/* ===== Optional dark mode: main simulator shell only ===== */

.theme-toggle{
  border:1px solid rgba(255,255,255,0.28);
  background:rgba(255,255,255,0.14);
  color:#fff;
  border-radius:16px;
  cursor:pointer;
  font-weight:700;
  white-space:nowrap;
  box-shadow:none;
}

html[data-theme="dark"]{
  --bg:#070a0f;
  --card:#111827;
  --ink:#e5edf7;
  --muted:#94a3b8;
  --line:#263244;
  --soft:#15202d;
  --shadow:0 12px 32px rgba(0,0,0,0.34);
}

html[data-theme="dark"] body{
  background:#070a0f;
  color:var(--ink);
}

html[data-theme="dark"] .topbar{
  background:linear-gradient(90deg, #05070c, #0f172a);
  border-bottom:1px solid #1f2937;
}

html[data-theme="dark"] .theme-toggle{
  background:#f8fafc;
  color:#0f172a;
  border-color:#f8fafc;
}

html[data-theme="dark"] .subbar,
html[data-theme="dark"] .panel,
html[data-theme="dark"] #positionsPanel.panel,
html[data-theme="dark"] #positionsPanel .panel-title-row{
  background:#111827 !important;
  border-color:var(--line) !important;
  color:var(--ink) !important;
}

html[data-theme="dark"] .layout{
  background:#070a0f;
}

html[data-theme="dark"] .panel-title,
html[data-theme="dark"] .panel-title-row .panel-title,
html[data-theme="dark"] .center-chip,
html[data-theme="dark"] .sim-dt,
html[data-theme="dark"] #spotVal{
  color:var(--ink) !important;
}

html[data-theme="dark"] .panel-meta,
html[data-theme="dark"] .panel-title-row .panel-meta{
  color:var(--muted) !important;
}

html[data-theme="dark"] .chip,
html[data-theme="dark"] .seg-btn,
html[data-theme="dark"] .expiry-pill,
html[data-theme="dark"] .strategy-cat-btn,
html[data-theme="dark"] #positionsPanel .mini,
html[data-theme="dark"] #positionsPanel input[data-act="qty"]{
  background:#162033 !important;
  border-color:#2c3a4f !important;
  color:#dbe7f5 !important;
}

html[data-theme="dark"] .chip:hover,
html[data-theme="dark"] .seg-btn:hover,
html[data-theme="dark"] .expiry-pill:hover,
html[data-theme="dark"] .strategy-cat-btn:hover,
html[data-theme="dark"] #positionsPanel .mini:hover{
  background:#1f2a3d !important;
}

html[data-theme="dark"] #dateBtn.chip,
html[data-theme="dark"] .expiry-pill.active,
html[data-theme="dark"] .seg-btn.active,
html[data-theme="dark"] .strategy-cat-btn.active,
html[data-theme="dark"] .strategy-card.active-strategy{
  background:#12313a !important;
  border-color:#1f7a80 !important;
  color:#7dd3d8 !important;
}

html[data-theme="dark"] select,
html[data-theme="dark"] input,
html[data-theme="dark"] button{
  color:inherit;
}

html[data-theme="dark"] select,
html[data-theme="dark"] .top-controls select,
html[data-theme="dark"] .time-dd,
html[data-theme="dark"] #symbol,
html[data-theme="dark"] #expiry,
html[data-theme="dark"] #strikeWindow,
html[data-theme="dark"] #simHour,
html[data-theme="dark"] #simMin{
  background:#0b1220 !important;
  border-color:#263244 !important;
  color:#dbe7f5 !important;
  color-scheme:dark;
}

html[data-theme="dark"] select option,
html[data-theme="dark"] .top-controls select option,
html[data-theme="dark"] #symbol option,
html[data-theme="dark"] #expiry option,
html[data-theme="dark"] #strikeWindow option,
html[data-theme="dark"] #simHour option,
html[data-theme="dark"] #simMin option{
  background:#0b1220 !important;
  color:#dbe7f5 !important;
  color-scheme:dark;
}

