/* GENERATED — DO NOT EDIT. Source: shared/ui/tokens.css
   sha256:425b49df80a155ec2e5559966d48eb395e1508d6c1f347060722ec77eec43246
   Re-sync: node shared/ui/scripts/sync-tokens.mjs */
/* =============================================================================
   Florida AI Partners — Canonical Design Tokens
   -----------------------------------------------------------------------------
   ONE source of truth for color, type, space, radius, shadow & z-index across
   every spoke. Vendored into each adopter's public/vendor/tokens.css by
   shared/ui/scripts/sync-tokens.mjs (drift-checked by check-tokens.mjs).

   ARCHITECTURE (three layers — reference downward, never upward):
     1. RAW PALETTE  (--fap-*)   the ONLY place hex values live. The rebrand
                                 swap point: change a palette value, re-sync,
                                 and every spoke re-skins. Do NOT reference
                                 --fap-* outside the semantic roles below.
     2. SEMANTIC ROLES (--color-*) what the UI actually uses. Light by default;
                                 re-pointed wholesale in the dark block.
     3. SCALES (--text/--space/--radius/--shadow/--z-) theme-agnostic.

   The brand is a PLACEHOLDER (rebrand ~Aug 2026). These tokens are deliberately
   brand-AGNOSTIC plumbing so that rebrand = edit the palette block once.
   ============================================================================= */

:root {
  /* --- 1. RAW PALETTE — rebrand swap point (do not reference outside roles) --- */
  --fap-teal: #2b5ce6;        /* brand royal — primary brand (white text 5.56:1 — AA, an upgrade: old teal was 3.32:1) */
  --fap-teal-deep: #0f35b8;   /* AA royal for links/text on white (9.45:1) */
  --fap-teal-bright: #5faef4; /* spark blue — text/links on dark (logo spark #38A1F0 brightened for AA) */
  --fap-orange: #f3a81b;      /* signal gold — CTA fill (UI-only; the logo stays all-blue) */
  --fap-orange-deep: #de9110; /* gold hover/pressed (navy label 5.13:1) */
  --fap-orange-darker: #8f5200; /* AA gold accent TEXT on light (6.22:1) */
  --fap-navy: #1b2a6b;        /* brand navy — ink/headings/dark bands (wordmark navy) */
  --fap-navy-soft: #31418c;
  --fap-peach: #f8dfa8;       /* aurum glow — highlight on dark (Mission band heir; 10.13:1 on navy) */
  --fap-accent-wash: #fdf3dc;
  --fap-ivory: #f5f7fc;       /* frost white — page base (cool-shifted) */
  --fap-cream: #ebeff8;       /* mist blue — banded surface */
  --fap-white: #ffffff;
  --fap-line-warm: #d9dfee;   /* cool hairline (token NAME kept for API stability) */
  --fap-text: #1c2536;        /* body text on light */
  --fap-muted: #5a667f;       /* logo steel #7A869C darkened to AA 5.38:1 — NEVER use raw #7A869C as text (3.6:1) */
  /* semantic-state hues (light) */
  --fap-green: #1c7a4a;
  --fap-amber: #9a6700;
  --fap-red: #b3261e;

  /* --- 2. SEMANTIC ROLES (light default — everything references THESE) --- */
  --color-bg: var(--fap-ivory);            /* page base */
  --color-surface: var(--fap-white);       /* cards / panels */
  --color-surface-2: var(--fap-cream);     /* raised / banded */
  --color-surface-hover: #e3e9f5;
  --color-line: var(--fap-line-warm);      /* hairlines / borders */

  --color-ink: var(--fap-navy);            /* headings / strong text */
  --color-text: var(--fap-text);           /* body text */
  --color-muted: var(--fap-muted);         /* secondary text */

  --color-brand: var(--fap-teal);          /* brand fills, active states */
  --color-brand-strong: var(--fap-teal-deep); /* brand text/links (AA on white) */
  --color-on-brand: var(--fap-white);      /* text on a brand fill */

  --color-accent: var(--fap-orange);       /* accent fills */
  --color-accent-strong: var(--fap-orange-deep); /* accent CTA / hover (AA) */
  --color-accent-ink: var(--fap-orange-darker);  /* accent text on light (AA gold text — re-pointed) */
  --color-accent-wash: var(--fap-accent-wash);   /* faint accent background */
  --color-on-accent: var(--fap-navy);            /* label on a gold fill — navy (white-on-gold fails AA) */

  --color-highlight: var(--fap-peach);

  /* state role pairs: a readable foreground + a tinted surface */
  --color-success: var(--fap-green);   --color-success-bg: #e8f6ee;
  --color-warning: var(--fap-amber);   --color-warning-bg: #fff6e6;
  --color-danger:  var(--fap-red);     --color-danger-bg:  #fdeceb;
  --color-info:    var(--fap-teal-deep); --color-info-bg:  #edf2fe;

  --color-focus-ring: rgba(43, 92, 230, 0.45);

  /* --- 3a. TYPE --- */
  --font-display: "Sora", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-body: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-serif: "Lora", "Iowan Old Style", Georgia, "Times New Roman", serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;

  --text-xs: 0.75rem;     /* 12 */
  --text-sm: 0.8125rem;   /* 13 */
  --text-base: 0.9375rem; /* 15 — compact app body (CRM) */
  --text-md: 1rem;        /* 16 — inputs (no iOS zoom), comfortable body */
  --text-lg: 1.125rem;    /* 18 */
  --text-xl: 1.25rem;     /* 20 */
  --text-2xl: 1.5rem;     /* 24 */
  --text-3xl: 1.9rem;     /* ~30 */
  --text-4xl: clamp(2rem, 4vw, 2.75rem);

  --leading-tight: 1.15;
  --leading-snug: 1.25;
  --leading-normal: 1.5;
  --leading-relaxed: 1.6;
  --tracking-tight: -0.02em;

  /* --- 3b. SPACE (4px base) --- */
  --space-0: 0;
  --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;

  /* --- 3c. RADIUS (reconciles the 9/12/14/18/22/999 spread) --- */
  --radius-sm: 9px;
  --radius: 12px;
  --radius-md: 14px;
  --radius-lg: 18px;
  --radius-xl: 22px;
  --radius-pill: 999px;

  /* --- 3d. SHADOW (light) --- */
  --shadow-sm: 0 1px 3px rgba(27, 42, 107, 0.08);
  --shadow: 0 8px 24px rgba(27, 42, 107, 0.07), 0 1px 2px rgba(27, 42, 107, 0.06);
  --shadow-lg: 0 28px 60px rgba(27, 42, 107, 0.16);

  /* --- 3e. Z-INDEX --- */
  --z-base: 0;
  --z-sticky: 20;
  --z-dropdown: 40;
  --z-overlay: 60;
  --z-modal: 80;
  --z-toast: 100;
}

