/*
 * Roefja design tokens - brandbook v1.0 (October 2026)
 * Single source of truth: the same names exist as Figma variables (without the "color-" prefix).
 * Change a value here and in Figma at the same time.
 */
:root {
  /* Colour */
  --color-bg: #F6F5F2;            /* page background (gebroken wit) */
  --color-surface: #FFFFFF;       /* cards, panels */
  --color-surface-muted: #ECEBE7; /* subtle fills */
  --color-border: #E2E1DC;        /* lines and borders */
  --color-ink: #161616;           /* text, headings, dark blocks, logo */
  --color-text-muted: #5B5A56;    /* secondary text */
  --color-accent: #F26621;        /* Roefja orange: logo, bar, buttons. Never small text on light */
  --color-accent-text: #A9490C;   /* links and small orange text on light (screen only) */
  --color-on-accent: #FFFFFF;     /* text on orange: bold, >= 19px only */

  /* Status (page 16). Never use orange as a status; warnings are amber, planned maintenance is blue */
  --color-success: #3FB67A;       /* indicator */
  --color-success-text: #1E7A4C;
  --color-success-bg: #E8F4EC;
  --color-maintenance: #3B82C4;   /* blue: planned maintenance only */
  --color-maintenance-text: #1F5A8F;
  --color-maintenance-bg: #E6F0F8;
  --color-warning: #E3A21A;
  --color-warning-text: #8A5A00;
  --color-warning-bg: #FBF1DC;
  --color-error: #E5484D;
  --color-error-text: #B42318;
  --color-error-bg: #FCEAE8;
  /* Info uses the neutrals: indicator --color-text-muted, bg --color-surface-muted, text #3A3936 */

  /* Typography (self-hosted, never Google Fonts) */
  --font-heading: "Onest", system-ui, sans-serif;
  --font-body: "Instrument Sans", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;

  /* Shape */
  --radius-md: 20px;   /* cards */
  --radius-sm: 14px;   /* small surfaces: choice cards, icon tiles */
  --radius-pill: 999px; /* buttons, filters, labels */
}