/* 1-op-1: de aanvraagflow (Plan je dag). De rest van de pagina volgt het cursussjabloon in
   cursus-groep.css; hier staat alleen wat bij het aanvraagformulier hoort. */

.aanvraag-grid{display:grid;grid-template-columns:minmax(0, 1fr) minmax(0, 1.45fr);gap:40px clamp(32px, 5vw, 80px);align-items:start}
.av-zij{position:sticky;top:calc(var(--header-h) + 84px);display:grid;gap:28px}
.av-zij .h2{max-width:12ch}
.av-zij > p{color:var(--ink-2);font-size:1.0625rem;line-height:1.65;max-width:44ch}
.av-wie h3{font-size:.8125rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;margin-bottom:14px}
.av-alt{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;font-size:.9375rem;color:var(--ink-2)}

.av-kaart{background:var(--panel);padding:clamp(22px, 3.4vw, 44px)}
.av-form{gap:26px}
.av-form[hidden],.av-stap[hidden]{display:none}
.av-stap{display:grid;gap:26px}
.av-stap > h3{font-size:clamp(1.5rem, 2.4vw, 2rem);font-weight:700;letter-spacing:-.03em;line-height:1.15}
.av-stap > h3:focus{outline:none}
.av-form .keuzes{grid-template-columns:repeat(auto-fill, minmax(min(100%, 210px), 1fr))}
.av-form .keuze .ph{margin-left:2px}
.av-form .veld .opt{font-weight:500;color:var(--ink-2)}
.av-knoppen{display:flex;flex-wrap:wrap;gap:12px;align-items:center;padding-top:6px}
.av-knoppen .btn-sage{flex:1 1 220px}
.av-gekozen{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:baseline;padding:14px 16px;background:var(--paper);font-size:.9375rem}
.av-gekozen b{font-weight:700}

.av-data{display:grid;gap:14px}
.av-datum{position:relative;border:0;margin:0;padding:18px 18px 20px;background:var(--paper);display:grid;gap:16px;min-width:0}
.av-datum > legend{float:left;width:100%;padding:0 96px 0 0;font-size:.9375rem;font-weight:800}
.av-datum > legend .opt{font-weight:500;color:var(--ink-2)}
.av-weg{position:absolute;top:8px;right:14px;min-height:44px;padding:0 4px;font-size:.875rem;color:var(--ink-2)}
.av-weg:hover{color:var(--ink)}
.av-weg[hidden],.av-erbij[hidden]{display:none}
.av-datum input[type=date]{max-width:260px}
.av-dagnaam{font-size:.875rem;font-weight:700;color:var(--olive)}
.av-dagnaam:empty{display:none}
.av-datum .keuzes{grid-template-columns:repeat(auto-fill, minmax(min(100%, 150px), 1fr))}
.av-datum .keuze{padding:13px 14px}
.av-erbij{justify-self:start}

/* Bevestiging */
#av-ok .weten ol{margin:0;padding-left:1.2em;display:grid;gap:4px}
#av-ok .weten small{font-weight:500;color:var(--ink-2)}

/* ---------- Responsive ---------- */
@media (max-width: 900px){
  .aanvraag-grid{grid-template-columns:1fr}
  .av-zij{position:static}
}
@media (max-width: 760px){
  .av-kaart{margin-inline:calc(-1 * var(--pad));padding:26px var(--pad) 30px}
  .av-datum{padding:16px 14px}
  .av-datum input[type=date]{max-width:none}
}