html[data-theme="dark"] select:focus,
html[data-theme="dark"] .top-controls select:focus,
html[data-theme="dark"] .time-dd:focus,
html[data-theme="dark"] #symbol:focus,
html[data-theme="dark"] #expiry:focus,
html[data-theme="dark"] #strikeWindow:focus,
html[data-theme="dark"] #simHour:focus,
html[data-theme="dark"] #simMin:focus{
  border-color:#0f8b8d !important;
  box-shadow:0 0 0 2px rgba(20,184,166,.16) !important;
  outline:none !important;
}

html[data-theme="dark"] .option-chain-table-wrapper{
  background:#111827;
  border-color:var(--line);
  scrollbar-color:#334155 #0f172a;
}

html[data-theme="dark"] .chain{
  color:#dbe7f5;
}

html[data-theme="dark"] .chain th,
html[data-theme="dark"] .chain td,
html[data-theme="dark"] #positionsPanel #posTable th,
html[data-theme="dark"] #positionsPanel #posTable td{
  border-color:var(--line) !important;
  color:#dbe7f5;
}

html[data-theme="dark"] .chain thead th,
html[data-theme="dark"] .chain thead tr:first-child th,
html[data-theme="dark"] .chain thead tr:last-child th,
html[data-theme="dark"] .option-chain-table-wrapper thead th,
html[data-theme="dark"] .option-chain-table-wrapper thead tr:first-child th,
html[data-theme="dark"] .option-chain-table-wrapper thead tr:nth-child(2) th,
html[data-theme="dark"] #positionsPanel #posTable thead th{
  background:#0f172a !important;
  background-image:none !important;
  color:#b6c6d8 !important;
  box-shadow:inset 0 -1px 0 rgba(255,255,255,0.06) !important;
}

html[data-theme="dark"] .option-chain-table-wrapper thead::after,
html[data-theme="dark"] .option-chain-table-wrapper::before{
  background:#0f172a !important;
}

html[data-theme="dark"] #chainBody td[style*="#f6f4e8"],
html[data-theme="dark"] #chainBody td[style*="#f3f0e4"],
html[data-theme="dark"] #chainBody td[style*="rgb(246, 244, 232)"],
html[data-theme="dark"] #chainBody td[style*="rgb(243, 240, 228)"]{
  background:#102b3d !important;
}

html[data-theme="dark"] .atm-row td,
html[data-theme="dark"] #chainBody tr.atm-row:hover td,
html[data-theme="dark"] #chainBody tr.atm-row.bs-active td{
  background:#12364a !important;
}

html[data-theme="dark"] #chainBody tr:hover td,
html[data-theme="dark"] #chainBody tr.bs-active td{
  background:#17253b !important;
}

html[data-theme="dark"] .strategy-card{
  background:#121c2d !important;
  border-color:#2c3a4f !important;
  color:#dbe7f5 !important;
}

html[data-theme="dark"] .strategy-card:hover{
  border-color:#3f536e !important;
  box-shadow:0 4px 14px rgba(0,0,0,0.24);
}

html[data-theme="dark"] .strategy-card-title{
  color:#c7d5e6 !important;
}

html[data-theme="dark"] .strategy-card-mini{
  background:#0b1220 !important;
  border-color:#34445c !important;
}

html[data-theme="dark"] .payoff-metrics{
  color:#dbe7f5;
}

html[data-theme="dark"] .payoff-metrics span{
  color:#b6c6d8;
}

html[data-theme="dark"] .mini-pill,
html[data-theme="dark"] #posCount,
html[data-theme="dark"] #posPnl{
  background:#18243a !important;
  border-color:#34445c !important;
  color:#dbe7f5;
}

html[data-theme="dark"] .pos-totals-bar{
  background:#111827 !important;
  border-color:var(--line) !important;
  color:#dbe7f5 !important;
}

