/* fz-slimme-formulieren — toestemming.css: de cookiemelding (plan 2026-09-30, A1).
   Weigeren en Accepteren zijn bewust exact gelijk (AP: weigeren moet even makkelijk zijn als accepteren).
   Desktop: kaart linksonder. Mobiel: paneel onderin met safe-area. Niet-modaal: de pagina blijft bruikbaar. */
.fzc{--fzc-ink:#14161A;--fzc-soft:#5B6068;--fzc-lijn:#E6E7EA;--fzc-rood:#C8102E;
  position:fixed;left:20px;bottom:20px;z-index:990;max-width:430px;width:calc(100% - 40px);
  font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--fzc-ink);-webkit-font-smoothing:antialiased}
.fzc[hidden]{display:none!important}
.fzc-kaart{background:#fff;border:1px solid var(--fzc-lijn);border-radius:16px;
  box-shadow:0 18px 50px -12px rgba(20,22,26,.28),0 2px 6px rgba(20,22,26,.06);padding:20px 20px 16px;
  max-height:calc(100vh - 40px);max-height:calc(100dvh - 40px);overflow-y:auto;overscroll-behavior:contain}
.fzc-laag[hidden]{display:none!important}
.fzc-titel{margin:0 0 6px;font:700 16px/1.3 Inter,system-ui,sans-serif;letter-spacing:-.01em;color:var(--fzc-ink)}
.fzc-tekst{margin:0 0 16px;font:400 14px/1.55 Inter,system-ui,sans-serif;color:var(--fzc-soft)}
.fzc .fzc-tekst a{color:var(--fzc-ink)!important;text-decoration:underline;text-underline-offset:2px}
.fzc-knoppen{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.fzc .fzc-knop{appearance:none;margin:0;min-height:48px;padding:0 14px;border:1px solid var(--fzc-ink);border-radius:12px;
  background:var(--fzc-ink);color:#fff!important;font:600 15px/1 Inter,system-ui,sans-serif;cursor:pointer;
  transition:background-color .15s ease,transform .15s ease;touch-action:manipulation}
.fzc .fzc-knop:hover{background:#2A2D33}
.fzc .fzc-knop:active{transform:scale(.98)}
.fzc .fzc-link{appearance:none;display:block;margin:10px auto 0;min-height:44px;padding:0 10px;border:0;background:none;
  color:var(--fzc-ink)!important;font:600 14px/1 Inter,system-ui,sans-serif;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.fzc .fzc-knop:focus-visible,.fzc .fzc-link:focus-visible,.fzc .fzc-tekst a:focus-visible,.fzc .fzc-schakel:focus-visible,.fzc-footerlink:focus-visible{
  outline:2px solid var(--fzc-rood);outline-offset:2px}
.fzc-cats{list-style:none;margin:6px 0 16px;padding:0;border-top:1px solid var(--fzc-lijn)}
.fzc-cats li{border-bottom:1px solid var(--fzc-lijn)}
.fzc-cat{display:flex;align-items:center;gap:14px;min-height:56px;padding:10px 0;cursor:pointer}
.fzc-cat-tx{flex:1;min-width:0}
.fzc-cat-tx b{display:block;font:600 14.5px/1.3 Inter,system-ui,sans-serif;color:var(--fzc-ink)}
.fzc-cat-tx small{display:block;margin-top:2px;font:400 13px/1.45 Inter,system-ui,sans-serif;color:var(--fzc-soft)}
/* Schakelaar (checkbox): 44px raakvlak via de hele rij (label). */
.fzc .fzc-schakel{appearance:none;-webkit-appearance:none;flex:0 0 auto;position:relative;width:44px;height:26px;margin:0;
  border-radius:999px;background:#C9CCD1;cursor:pointer;transition:background-color .18s ease}
.fzc .fzc-schakel::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;
  box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .18s ease}
.fzc .fzc-schakel:checked{background:var(--fzc-rood)}
.fzc .fzc-schakel:checked::after{transform:translateX(18px)}
.fzc .fzc-schakel:disabled{background:#8C9097;cursor:not-allowed}
.fzc-los{margin:0;padding:14px 16px calc(14px + env(safe-area-inset-bottom));text-align:center;background:#fff;
  font:500 13px/1.4 Inter,system-ui,sans-serif;color:#5B6068}
.fzc-footerlink{appearance:none;background:none;border:0;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer;
  text-decoration:inherit;min-height:24px}
/* Zolang de melding openstaat: alles wat onderin vastzit weg, zodat niets de knoppen afdekt (gemeten 30-09:
   de contactbalk .fz-actiebalk ving op 390 px de tik op "Zelf kiezen" af). */
html.fzc-open #receptieai-widget-host,html.fzc-open .joinchat,html.fzc-open .fz-actiebalk,
html.fzc-open #vdp-bar,html.fzc-open .cmpbar{display:none!important}
@media (prefers-reduced-motion:no-preference){
  .fzc:not([hidden]) .fzc-kaart{animation:fzc-in .22s cubic-bezier(.2,.8,.2,1) both}
  @keyframes fzc-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
}
@media (max-width:600px){
  .fzc{left:0;right:0;bottom:0;width:100%;max-width:none}
  .fzc-kaart{border-radius:18px 18px 0 0;border-width:1px 0 0;padding:18px 16px calc(12px + env(safe-area-inset-bottom));
    max-height:85vh;max-height:85dvh}
}