/* Ontwerptokens van familiecadeau.nl: de enige plek waar kleuren, letters en vaste maten worden vastgelegd.
   Bron: huisstijlgids Modern × Handschrift (claude/huisstijlgids-modern-handschrift.md, §3, §4 en §9).
   Elke pagina laadt dit bestand vóór de andere stijlbladen. Nieuwe kleur nodig? Voeg hem hier toe, met een naam,
   in plaats van een losse hexwaarde in een component. Controle: python3 tools/tokens.py --check */
:root{
  /* Nu: online, doen */
  --kobalt:#2B4EFF;          /* alleen de hoofdactie, één per scherm */
  --kobalt-h:#1A36CC;        /* hover en ingedrukt */
  --kobalt-25:#F5F8FF;       /* zachte achtergrond bij een gekozen optie */
  --kobalt-50:#EEF2FF;
  --kobalt-100:#EAF0FF;
  --kobalt-200:#C7D2FE;
  --kobalt-300:#9DB0FF;
  --inkt:#101828;            /* koppen, tekst, omlijnde knoppen */
  --grijs:#3B4655;           /* toelichting en labels (≥ 7:1 op wit) */
  --wit:#FFFFFF;
  --lijn:#EEF0F3;            /* randen van kaarten en vlakken */
  --zacht:#F7F8FA;           /* koele, lichte vlakken */
  --zacht-warm:#FBFAF7;      /* warme, lichte vlakken (Mijn familieboek) */

  /* grijstrap voor randen, scheidingen en uitgeschakelde elementen */
  --grijs-50:#F9FAFB;
  --grijs-100:#F2F4F7;
  --grijs-200:#E4E7EC;
  --grijs-300:#D0D5DD;
  --grijs-400:#98A2B3;
  --grijs-500:#667085;
  --grijs-600:#475467;
  --grijs-700:#344054;

  /* invoervelden: één rand voor alle formulieren */
  --veld:#B9C3CC;
  --veld-rand:2px solid var(--veld);

  /* status */
  --mint:#E9F7EF;            /* gevonden, gelukt */
  --mint-r:#ABEFC6;
  --groen:#067647;
  --groen-d:#05603A;
  --geel:#FFF4DC;            /* let op, waarschuwing */
  --geel-r:#FCE7A2;
  --oker:#D9A82E;
  --bruin:#8A5300;
  --bruin-d:#4A2D00;
  --rood:#B42318;            /* fout */
  --rood-l:#D92D20;

  /* Toen: het archief */
  --perk:#F3E9D2;            /* ondergrond van citaten, akten en verhalen */
  --perk-l:#FBF6EA;          /* lichte variant voor grotere vlakken */
  --perk-r:#E2D2AE;          /* randen en scheidingen op perkament */
  --perk-d:#C9B48A;          /* donkerdere rand, stippellijnen */
  --sepia:#5B3A1E;           /* aktenummers, datums, kleine oude tekst */
  --sepia-l:#6E5843;         /* zachtere sepia voor toelichting op perkament */
  --galnoot:#3A2614;         /* handschrift en transcripties */
  --lak:#9E2B25;             /* lakzegel; nooit voor knoppen */

  /* de redactie kijkt mee in een account */
  --meekijk:#3B1D6E;

  /* letters */
  --font-sans:'Plus Jakarta Sans',system-ui,sans-serif;
  --font-hand:'Pinyon Script',cursive;
  --font-oud:'IM Fell English',Georgia,serif;

  /* lettermaten: lopende tekst is minimaal 18px, handschrift minimaal 26px */
  --fs-label:13px;           /* kickers en kleine labels */
  --fs-klein:14px;           /* bijschriften en toelichting in compacte onderdelen */
  --fs-noot:15px;
  --fs-tekst-s:16px;
  --fs-veld:17px;            /* invoervelden en knoppen in formulieren */
  --fs-tekst:18px;
  --fs-kop-s:20px;
  --fs-kop:24px;
  --fs-hand:26px;

  /* afronding */
  --radius-kaart:18px;
  --radius-veld:12px;
  --radius-knop:999px;
  --radius-perk:4px;
}
