/**
 * DayTrader Pro — Fluent-inspired dual theme (dark default, light optional).
 * Loads after dashboard.css so tokens + surface polish cascade safely.
 * Does not remove progress bars / pipeline / op-progress behavior.
 */

/* ── Dark (default) ─────────────────────────────────────────────── */
:root,
html[data-theme="dark"] {
  color-scheme: dark;

  --font-ui: "Segoe UI Variable", "Segoe UI", "Helvetica Neue", sans-serif;
  --font-mono: "Cascadia Mono", "Consolas", "Segoe UI Mono", ui-monospace, monospace;

  --bg-deep: #0b0d10;
  --bg-canvas: #111318;
  --bg-sidebar: #0f1115;
  --bg-panel: #171a21;
  --bg-card: #1c2028;
  --bg-elevated: #242933;
  --bg-input: #12151b;
  --bg-hover: rgba(255, 255, 255, 0.04);
  --bg-active: rgba(96, 205, 255, 0.12);

  --text-primary: #f3f4f6;
  --text-secondary: #c5c7ce;
  --text-muted: #9aa0ab;
  --text-inverse: #0b0d10;

  --border-subtle: rgba(255, 255, 255, 0.08);
  --border-strong: rgba(255, 255, 255, 0.16);
  --border-focus: #60cdff;

  --accent: #60cdff;
  --accent-strong: #3aa0ff;
  --accent-cyan: var(--accent);
  --accent-green: #6ccb5f;
  --accent-orange: #f7a300;
  --accent-danger: #f1707a;
  --accent-purple: #3aa0ff;
  --accent-purple-bright: #60cdff;

  --glow-cyan: 0 0 0 1px rgba(96, 205, 255, 0.35);
  --glow-purple: 0 0 0 1px rgba(96, 205, 255, 0.28);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.35);
  --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.35);
  --shadow-lg: 0 16px 40px rgba(0, 0, 0, 0.45);

  --radius: 10px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --sidebar-width: 232px;
  --header-height: 44px;
  --brand-rail-height: 108px;

  /* Spacing scale — use these instead of one-off rem values */
  --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;
  --section-gap: var(--space-6);
  --card-padding: var(--space-4);
  --control-gap: var(--space-3);
  --stack-gap: var(--space-4);

  --focus-ring: 0 0 0 2px var(--bg-deep), 0 0 0 4px var(--border-focus);
  --success-bg: rgba(108, 203, 95, 0.14);
  --warning-bg: rgba(247, 163, 0, 0.14);
  --danger-bg: rgba(241, 112, 122, 0.14);
  --info-bg: rgba(96, 205, 255, 0.12);
}

/* ── Light ──────────────────────────────────────────────────────── */
html[data-theme="light"] {
  color-scheme: light;

  /* Surfaces — true white page, light neutral only for grouped sections */
  --bg-deep: #ffffff;
  --bg-canvas: #ffffff;
  --bg-sidebar: #ffffff;
  --bg-panel: #ffffff;
  --bg-card: #ffffff;
  --bg-elevated: #f6f8fb;
  --bg-input: #ffffff;
  --bg-hover: rgba(15, 23, 42, 0.06);
  --bg-active: rgba(0, 70, 130, 0.1);
  --surface-elevated: rgba(246, 248, 251, 0.9);

  /* Text — jet black everywhere in light mode. No grey body/helper text.
     Muted/secondary tokens resolve to the same black so nothing falls
     back to a light-grey that is unreadable on white. */
  --text-primary: #000000;
  --text-secondary: #000000;
  --text-muted: #000000;
  --text-inverse: #ffffff;

  --border-subtle: rgba(15, 23, 42, 0.14);
  --border-strong: rgba(15, 23, 42, 0.3);
  --border-focus: #005a9e;

  /* Accents — dark professional navy/indigo/teal family */
  --accent: #004a8f;
  --accent-strong: #003366;
  --accent-cyan: #004a8f;
  --accent-green: #0f7b3d;
  --accent-orange: #c2410c;
  --accent-danger: #b91c1c;
  --accent-purple: #4c3a8f;
  --accent-purple-bright: #4c3a8f;

  --glow-cyan: 0 0 0 1px rgba(0, 74, 143, 0.3);
  --glow-purple: 0 0 0 1px rgba(76, 58, 143, 0.25);
  --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.08);
  --shadow-md: 0 8px 24px rgba(15, 23, 42, 0.1);
  --shadow-lg: 0 16px 40px rgba(15, 23, 42, 0.14);

  --focus-ring: 0 0 0 2px #ffffff, 0 0 0 4px var(--border-focus);
  --success-bg: rgba(15, 123, 61, 0.1);
  --warning-bg: rgba(194, 65, 12, 0.1);
  --danger-bg: rgba(185, 28, 28, 0.1);
  --info-bg: rgba(0, 74, 143, 0.08);
}

/* ── Base surfaces ──────────────────────────────────────────────── */
html {
  scroll-behavior: smooth;
}

/* Shared visibility helper used across templates / active-work rail */
.is-hidden {
  display: none !important;
}

body.broker-portal,
body.login-portal {
  font-family: var(--font-ui);
  background: var(--bg-deep);
  color: var(--text-primary);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

.bg-geometry {
  background:
    radial-gradient(ellipse 70% 50% at 80% 0%, rgba(96, 205, 255, 0.06) 0%, transparent 55%),
    radial-gradient(ellipse 50% 40% at 10% 100%, rgba(0, 120, 212, 0.05) 0%, transparent 50%),
    var(--bg-deep);
}

html[data-theme="light"] .bg-geometry {
  background:
    radial-gradient(ellipse 70% 50% at 85% -10%, color-mix(in srgb, var(--accent) 8%, transparent) 0%, transparent 55%),
    var(--bg-deep);
}

.bg-geometry-svg {
  opacity: 0.18;
  filter: none;
}

html[data-theme="light"] .bg-geometry-svg {
  opacity: 0.08;
}

/* ── Theme toggle ───────────────────────────────────────────────── */
.theme-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  border: 1px solid var(--border-subtle);
  background: var(--bg-elevated);
  color: var(--text-secondary);
  border-radius: 999px;
  padding: 0.3rem 0.7rem;
  font-size: 0.78rem;
  font-weight: 600;
  cursor: pointer;
  box-shadow: var(--shadow-sm);
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

.theme-toggle:hover {
  background: var(--bg-hover);
  color: var(--text-primary);
  border-color: var(--border-strong);
}

.theme-toggle:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}

.theme-toggle-icon {
  font-size: 0.95rem;
  line-height: 1;
}

/* ── Active work rail (sticky off-page; docks into Trade Engine head on-page) ─ */
.active-work-rail-host:empty {
  display: none;
}

.active-work-rail {
  position: sticky;
  top: 0;
  z-index: 40;
  display: flex;
  align-items: center;
  gap: var(--control-gap);
  margin: 0 0 var(--section-gap);
  padding: var(--space-3) var(--space-4);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius);
  background: var(--bg-elevated);
  box-shadow: var(--shadow-md);
}

/* Breathing room between live scan preview and the Accounts section below */
.active-work-rail-host:not(:empty) {
  display: block;
  margin-bottom: var(--section-gap);
  padding-bottom: var(--space-2);
}

