/* ============================================================================
   LIGHT THEME — platform-wide
   Activated by html[data-theme="light"]. Re-defines the canonical color tokens
   used everywhere (--bb-*, --ix-*, --led-*, plus a few hardcoded surfaces) so
   the entire dashboard, top nav, ticker, sidebar, sections, tables, and form
   controls flip to a clean cream-and-charcoal palette in one toggle.
   ============================================================================ */

/* ── 0. SUPPRESS THE GLOBAL SCANLINE OVERLAY ───────────────────────────
   bloomberg-terminal.css paints a CRT-style scanline across body::after that
   shows as horizontal stripes against the cream canvas. Hide it in light. */
html[data-theme="light"] body::after,
html[data-theme="light"] body::before {
  display: none !important;
  background: transparent !important;
}

/* ── 1. TOKEN OVERRIDES — light values for the canonical token sets ──── */
html[data-theme="light"] {
  /* --bb-* (bloomberg-terminal.css canonical) */
  --bb-bg:           #FAF9F5;
  --bb-bg-1:         #FFFFFF;
  --bb-bg-2:         #F1EDE4;
  --bb-bg-3:         #EBE6DB;
  --bb-bg-panel:     #FFFFFF;
  --bb-bg-row:       #FFFFFF;
  --bb-bg-hover:     #F1EDE4;
  --bb-bg-input:     #FFFFFF;
  --bb-bg-elevated:  #FFFFFF;

  --bb-border:        #E0DCCC;
  --bb-border-bright: #C5BFA8;

  --bb-text:         #19181A;
  --bb-text-2:       #2A2826;
  --bb-text-3:       #5B5648;
  --bb-text-4:       #8A8475;
  --bb-text-dim:     #8A8475;
  --bb-text-muted:   #5B5648;

  --bb-amber:        #B25A32;          /* deeper for AA on light */
  --bb-amber-dim:    rgba(178, 90, 50, 0.10);
  --bb-amber-line:   rgba(178, 90, 50, 0.32);
  --bb-amber-glow:   rgba(178, 90, 50, 0.08);

  --bb-green:        #2F7A48;
  --bb-green-dim:    rgba(47, 122, 72, 0.10);
  --bb-red:          #A93B34;
  --bb-red-dim:      rgba(169, 59, 52, 0.10);
  --bb-blue:         #2F6DA3;

  /* --ix-* and --led-* aliases used by terminal-ledger.css and friends */
  --ix-bg:           #FAF9F5;
  --ix-surface:      #FFFFFF;
  --ix-surface-2:    #F1EDE4;
  --ix-text:         #19181A;
  --ix-text-muted:   #5B5648;
  --ix-text-dim:     #8A8475;
  --ix-border:       #E0DCCC;
  --ix-accent:       #B25A32;

  --led-paper:   #19181A;
  --led-body:    #2A2826;
  --led-quiet:   #5B5648;
  --led-rule:    #E0DCCC;
  --led-up:      #2F7A48;
  --led-down:    #A93B34;

  --bg-1: #FFFFFF;
  --bg:   #FAF9F5;
  --text-2: #2A2826;
  --text-3: #5B5648;
  --text-4: #8A8475;
  --gain: #2F7A48;
  --loss: #A93B34;
  --accent: #B25A32;
  --border: #E0DCCC;
  --border-2: #C5BFA8;

  color-scheme: light;
}

/* ── 2. BODY + ROOT CANVAS ──────────────────────────────────────────── */
html[data-theme="light"] body {
  background: var(--bb-bg) !important;
  color: var(--bb-text) !important;
}
/* Override the inline body style="background:#0a0a09" set by header.ejs */
html[data-theme="light"] body[style*="background"] {
  background: var(--bb-bg) !important;
}

/* ── 3. TOPNAV + TICKER ─────────────────────────────────────────────── */
html[data-theme="light"] .ix-nav,
html[data-theme="light"] header[class*="ix-nav"],
html[data-theme="light"] .ix-topnav {
  background: #FFFFFF !important;
  border-bottom: 1px solid var(--bb-border) !important;
  color: var(--bb-text) !important;
}
html[data-theme="light"] .ix-nav-item,
html[data-theme="light"] [class*="ix-nav-item"],
html[data-theme="light"] .ix-nav a,
html[data-theme="light"] .ix-search input {
  color: var(--bb-text) !important;
  background: transparent !important;
}
html[data-theme="light"] .ix-nav-item:hover,
html[data-theme="light"] .ix-nav a:hover {
  color: var(--bb-amber) !important;
}
html[data-theme="light"] .ix-search,
html[data-theme="light"] .ix-search input {
  background: var(--bb-bg-2) !important;
  border-color: var(--bb-border) !important;
  color: var(--bb-text) !important;
}
html[data-theme="light"] .ix-ticker,
html[data-theme="light"] [class*="ticker-bar"],
html[data-theme="light"] [class*="ticker"]:not([class*="ticker-bar-symbol"]) {
  background: #FFFFFF !important;
  border-bottom: 1px solid var(--bb-border) !important;
  color: var(--bb-text-3) !important;
}
html[data-theme="light"] .ix-notif,
html[data-theme="light"] .ix-user-btn {
  background: transparent !important;
  border-color: var(--bb-border) !important;
  color: var(--bb-text) !important;
}
html[data-theme="light"] [class*="terminal-btn"],
html[data-theme="light"] [class*="explore-btn"],
html[data-theme="light"] .ix-nav-cta {
  background: var(--bb-text) !important;
  color: var(--bb-bg) !important;
  border: 0 !important;
}

/* ── 4. DASHBOARD SHELL ─────────────────────────────────────────────── */
html[data-theme="light"] body.ix-bloomberg-tight .db-main,
html[data-theme="light"] body.ix-bloomberg-tight .db-layout,
html[data-theme="light"] body.ix-bloomberg-tight .db-main-col,
html[data-theme="light"] .db-main,
html[data-theme="light"] .db-layout,
html[data-theme="light"] .db-main-col {
  background: var(--bb-bg) !important;
  color: var(--bb-text) !important;
}

/* ── 5. SIDEBAR ─────────────────────────────────────────────────────── */
html[data-theme="light"] .db-sidebar {
  background: #FFFFFF !important;
  border-right: 1px solid var(--bb-border) !important;
  color: var(--bb-text) !important;
}
html[data-theme="light"] .db-sidebar-section,
html[data-theme="light"] body.ix-bloomberg-tight .db-sidebar-section {
  background: transparent !important;
  border-bottom: 1px solid var(--bb-border) !important;
  color: var(--bb-text) !important;
}
html[data-theme="light"] body.ix-bloomberg-tight .db-sidebar-hdr,
html[data-theme="light"] .db-sidebar-hdr {
  color: var(--bb-text-3) !important;
}
html[data-theme="light"] body.ix-bloomberg-tight .db-sidebar-item,
html[data-theme="light"] .db-sidebar-item {
  color: var(--bb-text) !important;
  background: transparent !important;
}
html[data-theme="light"] .db-sidebar-item:hover {
  background: var(--bb-bg-2) !important;
  color: var(--bb-text) !important;
}
html[data-theme="light"] body.ix-bloomberg-tight .db-sidebar-item.active-portfolio,
html[data-theme="light"] body.ix-bloomberg-tight .db-sidebar-item.active,
html[data-theme="light"] .db-sidebar-item.active {
  background: var(--bb-amber-dim) !important;
  color: var(--bb-amber) !important;
  border-left-color: var(--bb-amber) !important;
}
html[data-theme="light"] .db-sidebar-item span:last-child {
  color: var(--bb-text-3) !important;
}

