/* ============================================================
   Portaal - app-specifieke CSS
   Geladen NA css-framework core.min.css en klaslab.css.
   Uitsluitend framework-tokens (var(--color-*), var(--space-*), ...), zodat het
   thema overal gelijk blijft (één kleurprofiel en één lichte weergave).
   De bouwstenen komen uit het framework; hier staat alleen wat het portaal
   zelf nodig heeft.
   ============================================================ */

/* Een radiogroep staat in een fieldset (legend als label); zonder de
   browserrand en -marge, zodat hij eruitziet als elke andere .form-group. */
fieldset.form-group { border: 0; margin-inline: 0; padding: 0; min-width: 0; }
fieldset.form-group > legend { padding: 0; }
fieldset.form-group .radio-label { display: flex; }

/* Een lijst zonder opsommingstekens, met een lijn tussen de regels (de tools van een klas). */
.plain-list { list-style: none; margin: 0; padding: 0; }
.plain-list li + li { margin-top: var(--space-sm); padding-top: var(--space-sm); border-top: 1px solid var(--color-border); }

/* Het klasnummer voor de naam in het klasrooster: vaste breedte, zodat de namen onder elkaar staan. */
.class-number { display: inline-block; min-width: 2ch; margin-right: var(--space-xs); }

/* Klasnummers: de naam links, een smal invoerveld rechts. */
.number-list { list-style: none; margin: 0 0 var(--space-md); padding: 0; }
.number-list li { display: flex; align-items: center; justify-content: space-between; gap: var(--space-sm); }
.number-list li + li { margin-top: var(--space-xs); }
.number-list .input { width: 5rem; text-align: right; }