/*
 * Murdoch Technology — Design Tokens
 * ==================================================================
 * A Seillean-family brand. The product & engineering sibling: a deep
 * INDIGO dark theme (not black) — warmer, more readable, unmistakably
 * descended from Seillean's Thistle Indigo. Teal leads; Bee Gold and
 * Floret Blue support.
 *
 * Motif: the thistle-burst — radial, structured, a network of spokes.
 * Typography carries the family pairing (Cormorant + Archivo) with
 * JetBrains Mono for data.
 *
 * Usage:
 *   @import url('brand/tokens.css');
 *   body { background: var(--surface); color: var(--text); }
 */

:root {

  /* ── Seillean family palette (shared DNA) ── */
  --thistle-indigo: #201e44;
  --floret-blue:    #35327a;
  --bee-gold:       #c1922f;
  --warm-ivory:     #f4f1ea;

  /* ── Surfaces — deep indigo dark (derived from Thistle Indigo) ── */
  --surface:            #14152b;   /* page                       */
  --surface-secondary:  #1b1d38;   /* alternating sections       */
  --surface-raised:     #1e2039;   /* raised panels              */
  --surface-card:       #21233f;   /* cards                      */
  --surface-card-hover: #292b4c;   /* card hover                 */

  /* ── Brand: Teal (primary accent) ── */
  --teal-50:  #eefbf6;
  --teal-100: #d0f5e8;
  --teal-200: #a4e9d2;
  --teal-300: #6dd8b8;
  --teal-400: #3ec9a7;   /* primary */
  --teal-500: #2a9b7e;
  --teal-600: #1e7d66;
  --teal-700: #186452;
  --teal-800: #154f42;
  --teal-900: #0f3a30;
  --teal: #3ec9a7;
  --teal-light: #6dd8b8;
  --teal-deep: #2a9b7e;
  --teal-glow: rgba(62, 201, 167, 0.22);

  /* ── Brand: Gold (secondary accent) ── */
  --gold-300: #d8a94a;
  --gold-400: #c1922f;
  --gold-500: #a87e26;
  --gold: #c1922f;
  --gold-light: #d8a94a;
  --gold-glow: rgba(193, 146, 47, 0.2);

  /* ── Indigo accent (family tie) ── */
  --indigo: #35327a;
  --indigo-light: #4a466f;
  --indigo-bright: #6f6a95;

  /* ── Text — warm, high contrast on indigo-dark ── */
  --text:           #f4f1ea;   /* Warm Ivory — 14.1:1 on surface (AAA)   */
  --text-secondary: #b6b3c7;   /* light lavender — 7.6:1 on surface (AA) */
  --text-muted:     #7e7c99;   /* tertiary — 3.9:1, labels/large only    */

  /* ── Borders ── */
  --border:       #2e3050;
  --border-light: #3d3f63;

  /* ── Chart palette (8 series, tuned for indigo-dark) ── */
  --chart-teal:   #3ec9a7;
  --chart-gold:   #d8a94a;
  --chart-blue:   #5aa2f0;
  --chart-violet: #9b8ae8;
  --chart-coral:  #e0796b;
  --chart-cyan:   #45c8d8;
  --chart-lime:   #9cc95a;
  --chart-pink:   #e88bb8;

  --chart-teal-soft:   rgba(62, 201, 167, 0.22);
  --chart-gold-soft:   rgba(216, 169, 74, 0.22);
  --chart-blue-soft:   rgba(90, 162, 240, 0.20);
  --chart-violet-soft: rgba(155, 138, 232, 0.20);
  --chart-coral-soft:  rgba(224, 121, 107, 0.20);
  --chart-cyan-soft:   rgba(69, 200, 216, 0.20);
  --chart-lime-soft:   rgba(156, 201, 90, 0.20);
  --chart-pink-soft:   rgba(232, 139, 184, 0.20);
  /* JS array: ['#3ec9a7','#d8a94a','#5aa2f0','#9b8ae8','#e0796b','#45c8d8','#9cc95a','#e88bb8'] */

  /* ── Semantic / Status ── */
  --status-success: #3ec9a7;
  --status-warning: #d8a94a;
  --status-error:   #e0796b;
  --status-info:    #5aa2f0;

  /* ── Typography ── */
  --font-display: 'Cormorant Garamond', Georgia, serif;   /* headlines, family tie */
  --font-body:    'Archivo', system-ui, -apple-system, sans-serif;
  --font-mono:    'JetBrains Mono', 'IBM Plex Mono', monospace;
  --label-tracking: 0.16em;

  /* ── Spacing ── */
  --space-xs:  0.25rem;
  --space-sm:  0.5rem;
  --space-md:  1rem;
  --space-lg:  1.5rem;
  --space-xl:  2.5rem;
  --space-2xl: 4rem;
  --space-3xl: 6rem;

  /* ── Radii ── */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --radius-pill: 999px;

  /* ── Elevation ── */
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.35);
  --shadow-md: 0 8px 28px rgba(0, 0, 0, 0.4);
  --shadow-lg: 0 18px 50px rgba(0, 0, 0, 0.5);
  --shadow-teal-glow: 0 0 24px var(--teal-glow);

  /* ── Motion ── */
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
}