/*
 * ca_tokens.css -- VORMGEVING 2.0, F2 "kleinste snede" (16-10-2026): het TOKENCONTRACT.
 *
 * WAT: semantische rollen (geen merknamen) als CSS custom properties op :root, in een gedeelde naamruimte
 *      (--kleur-*, --lettertype-*, --gewicht-*, --letterafstand-*). Beslissing V2 (14-10-2026): semantische rollen met een map vanuit
 *      de bestaande namen; module-CSS van klantsites gebruikt dezelfde naamruimte (muziek leest al --kleur-tekst/-zacht/-lijn/-accent/-vlak,
 *      die nergens gedefinieerd waren).
 * WAARDEN HIERONDER = die van ClientAdmin zelf (huisstijl 4.1, groen als accent, beslissing V13): geen enkele huidige waarde is veranderd.
 *      Een klantsite krijgt dit bestand NIET; ze volgt haar eigen thema (V5). Een thema schrijft straks dezelfde namen op :root.
 * GELADEN: clientadmin/inc/template_start.php, enkel binnen het huisstijl-4.1-blok (schakelaar CA_HUISSTIJL_41 UIT = dit bestand wordt niet
 *      geladen = exact het oude uitzicht), vlak vóór huisstijl41.css. Elke gebruiker van een token heeft in huisstijl41.css/hs41_inhoud.css een
 *      terugval met dezelfde waarde: ontbreekt dit bestand, dan ziet ClientAdmin er hetzelfde uit.
 * OMKEERBAAR: de typografie (letterafstand) staat op één plek; --letterafstand-tekst: normal zet gewone tekst terug op de oude afstand.
 *
 * Contrast (WCAG, gemeten 16-10-2026 met de relatieve-luminantieformule), licht:
 *   tekst op oppervlak 13,5:1; tekst op achtergrond 11,9:1; zacht op oppervlak 4,59:1; primair-tekst op primair 5,15:1;
 *   primair op oppervlak 5,15:1 (op achtergrond 4,54:1); succes/fout/info op hun licht 4,65 / 4,68 / 6,00:1; focus op oppervlak 5,15:1.
 *   BEKENDE AFWIJKINGEN (bestaande waarden, bewust niet gewijzigd): zacht op achtergrond 4,05:1 (norm 4,5), waarschuwing op waarschuwing-licht
 *   4,28:1 (norm 4,5), accent op oppervlak 2,36:1 (accent is enkel decoratie: kopbalklijn, schakelaars, tekst op de donkere zijbalk).
 */

/* ---------------------------------------------------------------------------------------------
   1. Kleurrollen -- licht (standaard)
--------------------------------------------------------------------------------------------- */
:root {
    /* merk */
    --kleur-primair: #397960;            /* knoppen, links, actieve toestand (wit erop: 5,15:1) */
    --kleur-primair-hover: #2C5D4A;
    --kleur-primair-tekst: #FFFFFF;      /* tekst op --kleur-primair */
    --kleur-secundair: #0F3540;          /* donkere tweede merkkleur (koppen) */
    --kleur-accent: #69B899;             /* decoratief: lijnen, schakelaars, tekst op donkere vlakken */

    /* vlakken en tekst */
    --kleur-achtergrond: #EEF1F3;        /* pagina-achtergrond */
    --kleur-oppervlak: #FFFFFF;          /* kaart, blok, modal */
    --kleur-oppervlak-zacht: #F6F8F9;    /* kopstrook in een blok, tabelkop */
    --kleur-kop: #0F3540;
    --kleur-tekst: #22303A;
    --kleur-tekst-zacht: #6B7780;
    --kleur-lijn: #DDE2E6;
    --kleur-lijn-zacht: #EDF0F2;

    /* status (tekst/rand) + hun lichte vlak */
    --kleur-succes: #2F7A57;
    --kleur-succes-licht: #EAF5EF;
    --kleur-waarschuwing: #9A6A10;
    --kleur-waarschuwing-licht: #FBF3E2;
    --kleur-fout: #B4483C;
    --kleur-fout-hover: #8E362D;
    --kleur-fout-licht: #FBEDEB;
    --kleur-info: #17607A;               /* NIEUW in het contract (V12): bestond als omgevingskleur van het LIVE-label */
    --kleur-info-licht: #E4EFF4;

    /* interactie */
    --kleur-hover: var(--kleur-primair-hover);
    --kleur-actief: var(--kleur-primair-hover);
    --kleur-focus: #397960;              /* focusring: 5,15:1 op oppervlak (norm voor interface-onderdelen: 3:1) */
    --kleur-uitgeschakeld: #BFC6CC;
    --kleur-uitgeschakeld-tekst: #6B7780;

    /* compat: namen die module-CSS (muziek 1.x) al leest */
    --kleur-zacht: var(--kleur-tekst-zacht);
    --kleur-vlak: var(--kleur-oppervlak-zacht);
}

