/* Zwevende WhatsApp-knop + kaartje (inc/whatsapp.php): rechtsonder, de cookiebanner zit linksonder. */
.d-wa { position: fixed; right: 20px; bottom: 20px; z-index: 9990; display: flex; flex-direction: column; align-items: flex-end; gap: 12px; font-size: 15px; line-height: 1.45; color: #2E3B5E; }
.d-wa-knop { display: inline-flex; align-items: center; gap: 10px; padding: 8px 20px 8px 8px; border: 0; border-radius: 999px; background: #1F9D55; color: #fff; font: inherit; font-weight: 700; cursor: pointer; box-shadow: 0 14px 30px -12px rgba(20, 90, 50, .65); transition: transform .2s cubic-bezier(.3, 1.4, .5, 1), background .2s ease; animation: d-wa-hallo .6s cubic-bezier(.3, 1.4, .5, 1) 1.2s both; }
.d-wa-knop:hover { background: #188547; transform: translateY(-2px); }
.d-wa-knop:focus-visible { outline: 3px solid #8EAAD5; outline-offset: 3px; }
.d-wa-icoon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: rgba(255, 255, 255, .16); }
.d-wa.is-open .d-wa-icoon { transform: rotate(-10deg); transition: transform .3s ease; }
@keyframes d-wa-hallo { from { opacity: 0; transform: translateY(20px) scale(.9); } }

.d-wa-kaart { position: relative; width: min(330px, calc(100vw - 32px)); box-sizing: border-box; padding: 20px 20px 16px; background: #FFFBF3; border-radius: 22px 22px 6px 22px; border: 2px dashed rgba(46, 59, 94, .18); box-shadow: 0 18px 40px -18px rgba(30, 43, 69, .55); opacity: 0; transform: translateY(10px) scale(.97); transform-origin: bottom right; transition: opacity .25s ease, transform .3s cubic-bezier(.3, 1.4, .5, 1); }
.d-wa-kaart.is-zichtbaar { opacity: 1; transform: none; }
.d-wa-kaart[hidden] { display: none; }
.d-wa-dicht { position: absolute; top: 8px; right: 10px; width: 32px; height: 32px; border: 0; border-radius: 50%; background: transparent; color: #2E3B5E; font-size: 22px; line-height: 1; cursor: pointer; }
.d-wa-dicht:hover { background: rgba(46, 59, 94, .08); }
.d-wa-kop { margin: 0 32px 4px 0; font-family: var(--wp--preset--font-family--heading, Fraunces, serif); font-size: 17px; font-weight: 600; line-height: 1.3; }
.d-wa-tekst { margin: 0 0 12px; }
.d-wa-keuzes { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 8px; }
.d-wa-keuzes a { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 11px 14px; border-radius: 14px; background: #fff; border: 2px solid rgba(31, 157, 85, .25); color: #2E3B5E; font-weight: 700; text-decoration: none; transition: border-color .2s ease, transform .15s ease; }
.d-wa-keuzes a::after { content: "→"; color: #1F9D55; }
.d-wa-keuzes a:hover, .d-wa-keuzes a:focus-visible { border-color: #1F9D55; transform: translateX(2px); outline: none; }
.d-wa-tijden { margin: 0; font-size: 13px; opacity: .75; }

@media (max-width: 600px) {
	.d-wa { right: 16px; bottom: 16px; }
	.d-wa-knop { padding: 6px; }
	.d-wa-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
	/* op de telefoon niet over de cookiebanner heen */
	body:has(.d-cookies.is-zichtbaar) .d-wa { opacity: 0; pointer-events: none; }
}
@media print { .d-wa { display: none; } }
@media (prefers-reduced-motion: reduce) { .d-wa-knop, .d-wa-kaart, .d-wa-icoon { animation: none; transition: none; } }
