/*
 * theme.css — PrimeStake Global Theme System
 * Accent: Premium Gold (#FFB800 dark / #D97706 light)
 * Font: SF Pro / system-ui native stack
 */

html[data-theme="dark"] {
    --bg-main:      #070509;
    --bg-card:      #0f0c14;
    --bg-card2:     #16121e;
    --accent:       #FFB800;
    --accent-mid:   #E5A200;
    --accent-lite:  rgba(255,184,0,0.11);
    --accent-glow:  rgba(255,184,0,0.25);
    --text-main:    #f2eeff;
    --text-dim:     #5a506e;
    --border:       rgba(255,255,255,0.05);
    --border-soft:  rgba(255,255,255,0.08);
    --glass:        rgba(255,255,255,0.02);
    --nav-bg:       rgba(7,5,9,0.97);
    --header-bg:    rgba(7,5,9,0.94);
    --input-bg:     rgba(255,255,255,0.04);
    --input-border: rgba(255,255,255,0.08);
    --shadow:       0 16px 40px -12px rgba(0,0,0,0.9);
    --error:        #ff4040;
    --running:      #6366f1;
    --btn-text:     #1a0e00;
}

html[data-theme="light"] {
    --bg-main:      #f8f5ff;
    --bg-card:      #ffffff;
    --bg-card2:     #f3f0fa;
    --accent:       #D97706;
    --accent-mid:   #F59E0B;
    --accent-lite:  #fef3c7;
    --accent-glow:  rgba(217,119,6,0.18);
    --text-main:    #100b1a;
    --text-dim:     #64548a;
    --border:       #e4dff0;
    --border-soft:  #cec5e3;
    --glass:        rgba(0,0,0,0.02);
    --nav-bg:       rgba(255,255,255,0.97);
    --header-bg:    rgba(255,255,255,0.97);
    --input-bg:     #f3f0fa;
    --input-border: #cec5e3;
    --shadow:       0 4px 22px rgba(0,0,0,0.08);
    --error:        #ef4444;
    --running:      #4f46e5;
    --btn-text:     #ffffff;
}

/* ── Global base ── */
*, *::before, *::after { box-sizing: border-box; }

