/*
 * WordPress-brug (handgeschreven, klein houden).
 * Alleen wat nodig is omdat WordPress iets anders rendert dan de losse HTML-ontwerpen.
 * De ontwerp-CSS zelf staat ongewijzigd in olunda-home.css / olunda-page.css / olunda-404.css.
 */

/* Template-part-omhulsels tellen niet mee voor de opmaak.
   Nodig voor de sticky header: die moet .wp-site-blocks als ouder hebben, niet een kort omhulsel. */
.wp-site-blocks > .olunda-part { display: contents; }

/* Ingelogd: sticky header onder de WordPress-beheerbalk laten vallen. */
.admin-bar header.site { top: 32px; }
@media (max-width: 782px) { .admin-bar header.site { top: 46px; } }

/* FAQ: het ontwerp tekent het plus/min-icoon met een losse <span class="faq-icon">.
   In WordPress is elke vraag een bewerkbaar Details-blok, dus hetzelfde icoon via ::after. */
details.faq-item > summary::after {
	content: "";
	flex-shrink: 0;
	width: 1rem;
	height: 1rem;
	background:
		linear-gradient(var(--gold-deep), var(--gold-deep)) center / 100% 2px no-repeat,
		linear-gradient(var(--gold-deep), var(--gold-deep)) center / 2px 100% no-repeat;
	transition: background-size 220ms var(--ease-in-out);
}
details.faq-item[open] > summary::after { background-size: 100% 2px, 2px 0; }
@media (prefers-reduced-motion: reduce) { details.faq-item > summary::after { transition: none; } }

/* Privacypagina: de definitieve tekst heeft tussenkoppen (h3), lijsten en tabellen die het
   privacy-ontwerp nog niet kende. Opgemaakt met de ontwerpkleuren, verder niets nieuws. */
.wp-block-post-content h3 { font-weight: 600; font-size: 1.125rem; margin: 1.75rem 0 0.5rem; }
.wp-block-post-content .wp-block-table { margin: 1.25rem 0 1.5rem; overflow-x: auto; }
.wp-block-post-content .wp-block-table table { width: 100%; border-collapse: collapse; font-size: 0.9375rem; line-height: 1.55; }
.wp-block-post-content .wp-block-table th,
.wp-block-post-content .wp-block-table td { text-align: left; vertical-align: top; padding: 0.6rem 0.75rem 0.6rem 0; border-bottom: 1px solid var(--line); }
.wp-block-post-content .wp-block-table th { font-weight: 700; font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.06em; color: var(--ink-soft); border-bottom-color: var(--ink-soft); }
@media (max-width: 640px) {
	.wp-block-post-content .wp-block-table table.has-fixed-layout { table-layout: auto; min-width: 560px; }
}

/* Contactformulier: onzichtbaar lokveld tegen spam-bots. */
.olunda-hp { display: none !important; }

/* Contactformulier: foutmelding onder de knop (tekst komt uit config.json). */
.olunda-form-status { margin-top: 1rem; font-weight: 600; color: var(--paper); }
.olunda-form-status.is-error { color: var(--gold-core); }
.route-form button[disabled] { opacity: 0.6; cursor: progress !important; }

/* Contactformulier: bevestiging die het formulier vervangt, op dezelfde plek. */
.route-form:has(.olunda-form-done) { display: flex; align-items: flex-start; }
.olunda-form-done {
	width: 100%;
	padding: 2rem 1.75rem;
	border: 1px solid var(--gold-light);
	border-radius: 14px;
	background: rgba(181, 128, 79, 0.12);
	color: var(--paper);
	animation: olunda-done-in 0.35s ease-out both;
}
.olunda-form-done:focus { outline: none; }
.olunda-form-done-icon {
	display: inline-flex; align-items: center; justify-content: center;
	width: 44px; height: 44px; border-radius: 50%;
	background: var(--gold); color: var(--paper);
	margin-bottom: 1rem;
}
.olunda-form-done-title { margin: 0 0 0.5rem; font-size: 1.375rem; font-weight: 700; color: var(--paper); }
.olunda-form-done-text { margin: 0; color: rgba(250, 248, 244, 0.85); max-width: 46ch; }
@keyframes olunda-done-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .olunda-form-done { animation: none; } }
