/* =========================================================================
 * CoreX Terminal — theme-light.css (Cloudflare Pages single-edition build)
 * -------------------------------------------------------------------------
 * Light theme layer, generated from the Light edition stylesheet.
 * Loaded AFTER style.css; every rule is scoped with
 * html[data-theme="light"] so it applies only when the theme toggle
 * (or a saved preference) sets <html data-theme="light">.
 * Dark stays the untouched base stylesheet.
 * Generated by scripts/build-theme-light.js — do not hand-edit.
 * ========================================================================= */

html[data-theme="light"] {
  /* dark-only property, not in Light edition: color-scheme: dark */
  --bg: #eceef2;
  --panel: #ffffff;
  --border: rgba(12, 14, 18, 0.09);
  --border-strong: rgba(12, 14, 18, 0.17);
  --text: #0d0f12;
  --text-2: #565c64;
  --accent: #3d434c;
  --accent-soft: rgba(61, 67, 76, 0.10);
  --up: #089981;
  --gold: #b7791f;
  --mid: #d5d8de;
  --chip: rgba(12, 14, 18, 0.045);
  --shadow: 0 1px 3px rgba(16, 24, 40, 0.06), 0 1px 2px rgba(16, 24, 40, 0.04);
  /* dark-only vars the light edition never declared. The dark base keeps
     them at near-black, which left every field built on them (settings
     dropdowns, alert inputs, embed form, fs-menu search) dark-on-dark
     under the light theme — give them light surfaces here. */
  --field: #f1f3f8;
  --field-hover: #e9edf5;
  --glass-bg: rgba(255, 255, 255, 0.62);
  --glass-brd: rgba(255, 255, 255, 0.85);
  --glass-hi: inset 0 1px 0 rgba(255, 255, 255, 0.9), inset 0 0 24px rgba(255, 255, 255, 0.25);
  --glass-blur: blur(18px) saturate(1.4);
  --topbar-bg: rgba(255, 255, 255, 0.72);
  --dock-bg: rgba(255, 255, 255, 0.6);
  --dock-active: rgba(12, 14, 18, 0.06);
}

html[data-theme="light"] .brand-logo {
  border: 1px solid rgba(15, 23, 42, 0.12);
}

html[data-theme="light"] .symbol-btn {
  background: #fbfcfe;
}

html[data-theme="light"] .symbol-btn:hover {
  background: #f4f6fb;
}

html[data-theme="light"] .symbol-menu {
  box-shadow: 0 12px 32px rgba(16, 24, 40, 0.14);
}

html[data-theme="light"] .tf-group {
  background: #f0f2f8;
}

html[data-theme="light"] .ctype-group {
  background: #f0f2f8;
}

html[data-theme="light"] .icon-btn:hover {
  background: #e9edf5;
}

html[data-theme="light"] .alerts-panel {
  box-shadow: 0 12px 32px rgba(16, 24, 40, 0.14);
}

html[data-theme="light"] .alert-form input {
  /* dark-only property, not in Light edition: background: var(--field) */
  /* dark-only property, not in Light edition: color: var(--text) */
}

html[data-theme="light"] .alert-form select {
  background: #fbfcfe;
  /* dark-only property, not in Light edition: color: var(--text) */
}

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

html[data-theme="light"] .btn-ghost:hover {
  background: #f0f2f8;
}

html[data-theme="light"] .alert-row {
  background: #f7f8fc;
}

html[data-theme="light"] .alert-del:hover {
  background: #feecec;
}

html[data-theme="light"] .conn-badge {
  background: #fbfcfe;
}

html[data-theme="light"] .conn-badge .dot {
  background: #b6bcc8;
}

html[data-theme="light"] .conn-badge.live {
  border-color: rgba(8, 153, 129, 0.35);
  background: #f0faf7;
}

html[data-theme="light"] .conn-badge.partial {
  border-color: rgba(183, 121, 31, 0.35);
  background: #fdf8ef;
}

html[data-theme="light"] .conn-badge.offline {
  border-color: rgba(242, 54, 69, 0.35);
  background: #fef3f3;
}

html[data-theme="light"] .rail-count {
  color: #b0b6c3;
}

html[data-theme="light"] .rail-row:hover {
  background: #f4f6fb;
}

html[data-theme="light"] #chart-area {
  background: #ffffff;
}

html[data-theme="light"] .tool-btn:hover {
  background: #eef1f7;
}

html[data-theme="light"] .tool-btn.active {
  color: #ffffff;
}

html[data-theme="light"] .tool-btn.danger:hover {
  background: #feecec;
}

html[data-theme="light"] .lg-tf {
  background: #eef1f7;
}

html[data-theme="light"] .text-editor input {
  /* dark-only property, not in Light edition: background: var(--field) */
  /* dark-only property, not in Light edition: color: var(--text) */
  box-shadow: 0 8px 24px rgba(16, 24, 40, 0.16);
}

html[data-theme="light"] .draw-toolbar {
  box-shadow: var(--glass-hi), 0 10px 26px -14px rgba(14, 18, 26, 0.4);
}

html[data-theme="light"] .dt-swatch {
  box-shadow: inset 0 0 0 1px rgba(16, 24, 40, 0.18);
}

html[data-theme="light"] .dt-delete:hover {
  background: #feecec;
}

html[data-theme="light"] .dt-label-input {
  background: #fbfcfe;
}

html[data-theme="light"] .chart-msg {
  background: rgba(255, 255, 255, 0.82);
}

html[data-theme="light"] .toast {
  background: #1a1f2e;
  color: #fff;
  /* dark-only property, not in Light edition: border: 1px solid #33363d */
  box-shadow: 0 10px 30px rgba(16, 24, 40, 0.25);
}

html[data-theme="light"] .splash-logo {
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(15, 23, 42, 0.12);
}

html[data-theme="light"] .modal-backdrop {
  background: rgba(10, 14, 22, 0.55);
}

html[data-theme="light"] .modal {
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.30);
}

html[data-theme="light"] #embed-top .brand-logo {
  border: 1px solid rgba(15, 23, 42, 0.12);
}

html[data-theme="light"] body.embed #chart-area {
  background: #ffffff;
}

html[data-theme="light"] .trade-btn {
  color: #ffffff;
}

html[data-theme="light"] .trade-help:hover {
  background: #f0f2f8;
}

html[data-theme="light"] #replay-pick {
  color: #ffffff;
}

html[data-theme="light"] #replay-btn.replaying {
  color: #ffffff;
}

html[data-theme="light"] .dt-size.active {
  color: #ffffff;
}

html[data-theme="light"] #mobile-tabs button.active {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

@media (max-width: 900px) {
    html[data-theme="light"] #mobile-tabs {
      box-shadow: var(--glass-hi), 0 18px 44px -22px rgba(14, 18, 26, 0.35);
    }
  
    html[data-theme="light"] #mobile-tabs button.active {
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
    }
}

/* --- addendum: dark-only properties neutralized for the light theme --- */
html[data-theme="light"] { color-scheme: light; }      /* dark :root sets color-scheme: dark */
html[data-theme="light"] .toast { border: none; }      /* dark toasts carry a #33363d border */