/* ORAX V144 — palette/mode isolation
   Rule: brand palette colors UI chrome; semantic market/account states keep their own colors.
   Light/dark mode owns neutral surfaces independently from the selected brand palette. */

:root{
  --semantic-success:#10b981;
  --semantic-success-strong:#00c878;
  --semantic-danger:#ef4444;
  --semantic-warning:#f59e0b;
  --trade-up:#22c55e;
  --trade-down:#ef4444;
}

/* ======================================================================
   TRUE LIGHT MODE — do not reuse dark preset neutrals.
   ====================================================================== */
body.theme-light-mode,
body.lzx-auth-page[data-auth-theme="light"]{
  --brand-bg:#f4f7fb!important;
  --brand-surface:#ffffff!important;
  --brand-border:#d8e1ec!important;
  --brand-text:#0f172a!important;
  --brand-muted:#64748b!important;
  color-scheme:light;
}

/* AUTH: true white/light shell. Accent remains selected White-label palette. */
body.lzx-auth-page.lzx-auth-compact-page[data-auth-theme="light"],
body.lzx-auth-page.lzx-auth-compact-page.theme-light-mode{
  background:
    radial-gradient(circle at 50% 22%,color-mix(in srgb,var(--brand-primary) 10%,transparent),transparent 29rem),
    linear-gradient(180deg,#f8fbff,#eef3f9)!important;
  color:var(--brand-text)!important;
}
body.lzx-auth-page.lzx-auth-compact-page[data-auth-theme="light"]::before,
body.lzx-auth-page.lzx-auth-compact-page.theme-light-mode::before{
  opacity:.38!important;
  background:
    linear-gradient(90deg,rgba(88,105,128,.08) 1px,transparent 1px),
    linear-gradient(180deg,rgba(88,105,128,.07) 1px,transparent 1px)!important;
}
body.lzx-auth-page.lzx-auth-compact-page[data-auth-theme="light"] .lzx-min-nav,
body.lzx-auth-page.lzx-auth-compact-page.theme-light-mode .lzx-min-nav{
  background:rgba(255,255,255,.92)!important;
  border-color:#dbe4ee!important;
  box-shadow:0 8px 26px rgba(15,23,42,.04)!important;
}
body.lzx-auth-page.lzx-auth-compact-page[data-auth-theme="light"] .lzx-auth-card.lzx-auth-card-min.lzx-auth-compact-card,
body.lzx-auth-page.lzx-auth-compact-page.theme-light-mode .lzx-auth-card.lzx-auth-card-min.lzx-auth-compact-card,
body.lzx-auth-page.lzx-auth-compact-page[data-auth-theme="light"].lzx-register-page .lzx-auth-card,
body.lzx-auth-page.lzx-auth-compact-page.theme-light-mode.lzx-register-page .lzx-auth-card{
  background:#ffffff!important;
  color:#0f172a!important;
  border-color:color-mix(in srgb,var(--brand-primary) 22%,#d8e1ec)!important;
  box-shadow:0 24px 62px rgba(15,23,42,.12),0 0 46px color-mix(in srgb,var(--brand-primary) 8%,transparent)!important;
}
body.lzx-auth-page.lzx-auth-compact-page[data-auth-theme="light"] .lzx-auth-card h1,
body.lzx-auth-page.lzx-auth-compact-page[data-auth-theme="light"] .lzx-auth-card h2,
body.lzx-auth-page.lzx-auth-compact-page.theme-light-mode .lzx-auth-card h1,
body.lzx-auth-page.lzx-auth-compact-page.theme-light-mode .lzx-auth-card h2{
  color:#111827!important;
}
body.lzx-auth-page.lzx-auth-compact-page[data-auth-theme="light"] .lzx-auth-card p,
body.lzx-auth-page.lzx-auth-compact-page[data-auth-theme="light"] .lzx-auth-links,
body.lzx-auth-page.lzx-auth-compact-page.theme-light-mode .lzx-auth-card p,
body.lzx-auth-page.lzx-auth-compact-page.theme-light-mode .lzx-auth-links{
  color:#64748b!important;
}
body.lzx-auth-page.lzx-auth-compact-page[data-auth-theme="light"] .lzx-auth-field,
body.lzx-auth-page.lzx-auth-compact-page.theme-light-mode .lzx-auth-field,
body.lzx-auth-page.lzx-auth-compact-page[data-auth-theme="light"] .lzx-currency-choice label,
body.lzx-auth-page.lzx-auth-compact-page.theme-light-mode .lzx-currency-choice label{
  background:#f8fafc!important;
  color:#0f172a!important;
  border-color:#d8e1ec!important;
  box-shadow:none!important;
}
body.lzx-auth-page.lzx-auth-compact-page[data-auth-theme="light"] .lzx-auth-field:focus-within,
body.lzx-auth-page.lzx-auth-compact-page.theme-light-mode .lzx-auth-field:focus-within,
body.lzx-auth-page.lzx-auth-compact-page[data-auth-theme="light"] .lzx-currency-choice label:has(input:checked),
body.lzx-auth-page.lzx-auth-compact-page.theme-light-mode .lzx-currency-choice label:has(input:checked){
  background:#fff!important;
  border-color:var(--brand-primary)!important;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--brand-primary) 13%,transparent)!important;
}
body.lzx-auth-page.lzx-auth-compact-page[data-auth-theme="light"] .lzx-auth-field input,
body.lzx-auth-page.lzx-auth-compact-page[data-auth-theme="light"] .lzx-auth-field select,
body.lzx-auth-page.lzx-auth-compact-page.theme-light-mode .lzx-auth-field input,
body.lzx-auth-page.lzx-auth-compact-page.theme-light-mode .lzx-auth-field select{
  color:#0f172a!important;background:transparent!important;
}
body.lzx-auth-page.lzx-auth-compact-page[data-auth-theme="light"] .lzx-auth-field input::placeholder,
body.lzx-auth-page.lzx-auth-compact-page.theme-light-mode .lzx-auth-field input::placeholder{color:#94a3b8!important}
body.lzx-auth-page.lzx-auth-compact-page[data-auth-theme="light"] .lzx-auth-field .material-symbols-outlined,
body.lzx-auth-page.lzx-auth-compact-page.theme-light-mode .lzx-auth-field .material-symbols-outlined{color:#64748b!important}
body.lzx-auth-page.lzx-auth-compact-page[data-auth-theme="light"] .lzx-auth-theme-toggle,
body.lzx-auth-page.lzx-auth-compact-page[data-auth-theme="light"] .lzx-auth-nav-actions a,
body.lzx-auth-page.lzx-auth-compact-page.theme-light-mode .lzx-auth-theme-toggle,
body.lzx-auth-page.lzx-auth-compact-page.theme-light-mode .lzx-auth-nav-actions a{
  background:#fff!important;color:#172033!important;border-color:#d8e1ec!important;
}

/* ======================================================================
   ACCOUNT PAGES — theme chrome uses brand; money/status semantics do not.
   ====================================================================== */
body.lzx-account-body:not(.theme-light-mode) .lzx-account-sidebar>a.active,
body.lzx-account-body:not(.theme-light-mode) .lzx-account-sidebar>a:hover{
  background:color-mix(in srgb,var(--brand-primary) 15%,transparent)!important;
  color:color-mix(in srgb,var(--brand-primary) 78%,#fff)!important;
}
body.lzx-account-body:not(.theme-light-mode) .lzx-account-content{
  background:radial-gradient(circle at 50% -10%,color-mix(in srgb,var(--brand-primary) 8%,transparent),transparent 40%),var(--brand-bg)!important;
}
body.lzx-account-body:not(.theme-light-mode) .lzx-summary-grid article>.material-symbols-outlined,
body.lzx-account-body:not(.theme-light-mode) .lzx-deposit-info>div>.material-symbols-outlined:not(.warning),
body.lzx-account-body:not(.theme-light-mode) .wallet-nav-chip .material-symbols-outlined{
  background:color-mix(in srgb,var(--brand-primary) 12%,#fff)!important;
  color:var(--brand-primary)!important;
}
body.lzx-account-body.wallet-real .lzx-account-topbar .deposit-btn,
body.lzx-account-body:not(.wallet-demo) .lzx-account-topbar .deposit-btn{
  border-color:color-mix(in srgb,var(--brand-primary) 72%,#fff)!important;
  color:var(--brand-primary)!important;
  background:transparent!important;
}
body.lzx-account-body.wallet-real .lzx-account-topbar .deposit-btn:hover,
body.lzx-account-body:not(.wallet-demo) .lzx-account-topbar .deposit-btn:hover{
  background:linear-gradient(135deg,var(--brand-primary),var(--brand-secondary))!important;
  color:#fff!important;border-color:transparent!important;
}
body.lzx-account-body .lzx-method.active,
body.lzx-account-body .pay-card.active,
body.lzx-account-body .deposit-flow-back:hover,
body.lzx-account-body .lzx-outline-btn:hover,
body.lzx-account-body .lzx-text-btn:hover{
  border-color:color-mix(in srgb,var(--brand-primary) 55%,var(--brand-border))!important;
  box-shadow:0 0 0 2px color-mix(in srgb,var(--brand-primary) 10%,transparent)!important;
}
body.lzx-account-body .lzx-method.active,
body.lzx-account-body .pay-card.active{
  background:color-mix(in srgb,var(--brand-primary) 9%,var(--brand-surface))!important;
}
/* account balances remain semantic: real green / demo amber */
body.lzx-account-body.wallet-real .lzx-account-balance strong,
body.lzx-account-body.wallet-real .lzx-summary-grid article [data-current-balance]{color:#24b66f!important;-webkit-text-fill-color:#24b66f!important}
body.lzx-account-body.wallet-demo .lzx-account-balance strong,
body.lzx-account-body.wallet-demo .lzx-summary-grid article [data-current-balance]{color:#f39a24!important;-webkit-text-fill-color:#f39a24!important}

/* true light account pages */
body.lzx-account-body.theme-light-mode{
  background:#f4f7fb!important;color:#0f172a!important;
}
body.lzx-account-body.theme-light-mode .lzx-account-content{background:#f4f7fb!important}
body.lzx-account-body.theme-light-mode .topbar,
body.lzx-account-body.theme-light-mode .lzx-account-sidebar,
body.lzx-account-body.theme-light-mode .lzx-account-card,
body.lzx-account-body.theme-light-mode .lzx-profile-main-card,
body.lzx-account-body.theme-light-mode .lzx-profile-kpis article,
body.lzx-account-body.theme-light-mode .lzx-summary-grid article,
body.lzx-account-body.theme-light-mode .wallet-box{
  background:#fff!important;color:#0f172a!important;border-color:#dde5ee!important;
}
body.lzx-account-body.theme-light-mode .lzx-account-sidebar>a.active,
body.lzx-account-body.theme-light-mode .lzx-account-sidebar>a:hover{
  background:color-mix(in srgb,var(--brand-primary) 10%,#fff)!important;
  color:var(--brand-primary)!important;
}
body.lzx-account-body.theme-light-mode .lzx-account-title h1,
body.lzx-account-body.theme-light-mode .lzx-card-head h2,
body.lzx-account-body.theme-light-mode .lzx-account-table td,
body.lzx-account-body.theme-light-mode .lzx-method,
body.lzx-account-body.theme-light-mode .pay-card{color:#172033!important}
body.lzx-account-body.theme-light-mode .lzx-account-title p,
body.lzx-account-body.theme-light-mode .lzx-card-head p,
body.lzx-account-body.theme-light-mode .lzx-summary-grid small,
body.lzx-account-body.theme-light-mode .lzx-summary-grid em{color:#64748b!important}

/* ======================================================================
   TRADEROOM — undo the V143 global --green recolor.
   --green is semantic again. UI chrome is explicitly branded below.
   ====================================================================== */
body:has(#app){
  --green:#00cc99!important;
  --green2:#51a85d!important;
  --accent:var(--brand-primary)!important;
  --brand-accent:var(--brand-primary)!important;
}

/* BRAND/UI states */
body:has(#app) .tabs .tab.active,
body:has(#app) .tab.active,
body:has(#app) .chart-head button.active,
body:has(#app) .tf-btn.active,
body:has(#app) .expiry-btn.active{
  color:var(--brand-primary)!important;
  border-color:color-mix(in srgb,var(--brand-primary) 48%,var(--brand-border))!important;
  box-shadow:inset 0 -2px 0 var(--brand-primary)!important;
}
body:has(#app) .modern-menu a.active,
body:has(#app) .modern-menu a:hover{
  background:color-mix(in srgb,var(--brand-primary) 11%,transparent)!important;
  color:var(--brand-text)!important;
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--brand-primary) 13%,transparent)!important;
}
body:has(#app) .modern-menu a.active>.material-symbols-outlined,
body:has(#app) .modern-menu a:hover>.material-symbols-outlined,
body:has(#app) .modern-menu a.active span,
body:has(#app) .modern-menu a:hover span{color:var(--brand-primary)!important}
body:has(#app) .modern-menu a.active:before{background:linear-gradient(180deg,var(--brand-primary),var(--brand-secondary))!important}

body:has(#app) .trade-mode-switch button.active,
body:has(#app) .trade-mode-switch button:hover{
  background:color-mix(in srgb,var(--brand-primary) 12%,#0b0f11)!important;
  color:color-mix(in srgb,var(--brand-primary) 74%,#fff)!important;
  border:1px solid color-mix(in srgb,var(--brand-primary) 42%,transparent)!important;
  box-shadow:none!important;
}
body:has(#app) .balance-privacy-btn:hover,
body:has(#app) .trader-theme-toggle:hover,
body:has(#app) .top-notification-btn:hover,
body:has(#app) .add-asset-tab:hover,
body:has(#app) .chart-nav-controls button:hover,
body:has(#app) .bottom-chart-tools button:hover,
body:has(#app) .tools button:hover,
body:has(#app) .tools button.active{
  color:var(--brand-primary)!important;
  border-color:color-mix(in srgb,var(--brand-primary) 42%,var(--brand-border))!important;
  background:color-mix(in srgb,var(--brand-primary) 9%,var(--brand-surface))!important;
}
body:has(#app) .topbar .deposit-btn,
body:has(#app) .balance-area .deposit-btn,
body:has(#app) a[href="/deposit"] .deposit-btn,
body:has(#app) a[href="/deposit"].top-deposit-btn{
  color:#fff!important;
  background:linear-gradient(135deg,var(--brand-primary),var(--brand-secondary))!important;
  border-color:transparent!important;
}

/* Symbol modal: selection/hover = brand. Online dots/payout = semantic green. */
body:has(#app) #symbolModal .symbol-cats button.active,
body:has(#app) #symbolModal .symbol-cats button:hover{
  background:color-mix(in srgb,var(--brand-primary) 12%,transparent)!important;
  border-color:color-mix(in srgb,var(--brand-primary) 30%,transparent)!important;
  color:#f6fbff!important;
}
body:has(#app) #symbolModal .symbol-cats button.active span,
body:has(#app) #symbolModal .symbol-cats button:hover span{color:var(--brand-primary)!important}
body:has(#app) #symbolModal .symbol-cats button.active::before{background:var(--brand-primary)!important}
body:has(#app) #symbolModal .symbol-card-pro:hover{
  background:color-mix(in srgb,var(--brand-primary) 8%,rgba(255,255,255,.035))!important;
  border-color:color-mix(in srgb,var(--brand-primary) 30%,transparent)!important;
  box-shadow:0 12px 30px color-mix(in srgb,var(--brand-primary) 9%,transparent)!important;
}
body:has(#app) #symbolCountBadge{
  background:color-mix(in srgb,var(--brand-primary) 10%,transparent)!important;
  border-color:color-mix(in srgb,var(--brand-primary) 24%,transparent)!important;
  color:color-mix(in srgb,var(--brand-primary) 74%,#fff)!important;
}
/* keep availability/payout/market meaning green */
body:has(#app) #symbolModal .symbol-cats button.has-assets .cat-dot{background:#48f4b8!important;box-shadow:0 0 12px rgba(72,244,184,.9)!important}
body:has(#app) #symbolModal .symbol-card-pro .pay,
body:has(#app) #symbolModal .real-chip{color:#48f4b8!important}
body:has(#app) #symbolModal .real-chip{background:rgba(72,244,184,.10)!important;border-color:rgba(72,244,184,.30)!important}

/* SEMANTIC states: never palette-recolor these. */
body:has(#app) .premium-rightbar .premium-trade-btn.buy,
body:has(#app) .main-trade-btn.buy,
body:has(#app) #mainBuyBtn{background:linear-gradient(180deg,#22c55e,#16a34a)!important;color:#fff!important}
body:has(#app) .premium-rightbar .premium-trade-btn.sell,
body:has(#app) .main-trade-btn.sell,
body:has(#app) #mainSellBtn{background:linear-gradient(180deg,#ef4444,#dc2626)!important;color:#fff!important}
body:has(#app) .premium-rightbar .premium-profit strong,
body:has(#app) .premium-rightbar .premium-profit b,
body:has(#app) #payoutPercent,
body:has(#app) #profitAmount,
body:has(#app) .win,
body:has(#app) .rank-profit b,
body:has(#app) .copy-detail-profit b{color:#22c55e!important}
body:has(#app) .loss{color:#ef4444!important}
body:has(#app) .order-card.win{border-left-color:#22c55e!important}
body:has(#app) .order-card.loss{border-left-color:#ef4444!important}
body:has(#app).wallet-real [data-current-balance],
body.wallet-real:has(#app) [data-current-balance]{color:#00a67a!important}
body:has(#app).wallet-demo [data-current-balance],
body.wallet-demo:has(#app) [data-current-balance]{color:#f29a19!important}
/* live market current-price tag stays market green, not brand purple */
body:has(#app) .current-price-floating{background:#00cc99!important;color:#001812!important}
body:has(#app) .current-price-floating span{color:#002117!important}

/* true light traderoom — accent remains brand, market semantics remain green/red */
body.theme-light-mode:has(#app) .trade-mode-switch button.active,
body.theme-light-mode:has(#app) .trade-mode-switch button:hover{
  background:color-mix(in srgb,var(--brand-primary) 9%,#fff)!important;
  color:var(--brand-primary)!important;
  border-color:color-mix(in srgb,var(--brand-primary) 32%,#d8e1ec)!important;
}
body.theme-light-mode:has(#app) #symbolModal .symbol-cats button.active,
body.theme-light-mode:has(#app) #symbolModal .symbol-cats button:hover{
  color:#172033!important;
  background:color-mix(in srgb,var(--brand-primary) 9%,#fff)!important;
}
body.theme-light-mode:has(#app) #symbolCountBadge{color:var(--brand-primary)!important}

/* ======================================================================
   ADMIN LIGHT — neutral surfaces are actually light, accent stays palette.
   ====================================================================== */
body.admin-shell.theme-light-mode{
  background:#f4f7fb!important;color:#0f172a!important;
}
body.admin-shell.theme-light-mode::before{background:radial-gradient(circle at 20% 18%,color-mix(in srgb,var(--brand-primary) 7%,transparent),transparent 42%),radial-gradient(circle at 82% 76%,color-mix(in srgb,var(--brand-secondary) 6%,transparent),transparent 42%)!important}
body.admin-shell.theme-light-mode .sidebar,
body.admin-shell.theme-light-mode .page-header,
body.admin-shell.theme-light-mode .admin-card,
body.admin-shell.theme-light-mode .admin-panel,
body.admin-shell.theme-light-mode .table-container,
body.admin-shell.theme-light-mode .chart-card,
body.admin-shell.theme-light-mode .finance-panel,
body.admin-shell.theme-light-mode .stat-card,
body.admin-shell.theme-light-mode .metric-card,
body.admin-shell.theme-light-mode .finance-kpi-card,
body.admin-shell.theme-light-mode .quick-actions,
body.admin-shell.theme-light-mode .quick-actions-card,
body.admin-shell.theme-light-mode .wallet-card,
body.admin-shell.theme-light-mode .wl-card,
body.admin-shell.theme-light-mode .wl-hero{
  background:#fff!important;color:#0f172a!important;border-color:#dde5ee!important;box-shadow:0 8px 28px rgba(15,23,42,.045)!important;
}
body.admin-shell.theme-light-mode .stat-card b,
body.admin-shell.theme-light-mode .stat-value,
body.admin-shell.theme-light-mode .finance-kpi-card b,
body.admin-shell.theme-light-mode .metric-card b,
body.admin-shell.theme-light-mode h1,
body.admin-shell.theme-light-mode h2,
body.admin-shell.theme-light-mode h3{color:#111827!important;-webkit-text-fill-color:initial!important}
body.admin-shell.theme-light-mode .stat-label,
body.admin-shell.theme-light-mode .stat-change,
body.admin-shell.theme-light-mode .finance-kpi-card small,
body.admin-shell.theme-light-mode .finance-kpi-card em,
body.admin-shell.theme-light-mode .metric-card small,
body.admin-shell.theme-light-mode .metric-card span{color:#64748b!important}
/* Admin page heading is brand chrome, not neutral content. */
body.admin-shell.theme-light-mode .page-title h1{
  background:linear-gradient(135deg,var(--brand-primary),var(--brand-secondary))!important;
  -webkit-background-clip:text!important;background-clip:text!important;
  -webkit-text-fill-color:transparent!important;color:transparent!important;
}