/* ============================================================================
   FreedomCore Family -- Design Tokens
   Single source of truth for the four-site franchise:
     MAVERICK (gold) · SHADOW (violet) · QUANTUM (cyan) · ARENA (silver)

   Imported by /css/style.css at the top of the file. Any sibling stylesheet
   that redefines a token below is a bug -- fix the source, not the fork.

   Scale discipline:
     - 6 palette colors + 4 site accents (one per site, one active per page)
     - 8-step type scale (12/14/16/20/28/40/64/96)
     - 8-step spacing scale (8/16/24/32/48/64/96/128)
     - 2 durations (ui 240ms · hero 800ms), 1 spring, 1 ease
   ============================================================================ */

:root {
    /* ─── CORE PALETTE (locked, 4 neutrals) ──────────────────────────────── */
    --bg-primary:     #0a0a0f;   /* page background */
    --bg-elevated:    #14141c;   /* cards, panels, modals, nav */
    --text-primary:   #f5f5fa;   /* body text, headings */
    --text-muted:     #6b7280;   /* meta, eyebrows, disabled */

    /* ─── SITE ACCENTS (exactly one active per page) ─────────────────────── */
    --accent-gold:    #ffd700;   /* MAVERICK identity */
    --accent-violet:  #8b5cf6;   /* SHADOW identity */
    --accent-cyan:    #3ea8f5;   /* QUANTUM identity */
    --accent-silver:  #c0c8d4;   /* ARENA identity */

    /* ─── TYPE SCALE (px → rem at 16px base) ─────────────────────────────── */
    --fs-12:  0.75rem;
    --fs-14:  0.875rem;
    --fs-16:  1rem;
    --fs-20:  1.25rem;
    --fs-28:  1.75rem;
    --fs-40:  2.5rem;
    --fs-64:  4rem;
    --fs-96:  6rem;

    /* ─── SPACING SCALE (8px base, same unit as our grid) ───────────────── */
    --sp-8:    0.5rem;
    --sp-16:   1rem;
    --sp-24:   1.5rem;
    --sp-32:   2rem;
    --sp-48:   3rem;
    --sp-64:   4rem;
    --sp-96:   6rem;
    --sp-128:  8rem;

    /* ─── MOTION ─────────────────────────────────────────────────────────── */
    --ease-spring:    cubic-bezier(0.34, 1.56, 0.64, 1);
    --ease-out:       cubic-bezier(0.4, 0, 0.2, 1);
    --duration-ui:    240ms;
    --duration-hero:  800ms;

    /* ─── BORDER + RADIUS (moved in from style.css / components.css) ─────── */
    --border:         rgba(245, 245, 250, 0.10);  /* derived from --text-primary */
    --radius-card:    12px;
    --radius-pill:    999px;
    --radius-button:  8px;

    /* ─── SEMANTIC STATUS (universal, does NOT flip per site) ────────────
       PnL, trade direction, execution health. Green = up, red = down.
       These are INTENTIONALLY not site-accent-derived -- a trader reading
       a loss in gold because MAVERICK's accent is gold would be a bug. */
    --pos:            #22c55e;   /* positive / profit / up */
    --neg:            #ef4444;   /* negative / loss / down */
}

/* ─── LIGHT THEME OVERRIDES ─────────────────────────────────────────────────
   Only surface + text tokens flip. Accents stay the same identity colors but
   are shifted slightly darker for contrast on light backgrounds.
   ─────────────────────────────────────────────────────────────────────────── */
[data-theme="light"] {
    --bg-primary:     #f5f5fa;
    --bg-elevated:    #ffffff;
    --text-primary:   #0a0a0f;
    --text-muted:     #4b5563;

    --accent-gold:    #c89b00;
    --accent-violet:  #6d3bcc;
    --accent-cyan:    #1e7fc4;
    --accent-silver:  #5a6270;

    --border:         rgba(10, 10, 15, 0.12);

    --pos:            #15803d;   /* darker green for light bg contrast */
    --neg:            #dc2626;
}