/* themes.css - Theme variables and theme-specific overrides */

/* Theme: Classic (default) */
:root, .theme-classic {
    --bg-color: #c0c0c0;
    --border-light: #ffffff;
    --border-dark: #808080;
    --led-bg: #000000;
    --led-color: #FF0000;
    --cell-bg: #c0c0c0;
    --cell-revealed-bg: #c0c0c0;
    --text-color: #000000;
    --menu-highlight: #000080;
    --menu-highlight-text: #ffffff;
    --dialog-title-bg: #000080;
}

/* Theme: Dark */
.theme-dark {
    --bg-color: #2d2d2d;
    --border-light: #4a4a4a;
    --border-dark: #1a1a1a;
    --led-bg: #0a0a0a;
    --led-color: #00FF00;
    --cell-bg: #3a3a3a;
    --cell-revealed-bg: #2a2a2a;
    --text-color: #e0e0e0;
    --menu-highlight: #0066cc;
    --menu-highlight-text: #ffffff;
    --dialog-title-bg: #333333;
}

/* Theme: Blue */
.theme-blue {
    --bg-color: #d4e4f7;
    --border-light: #ffffff;
    --border-dark: #7ba3d4;
    --led-bg: #001133;
    --led-color: #FF6600;
    --cell-bg: #c8ddf0;
    --cell-revealed-bg: #b8cde0;
    --text-color: #000000;
    --menu-highlight: #0055E5;
    --menu-highlight-text: #ffffff;
    --dialog-title-bg: #0055E5;
}

/* === Dark Theme Overrides === */

.theme-dark body,
.theme-dark .game-window,
.theme-dark .game-container,
.theme-dark .board {
    background: var(--bg-color);
}

.theme-dark .game-window {
    border-top-color: var(--border-light);
    border-left-color: var(--border-light);
    border-bottom-color: var(--border-dark);
    border-right-color: var(--border-dark);
}

.theme-dark .game-container {
    border-top-color: var(--border-dark);
    border-left-color: var(--border-dark);
    border-bottom-color: var(--border-light);
    border-right-color: var(--border-light);
}

.theme-dark .status-bar {
    background: var(--bg-color);
    border-top-color: var(--border-dark);
    border-left-color: var(--border-dark);
    border-bottom-color: var(--border-light);
    border-right-color: var(--border-light);
}

.theme-dark .cell {
    background: var(--cell-bg);
    border-top-color: var(--border-light);
    border-left-color: var(--border-light);
    border-bottom-color: var(--border-dark);
    border-right-color: var(--border-dark);
}

.theme-dark .cell.revealed {
    background: var(--cell-revealed-bg);
    border-color: var(--border-dark);
}

.theme-dark .cell.pressed {
    background: var(--cell-revealed-bg);
    border-color: var(--border-dark);
}

.theme-dark .cell.flagged {
    background: var(--cell-bg);
    border-top-color: var(--border-light);
    border-left-color: var(--border-light);
    border-bottom-color: var(--border-dark);
    border-right-color: var(--border-dark);
}

.theme-dark .cell.mine {
    background: var(--cell-revealed-bg);
    border-color: var(--border-dark);
}

.theme-dark .menu-bar .menu-btn {
    background: var(--bg-color);
    color: var(--text-color);
}

.theme-dark .menu-dropdown {
    background: var(--bg-color);
    border-top-color: var(--border-light);
    border-left-color: var(--border-light);
    border-bottom-color: var(--border-dark);
    border-right-color: var(--border-dark);
}

.theme-dark .menu-item {
    color: var(--text-color);
}

.theme-dark .menu-item:hover {
    background: var(--menu-highlight);
    color: var(--menu-highlight-text);
}

.theme-dark .menu-separator {
    background: var(--border-dark);
}

.theme-dark .led-display {
    background: var(--led-bg);
    color: var(--led-color);
}

.theme-dark .dialog-overlay .dialog {
    background: var(--bg-color);
    color: var(--text-color);
    border-top-color: var(--border-light);
    border-left-color: var(--border-light);
    border-bottom-color: var(--border-dark);
    border-right-color: var(--border-dark);
}

