/* ============================================================
   arro.health — Design Tokens  (v3: ink + electric lime)
   Single source of truth for color, type, space, motion.
   RULE: lime is a SIGNAL color — fills, dark surfaces, accents-as-shapes.
   On light backgrounds, text accents use ink or deep-olive, never bright lime.
   ============================================================ */

:root {
  /* ---- Ink (base / dark canvas / primary brand) ---- */
  --ink-900: #06182B;
  --ink-800: #0A2540;   /* core ink */
  --ink-700: #16314F;
  --ink-600: #24425F;

  /* ---- Electric lime (the signal accent) ---- */
  --lime-50:  #F5FCDD;
  --lime-100: #EAF8B8;
  --lime-200: #DCF386;
  --lime-300: #D0F25E;   /* bright, for dark surfaces */
  --lime-400: #C9F04F;
  --lime-500: #C4F042;   /* core accent */
  --lime-600: #A6D424;
  --lime-700: #6E8A12;
  --lime-800: #4F640C;   /* deep olive, readable on light */
  --lime-900: #2E3A06;

  /* ---- Legacy accent names repointed to lime (used across the site) ---- */
  --aqua-50:  #F5FCDD;
  --aqua-100: #EAF8B8;
  --aqua-200: #DCF386;   /* hover borders / tints */
  --aqua-300: #D0F25E;   /* bright lime on dark */
  --aqua-400: #C4F042;   /* bright accent on dark */
  --aqua-500: #C4F042;   /* core lime */
  --aqua-600: #4F640C;   /* DEEP olive — on-light accent text */
  --aqua-700: #3E4F0A;   /* darker — on-light text/icons */
  --aqua-800: #2E3A06;
  --aqua-900: #1C2404;

  /* ---- Legacy "teal/brand" names repointed to ink + lime tints ---- */
  --teal-50:  #F0F7D8;   /* lime tint — icon backgrounds */
  --teal-100: #E4F0BC;
  --teal-200: #D5F185;   /* hover border (lime) */
  --teal-300: #93A1AB;
  --teal-400: #45828F;
  --teal-500: #0A2540;   /* ink — primary brand / button bg */
  --teal-600: #0A2540;   /* ink — links / ghost text on light */
  --teal-700: #06182B;
  --teal-800: #06222A;
  --teal-900: #03141A;

  /* ---- Neutrals ---- */
  --white:    #FFFFFF;
  --paper:    #F4F7F9;
  --mist:     #ECF1F4;
  --gray-200: #DCE3E8;
  --gray-300: #C2CCD3;
  --gray-400: #93A1AB;
  --gray-500: #6B7B86;
  --gray-600: #4C5A64;
  --gray-700: #33424C;

  /* ---- Functional ---- */
  --verified:  #C4F042;  /* pass / verified — brand lime */
  --pending:   #E2A33B;  /* in progress */
  --flag:      #E2574C;  /* expired / failed / attention */
  --info:      #2E8FCF;

  /* ---- Semantic (light theme defaults) ---- */
  --bg:            var(--paper);
  --bg-elevated:   var(--white);
  --bg-inverse:    var(--ink-800);
  --text:          var(--ink-800);
  --text-muted:    var(--gray-500);
  --text-inverse:  var(--paper);
  --border:        var(--gray-200);
  --brand:         var(--ink-800);
  --brand-strong:  var(--ink-900);
  --accent:        var(--lime-500);

  /* ---- Typography ---- */
  --font-display: "Geist", "Hanken Grotesk", system-ui, sans-serif;
  --font-body:    "Hanken Grotesk", system-ui, -apple-system, sans-serif;
  --font-mono:    "Geist Mono", "JetBrains Mono", ui-monospace, monospace;

  --text-xs:   0.75rem;
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-lg:   1.25rem;
  --text-xl:   1.563rem;
  --text-2xl:  1.953rem;
  --text-3xl:  2.441rem;
  --text-4xl:  3.052rem;
  --text-5xl:  3.815rem;
  --text-6xl:  4.768rem;

  --leading-tight: 1.05;
  --leading-snug:  1.2;
  --leading-body:  1.6;
  --tracking-tight: -0.03em;
  --tracking-wide:  0.08em;

  /* ---- Space (8pt grid) ---- */
  --space-1: 0.25rem;  --space-2: 0.5rem;  --space-3: 0.75rem; --space-4: 1rem;
  --space-6: 1.5rem;   --space-8: 2rem;    --space-12: 3rem;   --space-16: 4rem;
  --space-24: 6rem;    --space-32: 8rem;

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

  /* ---- Elevation ---- */
  --shadow-sm: 0 1px 2px rgba(6,24,43,0.06), 0 1px 3px rgba(6,24,43,0.08);
  --shadow-md: 0 4px 12px rgba(6,24,43,0.08), 0 2px 4px rgba(6,24,43,0.06);
  --shadow-lg: 0 18px 40px rgba(6,24,43,0.18);
  --shadow-glow: 0 0 0 1px rgba(196,240,66,0.45), 0 10px 34px rgba(196,240,66,0.28);

  /* ---- Motion ---- */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 140ms; --dur-mid: 260ms; --dur-slow: 480ms;

  /* ---- Signature gradient (lime) ---- */
  --grad-signal: linear-gradient(120deg, #A6D424 0%, #C4F042 52%, #E4FF86 100%);
}

[data-theme="dark"] {
  --bg:           var(--ink-900);
  --bg-elevated:  var(--ink-800);
  --bg-inverse:   var(--paper);
  --text:         var(--paper);
  --text-muted:   var(--gray-400);
  --text-inverse: var(--ink-800);
  --border:       rgba(255,255,255,0.10);
  --brand:        var(--lime-500);
  --brand-strong: var(--lime-400);
  --accent:       var(--lime-500);
}