/* Tyniq design tokens — brand book 1.1 (oktober 2026). DE bron voor website, dashboard, medewerker-app en admin.
 * Kopieën (niet met de hand wijzigen): scripts/huisstijl/deel-thema.sh; de testpoort faalt als een kopie afwijkt.
 *
 * Regels (docs/brandbook.pdf, docs/rebranding-plan.md):
 *  - Donker is de standaard (website, medewerker-app, admin). Het dashboard is licht: <html data-theme="licht">,
 *    met een zwarte zijbalk (--zijbalk).
 *  - Limoen (--primary) hooguit 1–2 keer per scherm: primaire actie, actieve status of één nadruk.
 *    Op licht nooit limoen als tekst: alleen als vlak met noir erop (--on-primary).
 *  - Statussen via licht en donker, niet rood/groen. Enige uitzondering: --signaal, alleen voor
 *    HACCP-waarden buiten de norm (plan §4). Op licht alleen als vlak of rand, nooit als tekst.
 *  - Hoeken 0 / 2px / 4px, nooit ronder. Geen schaduwen, geen gradients.
 */

:root {
  /* merkkleuren (brand book p. 7) */
  --noir: #0B0B0C;
  --ink: #F4F4F2;
  --limoen: #D4FF3A;
  --signaal: #FF5A36;

  /* thema: donker */
  --bg: #0B0B0C;              /* ground */
  --surface-1: #141416;       /* surface */
  --surface-2: #141416;
  --surface-3: #1C1C1F;       /* invoervelden en ingedrukt: één stap lichter dan surface */
  --border: #26262A;          /* line */
  --border-strong: #3A3A3E;   /* line strong */

  --text: #F4F4F2;            /* ink */
  --text-secondary: #B8B8B2;  /* muted */
  --text-muted: #8A8A84;      /* subtle */

  --primary: #D4FF3A;         /* limoen: primaire actie, actieve status */
  --primary-hover: #C4F02A;
  --on-primary: #0B0B0C;
  --primary-ink: #D4FF3A;     /* limoen als tekst: op donker toegestaan */

  /* statussen (brand book p. 7) */
  --status-klaar-bg: #F4F4F2;  --status-klaar-tekst: #0B0B0C;   /* op donker: licht vlak */
  --status-bezig-bg: #D4FF3A;  --status-bezig-tekst: #0B0B0C;
  --status-open-rand: #3A3A3E; --status-open-tekst: #B8B8B2;
  --afwijking-bg: #F4F4F2;     --afwijking-tekst: #0B0B0C;      /* omgekeerd blok */
  --afwijking-rand: #FF5A36;                                    /* signaal, alleen HACCP buiten de norm */

  /* soorten prikbordbericht (27 okt): gedempt, alleen als stip of smalle rand, nooit als vlak achter tekst */
  --soort-algemeen: #8A8A84;
  --soort-menu: #C9A25E;
  --soort-regels: #9AA8BA;
  --soort-event: #A99BD6;
  --soort-team: #7FB3A8;

  --zijbalk: #0B0B0C;
  --zijbalk-tekst: #F4F4F2;
  --zijbalk-muted: #8A8A84;
  --zijbalk-lijn: #26262A;

  /* vorm */
  --radius-0: 0;
  --radius-knop: 2px;          /* knoppen en labels */
  --radius-kaart: 4px;         /* kaarten; nooit ronder */
  --lijn: 1px;
  --rand-afwijking: 4px;
  --progress-hoogte: 6px;      /* 6–8px, zonder afronding */
  --aanraak-min: 44px;
  --checklist-rij: 56px;

  /* ruimte (brand book p. 9) */
  --space-1: 4px;  --space-2: 8px;  --space-3: 12px; --space-4: 16px;
  --space-5: 24px; --space-6: 32px; --space-7: 48px; --space-8: 96px;
  --kaart-padding: 24px;
  --kaart-gap: 12px;
  --site-max: 1240px;
  --sectie-ruimte: 96px;

  /* typografie (brand book p. 8) */
  --font-display: 'Space Grotesk', 'Geist', system-ui, sans-serif;
  --font-tekst: 'Geist', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono: 'Geist Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;
  --display-spatie: -0.03em;
  --display-regel: 1.02;
  --label-spatie: 0.06em;

  /* overgang: oude namen die nog in niet-omgezette schermen staan. Weg zodra alle onderdelen om zijn. */
  --accent: var(--primary);
  --accent-hover: var(--primary-hover);
  --accent-soft: var(--surface-3);
  --primary-soft: var(--surface-3);
  --success: var(--text);          --success-soft: var(--surface-3);
  --warning: var(--text);          --warning-soft: var(--surface-3);
  --error: var(--text);            --error-soft: var(--surface-3);
  --info: var(--text-secondary);   --info-soft: var(--surface-3);

  color-scheme: dark;
}

[data-theme="licht"] {
  --bg: #F4F4F2;
  --surface-1: #FFFFFF;
  --surface-2: #FFFFFF;
  --surface-3: #ECECE8;
  --border: #E2E2DE;          /* line licht */
  --border-strong: #B8B8B2;

  --text: #0B0B0C;
  --text-secondary: #5C5C57;  /* muted licht */
  --text-muted: #5C5C57;

  --primary: #D4FF3A;         /* alleen als vlak, met noir erop */
  --primary-hover: #C4F02A;
  --on-primary: #0B0B0C;
  --primary-ink: #0B0B0C;     /* nadruk als tekst op licht: noir (met onderstreping), nooit limoen */

  --status-klaar-bg: #0B0B0C;  --status-klaar-tekst: #F4F4F2;
  --status-bezig-bg: #D4FF3A;  --status-bezig-tekst: #0B0B0C;
  --status-open-rand: #B8B8B2; --status-open-tekst: #5C5C57;
  --afwijking-bg: #0B0B0C;     --afwijking-tekst: #F4F4F2;

  --soort-algemeen: #8A8A84;
  --soort-menu: #9A7432;
  --soort-regels: #56677D;
  --soort-event: #6E5FA8;
  --soort-team: #3F7F72;

  color-scheme: light;
}