/* ==========================================================================
   tokens.css — kern-tokens van het COM360 Platform (handboek v1.1, bijlage A)

   Dit is de enige plek waar kleuren en fonts vandaan komen (regel R24):
   modules gebruiken uitsluitend deze CSS-variabelen, nooit eigen waarden.

   Drie huisstijlen, gekozen via het attribuut data-theme op <html>:
     - "dark"   (standaard) COM360 Brand Guide v1.2, dark-first ("The Locked
                View"): Slate 900, Electric Blue / Deep Violet / Target Orange,
                Space Grotesk + Outfit. De platformhuisstijl en de standaard van
                elke tenant (besluit B5).
     - "light"  COM360 lichte variant (voor wie liever licht werkt en voor
                documenten, theme.document = light).
     - "tenant" de eigen huisstijl van de tenant (functie kern.huisstijl_aanpassen,
                besluit B6). Hieronder als voorbeeld de Smarlet-huisstijl; de
                huisstijl-editor (Platformbeheer › Huisstijl, migratie 70) zet
                per organisatie afwijkende tokens in platform.huisstijl en de
                shell injecteert die óver deze standaard heen. De platformstijl
                (dark/light) is op dezelfde manier bij te sturen.

   De shell zet data-theme op basis van de keuze van de gebruiker (localStorage);
   zonder keuze geldt "dark".
   ========================================================================== */

/* ── Donker (standaard = COM360 Brand Guide, dark-first) ── */
:root,
:root[data-theme="dark"]{
  --color-background:  #0f172a;   /* Slate 900 */
  --color-surface:     #1e293b;
  --color-surface-2:   #26344b;
  --color-surface-3:   #334155;
  --color-primary:     #3b82f6;   /* Electric Blue */
  --color-primary-dim: #2563eb;
  --color-secondary:   #8b5cf6;   /* Deep Violet (lichte variant op donker) */
  --color-accent:      #fb923c;   /* Target Orange */
  --color-accent-text: #fb923c;   /* accent als TEKST (kleine signalen, AA op surface) */
  --color-text:        #f1f5f9;
  --color-text-strong: #ffffff;
  --color-text-muted:  #94a3b8;
  --color-text-dim:    #64748b;
  --color-border:      #334155;
  --color-success:     #34d399;
  --color-danger:      #f87171;
  --gradient-cta:      linear-gradient(135deg,#3b82f6,#8b5cf6);
  --font-heading:      'Space Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-body:         'Outfit',system-ui,-apple-system,'Segoe UI',sans-serif;
}

/* ── Licht (COM360 lichte variant) ── */
:root[data-theme="light"]{
  --color-background:  #f1f5f9;
  --color-surface:     #ffffff;
  --color-surface-2:   #f8fafc;
  --color-surface-3:   #e2e8f0;
  --color-primary:     #2563eb;   /* iets donkerder voor AA op wit */
  --color-primary-dim: #1d4ed8;
  --color-secondary:   #7c3aed;
  --color-accent:      #ea580c;   /* Target Orange, leesbaar op wit (vlakken/iconen) */
  --color-accent-text: #c2410c;   /* 5,2:1 op wit — voor accentkleurige tekst */
  --color-text:        #0f172a;
  --color-text-strong: #0f172a;
  --color-text-muted:  #64748b;
  --color-text-dim:    #94a3b8;
  --color-border:      #e2e8f0;
  --color-success:     #059669;
  --color-danger:      #dc2626;
  --gradient-cta:      linear-gradient(135deg,#3b82f6,#7c3aed);
  --font-heading:      'Space Grotesk',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-body:         'Outfit',system-ui,-apple-system,'Segoe UI',sans-serif;
}

/* ── Huisstijl tenant (voorbeeld: Smarlet, licht) ──
   Komt in v0.4 uit platform.huisstijl per organisatie (kern.huisstijl_aanpassen). */
:root[data-theme="tenant"]{
  --color-background:  #F5F6FB;
  --color-surface:     #FFFFFF;
  --color-surface-2:   #FAFBFE;
  --color-surface-3:   #E6E8F2;
  --color-primary:     #2E3191;   /* Smarlet indigo */
  --color-primary-dim: #232566;
  --color-secondary:   #9A3277;   /* Smarlet paars */
  --color-accent:      #D63268;   /* Smarlet magenta */
  --color-accent-text: #B8285A;   /* magenta als tekst, ≥ 4,5:1 op wit */
  --color-text:        #1A1B3A;
  --color-text-strong: #1A1B3A;
  --color-text-muted:  #6B6F8C;
  --color-text-dim:    #9095B0;
  --color-border:      #E6E8F2;
  --color-success:     #12A277;
  --color-danger:      #E63C47;
  --gradient-cta:      linear-gradient(135deg,#E63C47,#D63268);
  --font-heading:      'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-body:         'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
}