/* ================================================================
   tokens.css — Design Tokens (single source of truth)
   Change brand/semantic colors here — all CSS files inherit.
   ================================================================ */

:root {
  /* ── Brand (primary action color) ──────────────────────────── */
  --color-brand:       #4f46e5;
  --color-brand-hi:    #5b52f0;
  --color-brand-dark:  #4338ca;
  --color-brand-deep:  #3730a3;
  --color-brand-400:   #818cf8;
  --color-brand-50:    #eef2ff;
  --color-brand-100:   #e0e7ff;
  --color-brand-200:   #c7d2fe;
  --color-brand-glow:  rgba(79, 70, 229, 0.15);
  --color-brand-dim:   rgba(79, 70, 229, 0.10);

  /* ── Success ───────────────────────────────────────────────── */
  --color-success:        #059669;
  --color-success-hi:     #10b981;
  --color-success-dark:   #047857;
  --color-success-50:     #ecfdf5;
  --color-success-dim:    #d1fae5;
  --color-success-border: #a7f3d0;
  --color-success-text:   #065f46;

  /* ── Danger ────────────────────────────────────────────────── */
  --color-danger:        #dc2626;
  --color-danger-hi:     #ef4444;
  --color-danger-dark:   #b91c1c;
  --color-danger-50:     #fef2f2;
  --color-danger-border: #fecaca;
  --color-danger-text:   #991b1b;

  /* ── Warning ───────────────────────────────────────────────── */
  --color-warning:        #d97706;
  --color-warning-hi:     #f59e0b;
  --color-warning-50:     #fffbeb;
  --color-warning-100:    #fef3c7;
  --color-warning-border: #fcd34d;
  --color-warning-text:   #92400e;

  /* ── Accent (decorative — group badges, etc.) ──────────────── */
  --color-blue:     #2563eb;
  --color-blue-50:  #eff6ff;
  --color-blue-100: #dbeafe;

  --color-violet:    #7c3aed;
  --color-violet-50: #f5f3ff;

  /* ── Neutral scale ─────────────────────────────────────────── */
  --color-slate-50:  #f8fafc;
  --color-slate-100: #f1f5f9;
  --color-slate-200: #e2e8f0;
  --color-slate-300: #cbd5e1;
  --color-slate-400: #94a3b8;
  --color-slate-500: #64748b;
  --color-slate-600: #475569;
  --color-slate-700: #334155;
  --color-slate-800: #1e293b;
  --color-slate-900: #0f172a;
  --color-white:     #ffffff;

  /* ── Shared non-color tokens ───────────────────────────────── */
  --font-sans:          'Outfit', system-ui, -apple-system, sans-serif;
  --ease:               cubic-bezier(0.4, 0, 0.2, 1);
  --radius-sm:          8px;
  --radius-md:          10px;
  --radius-lg:          14px;
  --shadow-card:        0 1px 3px rgba(15, 23, 42, .06), 0 4px 20px rgba(15, 23, 42, .07);
  --shadow-card-hover:  0 4px 8px rgba(15, 23, 42, .10), 0 10px 28px rgba(15, 23, 42, .13);
}