/* ==========================================================================
   RunFitCoach — Design tokens (single source of truth)
   Dark-mode-first. Mint primary. Barlow Condensed display + Inter body.
   ========================================================================== */

:root {
  /* -------- Brand ---------------------------------------------------- */
  --brand-mint:        #2DD4A8;   /* logo mint / accent green */
  --brand-mint-bright: #34e0b4;   /* hover / highlighted */
  --brand-teal:        #13394E;   /* logo dark teal (RunFit wordmark) */
  --brand-teal-deep:   #0B2535;   /* darker teal for shadows/bgs */
  --brand-cyan:        #22d3ee;   /* gradient companion */

  /* -------- Dark surface scale (the default theme) -------------------- */
  --bg:             hsl(240 8% 6%);     /* page background */
  --bg-elev-0:      hsl(240 8% 9%);     /* card */
  --bg-elev-1:      hsl(240 8% 12%);    /* elevated card / nested */
  --bg-elev-2:      hsl(240 6% 15%);    /* muted / input */
  --border:         hsl(240 6% 18%);
  --border-soft:    rgba(255,255,255,0.06);
  --border-white:   rgba(255,255,255,0.10);

  /* -------- Text ---------------------------------------------------- */
  --fg:             hsl(0 0% 98%);       /* primary text */
  --fg-muted:       hsl(240 5% 65%);     /* secondary text */
  --fg-dim:         rgba(255,255,255,0.45);
  --fg-ghost:       rgba(255,255,255,0.25);

  /* -------- Semantic role colors ----------------------------------- */
  --primary:            hsl(162 62% 48%);       /* brand mint — CTA */
  --primary-foreground: hsl(193 62% 12%);       /* deep teal on mint */
  --primary-ring:       hsl(162 77% 57%);
  --accent-fg:          hsl(162 77% 57%);       /* bright accent text on muted bg */
  --destructive:        hsl(0 84% 60%);
  --destructive-fg:     hsl(0 0% 98%);

  /* -------- Data / FIT Score zones --------------------------------- */
  --zone-recovery:   #38bdf8;  /* Z1 sky */
  --zone-easy:       #34d399;  /* Easy / Z2 emerald */
  --zone-long:       #60a5fa;  /* Long run blue */
  --zone-marathon:   #a78bfa;  /* Marathon violet */
  --zone-half:       #818cf8;  /* Half indigo */
  --zone-tempo:      #fbbf24;  /* Tempo / Z3 amber */
  --zone-vo2:        #f97316;  /* VO2 / Z4 orange */
  --zone-interval:   #f43f5e;  /* Interval / Z5 rose */
  --arc-grad-start:  #6366f1;  /* FIT Score arc gradient */
  --arc-grad-end:    #f43f5e;

  /* -------- Status -------------------------------------------------- */
  --status-online:   rgb(34 197 94);
  --status-away:     rgb(245 158 11);
  --status-busy:     rgb(239 68 68);
  --status-offline:  rgb(156 163 175);

  /* -------- Type families ------------------------------------------- */
  --font-sans:    'Inter', system-ui, -apple-system, sans-serif;
  --font-display: 'Barlow Condensed', 'Inter', sans-serif;
  --font-mono:    ui-monospace, 'SF Mono', Menlo, Monaco, Consolas, monospace;

  /* -------- Radii (from tailwind.config) ---------------------------- */
  --radius-sm:  3px;
  --radius-md:  6px;
  --radius-lg:  9px;
  --radius-xl:  12px;   /* rounded-xl — buttons, inputs */
  --radius-2xl: 16px;   /* rounded-2xl — cards */
  --radius-3xl: 24px;
  --radius-full: 9999px;

  /* -------- Spacing (Tailwind 4pt grid, keys we lean on) ------------ */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;

  /* -------- Shadows / glows ---------------------------------------- */
  --shadow-card:    0 1px 3px rgba(0,0,0,0.15), 0 1px 2px rgba(0,0,0,0.08);
  --shadow-card-lg: 0 2px 8px rgba(0,0,0,0.3), 0 1px 3px rgba(0,0,0,0.2);
  --shadow-xl:      0 10px 30px rgba(0,0,0,0.45);
  --glow-primary:   0 0 20px hsla(162 77% 57% / 0.4);
  --glow-primary-lg:0 0 40px hsla(162 77% 57% / 0.5);
  --text-glow:      0 0 20px hsla(162 77% 57% / 0.15);

  /* -------- Motion -------------------------------------------------- */
  --ease-out:   cubic-bezier(0.16, 1, 0.3, 1);
  --ease-snap:  cubic-bezier(0.2, 0.8, 0.2, 1);
  --dur-fast:   150ms;
  --dur-base:   250ms;
  --dur-slow:   400ms;
}