/**
 * Atelier Stralend – formulieren (nieuwsbrief, contact) en meldingen.
 */

/* Verborgen veld tegen spam: mensen zien het niet, robots vullen het in. */
.as-honing {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

form.is-bezig {
	opacity: 0.6;
	pointer-events: none;
}

.as-formulier-bericht {
	margin: 12px 0 0;
	padding: 12px 16px;
	border-radius: 14px;
	font-weight: 600;
	font-size: 15px;
	line-height: 1.45;
}

.as-formulier-bericht--goed {
	background: #ddf2e7;
	color: #14613f;
}

.as-formulier-bericht--fout {
	background: #ffe7df;
	color: #8a2412;
}

.as-veldfout {
	display: block;
	margin-top: 6px;
	font-size: 14px;
	font-weight: 600;
	color: #8a2412;
}

form [aria-invalid="true"] {
	border-color: #d4381e !important;
}

/* Nieuwsbrief: na aanmelden alleen de bevestiging tonen. */
.as-nieuwsbrief.is-verstuurd .as-nieuwsbrief__rij,
.as-nieuwsbrief.is-verstuurd > label,
.as-nieuwsbrief.is-verstuurd > small {
	display: none;
}

/* Melding bovenaan na een formulier of link uit een mail */
.as-melding {
	position: fixed;
	top: 16px;
	left: 50%;
	z-index: 100;
	display: flex;
	align-items: flex-start;
	gap: 12px;
	width: min(560px, calc(100% - 32px));
	padding: 16px 18px;
	border-radius: 18px;
	background: #2a1633;
	color: #fff;
	box-shadow: 0 16px 40px rgba(42, 22, 51, 0.25);
	transform: translateX(-50%);
	animation: as-melding-in 0.3s ease;
	transition: opacity 0.3s, transform 0.3s;
}

.admin-bar .as-melding {
	top: 48px;
}

.as-melding.is-weg {
	opacity: 0;
	transform: translate(-50%, -12px);
}

.as-melding--goed {
	border-left: 6px solid #ffc23a;
}

.as-melding--fout {
	border-left: 6px solid #d4381e;
}

.as-melding p {
	flex: 1 1 auto;
	margin: 0;
	font-weight: 600;
	font-size: 15px;
	line-height: 1.45;
}

.as-melding__sluit {
	flex: none;
	width: 32px;
	height: 32px;
	margin: -4px -6px 0 0;
	border: 0;
	border-radius: 999px;
	background: transparent;
	color: #fff;
	font-size: 24px;
	line-height: 1;
	cursor: pointer;
}

.as-melding__sluit:hover {
	background: rgba(255, 255, 255, 0.12);
}

@keyframes as-melding-in {
	from {
		opacity: 0;
		transform: translate(-50%, -12px);
	}
}

@media (prefers-reduced-motion: reduce) {
	.as-melding {
		animation: none;
		transition: none;
	}
}

/* Mijn account > Mijn gegevens: nieuwsbrief en account verwijderen */
.as-account-nieuwsbrief {
	margin: 24px 0;
}

.as-account-nieuwsbrief__status {
	margin: 4px 0 0;
	font-size: 14px;
	color: var(--wp--preset--color--tekst-gedempt, #5e4d63);
}

.as-account-verwijderen {
	margin-top: 48px;
	padding: clamp(20px, 3vw, 28px);
	border: 2px solid var(--wp--preset--color--rand, #f0dde7);
	border-radius: 24px;
}

.as-account-verwijderen > h2 {
	margin: 0 0 8px;
	font-size: 22px;
}

.as-account-verwijderen > p {
	margin: 0 0 16px;
	max-width: 620px;
	color: var(--wp--preset--color--tekst-zacht, #4a3a4f);
}

.as-account-verwijderen__stap > summary {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	padding: 0 20px;
	border: 2px solid #a82a14;
	border-radius: 999px;
	color: #a82a14;
	font-weight: 700;
	font-size: 15px;
	cursor: pointer;
	list-style: none;
}

.as-account-verwijderen__stap > summary::-webkit-details-marker {
	display: none;
}

.as-account-verwijderen__stap[open] > summary {
	margin-bottom: 16px;
}

.as-account-verwijderen__form {
	max-width: 420px;
}

.as-account-verwijderen__knop {
	min-height: 48px;
	padding: 0 24px;
	border: 0;
	border-radius: 999px;
	background: #a82a14;
	color: #fff;
	font: inherit;
	font-weight: 800;
	cursor: pointer;
}

.as-account-verwijderen__knop:hover {
	background: #8a2412;
}