/* CSS Theme Definitions */

/* Night Theme (Pitch Black) */
html[data-theme="night"] {
    --bg-color: #000000;
    --text-primary: #ffffff;
    --text-secondary: rgba(255, 255, 255, 0.7);
    --glass-bg: rgba(10, 10, 10, 0.6);
    --glass-border: rgba(255, 255, 255, 0.08);
    --modal-bg: #050505;
    --dropdown-bg: #111111;
    --header-bg: rgba(5, 5, 5, 0.85);
    --control-bg: rgba(255, 255, 255, 0.05);
}

/* Dark Theme (Softer Gray/Dark) - Default */
html[data-theme="dark"] {
    --bg-color: #121212;
    --text-primary: #e0e0e0;
    --text-secondary: #9e9e9e;
    --glass-bg: rgba(30, 30, 30, 0.6);
    --glass-border: rgba(255, 255, 255, 0.08);
    --modal-bg: #1a1a1a;
    --dropdown-bg: #222222;
    --header-bg: rgba(18, 18, 18, 0.85);
    --control-bg: rgba(255, 255, 255, 0.05);
}

/* Light Glass Theme (Apple Glassmorphism Blue) */
html[data-theme="light-glass"] {
    --bg-color: #eef2f6;
    --text-primary: #1d1d1f;
    --text-secondary: #5f6368;
    --glass-bg: rgba(255, 255, 255, 0.6);
    --glass-border: rgba(255, 255, 255, 1);
    --modal-bg: #f8f9fa;
    --dropdown-bg: #ffffff;
    --header-bg: rgba(255, 255, 255, 0.7);
    --control-bg: rgba(0, 0, 0, 0.05);
}

/* White Theme (Pure White) */
html[data-theme="white"] {
    --bg-color: #ffffff;
    --text-primary: #000000;
    --text-secondary: #666666;
    --glass-bg: #ffffff;
    --glass-border: rgba(0, 0, 0, 0.1);
    --modal-bg: #ffffff;
    --dropdown-bg: #ffffff;
    --header-bg: #ffffff;
    --control-bg: rgba(0, 0, 0, 0.05);
}


/* Overrides for hardcoded colors in light themes */
html[data-theme="light-glass"] .modal-content,
html[data-theme="white"] .modal-content {
    background: var(--modal-bg);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
}

html[data-theme="light-glass"] .header-bar,
html[data-theme="white"] .header-bar {
    background: var(--header-bg);
}

html[data-theme="light-glass"] .ex-filter-dropdown,
html[data-theme="white"] .ex-filter-dropdown {
    background: var(--dropdown-bg);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}

html[data-theme="light-glass"] .ex-filter-item,
html[data-theme="white"] .ex-filter-item {
    color: var(--text-primary);
}

html[data-theme="light-glass"] .ex-filter-item:hover,
html[data-theme="white"] .ex-filter-item:hover {
    background: rgba(0, 0, 0, 0.05);
}

html[data-theme="light-glass"] .token-filter-compact,
html[data-theme="white"] .token-filter-compact,
html[data-theme="light-glass"] .ex-filter-btn,
html[data-theme="white"] .ex-filter-btn,
html[data-theme="light-glass"] .sort-wrapper,
html[data-theme="white"] .sort-wrapper,
html[data-theme="light-glass"] .input-field,
html[data-theme="white"] .input-field,
html[data-theme="light-glass"] .input-field-sm,
html[data-theme="white"] .input-field-sm {
    background: var(--control-bg);
    color: var(--text-primary);
}

html[data-theme="light-glass"] .toolbar-select,
html[data-theme="white"] .toolbar-select,
html[data-theme="light-glass"] .token-input-compact,
html[data-theme="white"] .token-input-compact {
    color: var(--text-primary);
}

html[data-theme="light-glass"] .toolbar-select option,
html[data-theme="white"] .toolbar-select option {
    background: var(--dropdown-bg);
    color: var(--text-primary);
}

html[data-theme="light-glass"] .stats-bar-dom,
html[data-theme="white"] .stats-bar-dom {
    background: rgba(255, 255, 255, 0.5);
    border-bottom: 1px solid var(--glass-border);
}

html[data-theme="light-glass"] .stat-value,
html[data-theme="white"] .stat-value {
    color: var(--text-primary);
}

html[data-theme="light-glass"] .icon-action-btn:hover,
html[data-theme="white"] .icon-action-btn:hover,
html[data-theme="light-glass"] .icon-btn:hover,
html[data-theme="white"] .icon-btn:hover {
    background: rgba(0, 0, 0, 0.08);
    color: var(--text-primary);
}

html[data-theme="light-glass"] .coin-header,
html[data-theme="white"] .coin-header {
    background: linear-gradient(135deg, rgba(79, 137, 248, 0.08) 0%, rgba(0, 0, 0, 0.02) 40%, rgba(0, 180, 140, 0.06) 100%);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

html[data-theme="light-glass"] .order-row,
html[data-theme="white"] .order-row {
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
}

html[data-theme="light-glass"] .logo-title,
html[data-theme="white"] .logo-title {
    background: linear-gradient(90deg, #1d1d1f, #5f6368);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Modal text overrides */
html[data-theme="light-glass"] .modal-header h2,
html[data-theme="white"] .modal-header h2 {
    color: var(--text-primary);
}

/* Light theme overrides for toggle buttons */
html[data-theme="light-glass"] .ex-market-toggle.active,
html[data-theme="white"] .ex-market-toggle.active {
    background: #000;
    color: #fff;
}

html[data-theme="light-glass"] .ex-market-toggle,
html[data-theme="white"] .ex-market-toggle {
    background: rgba(0, 0, 0, 0.05);
}

/* Light Theme Theme Selector specific styles */
.theme-btn {
    border: 1px solid var(--glass-border);
    background: var(--control-bg);
    color: var(--text-secondary);
    transition: 0.2s;
}

.theme-btn:hover {
    background: rgba(120, 120, 120, 0.2);
}

.theme-btn.active,
.layout-btn.active,
.lang-btn.active {
    background: var(--accent-blue);
    color: #fff;
    border-color: var(--accent-blue);
}