/* AVG-quickscan: alleen de onderdelen die nis2-check.css nog niet dekt (de
   vragenlijst zelf, de voortgang, de thema-balken en het advies-blok). Kleuren,
   kaart, .nc-cta en .cred komen uit nis2-check.css, dat deze pagina ook laadt.
   Zie templates/avg-quickscan.html voor de reden. */

.aq .aq-intro-stats{grid-template-columns:repeat(3,1fr)}
.aq .aq-form{margin-top:22px;display:flex;flex-direction:column;gap:14px}
.aq .aq-q{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px 18px}
.aq .aq-q .aq-qtitel{font-weight:800;color:var(--navy);font-size:13px;text-transform:uppercase;
  letter-spacing:.04em;margin-bottom:6px}
.aq .aq-q p{font-size:15px;color:var(--ink);margin-bottom:12px}
.aq .aq-opts{display:flex;flex-wrap:wrap;gap:8px}
.aq .aq-opts label{font:inherit;font-weight:700;font-size:13.5px;padding:8px 14px;border-radius:99px;
  border:1.5px solid var(--line);background:#fff;color:var(--ink);cursor:pointer;user-select:none}
.aq .aq-opts input{position:absolute;opacity:0;width:1px;height:1px}
.aq .aq-opts input:checked + span{color:inherit}
.aq .aq-opts label:has(input:checked){background:var(--navy);color:#fff;border-color:var(--navy)}
/* :has() ondersteuning is breed maar niet universeel; de klasse hieronder zet
   dezelfde stijl via JS (change-event) zodat een oudere browser niet met een
   onzichtbare selectie blijft zitten. */
.aq .aq-opts label.aq-checked{background:var(--navy);color:#fff;border-color:var(--navy)}
.aq .aq-opts label:has(input:focus-visible){outline:3px solid var(--orange);outline-offset:2px}
.aq .aq-actions{margin-top:22px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.aq .aq-actions .nc-btn[disabled]{opacity:.5;cursor:default}
.aq .aq-progress{color:var(--muted);font-weight:700;font-size:13.5px}
.aq .aq-hidden{display:none}
.aq .aq-themas{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px;margin-top:22px}
.aq .aq-thema{background:var(--card);border:1px solid var(--line);border-left:6px solid var(--geen);
  border-radius:12px;padding:14px 15px}
.aq .aq-thema.s-Sterk{border-left-color:var(--sterk)} .aq .aq-thema.s-Matig{border-left-color:var(--matig)}
.aq .aq-thema.s-Zwak{border-left-color:var(--zwak)} .aq .aq-thema.s-Geen{border-left-color:var(--geen)}
.aq .aq-thema .tnaam{font-weight:800;color:var(--navy);font-size:14px;margin-bottom:8px}
.aq .aq-unlock{border-top:1px solid rgba(255,255,255,.14);margin-top:22px;padding-top:18px}
.aq .aq-unlock p{color:#c6d2e8;font-size:14px;margin-bottom:12px;max-width:52ch}
.aq .aq-unlock .nc-slotform input{background:#fff}
.aq .aq-advies{margin-top:18px;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.aq .aq-advies .acard{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);
  border-radius:14px;padding:16px}
.aq .aq-advies .acard .at{font-weight:800;color:#fff;font-size:14px;margin-bottom:6px}
.aq .aq-advies .acard p{color:#bccbe4;font-size:13.5px;margin:0}
@media(max-width:560px){.aq .aq-intro-stats{grid-template-columns:1fr}}