/* =========================================================================
   Herroepingsformulier (EU withdrawal form)
   BEM: .herroeping-form. Uses theme tokens from base/_variables.css with
   safe fallbacks so it also renders standalone.
   ========================================================================= */

.herroeping-form {
	max-width: 640px;
	margin: 0;
	font-family: inherit;
}

/* Full-width page (hide the Divi right sidebar on the herroepen page).
   !important overrides Divi's own .et_right_sidebar layout rules. */
.herroeping-fullwidth #sidebar {
	display: none !important;
}

.herroeping-fullwidth #left-area {
	width: 100% !important;
	float: none !important;
	padding-right: 0 !important;
}

/* Divi draws the sidebar divider as a 1px ::before on the content container,
   independent of #sidebar — hide it too. */
.herroeping-fullwidth #main-content .container:before {
	display: none !important;
}

.herroeping-form__hint {
	font-size: 0.85rem;
	color: var(--color-text-muted, #636d6e);
	margin: 0 0 1.25rem;
}

.herroeping-form__row {
	margin-bottom: 1.25rem;
}

.herroeping-form__label {
	display: block;
	font-weight: 600;
	margin-bottom: 0.4rem;
	color: var(--color-text, #2b2b2b);
}

.herroeping-form__input,
.herroeping-form__textarea {
	width: 100%;
	box-sizing: border-box;
	padding: 0.7rem 0.85rem;
	font-size: 1rem;
	line-height: 1.4;
	color: var(--color-text, #2b2b2b);
	background: #fff;
	border: 1px solid var(--color-border, #cfd4d4);
	border-radius: var(--radius, 6px);
	transition: border-color 0.15s ease;
}

.herroeping-form__input:focus,
.herroeping-form__textarea:focus {
	outline: none;
	border-color: var(--color-primary, #8b4d8b);
	box-shadow: 0 0 0 3px rgba(139, 77, 139, 0.15);
}

.herroeping-form__textarea {
	resize: vertical;
	min-height: 96px;
}

.herroeping-form__row--checkbox {
	margin-bottom: 1.5rem;
}

.herroeping-form__checkbox-label {
	display: flex;
	align-items: flex-start;
	gap: 0.6rem;
	cursor: pointer;
	font-size: 0.95rem;
	line-height: 1.4;
	color: var(--color-text, #2b2b2b);
}

.herroeping-form__checkbox-label input {
	margin-top: 0.2rem;
	flex-shrink: 0;
}

.herroeping-form__privacy {
	font-size: 0.8rem;
	color: var(--color-text-muted, #636d6e);
	margin: 0 0 1.25rem;
}

.herroeping-form__submit {
	display: inline-block;
	cursor: pointer;
	background-color: var(--color-primary, #8b4d8b);
	color: #ffffff;
	border: none;
	padding: 0.85rem 2rem;
	font-size: 1rem;
	font-weight: 600;
	line-height: 1.2;
	border-radius: var(--radius, 6px);
	text-decoration: none;
	transition: background-color 0.15s ease;
}

.herroeping-form__submit:hover,
.herroeping-form__submit:focus {
	background-color: #743f74;
	color: #ffffff;
}

.herroeping-form__submit[disabled],
.herroeping-form__submit.is-loading {
	opacity: 0.6;
	cursor: progress;
}

/* Honeypot — visually hidden, off-canvas, not display:none (some bots skip those). */
.herroeping-form__hp {
	position: absolute !important;
	left: -9999px !important;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/* Status / feedback messages */
.herroeping-form__status {
	padding: 0.85rem 1rem;
	border-radius: var(--radius, 6px);
	margin-bottom: 1.25rem;
	font-size: 0.95rem;
}

.herroeping-form__status--success {
	background: #e7f6ec;
	border: 1px solid #15803d;
	color: #14532d;
}

.herroeping-form__status--error {
	background: #fdecec;
	border: 1px solid #c0392b;
	color: #7a1f17;
}

.herroeping-form__ts {
	display: inline-block;
	color: var(--color-text-muted, #636d6e);
	font-size: 0.85em;
}

/* My Account convenience button spacing */
.herroeping-account-link {
	margin-top: 1.25rem;
}

/* Statutory model withdrawal form — collapsible toggle below the form */
.herroeping-modelform {
	max-width: 640px;
	margin: 2.5rem 0 0;
	border-top: 1px solid var(--color-border, #cfd4d4);
	padding-top: 1.5rem;
}

.herroeping-modelform__toggle {
	cursor: pointer;
	font-weight: 600;
	color: var(--color-primary, #8b4d8b);
	list-style: none;
	padding: 0.25rem 0;
}

.herroeping-modelform__toggle::-webkit-details-marker {
	display: none;
}

.herroeping-modelform__toggle::before {
	content: "\25B8"; /* ▸ */
	display: inline-block;
	margin-right: 0.5rem;
	transition: transform 0.15s ease;
}

.herroeping-modelform[open] .herroeping-modelform__toggle::before {
	transform: rotate(90deg);
}

.herroeping-modelform__body {
	margin-top: 1rem;
	font-size: 0.9rem;
	line-height: 1.6;
	color: var(--color-text, #2b2b2b);
}

.herroeping-modelform__intro {
	margin: 0 0 1rem;
	color: var(--color-text-muted, #636d6e);
}
