/* =====================================================================
 * FRNTIR design tokens — SINGLE SOURCE OF TRUTH
 * ---------------------------------------------------------------------
 * This file defines the FRNTIR brand primitives and scales as CSS custom
 * properties. It is consumed by every user-facing surface:
 *   - channels/voice  (vanilla CSS)
 *   - channels/chat   (Tailwind v4 @theme)
 *   - admin           (Tailwind v4 + shadcn/ui)
 *
 * Each surface keeps a COPY of this file and maps its own semantic roles
 * (primary, accent, background, ...) onto these primitives. Do not edit
 * the copies — edit THIS file and run:  scripts/sync-tokens.sh
 *
 * Brand derived from the FRNTIR logo + frntir.ai:
 *   navy   #0B1E42  (wordmark, primary, dark surfaces)
 *   orange #F8731E  (the four-pointed star / accent), gradient #F8861E→#F85E1E
 * ===================================================================== */

:root {
  /* --- Brand: navy ------------------------------------------------ */
  --frntir-navy-50: #eaeef6;
  --frntir-navy-100: #cbd5e8;
  --frntir-navy-200: #9db0cf;
  --frntir-navy-300: #6e84ae;
  --frntir-navy-400: #3f5680;
  --frntir-navy-500: #1e3a66;
  --frntir-navy-600: #122b4a;
  --frntir-navy-700: #0b1e42; /* core wordmark navy */
  --frntir-navy-800: #081a38;
  --frntir-navy-900: #061327;
  --frntir-navy-950: #030b18;

  /* --- Brand: orange (the star / accent) -------------------------- */
  --frntir-orange-50: #fef3ea;
  --frntir-orange-100: #fde0cc;
  --frntir-orange-200: #fbc299;
  --frntir-orange-300: #faa366;
  --frntir-orange-400: #f98b3d;
  --frntir-orange-500: #f8731e; /* core accent */
  --frntir-orange-600: #e55f12; /* hover / pressed */
  --frntir-orange-700: #c24e0f;
  --frntir-orange-800: #9a3e0d;
  --frntir-orange-900: #7c330d;

  /* The brand mark gradient (top→bottom of the star) */
  --frntir-orange-gradient: linear-gradient(135deg, #f8861e 0%, #f85e1e 100%);

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

  /* --- Status ----------------------------------------------------- */
  --color-white: #ffffff;
  --color-success: #22c55e;
  --color-warning: #f59e0b;
  --color-danger: #ef4444;

  /* --- Typography ------------------------------------------------- */
  --font-sans: "Figtree", "Segoe UI", system-ui, -apple-system,
    BlinkMacSystemFont, sans-serif;
  --font-mono: "Geist Mono", ui-monospace, "SFMono-Regular", Menlo, Consolas,
    monospace;

  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-lg: 1.125rem;
  --text-xl: 1.25rem;
  --text-2xl: 1.5rem;
  --text-3xl: 1.875rem;
  --text-4xl: 2.25rem;

  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;

  --leading-tight: 1.2;
  --leading-normal: 1.5;
  --leading-relaxed: 1.7;

  /* --- Spacing (4px base) ---------------------------------------- */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;

  /* --- Radius ----------------------------------------------------- */
  --radius-sm: 0.375rem;
  --radius-md: 0.625rem;
  --radius-lg: 1rem;
  --radius-xl: 1.5rem;
  --radius-pill: 999px;
  --radius-full: 50%;

  /* --- Shadow ----------------------------------------------------- */
  --shadow-sm: 0 12px 24px rgba(3, 11, 24, 0.35);
  --shadow-md: 0 18px 36px rgba(3, 11, 24, 0.42);
  --shadow-lg: 0 30px 60px rgba(3, 11, 24, 0.55);

  /* --- Motion ----------------------------------------------------- */
  --duration-fast: 0.15s;
  --duration-base: 0.25s;
  --duration-slow: 0.4s;
  --ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --transition: var(--duration-base) var(--ease-standard);
}