body {
    font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display",
                 "Helvetica Neue", system-ui, ui-sans-serif, sans-serif;
    background-color: var(--bg-main)  !important;
    color:            var(--text-main) !important;
    transition: background-color .3s ease, color .3s ease;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

*:not([class*="animate"]):not([class*="ticker"]):not([class*="scroll"]):not(script) {
    transition-property: background-color, border-color, color, box-shadow;
    transition-duration: .25s;
    transition-timing-function: ease;
}

/* ═══ LIGHT MODE OVERRIDES ═══ */
html[data-theme="light"] .text-white                    { color: var(--text-main)  !important; }
html[data-theme="light"] .text-gray-400,
html[data-theme="light"] .text-gray-500,
html[data-theme="light"] .text-gray-600,
html[data-theme="light"] .text-gray-700,
html[data-theme="light"] .text-gray-800,
html[data-theme="light"] .text-slate-400,
html[data-theme="light"] .text-slate-500               { color: var(--text-dim)   !important; }
html[data-theme="light"] [class*="bg-white\/"]          { background-color: rgba(0,0,0,0.04) !important; }
html[data-theme="light"] [class*="bg-black\/"]          { background-color: rgba(0,0,0,0.04) !important; }
html[data-theme="light"] [class*="border-white\/"]      { border-color: var(--border)        !important; }
html[data-theme="light"] [class*="border-black\/"]      { border-color: var(--border-soft)   !important; }
html[data-theme="light"] [class*="from-indigo-"][class*="to-indigo-"] { background: linear-gradient(135deg,#eef2ff,#e0e7ff) !important; border-color: #c7d2fe !important; }
html[data-theme="light"] [class*="from-amber-"][class*="to-amber-"]   { background: linear-gradient(135deg,#fffbeb,#fef3c7) !important; border-color: #fde68a !important; }
html[data-theme="light"] [class*="from-blue-"][class*="to-blue-"]     { background: linear-gradient(135deg,#eff6ff,#dbeafe) !important; border-color: #bfdbfe !important; }
html[data-theme="light"] .text-indigo-200               { color: #4338ca !important; }
html[data-theme="light"] .text-amber-200                { color: #b45309 !important; }
html[data-theme="light"] .text-blue-200                 { color: #1d4ed8 !important; }
html[data-theme="light"] .brightness-0                  { filter: none   !important; }
html[data-theme="light"] .bet-card,
html[data-theme="light"] .history-card,
html[data-theme="light"] .ticket-card                  { background: #ffffff    !important; border-color: var(--border) !important; box-shadow: var(--shadow) !important; }
html[data-theme="light"] .card-header                  { background: #f3f0fa    !important; border-color: var(--border) !important; }
html[data-theme="light"] .card-results                 { border-top: 1px solid var(--border) !important; }
html[data-theme="light"] .card-body                    { background: transparent !important; }
html[data-theme="light"] .match-teams,
html[data-theme="light"] .match-preview                { color: var(--text-main) !important; }
html[data-theme="light"] .match-odds                   { color: var(--text-main) !important; }
html[data-theme="light"] .match-pick                   { color: var(--text-dim)  !important; }
html[data-theme="light"] .match-row                    { border-color: var(--border) !important; }
html[data-theme="light"] .card-footer                  { background: #ede8f8    !important; border-top: 1px solid var(--border) !important; }
html[data-theme="light"] .sum-box p:last-child         { color: var(--text-main) !important; }
html[data-theme="light"] .expand-btn                   { background: #ede8f8    !important; color: var(--text-dim) !important; border-top: 1px solid var(--border) !important; }
html[data-theme="light"] .filter-bar                   { background: #ede8f8    !important; border-color: var(--border) !important; }
html[data-theme="light"] .filter-btn                   { background: #ede8f8    !important; color: var(--text-main) !important; border-color: var(--border) !important; }
html[data-theme="light"] .filter-btn.active            { color: var(--accent)   !important; border-color: var(--accent) !important; }
html[data-theme="light"] .status-text                  { color: inherit         !important; }
html[data-theme="light"] .text-running                 { color: #4f46e5         !important; }
html[data-theme="light"] .res-val                      { color: var(--text-main) !important; }
html[data-theme="light"] .res-label                    { color: #94a3b8         !important; }
html[data-theme="light"] .bottom-sheet                 { background: #ffffff    !important; border-top: 1px solid var(--border) !important; }
html[data-theme="light"] .sheet-option                 { background: #f3f0fa    !important; color: var(--text-main) !important; }
html[data-theme="light"] .sheet-option.selected        { background: var(--accent-lite) !important; color: var(--accent) !important; }
html[data-theme="light"] #co-sheet                     { background: #ffffff    !important; border-color: var(--border) !important; }
html[data-theme="light"] .bs-sheet                     { background: #ffffff    !important; color: var(--text-main) !important; border-top: 1px solid var(--border) !important; }
html[data-theme="light"] .bs-item                      { background: #f3f0fa    !important; border-color: var(--border) !important; }
html[data-theme="light"] .bs-item-header               { border-color: var(--border) !important; }
html[data-theme="light"] .bs-item-footer               { background: #ede8f8    !important; }
html[data-theme="light"] .bs-teams-text                { color: var(--text-main) !important; }
html[data-theme="light"] .bs-odds-value                { color: var(--text-main) !important; }
html[data-theme="light"] #bs-footer                    { background: #ffffff    !important; border-top: 1px solid var(--border) !important; box-shadow: 0 -4px 20px rgba(0,0,0,.08) !important; }
html[data-theme="light"] #bs-footer [class*="bg-white\/"]  { background: #f3f0fa !important; border-color: var(--border) !important; }
html[data-theme="light"] #bs-footer input              { color: var(--text-main) !important; }
html[data-theme="light"] .bs-sheet [class*="border-white\/"] { border-color: var(--border) !important; }
html[data-theme="light"] .td-overview                  { background: #f3f0fa    !important; border-color: var(--border) !important; }
html[data-theme="light"] .tag                          { background: #ede8f8    !important; border-color: var(--border) !important; color: var(--text-dim) !important; }
html[data-theme="light"] .payout-card                  { background: #ffffff    !important; border-color: var(--border) !important; }
html[data-theme="light"] .avatar-box                   { background: #ddd7ef    !important; border-color: var(--border) !important; }
html[data-theme="light"] .settings-input,
html[data-theme="light"] input:not([type="submit"]):not([type="button"]):not([type="range"]):not([type="checkbox"]):not([type="radio"]),
html[data-theme="light"] textarea,
html[data-theme="light"] select                        { background: var(--input-bg) !important; border-color: var(--input-border) !important; color: var(--text-main) !important; }
html[data-theme="light"] input:focus,
html[data-theme="light"] textarea:focus,
html[data-theme="light"] .settings-input:focus         { border-color: var(--accent) !important; }
html[data-theme="light"] input::placeholder,
html[data-theme="light"] textarea::placeholder         { color: #94a3b8 !important; }
html[data-theme="light"] .amount-tile                  { background: #f3f0fa    !important; border-color: var(--border) !important; color: var(--text-main) !important; }
html[data-theme="light"] .amount-tile.active           { background: var(--accent-lite) !important; border-color: var(--accent) !important; color: var(--accent) !important; }
html[data-theme="light"] .odds-grid button,
html[data-theme="light"] .today-odds button            { background: #ede8f8    !important; border-color: var(--border) !important; color: var(--text-main) !important; }
html[data-theme="light"] .odds-grid button.selected,
html[data-theme="light"] .today-odds button.selected   { background: var(--accent) !important; color: #fff !important; border-color: var(--accent) !important; }
html[data-theme="light"] .ticker-container             { background: rgba(248,245,255,0.96) !important; border-bottom: 1px solid var(--border) !important; }
html[data-theme="light"] .nav-wrapper                  { background: var(--nav-bg) !important; border-top: 1px solid var(--border) !important; }
html[data-theme="light"] .nav-label                    { color: #94a3b8         !important; }
html[data-theme="light"] .nav-icon                     { color: #94a3b8         !important; }
html[data-theme="light"] .nav-item.active .nav-label   { color: var(--text-main) !important; }
html[data-theme="light"] .diamond-btn                  { border-color: var(--bg-main) !important; }