/*
 * tokens.css — BidMaster design-token layer (BD-04 Phase B).
 *
 * Purpose: expose the shipped-Clarus token NAMES so future Clarus-pattern
 * components (BD-05+) render in BidMaster's palette. Each token ALIASES an
 * existing BidMaster variable (defined in modern.css), so it resolves to the
 * CURRENT value with ZERO change to any existing page — screenshot parity holds.
 *
 * Because every alias points at a BidMaster var that is already theme-aware
 * (modern.css defines the dark overrides under [data-theme="dark"]), these
 * tokens inherit light/dark automatically — no separate dark block is needed
 * or wanted here (a duplicated dark block would be a second source of truth and
 * a drift risk). Loaded FIRST in base_modern.html so tokens exist before use.
 *
 * NOTE: --border is intentionally NOT redefined — modern.css already owns that
 * exact name/role; re-declaring it here would be circular.
 */
/*
 * ── BD-13 brand ramp (D10 ruled: orange #F79E1B · navy #004071) ─────────────
 *
 * GENERATED by scripts/brand_ramp.py — do not hand-edit. Every shade below is
 * derived from the two canonical hexes by holding hue and saturation and moving
 * lightness; the -ink shades are darkened (light) or lightened (dark) in 1%
 * steps until they clear WCAG AA 4.5:1 against BOTH their surface and their own
 * tint. `python scripts/brand_ramp.py` prints the full contrast table and exits
 * non-zero if any pairing regresses; gate G8 runs it.
 *
 * These names live HERE and nowhere else. modern.css used to define --orange
 * and --navy in its own :root, which (equal specificity, later file) would have
 * silently beaten this block.
 *
 * --*-on is the foreground for a solid fill and is NOT assumed to be white:
 * white on the canonical orange is 2.13:1, so orange fills carry dark ink.
 */
/* BD-13 brand ramp — light */
:root {
  --orange:       #f79e1b;   /* canonical — fills, borders, accents          */
  --orange-dark:  #e18908;   /* hover / pressed                              */
  --orange-light: #fef6ea;   /* tint background                              */
  --orange-ink:   #9c6008;   /* orange AS TEXT — 5.13:1 card, 4.79:1 tint    */
  --orange-on:    #603c08;   /* text ON an orange fill — 4.59:1              */
  --navy:         #004071;   /* canonical                                    */
  --navy-light:   #0068b8;
  --navy-ink:     #004071;   /* 10.65:1 card                                 */
  --navy-on:      #ffffff;   /* 10.65:1                                      */
  --navy-tint:    #cde9ff;
}
/*
 * Sidebar palette — CONSTANT across themes.
 *
 * The sidebar is a dark navy panel in BOTH light and dark mode, so its
 * foregrounds are light-on-dark either way and must NOT follow the theme
 * tokens. Folding them into --navy-tint during the BD-13 collapse made the
 * sidebar text the same colour as its own background (1.00:1) — the
 * contrast audit caught it. These are named so they are tokens, not inline
 * hexes, without pretending they are theme-aware.
 */
:root, [data-theme="dark"] {
  --sidebar-bg:        #0d1520;   /* the panel itself — always dark navy */
  --sidebar-header-bg: #0d1520;
  --sidebar-fg:        #f0f6fd;   /* app name, hover states */
  --sidebar-fg-body:   #deeaf7;   /* nav links */
  --sidebar-fg-sub:    #c0d8ee;   /* sub-links */
  --sidebar-fg-mid:    #a8c8e0;   /* badges */
  --sidebar-fg-dim:    #92b4d0;   /* section labels, chevrons */
  --sidebar-accent:    #f79e1b;   /* active link — 8.5:1 on the panel */
}

