/* ============================================================================
   tokens.css — the single theming seam.
   EVERY brand-variable value is set here and nowhere else. tenant.config.js
   overwrites these at runtime, which is what makes a 5-minute rebrand possible.
   Never hard-code a colour, radius or font in a component.
   ========================================================================== */

:root {
  /* --- Brand (overwritten at runtime by tenant.config.js) ----------------- */
  --brand-primary:        #10457a;
  --brand-primary-hover:  #0c3560;
  --brand-primary-soft:   #eaf1f8;
  --brand-accent:         #b4762a;
  --brand-ink:            #0d1520;

  --brand-font-heading:   'Instrument Sans', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --brand-font-body:      'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --brand-font-mono:      ui-monospace, 'SF Mono', 'Cascadia Code', Menlo, monospace;

  /* --- Surfaces ----------------------------------------------------------- */
  --surface-page:         #f7f8fa;
  --surface-card:         #ffffff;
  --surface-sunken:       #f0f2f5;
  --surface-inverse:      #0d1520;
  --surface-hover:        #f4f6f9;

  /* --- Text --------------------------------------------------------------- */
  --text-strong:          #0d1520;
  --text-default:         #2c3947;
  --text-muted:           #5f6d7e;
  --text-faint:           #8b97a6;
  --text-inverse:         #ffffff;

  /* --- Borders ------------------------------------------------------------ */
  --border-default:       #dde2e9;
  --border-faint:         #eaedf2;
  --border-strong:        #c3ccd7;

  /* --- Status: risk bands (renamed per tenant, never hard-coded in markup) - */
  --risk-critical:        #b3261e;
  --risk-critical-bg:     #fdeceb;
  --risk-high:            #b45309;
  --risk-high-bg:         #fdf3e7;
  --risk-moderate:        #8a6d00;
  --risk-moderate-bg:     #fcf7e3;
  --risk-strong:          #1a6c42;
  --risk-strong-bg:       #eaf5ef;
  --status-info:          #10457a;
  --status-info-bg:       #eaf1f8;

  /* --- Spacing scale ------------------------------------------------------ */
  --space-1: 4px;   --space-2: 8px;   --space-3: 12px;  --space-4: 16px;
  --space-5: 24px;  --space-6: 32px;  --space-7: 48px;  --space-8: 64px;
  --space-9: 96px;

  /* --- Radius ------------------------------------------------------------- */
  --radius-sm: 4px; --radius-md: 6px; --radius-lg: 10px; --radius-xl: 16px;
  --radius-pill: 999px;

  /* --- Elevation ---------------------------------------------------------- */
  --shadow-sm:  0 1px 2px rgba(13,21,32,.06);
  --shadow-md:  0 2px 8px rgba(13,21,32,.08), 0 1px 2px rgba(13,21,32,.04);
  --shadow-lg:  0 8px 28px rgba(13,21,32,.12), 0 2px 6px rgba(13,21,32,.05);

  /* --- Type scale --------------------------------------------------------- */
  --fs-xs: .75rem;  --fs-sm: .8125rem; --fs-base: .9375rem; --fs-md: 1rem;
  --fs-lg: 1.125rem; --fs-xl: 1.375rem; --fs-2xl: 1.75rem; --fs-3xl: 2.25rem;
  --fs-4xl: 3rem;   --fs-5xl: 3.75rem;

  --lh-tight: 1.15; --lh-snug: 1.35; --lh-normal: 1.6;

  /* --- Layout ------------------------------------------------------------- */
  --container: 1200px;
  --container-narrow: 760px;
  --sidebar-w: 248px;
  --header-h: 60px;

  /* --- Motion ------------------------------------------------------------- */
  --ease: cubic-bezier(.2, .7, .3, 1);
  --dur-fast: 120ms; --dur-base: 200ms; --dur-slow: 380ms;
}

/* Respect the user's motion preference. Non-negotiable — see accessibility
   principle: foundations ignore feature flags. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}