html[data-theme="dark"] .pos-totals-left{
  color:#dbe7f5 !important;
}

html[data-theme="dark"] .pos-net-pnl{
  background:rgba(15,23,42,.65) !important;
  box-shadow:inset 0 0 0 1px #263244;
  color:#dbe7f5;
}

html[data-theme="dark"] #positionsPanel #posTable td[style*="#16a34a"]{
  color:#4ade80 !important;
}

html[data-theme="dark"] #posPnl[data-pnl-sign="positive"],
html[data-theme="dark"] .pos-net-pnl[data-pnl-sign="positive"]{
  background:rgba(15,23,42,.65) !important;
  border-color:#263244 !important;
  color:#4ade80 !important;
  font-weight:700;
}

html[data-theme="dark"] #positionsPanel #posTable td[style*="#dc2626"]{
  color:#f87171 !important;
}

html[data-theme="dark"] #posPnl[data-pnl-sign="negative"],
html[data-theme="dark"] .pos-net-pnl[data-pnl-sign="negative"]{
  background:rgba(15,23,42,.65) !important;
  border-color:#263244 !important;
  color:#f87171 !important;
  font-weight:700;
}

html[data-theme="dark"] .user-btn,
html[data-theme="dark"] .user-badge{
  background:rgba(255,255,255,0.12);
  color:#fff;
}

html[data-theme="dark"] .user-avatar{
  background:#e5edf7;
  color:#0f172a;
}

html[data-theme="dark"] .user-dd{
  background:#111827;
  border:1px solid var(--line);
  box-shadow:0 10px 30px rgba(0,0,0,0.42);
}

html[data-theme="dark"] .user-dd-item{
  color:#dbe7f5;
}

html[data-theme="dark"] .user-dd-item:hover{
  background:#1f2a3d;
}

html[data-theme="dark"] #positionsPanel .mini.danger{
  background:#351a22 !important;
  border-color:#6b2935 !important;
  color:#fca5a5 !important;
}

html[data-theme="dark"] .bs-bubble,
html[data-theme="dark"] #bsBubble{
  background:#0f172a !important;
  border:1px solid #334155 !important;
  box-shadow:0 14px 34px rgba(0,0,0,0.48) !important;
  color:#e5edf7 !important;
}

html[data-theme="dark"] .bs-bubble-inner{
  color:#e5edf7 !important;
}

html[data-theme="dark"] .bs-title{
  color:#b6c6d8 !important;
}

html[data-theme="dark"] .bs-row button,
html[data-theme="dark"] #bsBuy,
html[data-theme="dark"] #bsSell{
  background:#162033 !important;
  border:1px solid #3a4a61 !important;
  color:#dbe7f5 !important;
  border-radius:10px;
}

html[data-theme="dark"] .bs-row button:hover,
html[data-theme="dark"] #bsBuy:hover,
html[data-theme="dark"] #bsSell:hover{
  background:#1f2a3d !important;
}

html[data-theme="dark"] #bsBuy{
  color:#4ade80 !important;
  border-color:#256d46 !important;
}

html[data-theme="dark"] #bsSell{
  color:#f87171 !important;
  border-color:#7f3030 !important;
}

html[data-theme="dark"] #positionsPanel td:nth-last-child(2),
html[data-theme="dark"] #positionsPanel td:last-child{
  background:#111827 !important;
}

html[data-theme="dark"] #positionsPanel td:nth-last-child(2) .mini,
html[data-theme="dark"] #positionsPanel td:last-child .mini{
  background:#162033 !important;
  border-color:#34445c !important;
  color:#dbe7f5 !important;
}

html[data-theme="dark"] #positionsPanel td:nth-last-child(2) .mini:hover,
html[data-theme="dark"] #positionsPanel td:last-child .mini:hover{
  background:#223047 !important;
}

html[data-theme="dark"] #positionsPanel td:nth-last-child(2) .mini:disabled,
html[data-theme="dark"] #positionsPanel td:last-child .mini:disabled{
  background:#111827 !important;
  border-color:#263244 !important;
  color:#64748b !important;
}