.active-work-rail.is-hidden {
  display: none !important;
}

.active-work-dot {
  flex: 0 0 auto;
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 0 4px var(--info-bg);
  animation: dtp-pulse 1.6s ease-in-out infinite;
}

@keyframes dtp-pulse {
  0%,
  100% {
    opacity: 1;
    transform: scale(1);
  }
  50% {
    opacity: 0.55;
    transform: scale(0.92);
  }
}

.active-work-copy {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
}

.active-work-label {
  min-width: 0;
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--text-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.active-work-meta {
  font-size: 0.78rem;
  color: var(--text-muted);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.active-work-track {
  display: none;
  flex: 0 1 7.5rem;
  width: 7.5rem;
  max-width: 30%;
  height: 0.35rem;
  border-radius: 999px;
  background: color-mix(in srgb, var(--border-subtle) 80%, transparent);
  overflow: hidden;
}

.active-work-rail.has-track .active-work-track {
  display: inline-block;
}

.active-work-track-fill {
  display: block;
  height: 100%;
  width: 0%;
  border-radius: inherit;
  background: var(--accent, #60cdff);
  transition: width 0.35s ease;
}

.active-work-jump {
  flex: 0 0 auto;
  font-size: 0.78rem;
  font-weight: 700;
  color: var(--accent);
  text-decoration: none;
  padding: 0.25rem 0.55rem;
  border-radius: var(--radius-sm);
  background: var(--info-bg);
}

.active-work-jump:hover {
  text-decoration: underline;
}

/* Docked into Trade Engine page header — not sticky, sits beside the title */
.active-work-rail.is-inline {
  position: static;
  z-index: auto;
  flex: 1 1 auto;
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0.35rem 0.7rem;
  box-shadow: none;
  background: color-mix(in srgb, var(--bg-elevated, #242933) 88%, transparent);
}

body.active-work-docked .active-work-rail-host {
  display: none;
}

body.is-working .trade-engine-pipeline:not(.is-hidden),
body.is-working #tradeEngineGptProgress:not(.is-hidden),
body.is-working #nmTickProgress:not(.is-hidden),
body.is-working #rssProgressPanel:not(.is-hidden) {
  box-shadow: var(--shadow-md);
  border-color: rgba(96, 205, 255, 0.28);
}

html[data-theme="light"] body.is-working .trade-engine-pipeline:not(.is-hidden),
html[data-theme="light"] body.is-working #tradeEngineGptProgress:not(.is-hidden) {
  border-color: color-mix(in srgb, var(--accent) 28%, transparent);
}

/* ── Shell / chrome ─────────────────────────────────────────────── */
.sidebar {
  background: var(--bg-sidebar);
  border-right: 1px solid var(--border-subtle);
  box-shadow: var(--shadow-sm);
}

.sidebar-brand {
  background: var(--bg-sidebar);
  border-bottom: 1px solid var(--border-subtle);
}

.brand-logo {
  filter: none;
}

.nav-section-title {
  color: var(--text-muted);
  letter-spacing: 0.04em;
}

.nav-link {
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  margin-right: 0.4rem;
  color: var(--text-secondary);
}

.nav-link:hover {
  background: var(--bg-hover);
  color: var(--text-primary);
}

.nav-link.active {
  color: var(--accent);
  border-left-color: var(--accent);
  background: var(--bg-active);
  font-weight: 600;
}

.main-top-chrome,
.git-branch-bar,
.wallet-ticker-bar,
.topbar-actions-bar,
.global-header {
  background: color-mix(in srgb, var(--bg-panel) 92%, transparent);
  border-color: var(--border-subtle);
  backdrop-filter: blur(10px);
}

.git-branch-bar {
  background: var(--bg-panel);
}

.content {
  padding: 1.1rem 1.4rem 2.25rem;
  max-width: 1600px;
}

.page-title {
  font-size: 1.55rem;
  font-weight: 650;
  letter-spacing: -0.01em;
}

.page-header-row {
  margin-bottom: 1.1rem;
  padding-bottom: 0.35rem;
  border-bottom: 1px solid transparent;
}

.tool-page-desc,
.trade-engine-stats-help,
.login-trust-line {
  color: var(--text-muted);
  line-height: 1.45;
}

/* ── Buttons ────────────────────────────────────────────────────── */
.btn,
.btn-primary,
.btn-outline,
.btn-secondary,
.btn-danger,
button.btn {
  border-radius: var(--radius-sm);
  font-family: var(--font-ui);
  font-weight: 600;
  transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease,
    color 0.15s ease;
}

.btn:focus-visible,
.btn-primary:focus-visible,
.btn-outline:focus-visible,
.theme-toggle:focus-visible,
.icon-refresh:focus-visible {
  outline: none;
  box-shadow: var(--focus-ring);
}

.btn-primary {
  background: var(--accent);
  border: 1px solid transparent;
  color: var(--text-inverse);
  box-shadow: var(--shadow-sm);
}

.btn-primary:hover:not(:disabled) {
  background: var(--accent-strong);
  box-shadow: var(--shadow-sm);
}

html[data-theme="dark"] .btn-primary {
  color: #041018;
}

.btn-outline {
  background: transparent;
  border: 1px solid var(--border-strong);
  color: var(--text-primary);
}

.btn-outline:hover:not(:disabled) {
  background: var(--bg-hover);
  border-color: var(--accent);
  color: var(--accent);
}

.btn-danger,
.btn.btn-danger {
  background: var(--accent-danger);
  border-color: transparent;
  color: #fff;
}

.icon-refresh {
  border-color: var(--border-strong);
  background: var(--bg-elevated);
  color: var(--accent);
  box-shadow: var(--shadow-sm);
}

.icon-refresh:hover {
  background: var(--bg-active);
  box-shadow: var(--glow-cyan);
}

/* ── Cards / panels / tables ────────────────────────────────────── */
.section,
.metric-card,
.status-panel,
.trade-engine-pipeline:not(.workspace-block),
.workspace-block,
.rss-panel,
.nm-panel,
.sh-panel,
.pj-panel,
.gr-panel,
.chart-viewer-panel,
.login-card-modern,
.panel-drawer,
.trade-cards .trade-card,
.setup-batch,
.engine-activity-feed,
.op-progress,
.rss-progress,
.pj-submit-progress,
.gr-submit-progress {
  background: var(--bg-panel);
  border: 1px solid var(--border-subtle);
  border-radius: var(--radius);
  box-shadow: var(--shadow-sm);
}

.metric-card .value {
  color: var(--accent);
}

.session-pill {
  background: var(--info-bg);
  border: 1px solid var(--border-subtle);
  color: var(--accent);
}

.env-toggle {
  background: var(--bg-input);
  border: 1px solid var(--border-subtle);
}

.env-tab.active {
  color: var(--text-inverse);
  background: var(--accent);
  box-shadow: none;
}

html[data-theme="dark"] .env-tab.active {
  color: #041018;
}

.account-select,
input[type="text"],
input[type="password"],
input[type="number"],
input[type="search"],
input[type="email"],
select,
textarea {
  background: var(--bg-input);
  color: var(--text-primary);
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
}

/* Native <select> popup lists often ignore parent colors on Windows/Chromium.
   Force black menu + white text in dark theme for readable contrast. */
:root select,
html[data-theme="dark"] select,
html:not([data-theme="light"]) select {
  background-color: #000000;
  color: #ffffff;
  color-scheme: dark;
}

:root select option,
html[data-theme="dark"] select option,
html:not([data-theme="light"]) select option {
  background-color: #000000;
  color: #ffffff;
}

:root select optgroup,
html[data-theme="dark"] select optgroup,
html:not([data-theme="light"]) select optgroup {
  background-color: #000000;
  color: #ffffff;
  font-weight: 650;
}

html[data-theme="light"] select {
  background-color: #ffffff;
  color: var(--text-primary);
  color-scheme: light;
}

html[data-theme="light"] select option,
html[data-theme="light"] select optgroup {
  background-color: #ffffff;
  color: var(--text-primary);
}

.account-select:focus,
input:focus,
select:focus,
textarea:focus {
  outline: none;
  border-color: var(--border-focus);
  box-shadow: var(--focus-ring);
}

table,
.pipeline-symbol-table,
.rss-table,
.nm-table,
.sh-table {
  border-color: var(--border-subtle);
}

.pipeline-symbol-table th,
.nm-table th,
.rss-table th {
  color: var(--text-muted);
  background: var(--bg-elevated);
}

.pipeline-progress-track,
.op-progress-track,
.rss-progress-track,
.gr-progress-bar,
.pj-progress-bar {
  background: color-mix(in srgb, var(--text-muted) 18%, transparent);
  border-radius: 999px;
  overflow: hidden;
}

.pipeline-progress-bar,
.op-progress-fill,
.rss-progress-fill,
.gr-progress-bar-fill,
.pj-progress-bar-fill {
  background: linear-gradient(90deg, var(--accent-strong), var(--accent));
}

.pipeline-pct {
  color: var(--accent);
}

.pipeline-chip.is-active {
  background: var(--bg-active);
  border-color: transparent;
  color: var(--accent);
}

.empty-state {
  color: var(--text-muted);
  background: transparent;
}

/* ── Login page ─────────────────────────────────────────────────── */
body.login-portal {
  min-height: 100vh;
}

.login-backdrop {
  background: var(--bg-deep);
}

.login-backdrop-glow {
  background: radial-gradient(circle at 50% 20%, rgba(96, 205, 255, 0.12), transparent 55%);
}

html[data-theme="light"] .login-backdrop-glow {
  background: radial-gradient(circle at 50% 20%, color-mix(in srgb, var(--accent) 12%, transparent), transparent 55%);
}

.login-shell {
  position: relative;
  z-index: 1;
}

.login-card-modern {
  max-width: 420px;
  margin: 0 auto;
  padding: 1.75rem 1.6rem 1.4rem;
  box-shadow: var(--shadow-lg);
}

.login-card-accent {
  background: linear-gradient(90deg, var(--accent-strong), var(--accent));
  height: 3px;
  border-radius: 999px;
  margin: -1.75rem -1.6rem 1.25rem;
}

.login-eyebrow {
  color: var(--text-muted);
  font-size: 0.82rem;
  letter-spacing: 0.02em;
}

.login-field label {
  color: var(--text-secondary);
  font-weight: 600;
  font-size: 0.82rem;
}

.login-access-btn {
  width: 100%;
  border: none;
  border-radius: var(--radius-sm);
  background: var(--accent);
  color: var(--text-inverse);
  font-weight: 700;
  padding: 0.75rem 1rem;
  cursor: pointer;
  box-shadow: var(--shadow-sm);
}

html[data-theme="dark"] .login-access-btn {
  color: #041018;
}

.login-access-btn:hover {
  background: var(--accent-strong);
}

/* Outside the login card — avoids overlapping the neon accent bar */
.login-theme-dock {
  position: fixed;
  top: 1rem;
  right: 1rem;
  z-index: 20;
}

.login-theme-row {
  display: none;
}

/* ── Cockpit / research page polish ─────────────────────────────── */
.trade-engine-account-panel,
.trade-engine-panel,
.pair-selection-panel,
.accounts-panel {
  border-radius: var(--radius);
}

.trade-engine-live-status.is-active {
  color: var(--accent);
  font-weight: 600;
}

.trade-engine-feedback,
.rss-feedback,
.nm-feedback,
.sh-feedback,
.gr-feedback,
.pj-feedback {
  border-radius: var(--radius-sm);
  border: 1px solid var(--border-subtle);
  background: var(--info-bg);
}

.trade-engine-feedback.is-error,
.rss-feedback.error,
.nm-feedback.is-error,
.gr-feedback.is-error {
  background: var(--danger-bg);
  border-color: color-mix(in srgb, var(--accent-danger) 35%, transparent);
}

.panel-drawer-toggle {
  color: var(--text-primary);
}

.panel-drawer-body {
  background: transparent;
}

/* Light-mode overrides for leftover hard-coded dark fills */
html[data-theme="light"] .bg-geometry,
html[data-theme="light"] body.broker-portal,
html[data-theme="light"] body.login-portal {
  background: var(--bg-deep);
  color: var(--text-primary);
}

html[data-theme="light"] .sidebar,
html[data-theme="light"] .sidebar-brand,
html[data-theme="light"] .git-branch-bar,
html[data-theme="light"] .main-top-chrome {
  background: var(--bg-sidebar);
}

html[data-theme="light"] .wallet-ticker-bar,
html[data-theme="light"] .topbar-actions-bar,
html[data-theme="light"] .global-header {
  background: rgba(255, 255, 255, 0.92);
}

html[data-theme="light"] .btn-outline {
  border-color: var(--border-strong);
  color: var(--text-primary);
}

html[data-theme="light"] .pipeline-symbol-table-wrap,
html[data-theme="light"] .nm-table-wrap,
html[data-theme="light"] .engine-activity-feed {
  background: var(--bg-card);
}

html[data-theme="light"] .verified-badge {
  color: #fff;
  background: var(--accent-green);
}

/* Reduce neon glow leftovers from older cyber theme */
html[data-theme="dark"] .brand-logo,
html[data-theme="light"] .brand-logo {
  filter: none;
}

html[data-theme="dark"] .env-tab.active,
html[data-theme="light"] .env-tab.active {
  box-shadow: none;
}

/* Prefer calm elevation over glow on primary actions */
html[data-theme="dark"] .btn-primary,
html[data-theme="light"] .btn-primary {
  box-shadow: var(--shadow-sm);
}

/* Keep the compact active-work rail sticky for status, but never pin the full
   Live scan pipeline panel — sticky pipeline overlapped "Charts checked" and
   later sections while scrolling the Account Workspace mid-scan. */
body.is-working .trade-engine-pipeline:not(.is-hidden) {
  position: static;
  z-index: auto;
}

/* Shared typography / spacing helpers — prefer these over one-off margins */
.muted {
  color: var(--text-muted);
  font-size: 0.85rem;
  line-height: 1.4;
}

.section-stack > * + * {
  margin-top: var(--section-gap);
}

.stack-gap {
  display: flex;
  flex-direction: column;
  gap: var(--stack-gap);
}

.control-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--control-gap);
}

@media (max-width: 900px) {
  .content {
    padding: 0.9rem 0.85rem 1.75rem;
  }

  .active-work-rail {
    flex-wrap: wrap;
  }

  .trade-engine-head {
    flex-wrap: wrap;
  }

  .trade-engine-head-progress.has-rail {
    order: 3;
    flex: 1 1 100%;
    margin: 0.15rem 0 0;
  }

  .trade-engine-head-actions {
    margin-left: auto;
  }
}

/* ── Light-mode color & contrast corrections ─────────────────────
   dashboard.css carries a lot of dark-theme neon hard-codes (neon green
   #39ff14 / cyan #00f0ff, black buttons, etc.). This block is scoped to
   light mode only and re-tunes those surfaces for readable contrast:
   true-white backgrounds, black text, navy/deep-indigo accents, and
   non-neon status colors. Dark mode is untouched. */

/* Body / geometry — clean white canvas */
html[data-theme="light"] body.broker-portal,
html[data-theme="light"] body.login-portal {
  background: var(--bg-deep);
  color: var(--text-primary);
}

/* Sidebar / chrome — light neutral, readable nav text */
html[data-theme="light"] .sidebar,
html[data-theme="light"] .sidebar-brand,
html[data-theme="light"] .git-branch-bar {
  background: var(--bg-sidebar);
  border-color: var(--border-subtle);
}

html[data-theme="light"] .main-top-chrome,
html[data-theme="light"] .global-header {
  background: rgba(247, 248, 251, 0.92);
  border-color: var(--border-subtle);
}

html[data-theme="light"] .git-branch-select {
  background: #ffffff;
  color: var(--text-primary);
  border-color: var(--border-strong);
}

html[data-theme="light"] .nav-link {
  color: #1f2430;
  font-weight: 600;
}

html[data-theme="light"] .nav-section-title {
  color: var(--text-primary);
  font-weight: 700;
}

html[data-theme="light"] .nav-link:hover {
  background: color-mix(in srgb, var(--accent) 8%, transparent);
  color: var(--text-primary);
}

html[data-theme="light"] .nav-link.active {
  color: var(--accent);
  border-left-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 10%, transparent);
}

