/* ============================================================
   C·ERP — tokens.css (WP24, DESIGNSYSTEEM-29)
   Eén bestand met de daadwerkelijk geldende tokenwaarden, licht en
   donker, zoals ze nu na cerp/styles.css + platform/compositie.css
   uit de cascade komen. Geen enkele waarde is hier gewijzigd: dit
   bestand herhaalt bewust de bestaande eindwaarden zodat er precies
   één plek is om te lezen (en straks aan te passen) in plaats van
   twee bestanden na elkaar te moeten optellen.
   styles.css en compositie.css blijven ongewijzigd staan (bouwronde 2
   loopt met meerdere bouwers tegelijk in dezelfde bestanden; een
   volledige opschoning van de dubbele definities is bewust uitgesteld,
   zie oplevering WP24). Laadt na compositie.css, dus deze waarden zijn
   nu leidend zonder dat er iets visueel verandert.
   Uitzondering (besluit Max 27-09, DESIGNSYSTEEM-14): --text-3 is in licht
   en donker verhoogd tot 4,5:1; styles.css en compositie.css volgen, zodat
   het portaal (laadt tokens.css niet) dezelfde waarde krijgt. Zelfde voor
   --text-2 in licht (.66 naar .78), zodat het donkerder blijft dan --text-3.
   ============================================================ */

:root {
  --bg: #EFE7D6; --bg-2: #E5DBC8; --surface: #FFFFFF;
  --line: rgba(12,48,55,.07); --line-strong: rgba(12,48,55,.14);
  --text: #0C3037; --text-2: rgba(12,48,55,.78); --text-3: rgba(12,48,55,.70);
  /* DESIGNSYSTEEM-14 (besluit Max 27-09): --text-3 haalt de WCAG-norm van 4,5:1.
     Was .42 (2,46:1 op wit). De eerdere doelwaarde .66 haalde 4,80:1 op wit, maar
     slechts 4,08 tot 4,39:1 op de zandkleurige achtergronden (--bg, --bg-2, tags);
     .70 haalt op elke gemeten achtergrond minstens 4,5:1 (5,43:1 op wit).
     --text-2 (27-09, h12): was .66 en daarmee lichter dan --text-3 (4,18:1 op --bg-2).
     Nu .78: 6,99:1 op wit, 6,21:1 op --bg, 5,75:1 op --bg-2, 5,39:1 op getinte tags;
     altijd donkerder dan --text-3. Donker blijft .72 (minstens 6,6:1 op elk vlak). */
  --navy: #13284A; --steel: #3F6178; --cyan: #1AB7EA;
  --brand: #006271; --brand-soft: rgba(0,98,113,.08);
  --signal: #9D1E2D; --signal-soft: rgba(157,30,45,.08);
  --amber: #B07D2B;
  --track: rgba(12,48,55,.08); --glass: rgba(12,48,55,.04);
  --bar-base: #3F6178; --bar: color-mix(in srgb, var(--brand) 26%, var(--bar-base));
  --shadow: 0 1px 2px rgba(12,48,55,.05), 0 4px 10px rgba(12,48,55,.05), 0 18px 40px rgba(12,48,55,.07);
  --shadow-lg: 0 2px 8px rgba(12,48,55,.07), 0 14px 32px rgba(12,48,55,.10), 0 40px 80px rgba(12,48,55,.16);
  --radius: 22px;
  --f: 'Roboto', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --mono: 'Roboto Mono', 'Roboto', monospace;
  --gap: 18px;
  --side-w: 250px;
  --sheen: rgba(255,255,255,.55);
  --edge: rgba(255,255,255,.85);
  --pos: #1B8C54; --pos-soft: rgba(27,140,84,.13);
  --neg: #C2202E; --neg-soft: rgba(194,32,46,.13);
  /* Tekstvarianten van amber en groen (h137, vraag 346): gemengd met de tekstkleur, ALLEEN voor tekst.
     Vlakken, randen, stippen en iconen houden --amber en --pos. Licht 55 procent kleur: amber 6,81:1 op wit,
     5,53:1 op --bg, 4,96:1 op --bg-2; groen 7,26:1 op wit, 5,91:1 op --bg, 5,29:1 op --bg-2 (ook op een
     eigen tint van 14 procent minstens 4,39:1 en 4,56:1). Donker 80 procent: minstens 5,0:1 op een eigen tint. */
  --amber-tekst: color-mix(in srgb, var(--amber) 55%, var(--text));
  --pos-tekst: color-mix(in srgb, var(--pos) 55%, var(--text));
}
[data-density="compact"] { --gap: 12px; }
[data-density="comfy"]   { --gap: 26px; }

[data-theme="dark"] {
  --bg: #070B0E; --bg-2: #121C23; --surface: #18242C;
  --line: rgba(255,255,255,.12); --line-strong: rgba(255,255,255,.24);
  --text: #F3F8F7; --text-2: rgba(243,248,247,.72); --text-3: rgba(243,248,247,.52); /* DESIGNSYSTEEM-14: was .48 (4,48:1), nu 5,0:1 op --surface */
  --steel: #6E8CA3; --navy: #6E8CA3;
  --signal: #E0566A; --signal-soft: rgba(224,86,106,.12);
  --amber: #D6A24A;
  --track: rgba(255,255,255,.10); --glass: rgba(255,255,255,.05);
  --bar-base: #45637A;
  --shadow: 0 1px 2px rgba(0,0,0,.5), 0 6px 16px rgba(0,0,0,.42), 0 20px 48px rgba(0,0,0,.5);
  --shadow-lg: 0 4px 14px rgba(0,0,0,.5), 0 18px 44px rgba(0,0,0,.55), 0 40px 90px rgba(0,0,0,.66);
  --sheen: rgba(255,255,255,.06);
  --edge: rgba(255,255,255,.08);
  --pos: #43D08A; --pos-soft: rgba(67,208,138,.16);
  --neg: #FF6B79; --neg-soft: rgba(255,107,121,.16);
  --amber-tekst: color-mix(in srgb, var(--amber) 80%, var(--text));
  --pos-tekst: color-mix(in srgb, var(--pos) 80%, var(--text));
}