/* Account hero card on left rail (the inline-styled rgba amber card) */
html[data-theme="light"] .db-sidebar-section[style*="rgba(217,119,87"] {
  background: rgba(178, 90, 50, 0.05) !important;
  border: 1px solid rgba(178, 90, 50, 0.18) !important;
  border-radius: 8px !important;
  padding: 10px 14px !important;
}
html[data-theme="light"] #sb-acct-label { color: var(--bb-text-3) !important; }
html[data-theme="light"] #sb-acct-value { color: var(--bb-text) !important; }
html[data-theme="light"] #sb-acct-change > span { color: var(--bb-green) !important; }
html[data-theme="light"] .db-sidebar-section[style*="rgba(217,119,87"] > div:last-child {
  border-top-color: var(--bb-border) !important;
}

/* ── 6. KPI STRIP ───────────────────────────────────────────────────── */
html[data-theme="light"] body.ix-bloomberg-tight .db-stat-strip,
html[data-theme="light"] .db-stat-strip {
  background: #FFFFFF !important;
  border: 1px solid var(--bb-border) !important;
}
html[data-theme="light"] body.ix-bloomberg-tight .db-stat-cell {
  border-right-color: var(--bb-border) !important;
}
html[data-theme="light"] body.ix-bloomberg-tight .db-stat-cell:hover {
  background: var(--bb-bg-2) !important;
}
html[data-theme="light"] body.ix-bloomberg-tight .db-stat-label { color: var(--bb-text-3) !important; }
html[data-theme="light"] body.ix-bloomberg-tight .db-stat-value { color: var(--bb-text) !important; }
html[data-theme="light"] body.ix-bloomberg-tight .db-stat-sub { color: var(--bb-text-3) !important; }

/* ── 7. SECTION PANELS ──────────────────────────────────────────────── */
html[data-theme="light"] body.ix-bloomberg-tight .db-section,
html[data-theme="light"] body.ix-bloomberg-tight .db-panel,
html[data-theme="light"] body.ix-bloomberg-tight .db-card,
html[data-theme="light"] body.ix-bloomberg-tight .db-glass,
html[data-theme="light"] body.ix-bloomberg-tight .db-chart-wrap,
html[data-theme="light"] body.ix-bloomberg-tight .db-ai-insight-card,
html[data-theme="light"] body.ix-bloomberg-tight .db-closable-widget,
html[data-theme="light"] .db-section,
html[data-theme="light"] .db-panel,
html[data-theme="light"] .db-card,
html[data-theme="light"] .db-glass,
html[data-theme="light"] .db-chart-wrap,
html[data-theme="light"] .db-ai-insight-card {
  background: #FFFFFF !important;
  border-color: var(--bb-border) !important;
  color: var(--bb-text) !important;
}
html[data-theme="light"] body.ix-bloomberg-tight .db-section-head,
html[data-theme="light"] .db-section-head {
  background: transparent !important;
  border-bottom: 1px solid var(--bb-border) !important;
  color: var(--bb-text) !important;
}
html[data-theme="light"] body.ix-bloomberg-tight .db-section-head-title,
html[data-theme="light"] body.ix-bloomberg-tight .db-section-title,
html[data-theme="light"] .db-section-head-title,
html[data-theme="light"] .db-section-title { color: var(--bb-text) !important; }
html[data-theme="light"] body.ix-bloomberg-tight .db-section-link span,
html[data-theme="light"] .db-section-link span { color: var(--bb-text-3) !important; }
html[data-theme="light"] .db-nav-arrow { color: var(--bb-amber) !important; }