/* =============================================================================
   DARK THEME — opt in by setting [data-theme="dark"] on <html>. Re-points the
   SEMANTIC roles only (+ shadows); scales are inherited. --color-brand carries a
   dark-tuned brand royal (#3b6be8, white text AA); info re-tints royal; the
   gold accent brightens for on-dark legibility (navy label stays the on-accent).
   ============================================================================= */
[data-theme="dark"] {
  --color-bg: #0f141b;
  --color-surface: #19212c;
  --color-surface-2: #232e3b;
  --color-surface-hover: #2a3645;
  --color-line: #2b3744;

  --color-ink: #e9eef4;
  --color-text: #e9eef4;
  --color-muted: #94a3b4;

  --color-brand: #3b6be8;          /* dark-tuned royal (white text 4.71:1 — AA) */
  --color-brand-strong: var(--fap-teal-bright); /* spark blue for on-dark text (#5faef4) */
  --color-on-brand: #ffffff;

  --color-accent: var(--fap-orange);
  --color-accent-strong: #ffb53e;  /* gold brightened for on-dark hover/pressed */
  --color-accent-ink: #ffc964;     /* gold accent text on dark */
  --color-accent-wash: #2a1c10;
  --color-on-accent: #131a3d;      /* navy-ink label on a gold fill */

  --color-highlight: var(--fap-peach);

  --color-success: #5fd38a;  --color-success-bg: #143120;
  --color-warning: #e6b549;  --color-warning-bg: #382c13;
  --color-danger:  #f08a80;  --color-danger-bg:  #3a2020;
  --color-info:    #5faef4;  --color-info-bg:    #10263e;

  --color-focus-ring: rgba(95, 174, 244, 0.5);

  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.45);
  --shadow: 0 6px 18px rgba(0, 0, 0, 0.32), 0 1px 2px rgba(0, 0, 0, 0.45);
  --shadow-lg: 0 24px 60px rgba(0, 8, 25, 0.5);

  color-scheme: dark;
}