:root {
    --md-sys-color-primary: #818cf8;
    --md-sys-color-on-primary: #ffffff;
    --md-sys-color-primary-container: #3730a3;
    --md-sys-color-surface: #111827; /* Darker Background */
    --md-sys-color-surface-variant: #1f2937; /* Lighter Containers */
    --md-sys-color-on-surface: #ffffff; /* White Text */
    --md-sys-color-on-surface-variant: #9ca3af; /* Gray secondary text */
    --md-sys-color-outline: #374151;
    --md-sys-color-error: #f87171;
    --md-sys-color-warning: #fbbf24;
    --md-sys-color-success: #4ade80;
    --md-sys-color-info: #60a5fa;
    --md-sys-color-shadow: rgba(0, 0, 0, 0.4);
    --md-sys-elevation-level-1: 0 1px 3px 0 var(--md-sys-color-shadow), 0 1px 2px -1px var(--md-sys-color-shadow);
    --md-sys-elevation-level-2: 0 4px 6px -1px var(--md-sys-color-shadow), 0 2px 4px -2px var(--md-sys-color-shadow);
}
body { 
    font-family: 'Roboto', sans-serif; 
    background-color: var(--md-sys-color-surface); 
    color: var(--md-sys-color-on-surface); /* Default text color is white */
}
#mainAppSection, #loginSection { 
    background-color: var(--md-sys-color-surface-variant); 
    border-radius: 1.5rem; 
    box-shadow: var(--md-sys-elevation-level-2); 
    color: var(--md-sys-color-on-surface); /* Force white text in containers */
}
/* Force all child elements to inherit the container's white text color */
#mainAppSection *, #loginSection * {
    color: inherit;
}

h1,h2,h3,h4,h5,h6 { color: var(--md-sys-color-on-surface); }
button, .button { border-radius: 9999px; font-weight: 500; padding: 0.625rem 1.5rem; transition: all 0.2s ease-in-out; text-transform: uppercase; letter-spacing: 0.05em; box-shadow: var(--md-sys-elevation-level-1); }
button:hover, .button:hover { box-shadow: var(--md-sys-elevation-level-2); transform: translateY(-1px); }
button:disabled { opacity: 0.7; cursor: not-allowed; box-shadow: none; transform: none; }
#loginShoonyaBtn, #fetchAISignalBtn { background-color: var(--md-sys-color-primary); color: #1e1b4b; }
#loginShoonyaBtn:hover, #fetchAISignalBtn:hover { background-color: #a5b4fc; }
#manualBuyBtn { background-color: var(--md-sys-color-success); color: #052e16; }
#manualSellBtn { background-color: var(--md-sys-color-error); color: #450a0a; }
#logoutBtn { background-color: var(--md-sys-color-error); color: #450a0a; }
input, select { border-radius: 0.5rem; border: 1px solid var(--md-sys-color-outline); background-color: var(--md-sys-color-surface); transition: all 0.2s; color: var(--md-sys-color-on-surface); }
input:focus, select:focus { outline: none; border-color: var(--md-sys-color-primary); box-shadow: 0 0 0 3px var(--md-sys-color-primary-container); }
.status-box, .p-4.bg-white.rounded-lg.border, .p-2.grid.bg-white.rounded-lg, .p-4.bg-gray-50.rounded-lg.border { 
    background-color: var(--md-sys-color-surface); 
    border: 1px solid var(--md-sys-color-outline); 
}

.loading-spinner { border: 5px solid var(--md-sys-color-outline); border-top: 5px solid var(--md-sys-color-primary); }

.tab-button { color: var(--md-sys-color-on-surface-variant); }
.tab-button.active { color: var(--md-sys-color-primary); border-bottom-color: var(--md-sys-color-primary); }

.watchlist-row.primary { background-color: var(--md-sys-color-primary-container) !important; font-weight: bold; border-left: 4px solid var(--md-sys-color-primary); }
.watchlist-row:hover {
    background-color: #c7d2fe; /* Light indigo background on hover */
}
.watchlist-row:hover td {
    color: #000000 !important; /* BLACK text on hover */
}

