.aanvraag { max-width: 44rem; display: grid; gap: 1.4rem; }
.aanvraag fieldset { border: 0; margin: 0; padding: 0; display: grid; gap: .6rem; min-width: 0; }
.aanvraag legend { font-weight: 700; font-size: 1.15rem; margin-bottom: .2rem; padding: 0; }
.chips { display: flex; flex-wrap: wrap; gap: .5rem; }
.chip { font: inherit; font-size: 1rem; padding: .55rem .95rem; border-radius: 999px; border: 2px solid var(--inkt); background: var(--papier); color: var(--inkt); cursor: pointer; min-height: 44px; }
.chip.aan { background: var(--inkt); color: #fff; }
.chip:disabled { opacity: .35; cursor: default; text-decoration: line-through; }
.chip:focus-visible, .meer:focus-visible { outline: 3px solid var(--koraal-donker); outline-offset: 2px; }
.maand { font-weight: 700; color: var(--inkt-zacht); margin-top: .4rem; text-transform: capitalize; }
.meer { font: inherit; background: none; border: 0; color: var(--koraal-donker); text-decoration: underline; cursor: pointer; padding: .4rem 0; justify-self: start; }
.uitleg { color: var(--inkt-zacht); margin: 0; }
.aanvraag label { display: grid; gap: .3rem; font-weight: 600; }
.aanvraag input[type=text], .aanvraag input[type=email], .aanvraag textarea { font: inherit; font-size: 1rem; padding: .6rem .7rem; border: 2px solid var(--inkt); border-radius: 12px; background: var(--papier); color: var(--inkt); min-height: 44px; }
.aanvraag textarea { min-height: 5rem; resize: vertical; }
.aanvraag .optioneel { font-weight: 400; color: var(--inkt-zacht); }
.hint { background: var(--boter); border: 2px solid var(--inkt); border-radius: 12px; padding: .6rem .8rem; margin: 0; }
.kosten { font-weight: 700; margin: 0; }
.aanvraag .knop[aria-disabled="true"] { opacity: .5; cursor: default; }
/* one step at a time (aanvraagformulier.md) */
#aanvraagform[hidden], #aanvraagform [hidden] { display: none !important; }
.fstap { display: grid; gap: .7rem; }
.fstap h2 { font-size: 1.35rem; margin: 0; outline: none; }
.voortgang { margin: 0; color: var(--inkt-zacht); font-weight: 700; font-size: .95rem; }
.gekozen { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
.gekozen li button { font: inherit; font-size: .9rem; background: none; border: 0; border-bottom: 1.5px dotted var(--inkt-zacht); color: var(--inkt); padding: .1rem 0; margin-right: .6rem; cursor: pointer; }
.gekozen li button b { font-weight: 700; }
.keuzes { display: grid; gap: .6rem; }
.keuze { font: inherit; text-align: left; padding: .7rem 1rem; border: 2px solid var(--inkt); border-radius: 14px; background: var(--papier); color: var(--inkt); cursor: pointer; display: grid; gap: .1rem; }
.keuze.aan { background: var(--inkt); color: #fff; }
.keuze small { font-size: .9rem; opacity: .85; }
.stapknoppen { display: flex; gap: .7rem; justify-content: space-between; }
.stapknoppen .knop:disabled { opacity: .4; cursor: default; }
.overzicht { display: grid; grid-template-columns: max-content 1fr; gap: .3rem 1rem; margin: 0; }
.overzicht dt { color: var(--inkt-zacht); font-weight: 700; }
.overzicht dd { margin: 0; }
.valkuil { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.hint.fout { background: #fde9dc; }
.hint.klaar { background: #e5efe1; font-weight: 700; }
button.knop { font: inherit; cursor: pointer; }

/* how long and when -- a small heading above each row of chips; the total in the overview stands out a little */
.sublabel { margin: 1rem 0 .4rem; font-weight: 600; }
.overzicht dd.bedrag { font-weight: 700; }

/* WHEN: a month calendar and, beside it, the slots of the chosen day as blocks */
.kalender-blok { display: grid; grid-template-columns: minmax(0, 20rem) minmax(0, 1fr); gap: 1.4rem 2rem; align-items: start; margin-top: .4rem; }
.kalender { border: 2px solid var(--inkt); border-radius: 14px; padding: .8rem; background: var(--papier); }
.kal-kop { display: flex; align-items: center; justify-content: space-between; margin-bottom: .5rem; }
.kal-maand { font-weight: 800; }
.kal-maand::first-letter, .vak-dag::first-letter, .vak b::first-letter { text-transform: uppercase; }
.kal-nav { font: inherit; font-size: 1.3rem; line-height: 1; width: 2.2rem; height: 2.2rem; border-radius: 50%; border: 2px solid var(--inkt); background: var(--papier); color: var(--inkt); cursor: pointer; }
.kal-nav:disabled { opacity: .25; cursor: default; }
.kal-raster { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: .25rem; text-align: center; }
.kal-wd { font-size: .78rem; font-weight: 700; color: var(--inkt-zacht); padding: .2rem 0; }
.kal-dag { font: inherit; font-size: .95rem; aspect-ratio: 1; display: flex; align-items: center; justify-content: center; border-radius: 50%; }
.kal-dag.dicht { color: var(--inkt-zacht); opacity: .35; }
.kal-dag.vrij { border: 2px solid var(--inkt); background: #e5efe1; color: var(--inkt); cursor: pointer; font-weight: 700; }
.kal-dag.vrij:hover { background: #b9d3b0; }
.kal-dag.aan { background: var(--inkt); color: #fff; }
.kal-nav:focus-visible, .kal-dag:focus-visible, .vak:focus-visible { outline: 3px solid var(--koraal-donker); outline-offset: 2px; }
.vakken { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem; }
.vak-dag { grid-column: 1 / -1; margin: 0 0 .1rem; font-weight: 800; }
.vak { font: inherit; text-align: left; display: grid; gap: .15rem; padding: .7rem .85rem; border: 2px solid var(--inkt); border-radius: 10px; background: var(--papier); color: var(--inkt); cursor: pointer; min-height: 44px; }
.vak b { display: block; }
.vak .vak-tijd { font-size: .95rem; }
.vak .vak-prijs { font-size: .9rem; color: var(--inkt-zacht); }
.vak:hover { background: #fcf2d3; }
.vak.aan { background: var(--inkt); color: #fff; }
.vak.aan .vak-prijs { color: #fff; }
.vak:disabled { opacity: .4; cursor: default; background: transparent; }
@media (max-width: 700px) { .kalender-blok { grid-template-columns: minmax(0, 1fr); } .kalender { max-width: 22rem; } }
.vak-feestdag { display: block; font-size: .85rem; font-weight: 700; color: var(--koraal-donker); margin-top: .15rem; }
.kal-dag.feest { box-shadow: inset 0 -3px 0 var(--koraal); }

/* the first step: online or at your place (online advice, 04-10-2026) */
.vormkeuze { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; max-width: 44rem; }
.vorm-knop { font: inherit; text-align: left; display: grid; align-content: start; gap: .3rem; padding: .9rem 1rem; border: 2px solid var(--inkt); border-radius: 12px; background: var(--papier); color: var(--inkt); cursor: pointer; }
.vorm-knop b { font-size: 1.05rem; }
.vorm-knop span { color: var(--inkt-zacht); font-size: .95rem; }
.vorm-knop:hover { background: #fcf2d3; }
.vorm-knop.aan { background: var(--inkt); color: #fff; }
.vorm-knop.aan span { color: #fff; }
.vorm-knop:focus-visible { outline: 3px solid var(--koraal-donker); outline-offset: 2px; }
@media (max-width: 600px) { .vormkeuze { grid-template-columns: minmax(0, 1fr); } }
/* breathing room between the introduction and the step indicator */
.aanvraag .voortgang, #f-stapnr { margin-top: 1.8rem; }
/* the time zone of every time in the form (online people may sit elsewhere) */
.tijdzone { margin: .7rem 0 0; font-size: .9rem; color: var(--inkt-zacht); }