html[data-theme="dark"] .expiry-strip{
  scrollbar-color:#334155 #0f172a;
}

html[data-theme="dark"] .expiry-strip::-webkit-scrollbar,
html[data-theme="dark"] .option-chain-table-wrapper::-webkit-scrollbar{
  width:10px;
  height:8px;
}

html[data-theme="dark"] .expiry-strip::-webkit-scrollbar-track,
html[data-theme="dark"] .option-chain-table-wrapper::-webkit-scrollbar-track{
  background:#0f172a;
  border-radius:999px;
}

html[data-theme="dark"] .expiry-strip::-webkit-scrollbar-thumb,
html[data-theme="dark"] .option-chain-table-wrapper::-webkit-scrollbar-thumb{
  background:#334155;
  border:2px solid #0f172a;
  border-radius:999px;
}

html[data-theme="dark"] .expiry-strip::-webkit-scrollbar-thumb:hover,
html[data-theme="dark"] .option-chain-table-wrapper::-webkit-scrollbar-thumb:hover{
  background:#475569;
}

html[data-theme="dark"] #datePicker.datepicker,
html[data-theme="dark"] .ui-datepicker{
  background:#0f172a !important;
  border:1px solid #34445c !important;
  box-shadow:0 18px 42px rgba(0,0,0,.38) !important;
  color:#dbe7f5 !important;
}

html[data-theme="dark"] #datePicker .dp-head,
html[data-theme="dark"] .ui-datepicker .ui-datepicker-header{
  background:#111827 !important;
  border:1px solid #263244 !important;
  color:#dbe7f5 !important;
}

html[data-theme="dark"] #datePicker .dp-title,
html[data-theme="dark"] .ui-datepicker .ui-datepicker-title{
  color:#dbe7f5 !important;
}

html[data-theme="dark"] #datePicker .dp-nav button,
html[data-theme="dark"] #datePicker .dp-title button,
html[data-theme="dark"] .ui-datepicker .ui-datepicker-prev,
html[data-theme="dark"] .ui-datepicker .ui-datepicker-next,
html[data-theme="dark"] .ui-datepicker select{
  background:#162033 !important;
  border-color:#34445c !important;
  color:#dbe7f5 !important;
}

html[data-theme="dark"] .ui-datepicker .ui-icon{
  filter:invert(1) opacity(.75);
}

html[data-theme="dark"] #datePicker .dp-week,
html[data-theme="dark"] #datePicker .dow,
html[data-theme="dark"] #datePicker .weekday,
html[data-theme="dark"] .datepicker thead th,
html[data-theme="dark"] .ui-datepicker th{
  color:#94a3b8 !important;
  opacity:1 !important;
}

html[data-theme="dark"] #datePicker .dp-cell,
html[data-theme="dark"] .datepicker td button,
html[data-theme="dark"] .datepicker td a,
html[data-theme="dark"] .datepicker td div,
html[data-theme="dark"] .ui-datepicker .ui-state-default{
  background:#111827 !important;
  border-color:transparent !important;
  color:#dbe7f5 !important;
}

html[data-theme="dark"] #datePicker .dp-cell:hover,
html[data-theme="dark"] .datepicker td button:hover,
html[data-theme="dark"] .datepicker td a:hover,
html[data-theme="dark"] .datepicker td div:hover,
html[data-theme="dark"] .ui-datepicker .ui-state-hover{
  background:rgba(20,184,166,.16) !important;
  border-color:#0f8b8d !important;
  color:#f8fafc !important;
}

html[data-theme="dark"] #datePicker .dp-cell.sel,
html[data-theme="dark"] .datepicker .selected,
html[data-theme="dark"] .datepicker .active,
html[data-theme="dark"] .datepicker .is-selected,
html[data-theme="dark"] .ui-datepicker .ui-state-active{
  background:#0f8b8d !important;
  border-color:#22d3ee !important;
  box-shadow:0 0 0 1px rgba(34,211,238,.35) !important;
  color:#fff !important;
  outline:none !important;
}