/* BD-13 brand ramp — dark */
[data-theme="dark"] {
  --orange:       #f7a225;   /* 8.00:1 on card                               */
  --orange-dark:  #f79e1b;
  --orange-light: #3a2302;
  --orange-ink:   #f79e1b;   /* 7.77:1 card, 6.94:1 tint                     */
  --orange-on:    #603c08;   /* 4.73:1                                       */
  --navy:         #0080e1;   /* lifted — #004071 is invisible on dark        */
  --navy-light:   #1f9eff;
  --navy-ink:     #0091f8;   /* 5.05:1 card, 4.54:1 tint                     */
  --navy-on:      #001428;   /* white would be 4.06:1 — fails AA             */
  --navy-tint:    #002948;
}

:root {
  /* ── Surfaces ── */
  --bg:          var(--bg-page);
  --surface:     var(--bg-card);
  --surface-2:   var(--bg-hover);
  --card-shadow: var(--shadow-sm);

  /* ── Text ── */
  --text:        var(--text-primary);
  --text-dim:    var(--text-secondary);
  --text-faint:  var(--text-muted);

  /* ── Accent (BidMaster's brand accent is orange; navy is the secondary) ── */
  --accent:      var(--orange);
  --accent-dim:  var(--orange-dark);
  --accent-ink:  var(--orange-ink);   /* accent used as TEXT */
  --accent-fg:   var(--orange-on);    /* text ON an accent fill — not white */
  --accent-tint: var(--orange-light);
  --secondary:      var(--navy);
  --secondary-ink:  var(--navy-ink);
  --secondary-fg:   var(--navy-on);
  --secondary-tint: var(--navy-tint);

  /* ── Feedback ── */
  --ok:          var(--pill-awarded-text);
  --ok-bg:       var(--pill-awarded-bg);
  --ok-border:   var(--pill-awarded-border);
  --warn:        var(--pill-pending-text);
  --warn-bg:     var(--pill-pending-bg);
  --warn-border: var(--pill-pending-border);
  --err:         var(--pill-declined-text);
  --err-bg:      var(--pill-declined-bg);
  --err-border:  var(--pill-declined-border);
  --info:        var(--pill-review-text);
  --info-bg:     var(--pill-review-bg);
  --info-border: var(--pill-review-border);

  /* ── Status pills (Clarus names → BidMaster status palette) ── */
  --st-new:      var(--pill-review-text);
  --st-progress: var(--pill-pending-text);
  --st-waiting:  var(--pill-review-text);
  --st-done:     var(--pill-awarded-text);
  --st-hold:     var(--text-muted);

  /* ── Typography ── */
  --mono:        var(--font-mono);
}

/*
 * ── Role swap (BD-13, offered — NOT enabled) ────────────────────────────────
 *
 * The default keeps orange as the interactive accent, which is what BidMaster
 * has always done. The alternative treats NAVY as the interactive colour
 * (links, active tabs, primary buttons) and reserves ORANGE for attention —
 * warnings, overdue flags, the things that should be rare enough to stay loud.
 *
 * It is offered because the canonical amber is a poor interactive colour: as
 * text it needs darkening to #9c6008 to clear AA, and as a button fill it can
 * only carry dark ink. Navy carries white at 10.65:1 and reads as a link
 * without any of that.
 *
 * To adopt: add data-accent="navy" to the <html> element. One attribute; no
 * other change. Nothing below is active until that attribute is present.
 */
:root[data-accent="navy"] {
  --accent:      var(--navy);
  --accent-dim:  var(--navy-light);
  --accent-ink:  var(--navy-ink);
  --accent-fg:   var(--navy-on);
  --accent-tint: var(--navy-tint);
  --secondary:      var(--orange);
  --secondary-ink:  var(--orange-ink);
  --secondary-fg:   var(--orange-on);
  --secondary-tint: var(--orange-light);
}

/* ── Global refinements (BD-04 Phase B) ── */

/* Tabular figures on data surfaces so columns of numbers align. */
table,
.data-table,
.stat-value,
.metric-value,
.kv-row {
  font-variant-numeric: tabular-nums;
}

/* App-wide keyboard-focus ring (only shows on keyboard navigation, not mouse). */
:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}