.theme-dark .dialog-title {
    background: var(--dialog-title-bg);
    color: var(--menu-highlight-text);
}

.theme-dark .dialog-body,
.theme-dark .dialog-body p,
.theme-dark .dialog-body label,
.theme-dark .dialog-body th,
.theme-dark .dialog-body td {
    color: var(--text-color);
}

.theme-dark .dialog-body a {
    color: #6ab0f5;
}

.theme-dark input[type="number"],
.theme-dark input[type="text"],
.theme-dark .win-input,
.theme-dark select {
    background: #1a1a1a;
    color: var(--text-color);
    border-top-color: var(--border-dark);
    border-left-color: var(--border-dark);
    border-bottom-color: var(--border-light);
    border-right-color: var(--border-light);
}

.theme-dark select option {
    background: #1a1a1a;
    color: var(--text-color);
}

.theme-dark .dialog-btn,
.theme-dark .win-btn {
    background: var(--cell-bg);
    color: var(--text-color);
    border-top-color: var(--border-light);
    border-left-color: var(--border-light);
    border-bottom-color: var(--border-dark);
    border-right-color: var(--border-dark);
}

.theme-dark .dialog-btn:active,
.theme-dark .win-btn:active {
    border-top-color: var(--border-dark);
    border-left-color: var(--border-dark);
    border-bottom-color: var(--border-light);
    border-right-color: var(--border-light);
}

.theme-dark .dialog-btn:disabled,
.theme-dark .win-btn:disabled {
    color: #808080;
}

.theme-dark .dialog-close {
    background: var(--cell-bg);
    color: var(--text-color);
    border-top-color: var(--border-light);
    border-left-color: var(--border-light);
    border-bottom-color: var(--border-dark);
    border-right-color: var(--border-dark);
}

.theme-dark .toast {
    background: var(--bg-color);
    color: var(--text-color);
    border-top-color: var(--border-light);
    border-left-color: var(--border-light);
    border-bottom-color: var(--border-dark);
    border-right-color: var(--border-dark);
}

.theme-dark .smiley-btn,
.theme-dark .flag-mode-btn {
    background: var(--cell-bg);
}

.theme-dark ::-webkit-scrollbar {
    width: 12px;
    height: 12px;
    background: var(--bg-color);
}

.theme-dark ::-webkit-scrollbar-track {
    background: var(--bg-color);
    border-left: 1px solid var(--border-dark);
}

.theme-dark ::-webkit-scrollbar-thumb {
    background: #555555;
    border-top: 2px solid #6e6e6e;
    border-left: 2px solid #6e6e6e;
    border-bottom: 2px solid #222222;
    border-right: 2px solid #222222;
}

.theme-dark ::-webkit-scrollbar-thumb:hover {
    background: var(--menu-highlight);
}

/* === Blue Theme Overrides === */

.theme-blue body,
.theme-blue .game-window,
.theme-blue .game-container,
.theme-blue .board {
    background: var(--bg-color);
}

.theme-blue .game-window {
    border-top-color: var(--border-light);
    border-left-color: var(--border-light);
    border-bottom-color: var(--border-dark);
    border-right-color: var(--border-dark);
}

.theme-blue .game-container {
    border-top-color: var(--border-dark);
    border-left-color: var(--border-dark);
    border-bottom-color: var(--border-light);
    border-right-color: var(--border-light);
}

.theme-blue .status-bar {
    background: var(--bg-color);
    border-top-color: var(--border-dark);
    border-left-color: var(--border-dark);
    border-bottom-color: var(--border-light);
    border-right-color: var(--border-light);
}

.theme-blue .cell {
    background: var(--cell-bg);
    border-top-color: var(--border-light);
    border-left-color: var(--border-light);
    border-bottom-color: var(--border-dark);
    border-right-color: var(--border-dark);
}

.theme-blue .cell.revealed {
    background: var(--cell-revealed-bg);
    border-color: var(--border-dark);
}