html[data-theme="dark"] #datePicker .dp-cell.muted,
html[data-theme="dark"] .datepicker .muted,
html[data-theme="dark"] .datepicker .disabled,
html[data-theme="dark"] .datepicker .off,
html[data-theme="dark"] .ui-datepicker .ui-state-disabled .ui-state-default,
html[data-theme="dark"] .ui-datepicker .ui-priority-secondary{
  background:#0b1220 !important;
  color:#64748b !important;
  opacity:.6 !important;
}

/* ===== Public auth/login page dark mode ===== */
html[data-theme="dark"] #profilePanel:not(.hidden-panel){
  background:#070a0f !important;
  color:var(--ink) !important;
}

html[data-theme="dark"] #profilePanel:not(.hidden-panel) .profile-shell{
  color:var(--ink) !important;
}

html[data-theme="dark"] #profilePanel:not(.hidden-panel) .profile-card,
html[data-theme="dark"] #profilePanel:not(.hidden-panel) .auth-info-box,
html[data-theme="dark"] #profilePanel:not(.hidden-panel) .auth-info-card{
  background:#111827 !important;
  border:1px solid #263244 !important;
  box-shadow:0 18px 44px rgba(0,0,0,.36) !important;
  color:var(--ink) !important;
}

html[data-theme="dark"] #profilePanel:not(.hidden-panel) .profile-card{
  border-top-color:#0f8b8d !important;
}

html[data-theme="dark"] #profilePanel:not(.hidden-panel) .profile-title,
html[data-theme="dark"] #profilePanel:not(.hidden-panel) .auth-info-title{
  color:#e5edf7 !important;
}

html[data-theme="dark"] #profilePanel:not(.hidden-panel) .profile-label,
html[data-theme="dark"] #profilePanel:not(.hidden-panel) .auth-info-text,
html[data-theme="dark"] #profilePanel:not(.hidden-panel) .auth-info-card-text{
  color:#cbd5e1 !important;
}

html[data-theme="dark"] #profilePanel:not(.hidden-panel) .auth-info-line,
html[data-theme="dark"] #profilePanel:not(.hidden-panel) .auth-info-card-title,
html[data-theme="dark"] #profilePanel:not(.hidden-panel) #toggleLoginPassword,
html[data-theme="dark"] #profilePanel:not(.hidden-panel) #toggleProfilePassword,
html[data-theme="dark"] #profilePanel:not(.hidden-panel) #toggleProfileConfirmPassword{
  color:#5eead4 !important;
}

html[data-theme="dark"] #profilePanel:not(.hidden-panel) .auth-info-chip{
  background:rgba(20,184,166,.14) !important;
  border:1px solid rgba(45,212,191,.34) !important;
  color:#67e8f9 !important;
}

html[data-theme="dark"] #profilePanel:not(.hidden-panel) .profile-row input{
  background:#0b1220 !important;
  border-color:#34445c !important;
  color:#e5edf7 !important;
}

html[data-theme="dark"] #profilePanel:not(.hidden-panel) .profile-row input::placeholder{
  color:#64748b !important;
}

html[data-theme="dark"] #profilePanel:not(.hidden-panel) .profile-row input:focus{
  border-color:#22d3ee !important;
  box-shadow:0 0 0 3px rgba(34,211,238,.14) !important;
}

html[data-theme="dark"] #profilePanel:not(.hidden-panel) .auth-switch{
  background:#0b1220 !important;
  border-color:#0f8b8d !important;
}

html[data-theme="dark"] #profilePanel:not(.hidden-panel) .auth-tab{
  background:#0b1220 !important;
  color:#cbd5e1 !important;
}

html[data-theme="dark"] #profilePanel:not(.hidden-panel) .auth-tab.active{
  background:#0f8b8d !important;
  color:#fff !important;
}