.signal-card { background-color: var(--md-sys-color-surface-variant); border-left: 5px solid; }
.signal-card-buy { background-color: rgba(74, 222, 128, 0.1); border-color: var(--md-sys-color-success); }
.signal-card-buy h4 { color: #bbf7d0 !important; }
.signal-card-sell { background-color: rgba(248, 113, 113, 0.1); border-color: var(--md-sys-color-error); }
.signal-card-sell h4 { color: #fecaca !important; }
.signal-card-monitoring { background-color: rgba(96, 165, 250, 0.1); border-color: var(--md-sys-color-info); }
.signal-card-monitoring h4 { color: #bfdbfe !important; }
.signal-card-hold { background-color: rgba(156, 163, 175, 0.1); border-color: var(--md-sys-color-on-surface-variant); }

.settings-group { background-color: var(--md-sys-color-surface-variant); border: 1px solid var(--md-sys-color-outline); }
.log-content { font-family: 'Courier New', Courier, monospace; background-color: var(--md-sys-color-outline); }
.positive-pnl { background-color: rgba(74, 222, 128, 0.2) !important; color: #dcfce7 !important; }
.negative-pnl { background-color: rgba(248, 113, 113, 0.2) !important; color: #fee2e2 !important; }
.status-dot.connected { background-color: var(--md-sys-color-success); }
.status-dot.disconnected { background-color: var(--md-sys-color-error); }
.positive-change { color: var(--md-sys-color-success) !important; }
.negative-change { color: var(--md-sys-color-error) !important; }

#positionBookDisplay table { font-size: 0.75rem; }
#positionBookDisplay th, #positionBookDisplay td { padding: 4px 2px; text-align: right; }
#positionBookDisplay th:first-child, #positionBookDisplay td:first-child { text-align: left; }

.score-bar-container { background-color: var(--md-sys-color-outline); }
.score-bar { background: linear-gradient(to right, var(--md-sys-color-error), var(--md-sys-color-warning), var(--md-sys-color-success)); }

.side-column-container { background-color: var(--md-sys-color-surface-variant); }
.signal-checklist-item { border-bottom: 1px solid var(--md-sys-color-outline); }
.signal-checklist-label { color: var(--md-sys-color-on-surface-variant) !important; }
.signal-checklist-required-value { color: #6b7280 !important; }
.status-true { color: var(--md-sys-color-success) !important; }
.status-false { color: var(--md-sys-color-error) !important; }

/* === Final Minor Changes === */

/* 1. Backtest, ML Optimizer, HS Optimizer links */
.side-column-container .flex-wrap a.text-gray-800 {
    background-color: #93c5fd; /* A light blue background */
    color: #1e3a8a !important; /* Dark blue text */
}
.side-column-container .flex-wrap a.text-gray-800:hover {
     background-color: #60a5fa; /* A brighter blue on hover */
}

/* 2. Open Positions Box Text */
#positionBookDisplay_wrapper h2, 
#positionBookDisplay_wrapper h2 *,
#positionBookDisplay th, 
#positionBookDisplay td {
    color: #000000 !important;
}
/* This prevents P&L colors from turning black */
#positionBookDisplay .positive-pnl, #positionBookDisplay .negative-pnl {
    color: #ffffff !important;
}

/* 3. Contracts Selection Box Text */
#optionChainDisplay .contract-item {
    color: #000000 !important;
}

/* 4. Watchlist Box Heading */
#watchlistContainer_wrapper h3 {
    color: #000000 !important;
}

/* 5. Scan Interval Selection Box */
#clientMonitorControls label, #clientMonitorControls select {
    color: #000000 !important;
}
#clientMonitorControls select option {
    background-color: var(--md-sys-color-surface);
    color: #000000;
}

/* Text left */
#watchlistContainer tr .text-left{
 color:#000000;
}

/* Text right */
#watchlistContainer .text-xs .text-right{
 color:#000000;
}

/* Positive */
#positionBookDisplay tr .positive-pnl{
 color:#000000 !important;
 font-weight:700 !important;
 font-size:19px !important;
}

/* Label */
#clientMonitorControls label{
 color:#f3e634 !important;
}

/* Websocket status */
#websocketStatus{
 color:#64f664 !important;
}