/* AI insight card subtle amber tint */
html[data-theme="light"] body.ix-bloomberg-tight .db-ai-insight-card,
html[data-theme="light"] .db-ai-insight-card {
  background: linear-gradient(180deg, rgba(178,90,50,0.04) 0%, #FFFFFF 80%) !important;
  border-left: 2px solid var(--bb-amber) !important;
}

/* ── 8. PERIOD PILL BUTTONS ─────────────────────────────────────────── */
html[data-theme="light"] body.ix-bloomberg-tight .db-period,
html[data-theme="light"] body.ix-bloomberg-tight .db-period-btn,
html[data-theme="light"] body.ix-bloomberg-tight .db-tf-btn,
html[data-theme="light"] body.ix-bloomberg-tight .db-perf-period,
html[data-theme="light"] body.ix-bloomberg-tight [class*="db-time"] button,
html[data-theme="light"] body.ix-bloomberg-tight .db-chart-expand {
  background: #FFFFFF !important;
  border: 1px solid var(--bb-border) !important;
  color: var(--bb-text-3) !important;
}
html[data-theme="light"] body.ix-bloomberg-tight .db-period:hover,
html[data-theme="light"] body.ix-bloomberg-tight .db-period-btn:hover,
html[data-theme="light"] body.ix-bloomberg-tight .db-tf-btn:hover {
  background: var(--bb-bg-2) !important;
  color: var(--bb-text) !important;
  border-color: var(--bb-border-bright) !important;
}
html[data-theme="light"] body.ix-bloomberg-tight .db-period.active,
html[data-theme="light"] body.ix-bloomberg-tight .db-period-btn.active,
html[data-theme="light"] body.ix-bloomberg-tight .db-tf-btn.active,
html[data-theme="light"] body.ix-bloomberg-tight .db-perf-period.active {
  background: var(--bb-amber-dim) !important;
  border-color: var(--bb-amber-line) !important;
  color: var(--bb-amber) !important;
}

/* ── 9. TABLES ──────────────────────────────────────────────────────── */
html[data-theme="light"] body.ix-bloomberg-tight .db-holdings-table th,
html[data-theme="light"] body.ix-bloomberg-tight .db-table th,
html[data-theme="light"] .db-holdings-table th,
html[data-theme="light"] .db-table th {
  background: #FFFFFF !important;
  color: var(--bb-text-3) !important;
  border-bottom-color: var(--bb-border) !important;
}
html[data-theme="light"] body.ix-bloomberg-tight .db-holdings-table td,
html[data-theme="light"] body.ix-bloomberg-tight .db-table td,
html[data-theme="light"] .db-holdings-table td,
html[data-theme="light"] .db-table td {
  background: transparent !important;
  color: var(--bb-text) !important;
  border-bottom-color: var(--bb-border) !important;
}
html[data-theme="light"] body.ix-bloomberg-tight .db-holdings-table tr:hover td {
  background: var(--bb-bg-2) !important;
}

/* ── 10. ALLOCATION + MARKET PULSE ROWS ─────────────────────────────── */
html[data-theme="light"] body.ix-bloomberg-tight .db-allocation,
html[data-theme="light"] body.ix-bloomberg-tight .db-sector-row,
html[data-theme="light"] body.ix-bloomberg-tight .db-allocation-row,
html[data-theme="light"] .db-sector-row,
html[data-theme="light"] .db-allocation-row {
  border-bottom-color: var(--bb-border) !important;
  color: var(--bb-text) !important;
}
html[data-theme="light"] body.ix-bloomberg-tight .db-allocation-pct,
html[data-theme="light"] body.ix-bloomberg-tight .db-sector-pct {
  color: var(--bb-text) !important;
}
html[data-theme="light"] body.ix-bloomberg-tight .db-asset-bar,
html[data-theme="light"] .db-asset-bar {
  background: var(--bb-bg-2) !important;
}

/* ── 11. EVENT BADGES + BUTTONS ─────────────────────────────────────── */
html[data-theme="light"] body.ix-bloomberg-tight .db-event-item,
html[data-theme="light"] .db-event-item {
  border-bottom-color: var(--bb-border) !important;
  color: var(--bb-text) !important;
}
html[data-theme="light"] body.ix-bloomberg-tight .db-event-badge,
html[data-theme="light"] .db-event-badge {
  background: var(--bb-amber-dim) !important;
  border-color: var(--bb-amber-line) !important;
  color: var(--bb-amber) !important;
}

/* ── 12. STATUS FOOTER ──────────────────────────────────────────────── */
html[data-theme="light"] body.ix-bloomberg-tight .db-status-bar,
html[data-theme="light"] body.ix-bloomberg-tight .db-footer,
html[data-theme="light"] .db-status-bar,
html[data-theme="light"] .db-footer {
  background: #FFFFFF !important;
  border-top: 1px solid var(--bb-border) !important;
  color: var(--bb-text-3) !important;
}

/* ── 13. FORM INPUTS / SELECTS ──────────────────────────────────────── */
html[data-theme="light"] input[type="text"],
html[data-theme="light"] input[type="search"],
html[data-theme="light"] input[type="email"],
html[data-theme="light"] input[type="number"],
html[data-theme="light"] input[type="password"],
html[data-theme="light"] textarea,
html[data-theme="light"] select {
  background: #FFFFFF !important;
  border: 1px solid var(--bb-border) !important;
  color: var(--bb-text) !important;
}
html[data-theme="light"] input:focus,
html[data-theme="light"] textarea:focus,
html[data-theme="light"] select:focus {
  outline: 0 !important;
  border-color: var(--bb-amber) !important;
}

/* ── 14. SETTINGS PAGE — flip the sidebar nav + s-section to light ──── */
html[data-theme="light"] .s-shell,
html[data-theme="light"] .s-page {
  background: var(--bb-bg) !important;
  color: var(--bb-text) !important;
}
html[data-theme="light"] .s-side {
  background: #FFFFFF !important;
  border-right: 1px solid var(--bb-border) !important;
}
html[data-theme="light"] .s-nav-item,
html[data-theme="light"] [class*="s-nav"] {
  color: var(--bb-text-3) !important;
  background: transparent !important;
}
html[data-theme="light"] .s-nav-item.active {
  background: var(--bb-amber-dim) !important;
  color: var(--bb-amber) !important;
}
html[data-theme="light"] .s-section,
html[data-theme="light"] [class*="s-section"] {
  background: #FFFFFF !important;
  border: 1px solid var(--bb-border) !important;
  color: var(--bb-text) !important;
}
html[data-theme="light"] .s-section-title,
html[data-theme="light"] .s-page-title { color: var(--bb-text) !important; }
html[data-theme="light"] .s-section-desc { color: var(--bb-text-3) !important; }
html[data-theme="light"] .s-theme-card,
html[data-theme="light"] .s-style-card {
  background: var(--bb-bg-2) !important;
  border: 1px solid var(--bb-border) !important;
  color: var(--bb-text) !important;
}
html[data-theme="light"] .s-theme-card.active,
html[data-theme="light"] .s-style-card.active {
  background: #FFFFFF !important;
  border-color: var(--bb-amber) !important;
  box-shadow: 0 0 0 1px var(--bb-amber);
}
html[data-theme="light"] .s-swatch { box-shadow: 0 0 0 1px var(--bb-border); }
html[data-theme="light"] .s-swatch.active { box-shadow: 0 0 0 2px var(--bb-amber); }

/* ── 15. SCROLLBAR (tonal-aware) ────────────────────────────────────── */
html[data-theme="light"] ::-webkit-scrollbar-thumb {
  background: var(--bb-border) !important;
  border-radius: 4px;
}
html[data-theme="light"] ::-webkit-scrollbar-thumb:hover {
  background: var(--bb-border-bright) !important;
}

/* ── 16. SELECTION ──────────────────────────────────────────────────── */
html[data-theme="light"] ::selection {
  background: var(--bb-amber-dim) !important;
  color: var(--bb-amber) !important;
}

/* ── 17. SEMANTIC UP/DOWN — re-tune the inline #22c55e / #ef4444 ────── */
html[data-theme="light"] [style*="color:#22c55e"],
html[data-theme="light"] [style*="color: #22c55e"],
html[data-theme="light"] [class*="positive"],
html[data-theme="light"] [class*="-up"] {
  color: var(--bb-green) !important;
}
html[data-theme="light"] [style*="color:#ef4444"],
html[data-theme="light"] [style*="color: #ef4444"],
html[data-theme="light"] [class*="negative"],
html[data-theme="light"] [class*="-down"] {
  color: var(--bb-red) !important;
}

/* ── 18. AMBER (any inline #d97757 → terracotta) ─────────────────────── */
html[data-theme="light"] [style*="color:#d97757"],
html[data-theme="light"] [style*="color: #d97757"],
html[data-theme="light"] [class*="amber"]:not(.s-check) {
  color: var(--bb-amber) !important;
}

/* ── 19. KILL DARK INLINE BG TINTS THAT SHOW THROUGH (NUCLEAR) ───────── */
/* Match ALL the dark hex colors the dashboard hardcodes inline: 0a/14/1a/1f/25/2a... */
html[data-theme="light"] [style*="background:#0a0a09"],
html[data-theme="light"] [style*="background: #0a0a09"],
html[data-theme="light"] [style*="background-color:#0a0a09"],
html[data-theme="light"] [style*="background-color: #0a0a09"],
html[data-theme="light"] [style*="background:#141413"],
html[data-theme="light"] [style*="background: #141413"],
html[data-theme="light"] [style*="background-color:#141413"],
html[data-theme="light"] [style*="background:#14130f"],
html[data-theme="light"] [style*="background: #14130f"],
html[data-theme="light"] [style*="background:#1a1918"],
html[data-theme="light"] [style*="background: #1a1918"],
html[data-theme="light"] [style*="background-color:#1a1918"],
html[data-theme="light"] [style*="background:#1a1814"],
html[data-theme="light"] [style*="background:#1f1e1d"],
html[data-theme="light"] [style*="background: #1f1e1d"],
html[data-theme="light"] [style*="background:#252422"],
html[data-theme="light"] [style*="background: #252422"],
html[data-theme="light"] [style*="background:#221f19"],
html[data-theme="light"] [style*="background:#0f1117"],
html[data-theme="light"] [style*="background: #0f1117"],
html[data-theme="light"] [style*="background:#0d0d0c"],
html[data-theme="light"] [style*="background:#171615"] {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
}
/* rgba dark tints (panels, modal scrim, etc.) */
html[data-theme="light"] [style*="background:rgba(20,20,19"],
html[data-theme="light"] [style*="background: rgba(20,20,19"],
html[data-theme="light"] [style*="background:rgba(10,10,9"],
html[data-theme="light"] [style*="background:rgba(0,0,0"],
html[data-theme="light"] [style*="background: rgba(0,0,0"],
html[data-theme="light"] [style*="background:rgba(15,17,23"],
html[data-theme="light"] [style*="background:rgba(26,25,24"],
html[data-theme="light"] [style*="background-color:rgba(20"],
html[data-theme="light"] [style*="background-color: rgba(20"] {
  background: var(--bb-bg) !important;
  background-color: var(--bb-bg) !important;
}
/* Linear-gradient dark surfaces */
html[data-theme="light"] [style*="linear-gradient(180deg, #14"],
html[data-theme="light"] [style*="linear-gradient(180deg,#14"],
html[data-theme="light"] [style*="linear-gradient(180deg, #1a"],
html[data-theme="light"] [style*="linear-gradient(180deg,#1a"],
html[data-theme="light"] [style*="linear-gradient(180deg, #0a"],
html[data-theme="light"] [style*="linear-gradient(180deg,#0a"] {
  background: #FFFFFF !important;
}

/* ── 19b. KILL DARK INLINE TEXT COLORS THAT VANISH ON CREAM ──────────── */
html[data-theme="light"] [style*="color:#fff"],
html[data-theme="light"] [style*="color: #fff"],
html[data-theme="light"] [style*="color:white"],
html[data-theme="light"] [style*="color: white"],
html[data-theme="light"] [style*="color:#ffffff"],
html[data-theme="light"] [style*="color: #ffffff"],
html[data-theme="light"] [style*="color:#e8e5de"],
html[data-theme="light"] [style*="color: #e8e5de"],
html[data-theme="light"] [style*="color:#ebe7df"],
html[data-theme="light"] [style*="color: #ebe7df"],
html[data-theme="light"] [style*="color:#cbd5e1"],
html[data-theme="light"] [style*="color: #cbd5e1"],
html[data-theme="light"] [style*="color:#e2e8f0"],
html[data-theme="light"] [style*="color:#f8fafc"] {
  color: var(--bb-text) !important;
}
/* These mid-greys are bright enough on dark, but invisible on cream — bump them down */
html[data-theme="light"] [style*="color:#a09c97"],
html[data-theme="light"] [style*="color: #a09c97"],
html[data-theme="light"] [style*="color:#a09c91"],
html[data-theme="light"] [style*="color: #a09c91"],
html[data-theme="light"] [style*="color:#8a8580"],
html[data-theme="light"] [style*="color: #8a8580"],
html[data-theme="light"] [style*="color:#94a3b8"],
html[data-theme="light"] [style*="color: #94a3b8"],
html[data-theme="light"] [style*="color:#7d7670"],
html[data-theme="light"] [style*="color:#75716a"],
html[data-theme="light"] [style*="color: #75716a"],
html[data-theme="light"] [style*="color:#5e5953"],
html[data-theme="light"] [style*="color:#4a473f"] {
  color: var(--bb-text-3) !important;
}

/* ── 19c. INLINE BORDERS THAT WERE DARK HAIRLINES ────────────────────── */
html[data-theme="light"] [style*="border:1px solid #2a2927"],
html[data-theme="light"] [style*="border: 1px solid #2a2927"],
html[data-theme="light"] [style*="border-color:#2a2927"],
html[data-theme="light"] [style*="border-bottom:1px solid #2a2927"],
html[data-theme="light"] [style*="border-bottom: 1px solid #2a2927"],
html[data-theme="light"] [style*="border-top:1px solid #2a2927"],
html[data-theme="light"] [style*="border-right:1px solid #2a2927"],
html[data-theme="light"] [style*="border-left:1px solid #2a2927"],
html[data-theme="light"] [style*="border:1px solid #2a2722"],
html[data-theme="light"] [style*="border-color:#3a3735"],
html[data-theme="light"] [style*="border-bottom:1px solid rgba(255,255,255"],
html[data-theme="light"] [style*="border-top:1px solid rgba(255,255,255"],
html[data-theme="light"] [style*="border:1px solid rgba(255,255,255"] {
  border-color: var(--bb-border) !important;
}

/* ── 19d. .db-glass and .db-section the dashboard heavily uses ───────── */
html[data-theme="light"] .db-glass,
html[data-theme="light"] .db-section,
html[data-theme="light"] .db-panel,
html[data-theme="light"] .db-card,
html[data-theme="light"] .db-chart-wrap,
html[data-theme="light"] .db-ai-insight-card,
html[data-theme="light"] .db-closable-widget,
html[data-theme="light"] .db-lazy-widget,
html[data-theme="light"] .db-perf-card,
html[data-theme="light"] [class*="db-agent"],
html[data-theme="light"] [class*="db-event"],
html[data-theme="light"] [class*="db-briefing"] {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border-color: var(--bb-border) !important;
  color: var(--bb-text) !important;
}
/* Children of .db-glass that were riding the dark bg */
html[data-theme="light"] .db-glass *,
html[data-theme="light"] .db-section *,
html[data-theme="light"] .db-chart-wrap * {
  border-color: var(--bb-border) !important;
}
/* Headings inside dashboard panels */
html[data-theme="light"] .db-glass h1,
html[data-theme="light"] .db-glass h2,
html[data-theme="light"] .db-glass h3,
html[data-theme="light"] .db-glass h4,
html[data-theme="light"] .db-section h1,
html[data-theme="light"] .db-section h2,
html[data-theme="light"] .db-section h3,
html[data-theme="light"] .db-section h4 {
  color: var(--bb-text) !important;
}
/* Generic <p>, <span>, <div> text inside main dashboard area — push to dark */
html[data-theme="light"] .db-main p,
html[data-theme="light"] .db-main label,
html[data-theme="light"] .db-glass p,
html[data-theme="light"] .db-section p,
html[data-theme="light"] .db-glass div:not([style*="background"]):not([class*="bg-"]):not([class*="db-skeleton"]),
html[data-theme="light"] .db-section div:not([style*="background"]):not([class*="bg-"]) {
  color: var(--bb-text) !important;
}

/* Empty-state placeholder text ("No high-impact events detected", etc.) */
html[data-theme="light"] .db-empty-state,
html[data-theme="light"] [class*="empty"] {
  color: var(--bb-text-3) !important;
}

/* ════════════════════════════════════════════════════════════════════════
   PLATFORM-WIDE COVERAGE (every analytics page, mega-menu, modals, etc.)
   ════════════════════════════════════════════════════════════════════════ */

/* ── 21. MEGA-NAV DROPDOWN (Analysis / Markets / Trading / etc) ─────── */
html[data-theme="light"] .ix-mega,
html[data-theme="light"] .ix-mega-menu,
html[data-theme="light"] .ix-mega-content,
html[data-theme="light"] .ix-nav-mega,
html[data-theme="light"] .ix-nav-dropdown,
html[data-theme="light"] [class*="mega-menu"],
html[data-theme="light"] [class*="nav-dropdown"] {
  background: #FFFFFF !important;
  border: 1px solid var(--bb-border) !important;
  box-shadow: 0 12px 40px rgba(36, 32, 26, 0.12) !important;
  color: var(--bb-text) !important;
}
html[data-theme="light"] .ix-mega *,
html[data-theme="light"] .ix-mega-content *,
html[data-theme="light"] [class*="mega-menu"] * {
  color: var(--bb-text) !important;
  border-color: var(--bb-border) !important;
}
html[data-theme="light"] .ix-mega [class*="title"],
html[data-theme="light"] .ix-mega [class*="head"],
html[data-theme="light"] .ix-mega-section-title {
  color: var(--bb-text-3) !important;
}
html[data-theme="light"] .ix-mega a:hover,
html[data-theme="light"] .ix-mega [class*="item"]:hover {
  background: var(--bb-bg-2) !important;
  color: var(--bb-amber) !important;
}

/* ── 22. WINDOWS DROPDOWN / TERMINAL POPOVER ────────────────────────── */
html[data-theme="light"] [class*="windows-dropdown"],
html[data-theme="light"] [class*="terminal-window"],
html[data-theme="light"] [id*="windows-list"],
html[data-theme="light"] [id*="terminalDropdown"] {
  background: #FFFFFF !important;
  border: 1px solid var(--bb-border) !important;
  color: var(--bb-text) !important;
  box-shadow: 0 12px 40px rgba(36, 32, 26, 0.12) !important;
}

/* ── 23. PAGE-PREFIX CLASSES (every analytics page) ─────────────────── */
/* This is a deliberate catch-all that hits every "<prefix>-card",
   "<prefix>-panel", "<prefix>-section", etc. used across the platform.
   The prefix list comes from MEMORY.md: pp_, fp_, fn_, wl_, ip_, rb_, rt_,
   gl_, td_, tlh_, txl_, top_, ar_, ec_, fp_, dg_, dv_, ew_, ipo_, spac_,
   si_, gb_, gm_, sa_, tx_, dm_, sw_, etc. */
html[data-theme="light"] [class*="-card"],
html[data-theme="light"] [class*="_card"],
html[data-theme="light"] [class*="-panel"],
html[data-theme="light"] [class*="_panel"],
html[data-theme="light"] [class*="-section"]:not(.s-section):not([class*="db-section-link"]):not([class*="db-section-head"]),
html[data-theme="light"] [class*="_section"],
html[data-theme="light"] [class*="-tile"],
html[data-theme="light"] [class*="_tile"],
html[data-theme="light"] [class*="-widget"],
html[data-theme="light"] [class*="_widget"],
html[data-theme="light"] [class*="-block"]:not([class*="ix-term-block"]),
html[data-theme="light"] [class*="_block"],
html[data-theme="light"] [class*="-pane"]:not([class*="ix-term-pane"]),
html[data-theme="light"] [class*="-kpi"]:not([class*="db-kpi"]),
html[data-theme="light"] [class*="_kpi"],
html[data-theme="light"] [class*="-stat"]:not([class*="db-stat"]),
html[data-theme="light"] [class*="_stat"],
html[data-theme="light"] [class*="-metric"],
html[data-theme="light"] [class*="_metric"],
html[data-theme="light"] [class*="-hero"],
html[data-theme="light"] [class*="_hero"] {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border-color: var(--bb-border) !important;
  color: var(--bb-text) !important;
  box-shadow: none !important;
}

/* Inside-card text doesn't get washed white-on-white */
html[data-theme="light"] [class*="-card"] *:not(svg):not(path):not(canvas),
html[data-theme="light"] [class*="_card"] *:not(svg):not(path):not(canvas),
html[data-theme="light"] [class*="-panel"] *:not(svg):not(path):not(canvas),
html[data-theme="light"] [class*="-tile"] *:not(svg):not(path):not(canvas),
html[data-theme="light"] [class*="-hero"] *:not(svg):not(path):not(canvas) {
  border-color: var(--bb-border) !important;
}

/* Headlines/titles inside cards */
html[data-theme="light"] [class*="-card"] h1,
html[data-theme="light"] [class*="-card"] h2,
html[data-theme="light"] [class*="-card"] h3,
html[data-theme="light"] [class*="-card"] h4,
html[data-theme="light"] [class*="-panel"] h1,
html[data-theme="light"] [class*="-panel"] h2,
html[data-theme="light"] [class*="-panel"] h3,
html[data-theme="light"] [class*="-panel"] h4,
html[data-theme="light"] [class*="-hero"] h1,
html[data-theme="light"] [class*="-hero"] h2 {
  color: var(--bb-text) !important;
}

/* ── 24. PAGE HERO / AURORA PATTERNS ────────────────────────────────── */
/* Most analytics pages have a "<prefix>-hero" or "<prefix>_hero" with a
   gradient/aurora background. Replace with a soft cream tint. */
html[data-theme="light"] [class*="-hero"],
html[data-theme="light"] [class*="_hero"],
html[data-theme="light"] [class*="-aurora"],
html[data-theme="light"] [class*="_aurora"],
html[data-theme="light"] [class*="-banner"]:not([class*="ticker"]) {
  background: linear-gradient(180deg, #FFFFFF 0%, var(--bb-bg-2) 100%) !important;
  border-color: var(--bb-border) !important;
  color: var(--bb-text) !important;
}
html[data-theme="light"] [class*="-hero"]::before,
html[data-theme="light"] [class*="_hero"]::before,
html[data-theme="light"] [class*="-hero"]::after,
html[data-theme="light"] [class*="_hero"]::after {
  display: none !important;
}

/* ── 25. KPI VALUE / METRIC INSIDE CARDS ────────────────────────────── */
html[data-theme="light"] [class*="-value"],
html[data-theme="light"] [class*="_value"],
html[data-theme="light"] [class*="-amount"],
html[data-theme="light"] [class*="_amount"],
html[data-theme="light"] [class*="-num"],
html[data-theme="light"] [class*="_num"] {
  color: var(--bb-text) !important;
}
html[data-theme="light"] [class*="-label"],
html[data-theme="light"] [class*="_label"],
html[data-theme="light"] [class*="-meta"],
html[data-theme="light"] [class*="_meta"],
html[data-theme="light"] [class*="-caption"],
html[data-theme="light"] [class*="_caption"],
html[data-theme="light"] [class*="-sub"]:not([class*="-submit"]):not([class*="subtotal"]),
html[data-theme="light"] [class*="_sub"] {
  color: var(--bb-text-3) !important;
}

/* ── 26. TABLES (every page) ────────────────────────────────────────── */
html[data-theme="light"] table {
  background: transparent !important;
  color: var(--bb-text) !important;
  border-color: var(--bb-border) !important;
}
html[data-theme="light"] table thead,
html[data-theme="light"] table thead tr,
html[data-theme="light"] table thead th,
html[data-theme="light"] thead {
  background: #FFFFFF !important;
  color: var(--bb-text-3) !important;
  border-color: var(--bb-border) !important;
}
html[data-theme="light"] table tbody tr {
  background: transparent !important;
  border-color: var(--bb-border) !important;
}
html[data-theme="light"] table tbody td {
  background: transparent !important;
  color: var(--bb-text) !important;
  border-color: var(--bb-border) !important;
}
html[data-theme="light"] table tbody tr:hover,
html[data-theme="light"] table tbody tr:hover td {
  background: var(--bb-bg-2) !important;
}

/* ── 27. MODALS / DRILL OVERLAYS ────────────────────────────────────── */
html[data-theme="light"] [class*="-modal"],
html[data-theme="light"] [class*="_modal"],
html[data-theme="light"] [class*="-overlay"],
html[data-theme="light"] [class*="_overlay"],
html[data-theme="light"] [class*="-drill"],
html[data-theme="light"] [class*="_drill"],
html[data-theme="light"] [class*="-popup"],
html[data-theme="light"] [class*="_popup"],
html[data-theme="light"] [id*="DrillOv"],
html[data-theme="light"] [id*="drillOverlay"] {
  background: #FFFFFF !important;
  color: var(--bb-text) !important;
  border-color: var(--bb-border) !important;
  box-shadow: 0 24px 60px rgba(36, 32, 26, 0.16) !important;
}
/* Modal backdrop */
html[data-theme="light"] [class*="-backdrop"],
html[data-theme="light"] [class*="_backdrop"],
html[data-theme="light"] [class*="modal-backdrop"],
html[data-theme="light"] [style*="background:rgba(0,0,0,0.5)"],
html[data-theme="light"] [style*="background:rgba(0,0,0,0.6)"],
html[data-theme="light"] [style*="background:rgba(0,0,0,0.7)"],
html[data-theme="light"] [style*="background: rgba(0,0,0"] {
  background: rgba(36, 32, 26, 0.32) !important;
}

/* ── 28. CHART CONTAINERS — keep canvas, light bg around it ──────────── */
html[data-theme="light"] canvas { background: transparent !important; }
html[data-theme="light"] [class*="-chart-wrap"],
html[data-theme="light"] [class*="_chart"],
html[data-theme="light"] [class*="-chart"]:not(canvas) {
  background: #FFFFFF !important;
  color: var(--bb-text) !important;
  border-color: var(--bb-border) !important;
}

/* ── 29. TABS / PILL CONTROLS ───────────────────────────────────────── */
html[data-theme="light"] [class*="-tab"]:not([class*="-tab-"]),
html[data-theme="light"] [class*="_tab"]:not([class*="_tab-"]),
html[data-theme="light"] [class*="-pill"],
html[data-theme="light"] [class*="_pill"] {
  background: #FFFFFF !important;
  color: var(--bb-text-3) !important;
  border-color: var(--bb-border) !important;
}
html[data-theme="light"] [class*="-tab"].active,
html[data-theme="light"] [class*="_tab"].active,
html[data-theme="light"] [class*="-pill"].active,
html[data-theme="light"] [class*="_pill"].active {
  background: var(--bb-amber-dim) !important;
  border-color: var(--bb-amber-line) !important;
  color: var(--bb-amber) !important;
}

/* ── 30. STATUS PILLS / BADGES (At Risk / OUTPERFORM / etc.) ────────── */
html[data-theme="light"] [class*="-pill"],
html[data-theme="light"] [class*="-badge"],
html[data-theme="light"] [class*="_badge"],
html[data-theme="light"] [class*="-chip"],
html[data-theme="light"] [class*="_chip"],
html[data-theme="light"] [class*="status"] {
  /* Don't override here — the inline-color rules in section 17/18 cover the
     semantic up/down/amber tints. Only kill any dark BG. */
  border-color: var(--bb-border) !important;
}

/* ── 31. PAGE WRAPPER / MAIN CONTAINER ──────────────────────────────── */
html[data-theme="light"] main,
html[data-theme="light"] .page,
html[data-theme="light"] [class*="-page"],
html[data-theme="light"] [class*="_page"],
html[data-theme="light"] [class*="-container"]:not(.bb-container),
html[data-theme="light"] [class*="_container"],
html[data-theme="light"] [class*="-wrapper"],
html[data-theme="light"] [class*="_wrapper"],
html[data-theme="light"] [class*="-shell"],
html[data-theme="light"] [class*="_shell"] {
  background: var(--bb-bg) !important;
  color: var(--bb-text) !important;
}

/* ── 32. AGGRESSIVE INLINE-STYLE OVERRIDES (catch the rest) ─────────── */
/* Anything with inline background using the dark hex range #00–#2f */
html[data-theme="light"] *[style*="background:#0"]:not([style*="background:#0c8"]):not([style*="background:#0f0"]),
html[data-theme="light"] *[style*="background: #0"]:not([style*="background: #0c8"]),
html[data-theme="light"] *[style*="background:#1"]:not([style*="background:#1f"]),
html[data-theme="light"] *[style*="background: #1"]:not([style*="background: #1f"]),
html[data-theme="light"] *[style*="background:#2a"],
html[data-theme="light"] *[style*="background:#2b"],
html[data-theme="light"] *[style*="background:#252422"],
html[data-theme="light"] *[style*="background: #252422"] {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
}

/* ── 33. TICKER SCROLLER LINK COLORS ────────────────────────────────── */
html[data-theme="light"] [class*="ticker"] a,
html[data-theme="light"] [class*="ticker"] span {
  color: var(--bb-text) !important;
}

/* ── 34. SETTINGS PAGE THEME PREVIEW CARDS — KEEP DARK FOR DARK PREVIEW */
/* The s-theme-preview elements show what each theme looks like — they should
   keep their hardcoded preview colors so users can see the comparison. */
html[data-theme="light"] .s-theme-preview,
html[data-theme="light"] .s-theme-preview *,
html[data-theme="light"] .s-theme-preview-bar,
html[data-theme="light"] .s-theme-preview-body,
html[data-theme="light"] .s-theme-preview-sidebar,
html[data-theme="light"] .s-theme-preview-content,
html[data-theme="light"] .s-theme-preview-line,
html[data-theme="light"] .s-theme-preview-block,
html[data-theme="light"] .s-theme-preview-dot {
  /* Force-reset to inline value to show original preview */
  background: revert !important;
  color: revert !important;
  border-color: revert !important;
}

/* ── 35. KEEP SEMANTIC COLORS ON BADGES (OUTPERFORM green, AT RISK red) */
html[data-theme="light"] [style*="background:#22c55e"],
html[data-theme="light"] [style*="background: #22c55e"] {
  background: var(--bb-green) !important;
  color: #FFFFFF !important;
}
html[data-theme="light"] [style*="background:#ef4444"],
html[data-theme="light"] [style*="background: #ef4444"] {
  background: var(--bb-red) !important;
  color: #FFFFFF !important;
}
html[data-theme="light"] [style*="background:#d97757"],
html[data-theme="light"] [style*="background: #d97757"],
html[data-theme="light"] [style*="background:#f5d28a"] {
  background: var(--bb-amber) !important;
  color: #FFFFFF !important;
}

/* ════════════════════════════════════════════════════════════════════════
   36. TERMINAL WORKSPACE (/terminal/workspace) — React app with its own CSS
   Every pane, watchlist row, FN bar, chart stage, AI insight card, position
   table, order book, CLI input, chip — flip to cream+charcoal in light mode.
   ════════════════════════════════════════════════════════════════════════ */
html[data-theme="light"] .ix-workspace,
html[data-theme="light"] [class*="workspace-shell"],
html[data-theme="light"] .ix-fn-bar,
html[data-theme="light"] .fn-bar,
html[data-theme="light"] .pane,
html[data-theme="light"] .pane-hd,
html[data-theme="light"] .pane-body,
html[data-theme="light"] .watchlist,
html[data-theme="light"] .watch-row,
html[data-theme="light"] .ai-card,
html[data-theme="light"] .ai-card-h,
html[data-theme="light"] .ai-block,
html[data-theme="light"] .book,
html[data-theme="light"] .book-hd,
html[data-theme="light"] .book-row,
html[data-theme="light"] .chart-stage,
html[data-theme="light"] .chart-toolbar,
html[data-theme="light"] .cli-bar,
html[data-theme="light"] .cli-input,
html[data-theme="light"] .cli-pop,
html[data-theme="light"] .pos-table,
html[data-theme="light"] .pos-row,
html[data-theme="light"] .ord-row,
html[data-theme="light"] .news-item,
html[data-theme="light"] .insight,
html[data-theme="light"] .indices,
html[data-theme="light"] .breadth,
html[data-theme="light"] .heat,
html[data-theme="light"] .heat-cell {
  background: #FFFFFF !important;
  color: var(--bb-text) !important;
  border-color: var(--bb-border) !important;
}
/* Workspace canvas */
html[data-theme="light"] .ix-workspace,
html[data-theme="light"] [class*="workspace-shell"],
html[data-theme="light"] .terminal-workspace-page {
  background: var(--bb-bg) !important;
}
/* Pane headers: ID badge ([01], [02]) + title + sub */
html[data-theme="light"] .pane-id {
  background: var(--bb-amber-dim) !important;
  color: var(--bb-amber) !important;
  border-color: var(--bb-amber-line) !important;
}
html[data-theme="light"] .pane-title { color: var(--bb-text) !important; }
html[data-theme="light"] .pane-sub { color: var(--bb-text-3) !important; }
/* FN-bar (F1 DASH / F2 MKT / etc.) */
html[data-theme="light"] .fn-key,
html[data-theme="light"] [class*="fn-key"] {
  background: transparent !important;
  color: var(--bb-text-3) !important;
  border-color: var(--bb-border) !important;
}
html[data-theme="light"] .fn-key.active,
html[data-theme="light"] .fn-key:hover {
  background: var(--bb-amber-dim) !important;
  color: var(--bb-amber) !important;
  border-color: var(--bb-amber-line) !important;
}
/* Watchlist rows */
html[data-theme="light"] .watch-row { border-bottom-color: var(--bb-border) !important; }
html[data-theme="light"] .watch-row:hover { background: var(--bb-bg-2) !important; }
html[data-theme="light"] .watch-sym { color: var(--bb-text) !important; }
html[data-theme="light"] .watch-sub { color: var(--bb-text-3) !important; }
/* Order book rows — keep red/green tints from inline styles */
html[data-theme="light"] .book-row { background: transparent !important; }
html[data-theme="light"] .book-side { color: var(--bb-text-3) !important; }
/* Position table */
html[data-theme="light"] .pos-table th,
html[data-theme="light"] .pos-table thead { color: var(--bb-text-3) !important; background: #FFFFFF !important; }
html[data-theme="light"] .pos-table td { color: var(--bb-text) !important; border-color: var(--bb-border) !important; }
html[data-theme="light"] .pos-row:hover { background: var(--bb-bg-2) !important; }
/* AI insights card body */
html[data-theme="light"] .ai-card,
html[data-theme="light"] .insight {
  background: #FFFFFF !important;
  border-left: 2px solid var(--bb-amber) !important;
  color: var(--bb-text) !important;
}
html[data-theme="light"] .ai-card-h,
html[data-theme="light"] .insight-h { color: var(--bb-text-3) !important; }
html[data-theme="light"] .ai-stream,
html[data-theme="light"] .insight-body { color: var(--bb-text) !important; }
/* CLI bar */
html[data-theme="light"] .cli-bar {
  background: #FFFFFF !important;
  border-top: 1px solid var(--bb-border) !important;
}
html[data-theme="light"] .cli-input {
  background: transparent !important;
  color: var(--bb-text) !important;
}
html[data-theme="light"] .cli-hint { color: var(--bb-text-3) !important; }
html[data-theme="light"] .cli-pop {
  background: #FFFFFF !important;
  border: 1px solid var(--bb-border) !important;
  box-shadow: 0 12px 40px rgba(36, 32, 26, 0.16) !important;
}
html[data-theme="light"] .cli-pop-cmd { color: var(--bb-text) !important; }
html[data-theme="light"] .cli-pop-desc { color: var(--bb-text-3) !important; }
html[data-theme="light"] .cli-pop-cat { color: var(--bb-amber) !important; }
/* Chips */
html[data-theme="light"] .chip { background: var(--bb-bg-2) !important; color: var(--bb-text) !important; border-color: var(--bb-border) !important; }
html[data-theme="light"] .chip-mute { color: var(--bb-text-3) !important; }
html[data-theme="light"] .chip-amber { background: var(--bb-amber-dim) !important; color: var(--bb-amber) !important; }
html[data-theme="light"] .chip-green { background: var(--bb-green-dim) !important; color: var(--bb-green) !important; }
html[data-theme="light"] .chip-red { background: var(--bb-red-dim) !important; color: var(--bb-red) !important; }
html[data-theme="light"] .chip-blue { background: rgba(47, 109, 163, 0.10) !important; color: var(--bb-blue) !important; }
/* Allocation bars */
html[data-theme="light"] .alloc-bar { background: var(--bb-bg-2) !important; }
/* Heatmap */
html[data-theme="light"] .heat-cell { border-color: var(--bb-border) !important; }
/* Chart toolbar */
html[data-theme="light"] .chart-toolbar { background: #FFFFFF !important; border-color: var(--bb-border) !important; }
html[data-theme="light"] .chart-toolbar button {
  background: transparent !important;
  color: var(--bb-text-3) !important;
  border-color: var(--bb-border) !important;
}
html[data-theme="light"] .chart-toolbar button.active {
  background: var(--bb-amber-dim) !important;
  color: var(--bb-amber) !important;
  border-color: var(--bb-amber-line) !important;
}
html[data-theme="light"] .chart-tip {
  background: #FFFFFF !important;
  color: var(--bb-text) !important;
  border: 1px solid var(--bb-border) !important;
}
/* Inline body bg from terminal-workspace.css */
html[data-theme="light"] .pane.pane-console .pane-body { background: var(--bb-bg) !important; }

/* ════════════════════════════════════════════════════════════════════════
   37. ENHANCED-VISUALS LEGACY (.glass-card, .stat-card, .premium-card,
   .bloomberg-card) — used across analytics pages built before Bloomberg
   layer. Override their dark surfaces.
   ════════════════════════════════════════════════════════════════════════ */
html[data-theme="light"] .glass-card,
html[data-theme="light"] .stat-card,
html[data-theme="light"] .premium-card,
html[data-theme="light"] .bloomberg-card,
html[data-theme="light"] [class*="glass"]:not([class*="glassdoor"]) {
  background: #FFFFFF !important;
  border-color: var(--bb-border) !important;
  color: var(--bb-text) !important;
  backdrop-filter: none !important;
}
html[data-theme="light"] .stat-card .stat-value,
html[data-theme="light"] .stat-card [class*="value"] { color: var(--bb-text) !important; }
html[data-theme="light"] .stat-card [class*="label"] { color: var(--bb-text-3) !important; }
html[data-theme="light"] .stat-card .stat-sub,
html[data-theme="light"] .stat-card [class*="sub"] { color: var(--bb-text-3) !important; }

/* ════════════════════════════════════════════════════════════════════════
   38. --sa-* TOKEN SYSTEM (used by /tutorials, /education, /calendar,
   /tax-opportunities, /interest-coverage, /revenue-per-employee, /iv-surface,
   /float-analysis, /guidance-tracker, /cash-conversion, /advisor-risk and
   100+ other analytics + education pages).
   The pages define their own :root --sa-* tokens inline. By re-declaring
   them on html[data-theme="light"] (specificity 0,1,1 > :root's 0,0,1),
   we win the cascade AND every .tut-*, .sa-* class flips automatically.
   ════════════════════════════════════════════════════════════════════════ */
html[data-theme="light"] {
  --sa-bg:           #FAF9F5;
  --sa-card:         rgba(255, 255, 255, 0.96);
  --sa-card-solid:   #FFFFFF;
  --sa-card-hover:   #F1EDE4;
  --sa-border:       #E0DCCC;
  --sa-border-hover: #C5BFA8;

  --sa-text:         #19181A;
  --sa-text-sec:     #5B5648;
  --sa-text-muted:   #8A8475;

  --sa-green:        #2F7A48;
  --sa-green-dim:    rgba(47, 122, 72, 0.10);
  --sa-red:          #A93B34;
  --sa-red-dim:      rgba(169, 59, 52, 0.10);
  --sa-amber:        #B25A32;
  --sa-amber-dim:    rgba(178, 90, 50, 0.10);
  --sa-blue:         #2F6DA3;
  --sa-blue-dim:     rgba(47, 109, 163, 0.10);
  --sa-yellow:       #B88C2C;
  --sa-yellow-dim:   rgba(184, 140, 44, 0.10);
  --sa-purple:       #8B5E3C;

  --sa-glow:         0 1px 2px rgba(36, 32, 26, 0.04);
}

/* Hover state for `.tut-card`, `.sa-panel` boxes */
html[data-theme="light"] .tut-card:hover,
html[data-theme="light"] .sa-panel:hover {
  border-color: var(--sa-amber) !important;
  box-shadow: 0 4px 14px rgba(36, 32, 26, 0.08) !important;
}

/* Hero placeholder (linear-gradient(#0a0a08, #141412, #0a0a08)) → cream */
html[data-theme="light"] .tut-hero-placeholder,
html[data-theme="light"] [class*="-placeholder"]:not([class*="img"]) {
  background: linear-gradient(135deg, #FFFFFF 0%, var(--sa-card-hover) 50%, #FFFFFF 100%) !important;
}
html[data-theme="light"] .tut-hero-video {
  background: var(--sa-card-hover) !important;
  border-color: var(--sa-border) !important;
}

/* Hero amber CTA — keep terracotta with white text */
html[data-theme="light"] .tut-hero-btn-pri,
html[data-theme="light"] .tut-modal-tour-btn,
html[data-theme="light"] .tut-tab-btn.active {
  background: var(--sa-amber) !important;
  color: #FFFFFF !important;
  border-color: var(--sa-amber) !important;
}
html[data-theme="light"] .tut-hero-btn-pri:hover {
  background: var(--bb-amber-strong, #8A4222) !important;
}

/* Tab strip + cards specifically */
html[data-theme="light"] .tut-tab-strip,
html[data-theme="light"] .tut-card,
html[data-theme="light"] .tut-tip-card,
html[data-theme="light"] .sa-panel,
html[data-theme="light"] .sa-header-bar {
  background: #FFFFFF !important;
  border-color: var(--sa-border) !important;
  color: var(--sa-text) !important;
}

/* Modal — solid paper white */
html[data-theme="light"] .tut-modal {
  background: rgba(36, 32, 26, 0.42) !important;  /* darker scrim for contrast */
}
html[data-theme="light"] .tut-modal-content {
  background: #FFFFFF !important;
  border: 1px solid var(--sa-border) !important;
  box-shadow: 0 24px 60px rgba(36, 32, 26, 0.18) !important;
}

/* Step list border (was rgba(40,40,36,0.3)) */
html[data-theme="light"] .tut-step-list li {
  border-bottom-color: var(--sa-border) !important;
  color: var(--sa-text-muted) !important;
}

/* Keyboard chip (had rgba(255,255,255,0.04)) */
html[data-theme="light"] .tut-tip-kbd {
  background: var(--sa-card-hover) !important;
  border-color: var(--sa-border) !important;
  color: var(--sa-text) !important;
}

/* FAQ items */
html[data-theme="light"] .tut-faq-item { border-bottom-color: var(--sa-border) !important; }
html[data-theme="light"] .tut-faq-q { color: var(--sa-text) !important; }
html[data-theme="light"] .tut-faq-a-inner { color: var(--sa-text-sec) !important; }

/* Search input */
html[data-theme="light"] .tut-search,
html[data-theme="light"] .sa-search {
  background: #FFFFFF !important;
  border-color: var(--sa-border) !important;
  color: var(--sa-text) !important;
}

/* Tip icon backgrounds (rgba(0,200,120,0.08) → terracotta tint) */
html[data-theme="light"] .tut-tip-icon {
  background: var(--sa-amber-dim) !important;
}
html[data-theme="light"] .tut-tip-icon .material-symbols-outlined {
  color: var(--sa-amber) !important;
}
html[data-theme="light"] .tut-hero-play {
  background: var(--sa-amber-dim) !important;
  border-color: var(--sa-amber) !important;
}

/* Hero h2 text uses the amber accent for the "<span>" highlight — already
   covered by --sa-amber redefinition. */

/* ════════════════════════════════════════════════════════════════════════
   39. TUTORIALS MODAL (light) — match the new viewport-bound layout
   ════════════════════════════════════════════════════════════════════════ */
html[data-theme="light"] .tut-modal {
  background: rgba(36, 32, 26, 0.42) !important;
  backdrop-filter: blur(4px) !important;
}
html[data-theme="light"] .tut-modal-content {
  background: #FFFFFF !important;
  border: 1px solid var(--sa-border) !important;
  box-shadow: 0 24px 60px rgba(36, 32, 26, 0.18) !important;
}
html[data-theme="light"] .tut-modal-header { background: #FFFFFF !important; }
html[data-theme="light"] .tut-modal-body::-webkit-scrollbar-thumb {
  background: var(--bb-border-bright) !important;
}

/* ── 20. TICKER SYMBOL + CHANGE — keep up/down colors readable ───────── */
html[data-theme="light"] .ticker-symbol,
html[data-theme="light"] [class*="ticker-bar-symbol"],
html[data-theme="light"] [class*="ticker"] [class*="symbol"] {
  color: var(--bb-text) !important;
}