html[data-theme="dark"] #profilePanel:not(.hidden-panel) .auth-info-terms-btn,
html[data-theme="dark"] #profilePanel:not(.hidden-panel) #closeProfileBtn,
html[data-theme="dark"] #profilePanel:not(.hidden-panel) .mini,
html[data-theme="dark"] #profilePanel:not(.hidden-panel) #verifyOtpBtn{
  background:#162033 !important;
  border-color:#34445c !important;
  color:#dbe7f5 !important;
}

html[data-theme="dark"] #profilePanel:not(.hidden-panel) .auth-info-terms-btn:hover,
html[data-theme="dark"] #profilePanel:not(.hidden-panel) #closeProfileBtn:hover,
html[data-theme="dark"] #profilePanel:not(.hidden-panel) .mini:hover,
html[data-theme="dark"] #profilePanel:not(.hidden-panel) #verifyOtpBtn:hover{
  background:#223047 !important;
  border-color:#0f8b8d !important;
}

html[data-theme="dark"] #profilePanel:not(.hidden-panel) #loginSubmitBtn,
html[data-theme="dark"] #profilePanel:not(.hidden-panel) #saveProfileBtn{
  background:#0f8b8d !important;
  border-color:#0f8b8d !important;
  color:#fff !important;
}

html[data-theme="dark"] #profilePanel:not(.hidden-panel) .error-msg,
html[data-theme="dark"] #profilePanel:not(.hidden-panel) [id$="Error"]{
  color:#fca5a5 !important;
}

html[data-theme="dark"] #profilePanel:not(.hidden-panel) .success-msg,
html[data-theme="dark"] #profilePanel:not(.hidden-panel) #signupStatusMsg,
html[data-theme="dark"] #profilePanel:not(.hidden-panel) #otpSuccessMsg,
html[data-theme="dark"] #profilePanel:not(.hidden-panel) #profileSuccessMsg{
  color:#5eead4 !important;
}

/* ===== Logged-in Home page dark mode ===== */
html[data-theme="dark"] body{
  background:#070a0f !important;
  color:var(--ink) !important;
}

html[data-theme="dark"] .home-shell,
html[data-theme="dark"] .home-hero-card{
  color:var(--ink) !important;
}

html[data-theme="dark"] .home-hero-card,
html[data-theme="dark"] .home-feature-card{
  background:#111827 !important;
  border:1px solid #263244 !important;
  box-shadow:0 18px 44px rgba(0,0,0,.34) !important;
}

html[data-theme="dark"] .home-hero-card h1{
  color:#e5edf7 !important;
}

html[data-theme="dark"] .home-copy,
html[data-theme="dark"] .home-feature-text{
  color:#cbd5e1 !important;
}

html[data-theme="dark"] .home-trust-line,
html[data-theme="dark"] .home-feature-title{
  color:#5eead4 !important;
}

html[data-theme="dark"] .home-chip{
  background:rgba(20,184,166,.14) !important;
  border:1px solid rgba(45,212,191,.34) !important;
  color:#67e8f9 !important;
}

html[data-theme="dark"] .home-muted-chip{
  background:#162033 !important;
  border:1px solid #34445c !important;
  color:#cbd5e1 !important;
}

html[data-theme="dark"] .home-terms-btn{
  background:#162033 !important;
  border-color:#34445c !important;
  color:#dbe7f5 !important;
}

html[data-theme="dark"] .home-terms-btn:hover{
  background:#223047 !important;
  border-color:#0f8b8d !important;
}

html[data-theme="dark"] .home-notice{
  background:#0b1220 !important;
  border-color:#263244 !important;
  box-shadow:0 12px 30px rgba(0,0,0,.28) !important;
  color:#cbd5e1 !important;
}

html[data-theme="dark"] .home-footer{
  background:#070a0f !important;
  border-color:#263244 !important;
  color:#94a3b8 !important;
}

html[data-theme="dark"] .home-footer a{
  color:#5eead4 !important;
}