.theme-blue .cell.pressed {
    background: var(--cell-revealed-bg);
    border-color: var(--border-dark);
}

.theme-blue .cell.flagged {
    background: var(--cell-bg);
    border-top-color: var(--border-light);
    border-left-color: var(--border-light);
    border-bottom-color: var(--border-dark);
    border-right-color: var(--border-dark);
}

.theme-blue .cell.mine {
    background: var(--cell-revealed-bg);
    border-color: var(--border-dark);
}

.theme-blue .menu-bar .menu-btn {
    background: var(--bg-color);
    color: var(--text-color);
}

.theme-blue .menu-dropdown {
    background: var(--bg-color);
    border-top-color: var(--border-light);
    border-left-color: var(--border-light);
    border-bottom-color: var(--border-dark);
    border-right-color: var(--border-dark);
}

.theme-blue .menu-item:hover {
    background: var(--menu-highlight);
    color: var(--menu-highlight-text);
}

.theme-blue .led-display {
    background: var(--led-bg);
    color: var(--led-color);
}

.theme-blue .dialog-overlay .dialog {
    background: var(--bg-color);
    color: var(--text-color);
    border-top-color: var(--border-light);
    border-left-color: var(--border-light);
    border-bottom-color: var(--border-dark);
    border-right-color: var(--border-dark);
}

.theme-blue .dialog-title {
    background: var(--dialog-title-bg);
    color: var(--menu-highlight-text);
}

.theme-blue .menu-item {
    color: var(--text-color);
}

.theme-blue .menu-item:hover {
    background: var(--menu-highlight);
    color: var(--menu-highlight-text);
}

.theme-blue .menu-separator {
    background: var(--border-dark);
}

.theme-blue .dialog-body,
.theme-blue .dialog-body p,
.theme-blue .dialog-body label,
.theme-blue .dialog-body th,
.theme-blue .dialog-body td {
    color: var(--text-color);
}

.theme-blue input[type="number"],
.theme-blue input[type="text"],
.theme-blue .win-input,
.theme-blue select {
    background: #f4f9ff;
    color: #000000;
    border-top-color: var(--border-dark);
    border-left-color: var(--border-dark);
    border-bottom-color: var(--border-light);
    border-right-color: var(--border-light);
}

.theme-blue .dialog-btn,
.theme-blue .win-btn {
    background: var(--cell-bg);
    color: var(--text-color);
    border-top-color: var(--border-light);
    border-left-color: var(--border-light);
    border-bottom-color: var(--border-dark);
    border-right-color: var(--border-dark);
}

.theme-blue .dialog-btn:active,
.theme-blue .win-btn:active {
    border-top-color: var(--border-dark);
    border-left-color: var(--border-dark);
    border-bottom-color: var(--border-light);
    border-right-color: var(--border-light);
}

.theme-blue .dialog-close {
    background: var(--cell-bg);
    color: var(--text-color);
    border-top-color: var(--border-light);
    border-left-color: var(--border-light);
    border-bottom-color: var(--border-dark);
    border-right-color: var(--border-dark);
}

.theme-blue .toast {
    background: var(--bg-color);
    color: var(--text-color);
    border-top-color: var(--border-light);
    border-left-color: var(--border-light);
    border-bottom-color: var(--border-dark);
    border-right-color: var(--border-dark);
}

.theme-blue ::-webkit-scrollbar {
    width: 12px;
    height: 12px;
    background: var(--bg-color);
}

.theme-blue ::-webkit-scrollbar-track {
    background: var(--bg-color);
    border-left: 1px solid var(--border-dark);
}

.theme-blue ::-webkit-scrollbar-thumb {
    background: #9fc1e8;
    border-top: 2px solid #bcd6f2;
    border-left: 2px solid #bcd6f2;
    border-bottom: 2px solid #6f97c4;
    border-right: 2px solid #6f97c4;
}

.theme-blue ::-webkit-scrollbar-thumb:hover {
    background: var(--menu-highlight);
}