/* Light Mode Fixes for All Pages */

/* Ensure light mode has proper light backgrounds */
body {
    background-color: #ffffff !important;
    color: #333333 !important;
}

/* Light mode specific overrides */
body:not(.dark-theme):not([data-theme="dark"]) {
    background-color: #ffffff !important;
    color: #333333 !important;
}

/* Ensure sections have light backgrounds in light mode */
body:not(.dark-theme):not([data-theme="dark"]) section {
    background-color: transparent !important;
    color: #333333 !important;
}

/* Fix main content areas */
body:not(.dark-theme):not([data-theme="dark"]) .container,
body:not(.dark-theme):not([data-theme="dark"]) .container-fluid,
body:not(.dark-theme):not([data-theme="dark"]) .container-xl {
    background-color: transparent !important;
    color: #333333 !important;
}

/* Fix cards and panels in light mode */
body:not(.dark-theme):not([data-theme="dark"]) .card,
body:not(.dark-theme):not([data-theme="dark"]) .panel,
body:not(.dark-theme):not([data-theme="dark"]) .game-container {
    background-color: #ffffff !important;
    color: #333333 !important;
}

/* Fix text readability in light mode */
body:not(.dark-theme):not([data-theme="dark"]) h1,
body:not(.dark-theme):not([data-theme="dark"]) h2,
body:not(.dark-theme):not([data-theme="dark"]) h3,
body:not(.dark-theme):not([data-theme="dark"]) h4,
body:not(.dark-theme):not([data-theme="dark"]) h5,
body:not(.dark-theme):not([data-theme="dark"]) h6 {
    color: #333333 !important;
}

body:not(.dark-theme):not([data-theme="dark"]) p,
body:not(.dark-theme):not([data-theme="dark"]) span,
body:not(.dark-theme):not([data-theme="dark"]) div {
    color: #333333 !important;
}

/* Fix form elements in light mode */
body:not(.dark-theme):not([data-theme="dark"]) input,
body:not(.dark-theme):not([data-theme="dark"]) textarea,
body:not(.dark-theme):not([data-theme="dark"]) select {
    background-color: #ffffff !important;
    color: #333333 !important;
    border-color: #dee2e6 !important;
}

/* Fix buttons in light mode */
body:not(.dark-theme):not([data-theme="dark"]) .btn:not(.btn-primary):not(.btn-success):not(.btn-warning):not(.btn-danger):not(.btn-info) {
    background-color: #ffffff !important;
    color: #333333 !important;
    border-color: #dee2e6 !important;
}

/* Ensure proper contrast for links - but not blue */
body:not(.dark-theme):not([data-theme="dark"]) a {
    color: #333333 !important;
}

body:not(.dark-theme):not([data-theme="dark"]) a:hover {
    color: #28a745 !important;
}

/* Fix any remaining dark elements */
body:not(.dark-theme):not([data-theme="dark"]) * {
    border-color: #dee2e6 !important;
}

/* Override any dark backgrounds that might be applied */
body:not(.dark-theme):not([data-theme="dark"]) [style*="background-color: #1a1a1a"],
body:not(.dark-theme):not([data-theme="dark"]) [style*="background-color: #121212"],
body:not(.dark-theme):not([data-theme="dark"]) [style*="background: #1a1a1a"],
body:not(.dark-theme):not([data-theme="dark"]) [style*="background: #121212"] {
    background-color: #ffffff !important;
    color: #333333 !important;
}

/* Dark mode styles (keep existing dark mode working) */
body.dark-theme,
[data-theme="dark"] body {
    background-color: #1a1a1a !important;
    color: #ffffff !important;
}

body.dark-theme *,
[data-theme="dark"] * {
    color: #ffffff !important;
}

body.dark-theme .card,
body.dark-theme .panel,
body.dark-theme .game-container,
[data-theme="dark"] .card,
[data-theme="dark"] .panel,
[data-theme="dark"] .game-container {
    background-color: #2d2d2d !important;
    color: #ffffff !important;
}

body.dark-theme input,
body.dark-theme textarea,
body.dark-theme select,
[data-theme="dark"] input,
[data-theme="dark"] textarea,
[data-theme="dark"] select {
    background-color: #2d2d2d !important;
    color: #ffffff !important;
    border-color: #404040 !important;
}/* 
Additional light mode fixes */
body.light-theme {
    background-color: #ffffff !important;
    color: #333333 !important;
}

/* Force light backgrounds for specific elements */
body.light-theme section,
body.light-theme .container,
body.light-theme .container-fluid,
body.light-theme .row,
body.light-theme .col {
    background-color: transparent !important;
    color: inherit !important;
}

/* Fix any remaining dark text on light backgrounds */
body.light-theme .text-white {
    color: #333333 !important;
}

/* Ensure proper contrast for all text elements */
body.light-theme * {
    color: #333333 !important;
}

/* Exception for buttons and special elements that should keep their colors */
body.light-theme .btn-primary,
body.light-theme .btn-success,
body.light-theme .btn-warning,
body.light-theme .btn-danger,
body.light-theme .btn-info,
body.light-theme .btn-secondary {
    color: #ffffff !important;
}

/* Fix navbar in light mode */
body.light-theme .navbar {
    background-color: rgba(255, 255, 255, 0.95) !important;
}

body.light-theme .navbar-brand,
body.light-theme .nav-link {
    color: #333333 !important;
}

/* Override any CSS variables that might be causing issues */
body.light-theme {
    --bg-primary: #ffffff;
    --bg-secondary: #f8f9fa;
    --text-primary: #333333;
    --text-secondary: #666666;
}