/* Logo — the brand mark contains white elements; give it a dark plate in
   light mode only so it stays visible. The plate stays inside the logo
   container and never tints the sidebar/header. */
html[data-theme="light"] .sidebar-brand {
  background: #10151d;
  border-bottom-color: rgba(255, 255, 255, 0.08);
}

html[data-theme="light"] .brand-logo {
  background: transparent;
  filter: none;
}

html[data-theme="light"] .login-brand-logo {
  background: transparent;
  filter: drop-shadow(0 2px 6px rgba(15, 23, 42, 0.18));
}

html[data-theme="light"] .login-card-brand {
  padding: 0.85rem;
  border-radius: 12px;
  background: #10151d;
}

/* Primary buttons — navy, no neon glow */
html[data-theme="light"] .btn-primary,
html[data-theme="light"] button.btn-primary,
html[data-theme="light"] .login-access-btn {
  background: var(--accent);
  border-color: transparent;
  color: #ffffff;
  box-shadow: var(--shadow-sm);
  text-shadow: none;
}

html[data-theme="light"] .btn-primary:hover:not(:disabled),
html[data-theme="light"] button.btn-primary:hover:not(:disabled),
html[data-theme="light"] .login-access-btn:hover {
  background: var(--accent-strong);
  color: #ffffff;
}