/* ---------------------------------------------------------------------------------------------
   2. Donkere modus -- VOORBEREID, NOG NIET IN GEBRUIK (V12). Springt enkel aan met data-thema="donker" op <html>;
      er is geen prefers-color-scheme-koppeling, dus er verandert niets voor wie dit attribuut niet zet.
      Contrast (donker): tekst op oppervlak 12,8:1; zacht op oppervlak 7,0:1; primair-tekst op primair 7,6:1; primair op oppervlak 6,7:1;
      succes/waarschuwing/fout/info op hun licht 7,9 / 8,3 / 7,1 / 7,5:1; focus op oppervlak 9,8:1.
--------------------------------------------------------------------------------------------- */
:root[data-thema="donker"] {
    --kleur-primair: #69B899;
    --kleur-primair-hover: #86CBAF;
    --kleur-primair-tekst: #0E1A14;
    --kleur-secundair: #9AD9BF;
    --kleur-accent: #69B899;
    --kleur-achtergrond: #12181C;
    --kleur-oppervlak: #1B242A;
    --kleur-oppervlak-zacht: #222D34;
    --kleur-kop: #F2F5F7;
    --kleur-tekst: #E4E8EB;
    --kleur-tekst-zacht: #A3AFB8;
    --kleur-lijn: #33414A;
    --kleur-lijn-zacht: #2A363E;
    --kleur-succes: #7BD3A2;
    --kleur-succes-licht: #16301F;
    --kleur-waarschuwing: #EDBB5A;
    --kleur-waarschuwing-licht: #33270E;
    --kleur-fout: #F29A8F;
    --kleur-fout-hover: #F7B5AC;
    --kleur-fout-licht: #3A1E1B;
    --kleur-info: #86C6DE;
    --kleur-info-licht: #112F3A;
    --kleur-focus: #9AD9BF;
    --kleur-uitgeschakeld: #4A555D;
    --kleur-uitgeschakeld-tekst: #8794A0;
}

/* ---------------------------------------------------------------------------------------------
   3. Typografie -- rollen (huisstijl MatAtWork, enkel ClientAdmin; klantsites volgen hun thema, V5)
      Helvetica Now Text Light (300) als basis, Bold (700) voor vet; letterafstand gewone tekst -0.03em, vet -0.02em.
      De @font-face-regels staan in huisstijl41.css (§0). Een thema mag deze namen overschrijven zonder module-CSS aan te raken.
--------------------------------------------------------------------------------------------- */
:root {
    --lettertype-hoofd: 'Helvetica Now Text', Helvetica, Arial, sans-serif;     /* lopende tekst en interface */
    --lettertype-display: var(--lettertype-hoofd);                              /* koppen; eigen pairing komt in F3 */
    --lettertype-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    --gewicht-basis: 300;
    --gewicht-vet: 700;
    --letterafstand-tekst: -0.03em;
    --letterafstand-vet: -0.02em;
    --letterafstand-kop: -0.03em;
}