/* EPN consent v1 – banner (één bron: shared/consent/epn-consent.css). EPN-design tokens met
   terugvalwaarden, zodat dezelfde stijl op de frontend en de rekentools (epn-core) werkt. */
.epn-consent { position: fixed; inset: auto 0 0 0; z-index: 1000; padding: 12px; pointer-events: none; }
.epn-consent[hidden] { display: none; }
.epn-consent__binnen {
  pointer-events: auto; box-sizing: border-box; max-width: 46rem; margin: 0 auto; padding: 20px 22px;
  background: var(--epn-wit, #FFFFFF); color: var(--epn-tekst, #463D4D);
  border: 1px solid var(--epn-lila-zacht, #D9CCE6); border-top: 5px solid var(--epn-saffraan, #F4A62A);
  border-radius: 16px; box-shadow: 0 8px 28px rgba(36, 17, 47, .18);
  font-family: "Nunito Sans", "Segoe UI", system-ui, sans-serif; font-size: 0.9375rem; line-height: 1.5;
}
.epn-consent__titel { margin: 0 0 6px; font-family: Rubik, "Segoe UI", system-ui, sans-serif; font-weight: 600; font-size: 1.0625rem; color: var(--epn-pruim, #3A1D4D); }
.epn-consent__tekst { margin: 0 0 14px; }
.epn-consent a { color: var(--epn-lila, #7A4E92); }
.epn-consent__keuzes { display: grid; gap: 10px; margin: 0 0 14px; }
.epn-consent__keuzes[hidden] { display: none; }
.epn-consent__keuze { display: flex; gap: 10px; align-items: flex-start; font-weight: 600; color: var(--epn-pruim, #3A1D4D); }
.epn-consent__keuze input { width: 20px; height: 20px; margin: 2px 0 0; flex: 0 0 auto; accent-color: var(--epn-lila, #7A4E92); }
.epn-consent__keuze small { display: block; font-weight: 400; color: var(--epn-grijs-600, #6B5F73); }
.epn-consent__knoppen { display: flex; flex-wrap: wrap; gap: 10px; }
.epn-consent__knop {
  flex: 1 1 10rem; min-height: 44px; padding: 10px 18px; border-radius: 12px; cursor: pointer;
  font: 600 1rem/1.2 Rubik, "Segoe UI", system-ui, sans-serif;
}
.epn-consent__knop--hoofd { background: var(--epn-pruim, #3A1D4D); color: var(--epn-wit, #FFFFFF); border: 2px solid var(--epn-pruim, #3A1D4D); }
.epn-consent__knop--hoofd:hover { background: var(--epn-pruim-donker, #24112F); }
.epn-consent__knop--rustig { background: transparent; color: var(--epn-pruim, #3A1D4D); border: 2px solid var(--epn-pruim, #3A1D4D); }
.epn-consent__knop--rustig:hover { background: var(--epn-lila-licht, #F4EFF9); }
.epn-consent :focus-visible { outline: 3px solid var(--epn-lila, #7A4E92); outline-offset: 2px; }
.epn-consent__titel:focus { outline: none; }
@media (max-width: 30rem) { .epn-consent { padding: 8px; } .epn-consent__binnen { padding: 16px; } .epn-consent__knop { flex-basis: 100%; } }
@media (prefers-reduced-motion: reduce) { .epn-consent * { transition: none; } }