html[data-theme="light"] .btn-outline {
  border-color: var(--border-strong);
  color: var(--text-primary);
  background: transparent;
}

html[data-theme="light"] .btn-outline:hover:not(:disabled) {
  border-color: var(--accent);
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 8%, transparent);
}

html[data-theme="light"] .env-tab.active {
  color: #ffffff;
  background: var(--accent);
}

/* Login card — light surface, subtle navy accent bar (no neon gradient) */
html[data-theme="light"] .login-card-modern {
  background: linear-gradient(165deg, #ffffff 0%, #f6f8fb 100%);
  border: 1px solid var(--border-subtle);
  box-shadow: var(--shadow-lg);
}

html[data-theme="light"] .login-card-accent {
  background: linear-gradient(90deg, var(--accent-strong), var(--accent));
  box-shadow: none;
}

html[data-theme="light"] .login-eyebrow {
  color: var(--text-muted);
}

/* Form fields — clean white inputs with visible borders */
html[data-theme="light"] .account-select,
html[data-theme="light"] input[type="text"],
html[data-theme="light"] input[type="password"],
html[data-theme="light"] input[type="number"],
html[data-theme="light"] input[type="search"],
html[data-theme="light"] input[type="email"],
html[data-theme="light"] select,
html[data-theme="light"] textarea {
  background: var(--bg-input);
  color: var(--text-primary);
  border-color: var(--border-strong);
}

/* Login form — dark hard-coded label/input colors → black text on white */
html[data-theme="light"] .login-field label {
  color: var(--text-secondary);
  font-weight: 700;
}

html[data-theme="light"] .login-field input {
  background: #ffffff;
  border-color: var(--border-strong);
  color: var(--text-primary);
}

html[data-theme="light"] .login-field input::placeholder {
  color: var(--text-muted);
}

html[data-theme="light"] .login-field input:focus {
  border-color: var(--border-focus);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 22%, transparent);
}

/* Login stay-row — neon checkbox → navy, readable text */
html[data-theme="light"] .login-stay-box {
  border-color: color-mix(in srgb, var(--accent) 60%, transparent);
  background: #ffffff;
}

html[data-theme="light"] .login-stay-row input:checked + .login-stay-box {
  background: var(--accent);
  border-color: var(--accent);
}

html[data-theme="light"] .login-stay-text {
  color: var(--text-secondary);
}

/* Login session status — remove dark patch, use light surface */
html[data-theme="light"] .login-session-status {
  background: var(--bg-elevated);
  border-color: var(--border-subtle);
  color: var(--text-secondary);
}

html[data-theme="light"] .account-select:focus,
html[data-theme="light"] input:focus,
html[data-theme="light"] select:focus,
html[data-theme="light"] textarea:focus {
  border-color: var(--border-focus);
  box-shadow: var(--focus-ring);
}

/* Tables — readable header/body contrast */
html[data-theme="light"] .pipeline-symbol-table th,
html[data-theme="light"] .nm-table th,
html[data-theme="light"] .rss-table th {
  background: #e8edf4;
  color: #1f2430;
  font-weight: 700;
}

html[data-theme="light"] .accounts-table th,
html[data-theme="light"] .tool-table th,
html[data-theme="light"] .sh-table th,
html[data-theme="light"] .gr-table th,
html[data-theme="light"] .pj-rejection-table th {
  color: #1f2430;
  font-weight: 700;
}

html[data-theme="light"] .pipeline-symbol-table-wrap,
html[data-theme="light"] .nm-table-wrap,
html[data-theme="light"] .engine-activity-feed,
html[data-theme="light"] .bt-saved-panel {
  background: var(--bg-card);
}

html[data-theme="light"] .bt-saved-banner {
  border-left-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 8%, transparent);
}

/* Status indicators / badges / pills — darker non-neon colors */
html[data-theme="light"] .badge-active {
  background: rgba(15, 123, 61, 0.12);
  color: #0f7b3d;
  border-color: rgba(15, 123, 61, 0.4);
}

html[data-theme="light"] .badge-view-only,
html[data-theme="light"] .badge-warning {
  background: rgba(194, 65, 12, 0.1);
  color: #b45309;
  border-color: rgba(194, 65, 12, 0.35);
}

html[data-theme="light"] .badge-disabled {
  background: color-mix(in srgb, var(--accent-danger) 10%, transparent);
  color: var(--accent-danger);
  border-color: color-mix(in srgb, var(--accent-danger) 40%, transparent);
}

html[data-theme="light"] .engine-badge-idle { background: color-mix(in srgb, var(--text-muted) 14%, transparent); color: #3d4656; }
html[data-theme="light"] .engine-badge-scanning { background: color-mix(in srgb, var(--accent) 12%, transparent); color: var(--accent); }
html[data-theme="light"] .engine-badge-setup { background: color-mix(in srgb, var(--accent-green) 12%, transparent); color: var(--accent-green); }
html[data-theme="light"] .engine-badge-executing { background: color-mix(in srgb, var(--accent-purple) 12%, transparent); color: var(--accent-purple); }
html[data-theme="light"] .engine-badge-blocked { background: color-mix(in srgb, var(--accent-orange) 12%, transparent); color: #b45309; }
html[data-theme="light"] .engine-badge-failed { background: color-mix(in srgb, var(--accent-danger) 12%, transparent); color: var(--accent-danger); }
html[data-theme="light"] .engine-badge-completed { background: color-mix(in srgb, var(--accent) 12%, transparent); color: var(--accent); }

html[data-theme="light"] .outcome-win,
html[data-theme="light"] .rss-grade.grade-A,
html[data-theme="light"] .pipeline-stage-badge.stage-completed,
html[data-theme="light"] .gr-badge.gr-agree {
  background: rgba(15, 123, 61, 0.14);
  color: #0d6b34;
}

html[data-theme="light"] .rss-grade.grade-B,
html[data-theme="light"] .pipeline-stage-badge.stage-failed,
html[data-theme="light"] .gr-badge.gr-disagree {
  background: rgba(185, 28, 28, 0.12);
  color: #b91c1c;
}

html[data-theme="light"] .rss-grade.grade-B {
  color: #a16207;
  background: rgba(161, 98, 7, 0.12);
}

html[data-theme="light"] .pipeline-stage-badge.stage-fetching,
html[data-theme="light"] .pipeline-stage-badge.stage-analyzing {
  color: #3d4656;
  background: rgba(77, 86, 104, 0.12);
}

html[data-theme="light"] .pipeline-stage-badge.stage-validating {
  color: #a16207;
  background: rgba(161, 98, 7, 0.12);
}

html[data-theme="light"] .sh-grade-pill.is-a { color: #0d6b34; border-color: rgba(15, 123, 61, 0.5); }
html[data-theme="light"] .sh-grade-pill.is-b { color: #8a5a00; border-color: rgba(161, 98, 7, 0.5); }

html[data-theme="light"] .position-badge.is-profit {
  color: #0d6b34;
}

html[data-theme="light"] .position-badge.is-loss {
  color: #b91c1c;
}

/* Profit/loss and buy/sell accents — readable on white */
html[data-theme="light"] .dtp-tl-grid,
html[data-theme="light"] .tl-positions-grid,
html[data-theme="light"] .tg-tl-grid {
  --dtp-tl-buy: var(--accent-green);
  --dtp-tl-sell: #c2410c;
  --dtp-tl-pnl-pos: var(--accent-green);
  --dtp-tl-pnl-neg: var(--accent-danger);
  --dtp-tl-grid-bg: #ffffff;
  --dtp-tl-head-bg: #eef2f7;
  --dtp-tl-text: var(--text-primary);
  --dtp-tl-muted: #000000;
  --dtp-tl-border: rgba(15, 23, 42, 0.18);
  --dtp-tl-row-border: rgba(15, 23, 42, 0.12);
}

html[data-theme="light"] .verified-badge {
  color: #ffffff;
  background: #0f7b3d;
}

/* Live-universe notification buttons — kill the black/neon look */
html[data-theme="light"] .lu-notify-actions button,
html[data-theme="light"] .lu-notify-actions .btn-secondary {
  background: var(--bg-card) !important;
  background-color: var(--bg-card) !important;
  color: var(--accent) !important;
  border: 1px solid var(--border-strong) !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

html[data-theme="light"] .lu-notify-actions button:hover:not(:disabled),
html[data-theme="light"] .lu-notify-actions .btn-secondary:hover:not(:disabled) {
  background: var(--bg-active) !important;
  color: var(--accent-strong) !important;
  border-color: var(--accent) !important;
  box-shadow: none !important;
}

html[data-theme="light"] .lu-notify-actions button:nth-child(1) {
  color: var(--accent) !important;
  border-color: var(--accent) !important;
  text-shadow: none !important;
}

html[data-theme="light"] .lu-notify-actions button:nth-child(2) {
  color: #0d6b34 !important;
  border-color: #0f7b3d !important;
  text-shadow: none !important;
}

html[data-theme="light"] .lu-copy-session-btn {
  background: var(--bg-card) !important;
  background-color: var(--bg-card) !important;
  color: var(--accent) !important;
  border: 1px solid var(--border-strong) !important;
  text-shadow: none !important;
}

html[data-theme="light"] .lu-copy-session-btn:hover:not(:disabled) {
  background: var(--bg-active) !important;
  color: var(--accent-strong) !important;
  border-color: var(--accent) !important;
  box-shadow: none !important;
}

html[data-theme="light"] .lu-notify-actions button:focus-visible,
html[data-theme="light"] .lu-notify-actions .btn-secondary:focus-visible {
  outline: 2px solid var(--border-focus);
}

/* Dark code/JSON panels become light code panels */
html[data-theme="light"] .luh-detail-pre {
  background: #0f172a;
  color: #dbe4f0;
  border-color: rgba(15, 23, 42, 0.2);
}

/* Links and accents */
html[data-theme="light"] a {
  color: var(--accent);
}

html[data-theme="light"] a:hover {
  color: var(--accent-strong);
}

/* Metric values and pipeline percentages stay dark-ink for contrast */
html[data-theme="light"] .metric-card .value,
html[data-theme="light"] .pipeline-pct,
html[data-theme="light"] .session-pill {
  color: var(--accent);
}

html[data-theme="light"] .session-pill {
  background: color-mix(in srgb, var(--accent) 8%, transparent);
  border-color: color-mix(in srgb, var(--accent) 30%, transparent);
}

html[data-theme="light"] .icon-refresh {
  border-color: var(--border-strong);
  background: var(--bg-card);
  color: var(--accent);
  box-shadow: var(--shadow-sm);
}

html[data-theme="light"] .icon-refresh:hover {
  background: var(--bg-active);
  box-shadow: var(--glow-cyan);
}

html[data-theme="light"] .pipeline-chip.is-active {
  background: color-mix(in srgb, var(--accent) 10%, transparent);
  color: var(--accent);
}

html[data-theme="light"] .active-work-jump {
  color: var(--accent);
  background: color-mix(in srgb, var(--accent) 8%, transparent);
}

html[data-theme="light"] .trade-engine-feedback,
html[data-theme="light"] .rss-feedback,
html[data-theme="light"] .nm-feedback,
html[data-theme="light"] .sh-feedback,
html[data-theme="light"] .gr-feedback,
html[data-theme="light"] .pj-feedback {
  background: var(--info-bg);
  border-color: var(--border-subtle);
}

html[data-theme="light"] .trade-engine-feedback.is-error,
html[data-theme="light"] .rss-feedback.error,
html[data-theme="light"] .nm-feedback.is-error,
html[data-theme="light"] .gr-feedback.is-error {
  background: var(--danger-bg);
  border-color: rgba(185, 28, 28, 0.35);
}

/* bt-suggest / warning accents */
html[data-theme="light"] .bt-suggest-panel {
  background: var(--bg-card);
}

html[data-theme="light"] .bt-suggest-disclaimer {
  border-left-color: var(--accent-orange);
  background: color-mix(in srgb, var(--accent-orange) 8%, transparent);
}

/* ── Remaining neon hard-codes → dark professional light-mode equivalents ──
   dashboard.css still contains dark-theme neon fills (#0ff, #39ff14, #00f0ff,
   #7af8ff, #4ade80, #fbbf24, etc.). These overrides are light-mode-only and
   map each to the navy/deep-indigo palette or a dark status color. */

/* User avatar — replace neon green/purple split with navy gradient */
html[data-theme="light"] .user-avatar {
  background: linear-gradient(135deg, var(--accent-strong) 0%, var(--accent) 60%, var(--accent-purple) 100%);
  box-shadow: var(--shadow-sm);
}

/* Account rows — selected state + "trading chosen" badge */
html[data-theme="light"] .account-row-selected {
  background: color-mix(in srgb, var(--accent) 7%, transparent);
  box-shadow: inset 4px 0 0 var(--accent);
}

html[data-theme="light"] .account-trading-chosen-badge {
  color: var(--accent-strong);
  background: color-mix(in srgb, var(--accent) 10%, transparent);
  border: 1px solid color-mix(in srgb, var(--accent) 55%, transparent);
  box-shadow: none;
  text-shadow: none;
  animation: none;
}

html[data-theme="light"] .pair-selection-account-hint.is-trading-acc-chosen {
  color: var(--accent-strong);
  text-shadow: none;
}

/* Favorites / setup confidence — cyan #0ff → navy */
html[data-theme="light"] .favorites-count-badge,
html[data-theme="light"] .favorite-session-account-id,
html[data-theme="light"] .setup-confidence-badge {
  color: var(--accent-strong);
  background: color-mix(in srgb, var(--accent) 10%, transparent);
  border-color: color-mix(in srgb, var(--accent) 40%, transparent);
  text-shadow: none;
}

/* Amber warnings — darken for contrast on white */
html[data-theme="light"] .oco-warning,
html[data-theme="light"] .bible-ch-watch,
html[data-theme="light"] .pipeline-throttle-text,
html[data-theme="light"] .lu-interval-estimate.is-warn {
  color: #92400e;
}

/* Candlestick Bible statuses — darker readable colors */
html[data-theme="light"] .bible-ch-pass,
html[data-theme="light"] .bible-beginner-yes {
  color: var(--accent-green);
}

html[data-theme="light"] .bible-ch-blocked {
  color: var(--accent-danger);
}

/* Backtesting suggestion priorities */
html[data-theme="light"] .bt-sug-prio-high {
  color: var(--accent-danger);
}

html[data-theme="light"] .bt-sug-prio-medium {
  color: #92400e;
}

html[data-theme="light"] .bt-sug-prio-low {
  color: var(--accent-green);
}

/* Backtesting win badge — neon green → deep green */
html[data-theme="light"] .bg-win-badge {
  background: color-mix(in srgb, var(--accent-green) 14%, transparent);
  color: var(--accent-green);
}

html[data-theme="light"] .bg-bt-outcome {
  color: var(--text-muted);
}

html[data-theme="light"] .bg-notes-intro {
  color: var(--text-secondary);
}

/* Backtesting outcome badges */
html[data-theme="light"] .outcome-win {
  background: color-mix(in srgb, var(--accent-green) 15%, transparent);
  color: var(--accent-green);
}

html[data-theme="light"] .outcome-loss {
  background: color-mix(in srgb, var(--accent-danger) 14%, transparent);
  color: var(--accent-danger);
}

html[data-theme="light"] .outcome-timeout {
  background: color-mix(in srgb, var(--accent-orange) 12%, transparent);
  color: #92400e;
}

html[data-theme="light"] .outcome-skipped {
  background: color-mix(in srgb, var(--text-muted) 12%, transparent);
  color: #3d4656;
}

html[data-theme="light"] .bg-feedback.is-error {
  color: var(--accent-danger);
}

/* Status text that was neon on dark — darken for white backgrounds */
html[data-theme="light"] .login-session-status.login-session-error,
html[data-theme="light"] .cockpit-account-context-status.is-error {
  color: var(--accent-danger);
}

html[data-theme="light"] .cockpit-account-context-status.is-loading {
  color: var(--accent);
}

html[data-theme="light"] .cockpit-account-balance-is-cached .cockpit-account-balance-amount,
html[data-theme="light"] .wallet-balance-chip.is-cached-balance .wallet-balance-amount {
  color: #92400e;
}

html[data-theme="light"] .git-branch-dirty {
  color: #92400e;
}

html[data-theme="light"] .git-branch-flash {
  color: var(--accent-green);
}

html[data-theme="light"] .git-branch-busy {
  color: #92400e;
}

/* Account engine status — bright cyan/blue → navy */
html[data-theme="light"] .account-engine-status.is-active {
  color: var(--accent);
}

html[data-theme="light"] .account-engine-status.is-done {
  color: var(--accent-strong);
}

html[data-theme="light"] .account-engine-status.is-error {
  color: var(--accent-orange);
}

/* Topbar account label — hard-coded light text → dark */
html[data-theme="light"] .topbar-account #accountLabel {
  color: var(--text-primary);
}

html[data-theme="light"] .login-session-status.login-session-ok {
  border-color: color-mix(in srgb, var(--accent-green) 40%, transparent);
}

/* Live-universe status rows / metrics — neon → navy/green */
html[data-theme="light"] .lu-status-row.is-active {
  color: var(--accent-green);
  font-weight: 800;
  text-shadow: none;
}

html[data-theme="light"] .lu-metric-pair strong {
  color: var(--accent-strong);
  text-shadow: none;
}

html[data-theme="light"] .lu-live-activity {
  border: 1px solid var(--border-subtle);
  background: var(--bg-elevated);
}

html[data-theme="light"] .lu-live-activity-pulse {
  background: var(--accent-green);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent-green) 25%, transparent);
}

html[data-theme="light"] .lu-live-activity-headline {
  color: var(--text-primary);
}

html[data-theme="light"] .lu-interval-estimate.is-continuous {
  color: var(--accent);
}

html[data-theme="light"] .lu-session-id {
  color: var(--accent-strong);
  text-shadow: none;
}

html[data-theme="light"] .lu-handoff-bar {
  border: 1px solid var(--border-strong);
  background: color-mix(in srgb, var(--accent) 6%, transparent);
}

html[data-theme="light"] .lu-copy-handoff-btn {
  border: 1px solid color-mix(in srgb, var(--accent-green) 55%, transparent);
  background: color-mix(in srgb, var(--accent-green) 10%, transparent);
  color: var(--accent-green);
}

html[data-theme="light"] .lu-copy-handoff-btn:hover:not(:disabled) {
  background: color-mix(in srgb, var(--accent-green) 18%, transparent);
}

html[data-theme="light"] .lu-copy-handoff-btn.is-copied {
  border-color: var(--accent);
  color: var(--accent);
}

/* Live-universe feedback panels */
html[data-theme="light"] .lu-feedback {
  background: var(--info-bg);
  color: var(--text-primary);
}

html[data-theme="light"] .lu-feedback.is-error {
  background: var(--danger-bg);
  color: var(--accent-danger);
}

/* Live-universe history — id buttons/rows */
html[data-theme="light"] .luh-id-btn:hover {
  color: var(--accent);
}

html[data-theme="light"] .luh-detail-id {
  color: var(--accent);
}

/* Live-universe live banner + auto-exec warnings */
html[data-theme="light"] .lu-live-banner {
  border-color: color-mix(in srgb, var(--accent-danger) 55%, transparent);
  background: color-mix(in srgb, var(--accent-danger) 10%, transparent);
  color: var(--accent-danger);
}

html[data-theme="light"] .lu-live-auto-warn {
  border-color: color-mix(in srgb, var(--accent-danger) 45%, transparent);
  background: color-mix(in srgb, var(--accent-danger) 8%, transparent);
  color: var(--accent-danger);
}

/* Live-universe notification buttons — per-child non-neon colors */
html[data-theme="light"] .lu-notify-actions button:nth-child(3) {
  color: var(--accent) !important;
  border-color: var(--accent) !important;
  text-shadow: none !important;
}

html[data-theme="light"] .lu-notify-actions button:nth-child(4) {
  color: var(--accent-green) !important;
  border-color: var(--accent-green) !important;
  text-shadow: none !important;
}

html[data-theme="light"] .lu-notify-actions button:nth-child(5) {
  color: #92400e !important;
  border-color: #92400e !important;
  text-shadow: none !important;
}

html[data-theme="light"] .lu-notify-actions button:nth-child(6) {
  color: var(--accent-purple) !important;
  border-color: var(--accent-purple) !important;
  text-shadow: none !important;
}

html[data-theme="light"] .lu-notify-actions button:nth-child(1):hover:not(:disabled) {
  color: var(--accent-strong) !important;
  border-color: var(--accent-strong) !important;
  box-shadow: none !important;
}

html[data-theme="light"] .lu-notify-actions button:nth-child(2):hover:not(:disabled) {
  color: var(--accent-green) !important;
  border-color: var(--accent-green) !important;
  box-shadow: none !important;
}

/* Live-universe copy buttons (already overridden above) — ensure copied state
   matches the accent palette */
html[data-theme="light"] .lu-copy-session-btn.is-copied {
  color: var(--accent-green) !important;
  border-color: var(--accent-green) !important;
  text-shadow: none !important;
}

/* Scattered dark fills → light surfaces */
html[data-theme="light"] .env-toggle {
  background: var(--bg-elevated);
}

html[data-theme="light"] kbd {
  background: var(--bg-elevated);
  border-color: var(--border-strong);
  color: var(--text-primary);
}

html[data-theme="light"] .coming-soon-panel {
  background: var(--bg-elevated);
}

html[data-theme="light"] .rss-card {
  background: var(--bg-card);
  border-color: var(--border-subtle);
}

html[data-theme="light"] .workspace-block {
  background: var(--bg-card);
}

/* ── Jet-black text sweep ─────────────────────────────────────────
   dashboard.css hard-codes light-grey text (#9aa0ab, #94a3b8, #cbd5e1,
   #e2e8f0, #e8eef7, #8b95a5) for dark-mode surfaces. On a white page
   those greys are nearly unreadable, so every one is forced to black
   in light mode. Only genuinely decorative/dim elements (disabled, empty
   dividers) keep a dark-but-readable tone. */

html[data-theme="light"] .git-branch-select,
html[data-theme="light"] .topbar-account #accountLabel,
html[data-theme="light"] .cockpit-account-select,
html[data-theme="light"] .signal-playbook-card,
html[data-theme="light"] .signal-playbook-title,
html[data-theme="light"] .signal-playbook-section h4,
html[data-theme="light"] .tg-grid-count,
html[data-theme="light"] .tl-empty strong,
html[data-theme="light"] .tl-empty span,
html[data-theme="light"] .engine-badge-idle,
html[data-theme="light"] .outcome-skipped,
html[data-theme="light"] .bg-final-fields dt,
html[data-theme="light"] .pj-brief-block h4,
html[data-theme="light"] .pj-brief-thumbs h4,
html[data-theme="light"] .pj-gpt-checklist code,
html[data-theme="light"] .op-progress-steps li.is-active,
html[data-theme="light"] .gr-progress-steps li.is-active,
html[data-theme="light"] .setup-lifecycle-canceled,
html[data-theme="light"] .luh-meta,
html[data-theme="light"] .luh-stop,
html[data-theme="light"] .lu-handoff-choice strong,
html[data-theme="light"] .lu-handoff-choice small,
html[data-theme="light"] .lu-live-activity-feed li,
html[data-theme="light"] .lu-live-activity-algorithm,
html[data-theme="light"] .lu-live-activity-detail,
html[data-theme="light"] .lu-live-activity-progress,
html[data-theme="light"] .chart-card-loading,
html[data-theme="light"] .dtp-tl-grid .tl-col-id code,
html[data-theme="light"] .tl-positions-grid .tl-col-id code {
  color: #000000;
}

html[data-theme="light"] .tg-grid-sub,
html[data-theme="light"] .tg-grid-meta,
html[data-theme="light"] .signal-playbook-source,
html[data-theme="light"] .signal-repeat-lead,
html[data-theme="light"] .bg-bt-outcome,
html[data-theme="light"] .bg-notes-intro,
html[data-theme="light"] .bg-notes-list,
html[data-theme="light"] .pj-brief-block,
html[data-theme="light"] .pj-brief-thumbs,
html[data-theme="light"] .empty-state,
html[data-theme="light"] .empty-cell {
  color: #000000;
}

html[data-theme="light"] .login-field input::placeholder {
  color: #000000;
}

html[data-theme="light"] .login-trust-line,
html[data-theme="light"] .login-build-line,
html[data-theme="light"] .tool-page-desc,
html[data-theme="light"] .trade-engine-stats-help {
  color: #000000;
}

/* Disabled / inactive still readable but clearly not interactive */
html[data-theme="light"] .btn:disabled,
html[data-theme="light"] .btn-primary:disabled,
html[data-theme="light"] .btn-outline:disabled,
html[data-theme="light"] input:disabled,
html[data-theme="light"] select:disabled,
html[data-theme="light"] textarea:disabled {
  color: #4b5563;
}

/* ── Sky / neon blue → dark navy ──────────────────────────────────
   dashboard.css hard-codes bright sky-blues (#22d3ee, #3b82f6, #7dd3fc,
   #67e8f9, #7ee7ff, #93c5fd, #60a5fa, #7af8ff, #6ec8ff, #0ff) for dark
   mode. On white those are neon/highlighter and fail the light-mode
   rules, so every one is forced to the navy accent in light mode. */

html[data-theme="light"] .git-branch-current,
html[data-theme="light"] .accounts-env-active-badge,
html[data-theme="light"] .cockpit-env-card-icon,
html[data-theme="light"] .cockpit-account-env-badge-demo,
html[data-theme="light"] .cockpit-account-context-status.is-loading,
html[data-theme="light"] .trade-engine-live-status.is-active::before,
html[data-theme="light"] .trade-engine-symbol-current strong,
html[data-theme="light"] .trade-engine-symbol-chip.is-active,
html[data-theme="light"] .trade-engine-symbol-chip.is-setup,
html[data-theme="light"] .setup-lifecycle-watch,
html[data-theme="light"] .gpt-reviewer-banner-text,
html[data-theme="light"] .broker-orders-feedback,
html[data-theme="light"] .broker-positions-feedback,
html[data-theme="light"] .pipeline-eta,
html[data-theme="light"] .pipeline-stage-badge.stage-fetching,
html[data-theme="light"] .chart-viewer-path code,
html[data-theme="light"] .chart-card-file code,
html[data-theme="light"] .engine-chart-link,
html[data-theme="light"] .gr-root code,
html[data-theme="light"] .gr-analysis summary,
html[data-theme="light"] .gr-files summary,
html[data-theme="light"] .gr-folder code,
html[data-theme="light"] .pj-progress-head span,
html[data-theme="light"] .gr-progress-head span,
html[data-theme="light"] .pj-next-check-label,
html[data-theme="light"] .pj-analysis-trail summary,
html[data-theme="light"] .pj-brief-preview-details summary,
html[data-theme="light"] .op-progress-head .op-progress-timer,
html[data-theme="light"] .op-progress-timer,
html[data-theme="light"] .rss-progress-pct,
html[data-theme="light"] .ccfx-prog-badge,
html[data-theme="light"] .chart-reasoning-summary,
html[data-theme="light"] .luh-id-btn {
  color: var(--accent);
}

html[data-theme="light"] .engine-chart-link:hover {
  color: var(--accent-strong);
}

/* Info banner — the "Use your TradeLocker credentials" text. Was
   light-grey-on-purple (unreadable). Now dark text on a light navy wash. */
html[data-theme="light"] .info-banner {
  background: color-mix(in srgb, var(--accent-purple) 7%, transparent);
  border-color: color-mix(in srgb, var(--accent-purple) 30%, transparent);
  color: var(--text-primary);
}

html[data-theme="light"] .info-banner strong {
  color: var(--accent-purple);
  font-weight: 700;
}

html[data-theme="light"] .info-banner-dismiss {
  color: var(--text-secondary);
}

html[data-theme="light"] .info-banner-dismiss:hover {
  background: color-mix(in srgb, var(--accent) 10%, transparent);
  color: var(--text-primary);
}

/* Remaining light-grey hard-codes → black */
html[data-theme="light"] .signal-playbook-section ul,
html[data-theme="light"] .bg-req-list,
html[data-theme="light"] .bg-final-fields dd,
html[data-theme="light"] .luh-detail-pre,
html[data-theme="light"] .lu-handoff-picker-title {
  color: var(--text-primary);
}

/* B-grade request labels — neon cyan → navy */
html[data-theme="light"] .bg-req-label {
  color: var(--accent);
  font-weight: 700;
}

/* Live-universe copy-session button — handled above in the
   "Live-universe copy buttons" block (white bg, navy text). */

/* Next-check countdown — pale sky text → dark navy/ink */
html[data-theme="light"] .pj-next-check-value {
  color: var(--accent-strong);
}

html[data-theme="light"] .pj-next-check-countdown.is-soon .pj-next-check-label,
html[data-theme="light"] .pj-next-check-countdown.is-soon .pj-next-check-value {
  color: #92400e;
}

html[data-theme="light"] .pj-next-check-countdown.is-due .pj-next-check-label,
html[data-theme="light"] .pj-next-check-countdown.is-due .pj-next-check-value {
  color: var(--accent-green);
}

html[data-theme="light"] .pj-next-check-meta {
  color: var(--text-primary);
}

/* Cockpit env badge — bright yellow → dark amber */
html[data-theme="light"] .cockpit-account-env-badge-live {
  background: color-mix(in srgb, var(--accent-orange) 12%, transparent);
  color: #92400e;
}

/* Pale helper text that was light-on-dark → dark ink */
html[data-theme="light"] .lu-live-activity-algorithm,
html[data-theme="light"] .gr-diff,
html[data-theme="light"] .pj-brief-gpt-note,
html[data-theme="light"] .pj-gpt-checklist li.is-yes,
html[data-theme="light"] .pj-gpt-checklist li.is-no,
html[data-theme="light"] .pj-progress-steps li.is-done,
html[data-theme="light"] .gr-progress-steps li.is-done,
html[data-theme="light"] .pj-progress-steps li.is-failed,
html[data-theme="light"] .gr-progress-steps li.is-failed,
html[data-theme="light"] .op-progress-steps li.is-done,
html[data-theme="light"] .op-progress-steps li.is-failed {
  color: var(--text-primary);
}

html[data-theme="light"] .pj-gpt-checklist li.is-yes,
html[data-theme="light"] .pj-progress-steps li.is-done,
html[data-theme="light"] .gr-progress-steps li.is-done,
html[data-theme="light"] .op-progress-steps li.is-done {
  color: var(--accent-green);
}

html[data-theme="light"] .pj-gpt-checklist li.is-no,
html[data-theme="light"] .pj-progress-steps li.is-failed,
html[data-theme="light"] .gr-progress-steps li.is-failed,
html[data-theme="light"] .op-progress-steps li.is-failed {
  color: var(--accent-danger);
}

/* ── Last remaining neon / pale-text hard-codes ──────────────────── */
html[data-theme="light"] .tg-grid-toolbar h2 {
  color: var(--text-primary);
}

html[data-theme="light"] .form-hint-success {
  color: var(--accent-green);
}

html[data-theme="light"] .signal-playbook-fields dt {
  color: var(--text-secondary);
  font-weight: 700;
}

html[data-theme="light"] .tool-error,
html[data-theme="light"] .pipeline-fail,
html[data-theme="light"] .chart-viewer-error,
html[data-theme="light"] .chart-reasoning-list.is-blockers li,
html[data-theme="light"] .pj-live-cash-error,
html[data-theme="light"] .pj-result-error,
html[data-theme="light"] .gr-result-error {
  color: var(--accent-danger);
}

html[data-theme="light"] .chart-viewer-empty {
  color: #92400e;
}

html[data-theme="light"] .pj-demo-exec-note,
html[data-theme="light"] .pj-live-cash-approval-card h3,
html[data-theme="light"] .pj-brief-final,
html[data-theme="light"] .lu-ready-warn,
html[data-theme="light"] .lu-needs {
  color: #92400e;
}

html[data-theme="light"] .lu-ready-ok {
  color: var(--accent-green);
}

html[data-theme="light"] .launch-log-badge-ok {
  background: color-mix(in srgb, var(--accent-green) 14%, transparent);
  color: var(--accent-green);
}

/* Keep dark-mode neon untouched — every override above is light-scoped. */
