/* Theme variables */
:root {
    --theme-transition: 0.3s ease;
}

/* Smooth transition on elements */
body, header, footer, div.glass, h1, h2, h3, p, span, a, button, input {
    transition: background-color var(--theme-transition),
                border-color var(--theme-transition),
                color var(--theme-transition),
                box-shadow var(--theme-transition);
}

/* ------------------------------------------ */
/* LIGHT THEME OVERRIDES                      */
/* ------------------------------------------ */

[data-theme="light"] {
    color-scheme: light;
}

[data-theme="light"] body {
    background-color: #f8fafc !important; /* slate-50 */
    color: #0f172a !important; /* slate-900 */
}

/* General Layout Backgrounds */
[data-theme="light"] .bg-background-dark,
[data-theme="light"] .bg-\[\#060b13\],
[data-theme="light"] .bg-slate-900,
[data-theme="light"] .bg-slate-950,
[data-theme="light"] .bg-\[\#0f172a\],
[data-theme="light"] .bg-\[\#0d1117\] {
    background-color: #ffffff !important;
}

[data-theme="light"] .bg-slate-800 {
    background-color: #f1f5f9 !important; /* slate-100 */
}

/* Typography Overrides */
[data-theme="light"] .text-white,
[data-theme="light"] .text-slate-100,
[data-theme="light"] .text-slate-200,
[data-theme="light"] .text-slate-300 {
    color: #0f172a !important; /* slate-900 */
}

[data-theme="light"] .text-slate-400,
[data-theme="light"] .text-slate-500 {
    color: #1e293b !important; /* slate-800 (Preto/Mais Escuro para leitura) */
}

/* Borders */
[data-theme="light"] .border-slate-800,
[data-theme="light"] .border-slate-700,
[data-theme="light"] .border-\[\#0d1117\],
[data-theme="light"] .border-white\/10,
[data-theme="light"] .border-white\/5 {
    border-color: #e2e8f0 !important; /* slate-200 */
}

/* Primary Color Adjustments (Cyan -> Deep Blue) */
[data-theme="light"] .text-primary {
    color: #0284c7 !important; /* sky-600 */
}

[data-theme="light"] .bg-primary {
    background-color: #0284c7 !important;
    color: #ffffff !important;
}

[data-theme="light"] .border-primary,
[data-theme="light"] .border-primary\/10,
[data-theme="light"] .border-primary\/20,
[data-theme="light"] .border-primary\/30,
[data-theme="light"] .border-primary\/50 {
    border-color: rgba(2, 132, 199, 0.4) !important;
}

[data-theme="light"] .bg-primary\/10,
[data-theme="light"] .bg-primary\/20 {
    background-color: rgba(2, 132, 199, 0.1) !important;
}

/* Secondary Color Adjustments (Magenta -> Deep Rose) */
[data-theme="light"] .text-secondary {
    color: #e11d48 !important; /* rose-600 */
}

[data-theme="light"] .bg-secondary {
    background-color: #e11d48 !important;
    color: #ffffff !important;
}

[data-theme="light"] .border-secondary\/30 {
    border-color: rgba(225, 29, 72, 0.4) !important;
}
[data-theme="light"] .bg-secondary\/20 {
    background-color: rgba(225, 29, 72, 0.1) !important;
}

/* Component Overrides: Glass Effect */
[data-theme="light"] .glass {
    background: rgba(255, 255, 255, 0.7) !important;
    backdrop-filter: blur(12px) !important;
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
}

/* Effects & Shadows */
[data-theme="light"] .neon-text {
    text-shadow: none !important;
}

[data-theme="light"] .drop-shadow-\[0_10px_15px_rgba\(0\,0\,0\,0\.5\)\] {
    filter: drop-shadow(0 10px 15px rgba(0,0,0,0.1)) !important;
}

[data-theme="light"] .shadow-\[0_0_20px_rgba\(0\,242\,255\,0\.1\)\] {
    box-shadow: 0 0 20px rgba(2, 132, 199, 0.1) !important;
}

/* Overlays (like the background image gradient masks) */
[data-theme="light"] .bg-gradient-to-t {
    /* If the gradient goes from dark to transparent, make it from light to transparent */
    background-image: linear-gradient(to top, #ffffff, rgba(255,255,255,0.8), rgba(255,255,255,0.3)) !important;
}
[data-theme="light"] .md\:bg-gradient-to-r {
    background-image: linear-gradient(to right, #ffffff, rgba(255,255,255,0.8), transparent) !important;
}

/* Telegram CTA Fix */
[data-theme="light"] .bg-gradient-to-br {
    background-image: linear-gradient(to bottom right, #f1f5f9, #e2e8f0, #f1f5f9) !important;
}

[data-theme="light"] .bg-white\/\[0\.03\] {
    background-color: rgba(0,0,0,0.03) !important;
}
[data-theme="light"] .border-white\/\[0\.06\] {
    border-color: rgba(0,0,0,0.1) !important;
}

/* ------------------------------------------ */
/* USER REQUESTED CORRECTIONS FOR LIGHT THEME */
/* ------------------------------------------ */

/* 1. Header & Mobile Menu (Barra mais escura, letras brancas) */
[data-theme="light"] header,
[data-theme="light"] #mobile-drawer {
    background-color: #0f172a !important;
    border-color: rgba(255, 255, 255, 0.1) !important;
}
[data-theme="light"] header a.text-slate-400,
[data-theme="light"] #mobile-drawer a.text-slate-300 {
    color: #94a3b8 !important;
}
[data-theme="light"] header a.text-white,
[data-theme="light"] header span.text-white,
[data-theme="light"] #mobile-drawer a.text-white,
[data-theme="light"] header .font-pixel.text-white,
[data-theme="light"] #mobile-drawer .font-pixel.text-white {
    color: #ffffff !important;
}
[data-theme="light"] header a.text-\[\#2AABEE\],
[data-theme="light"] #mobile-drawer a.text-\[\#2AABEE\] {
    color: #2aabee !important;
}
[data-theme="light"] header .theme-toggle-btn.text-slate-400,
[data-theme="light"] header #global-search-btn.text-slate-400,
[data-theme="light"] #mobile-drawer .theme-toggle-btn.text-slate-300 {
    color: #cbd5e1 !important;
}
[data-theme="light"] header a.hover\:text-white:hover,
[data-theme="light"] header button.hover\:text-white:hover,
[data-theme="light"] #mobile-drawer a.hover\:text-white:hover,
[data-theme="light"] #mobile-drawer button.hover\:text-white:hover {
    color: #ffffff !important;
}

/* 2. Telegram CTA (Grupo Exclusivo) - Light Theme Styling */
[data-theme="light"] #telegram-cta {
    background-image: none !important;
    background-color: #f8fafc !important; /* Soft light background */
    border-color: #cbd5e1 !important;     /* Light slate border */
    box-shadow: 0 10px 30px -10px rgba(42,171,238,0.15); /* Soft cyan shadow */
}

/* Titles and Texts */
[data-theme="light"] #telegram-cta h2,
[data-theme="light"] #telegram-cta .text-white {
    color: #0f172a !important; /* Dark text */
}
[data-theme="light"] #telegram-cta p.text-slate-400 {
    color: #475569 !important; /* Slate-600 */
}

/* Benefit Grid items */
[data-theme="light"] #telegram-cta .group.bg-white\/\[0\.03\] {
    background-color: #ffffff !important;
    border-color: #e2e8f0 !important;
}

[data-theme="light"] #telegram-cta .group:hover.bg-white\/\[0\.03\] {
    background-color: rgba(42, 171, 238, 0.05) !important;
    border-color: rgba(42, 171, 238, 0.4) !important;
}

/* 3. Filter Buttons/Labels Hover & Select Boxes (Evitar texto invisível ao passar o mouse ou selecionar) */
[data-theme="light"] .hover\:text-white:hover:not(header *, #mobile-drawer *) {
    color: #0f172a !important; /* Forces text to be dark, ensuring contrast with light hover backgrounds */
}
[data-theme="light"] .hover\:text-white:hover .material-icons {
    color: #0f172a !important;
}
[data-theme="light"] select.bg-\[\#161b22\],
[data-theme="light"] select.bg-card-dark {
    color: #0f172a !important;
    background-color: #f8fafc !important; /* Mais claro para parecer um campo de input normal */
    border-color: #cbd5e1 !important;
}

[data-theme="light"] select:focus {
    border-color: #00f2ff !important;
    box-shadow: 0 0 0 2px rgba(0, 242, 255, 0.2) !important;
}

/* 4. Active Platform Buttons */
/* Make sure active platform buttons have their distinct background colors in light mode too */
[data-theme="light"] .compatibility-btn.active-platform-nintendo {
    background-color: rgba(239, 68, 68, 0.15) !important;
    border-color: #ef4444 !important;
    color: #ef4444 !important;
    font-weight: 800 !important;
}
[data-theme="light"] .compatibility-btn.active-platform-nintendo .material-icons {
    color: #ef4444 !important;
}

[data-theme="light"] .compatibility-btn.active-platform-xbox {
    background-color: rgba(34, 197, 94, 0.15) !important;
    border-color: #22c55e !important;
    color: #22c55e !important;
    font-weight: 800 !important;
}
[data-theme="light"] .compatibility-btn.active-platform-xbox .material-icons {
    color: #22c55e !important;
}

[data-theme="light"] .compatibility-btn.active-platform-playstation {
    background-color: rgba(59, 130, 246, 0.15) !important;
    border-color: #3b82f6 !important;
    color: #3b82f6 !important;
    font-weight: 800 !important;
}
[data-theme="light"] .compatibility-btn.active-platform-playstation .material-icons {
    color: #3b82f6 !important;
}

[data-theme="light"] .compatibility-btn.active-platform-pc {
    background-color: rgba(0, 242, 255, 0.15) !important;
    border-color: #00f2ff !important;
    color: #0f172a !important; /* Texto escuro para PC em tema claro */
    font-weight: 800 !important;
}
[data-theme="light"] .compatibility-btn.active-platform-pc .material-icons {
    color: #0f172a !important; /* ícone escuro */
}

[data-theme="light"] .compatibility-btn.active-platform-mobile {
    background-color: rgba(168, 85, 247, 0.15) !important;
    border-color: #a855f7 !important;
    color: #a855f7 !important;
    font-weight: 800 !important;
}
[data-theme="light"] .compatibility-btn.active-platform-mobile .material-icons {
    color: #a855f7 !important;
}

[data-theme="light"] .compatibility-btn.active-platform-apple {
    background-color: rgba(148, 163, 184, 0.2) !important;
    border-color: #64748b !important;
    color: #475569 !important;
    font-weight: 800 !important;
}
[data-theme="light"] .compatibility-btn.active-platform-apple .material-icons {
    color: #475569 !important;
}

/* Fix Filter Buttons (Compatibilidade / Sensor de movimento) background and text icons */
[data-theme="light"] .compatibility-btn,
[data-theme="light"] .motion-filter-btn {
    background-color: #f8fafc !important; /* Fundo mais claro padrão */
    border-color: #e2e8f0 !important;
    color: #475569 !important;
}

[data-theme="light"] .compatibility-btn .material-icons,
[data-theme="light"] .motion-filter-btn .material-icons {
    color: #64748b !important;
}

/* Fix active states for Motion Filter */
[data-theme="light"] .motion-filter-btn.text-white,
[data-theme="light"] .motion-filter-btn.border-primary {
    background-color: rgba(0, 242, 255, 0.1) !important;
    border-color: #00f2ff !important;
    color: #0f172a !important;
    font-weight: bold !important;
}
[data-theme="light"] .motion-filter-btn.text-white .material-icons {
    color: #00f2ff !important;
}

/* Ensure checkbox labels remain readable e com fundo de destaque if active/checked */
[data-theme="light"] input[type="checkbox"]:checked + span,
[data-theme="light"] input[type="checkbox"]:checked ~ label,
[data-theme="light"] label:has(input[type="checkbox"]:checked) {
    color: #ffffff !important;
    font-weight: 800 !important;
    background-color: #334155 !important; /* Fundo slate-700 (bem mais escuro) */
    border-radius: 4px;
    padding: 2px 4px;
}

/* Fix product score capsule readability in light theme */
[data-theme="light"] .absolute.bg-black\/80.text-white {
    background-color: #0f172a !important; /* Force dark blue slate */
    color: #ffffff !important;
    border-color: #334155 !important;
}

/* 5. Artigos (Texto principal escuro) */
[data-theme="light"] .prose p,
[data-theme="light"] .prose ul,
[data-theme="light"] .prose ol,
[data-theme="light"] .prose blockquote {
    color: #1e293b !important;
}
[data-theme="light"] .prose strong,
[data-theme="light"] .prose h1,
[data-theme="light"] .prose h2,
[data-theme="light"] .prose h3 {
    color: #0f172a !important;
}
[data-theme="light"] .prose blockquote {
    background: rgba(15, 23, 42, 0.05) !important;
    border-left-color: #0284c7 !important;
}

/* 6. Comparativo - Manter aparência da tabela idêntica ao tema padrão */
[data-theme="light"] .compare-table-wrapper {
    background-color: #060b13 !important;
    border-color: rgba(255, 255, 255, 0.09) !important;
}

[data-theme="light"] .slot-card {
    background: rgba(15, 23, 42, 0.7) !important;
    color: #f1f5f9 !important;
}

[data-theme="light"] .compare-sticky-header {
    background: rgba(8, 12, 22, 0.98) !important;
}

[data-theme="light"] .compare-row:hover {
    background: rgba(255, 255, 255, 0.035) !important;
}

/* Neutraliza os textos escurecidos na tabela globalmente */
[data-theme="light"] #comparison-table-section .text-slate-400,
[data-theme="light"] #comparison-table-section .text-slate-500,
[data-theme="light"] #comparison-table-section .text-slate-600,
[data-theme="light"] #comparison-slots .text-slate-400,
[data-theme="light"] #comparison-slots .text-slate-500,
[data-theme="light"] #comparison-slots .text-slate-600,
[data-theme="light"] #comparison-bar .text-slate-500 {
    color: #94a3b8 !important; /* Cor clara original do padrão */
}

[data-theme="light"] #comparison-table-section .text-white,
[data-theme="light"] #comparison-slots .text-white,
[data-theme="light"] #comparison-bar .text-white,
[data-theme="light"] .num-value {
    color: #ffffff !important;
}

/* 7. Barra Flutuante de Comparação (Fix for text contrast loop) */
[data-theme="light"] #comparison-bar {
    color: #ffffff !important; 
}
[data-theme="light"] #comparison-bar .bg-\[\#0f172a\]\/95 {
    background-color: rgba(15, 23, 42, 0.95) !important; /* Ensure bg is dark */
}
[data-theme="light"] #global-selected-items-container .text-white {
    color: #ffffff !important;
}
[data-theme="light"] #global-selected-items-container .bg-slate-800\/50,
[data-theme="light"] #global-selected-items-container .bg-slate-900 {
    background-color: #1e293b !important;
    color: #ffffff !important;
}

/* 8. Caixas de Pesquisa (Search Inputs & Modals globais) */
[data-theme="light"] #ranking-search,
[data-theme="light"] #modal-search-input,
[data-theme="light"] #search-input,
[data-theme="light"] #global-search-input,
[data-theme="light"] input[type="text"].bg-\[\#1e293b\],
[data-theme="light"] input[type="text"].bg-\[\#161b22\],
[data-theme="light"] input[type="text"].bg-black\/40 {
    color: #ffffff !important;
    background-color: #1e293b !important;
}
[data-theme="light"] #ranking-search::placeholder,
[data-theme="light"] #modal-search-input::placeholder,
[data-theme="light"] #search-input::placeholder,
[data-theme="light"] #global-search-input::placeholder {
    color: #94a3b8 !important;
}

[data-theme="light"] #global-search-results .text-accent,
[data-theme="light"] #global-search-results .text-primary {
    color: var(--primary) !important; /* Preserva as cores accent em light theme se invertidas */
}

/* 9. Botão Ranking Geral */
[data-theme="light"] #side-ranking-btn .text-slate-200,
[data-theme="light"] #side-ranking-btn .text-slate-500 {
    color: #ffffff !important;
}

[data-theme="light"] #side-ranking-btn:hover {
    background-color: rgba(0, 242, 255, 0.05) !important;
    border-color: rgba(0, 242, 255, 0.5) !important;
}
[data-theme="light"] #side-ranking-btn:hover .text-slate-200,
[data-theme="light"] #side-ranking-btn:hover .text-slate-500 {
    color: #00f2ff !important;
}

/* 10. Tags de Plataforma (Review Detalhado) */
[data-theme="light"] #platform-tags span {
    color: #f8fafc !important; /* Quase branco */
}
[data-theme="light"] #platform-tags span .material-icons {
    color: #cbd5e1 !important; /* slate-300 origin */
}

/* 11. Especificações (Review Detalhado) - Force Dark Zone */
[data-theme="light"] #review-specs-section .text-2xl.font-pixel.text-primary {
    color: #00b8cc !important; /* cyan escurecido */
}

[data-theme="light"] #review-specs-section #performance-block,
[data-theme="light"] #review-specs-section .spec-tile {
    background-color: #1e293b !important; /* slate-800, escura um pouco mais clara */
    border-color: rgba(0, 184, 204, 0.1) !important;
}

[data-theme="light"] #review-specs-section .spec-tile:hover {
    background-color: #334155 !important; /* slate-700, para o hover */
    border-color: rgba(0, 184, 204, 0.3) !important;
}

[data-theme="light"] #review-specs-section .text-white,
[data-theme="light"] #review-specs-section .text-slate-100,
[data-theme="light"] #review-specs-section .text-slate-200,
[data-theme="light"] #review-specs-section .text-slate-300 {
    color: #ffffff !important;
}

[data-theme="light"] #review-specs-section .text-slate-400,
[data-theme="light"] #review-specs-section .text-slate-500 {
    color: #8b949e !important; /* Restore dark-theme label color */
}

[data-theme="light"] #review-specs-section .text-primary,
[data-theme="light"] #review-specs-section .material-icons {
    color: #00b8cc !important; /* cyan escurecido */
}

[data-theme="light"] #review-specs-section .bg-primary\/10 {
    background-color: rgba(0, 184, 204, 0.1) !important;
}

[data-theme="light"] #review-specs-section .progress-bar {
    background: rgba(255, 255, 255, 0.1) !important;
}

[data-theme="light"] #review-specs-section .h-px.bg-slate-800 {
    background-color: #30363d !important;
}

/* 12. Botões de Review (Manter cor original no Tema Claro) */
[data-theme="light"] #text-review-btn {
    color: #ffffff !important;
}
[data-theme="light"] #text-review-btn .material-icons {
    color: #ffffff !important;
}

/* 13. Resumo de Review em Artigos (Nota Final, Prós e Contras) */
[data-theme="light"] .review-footer {
    border-top-color: rgba(0, 0, 0, 0.1) !important;
}

[data-theme="light"] .score-banner-premium {
    background: linear-gradient(135deg, rgba(15, 23, 42, 0.95), rgba(15, 23, 42, 0.8)) !important;
    border-color: #00f2ff !important;
    box-shadow: 0 0 40px rgba(0, 242, 255, 0.1) !important;
}

[data-theme="light"] .score-banner-premium::before {
    color: rgba(0, 242, 255, 0.05) !important;
}

[data-theme="light"] .score-value {
    color: #ffffff !important;
    text-shadow: 0 0 30px rgba(0, 242, 255, 0.6) !important;
}

[data-theme="light"] .score-label {
    color: #00f2ff !important;
}

/* 14. Banner de Pontuação (Review Detalhado Superior) */
[data-theme="light"] #review-score-banner {
    background-color: #1e293b !important; /* Fundo escuro leve */
    border-color: rgba(0, 184, 204, 0.3) !important;
}
[data-theme="light"] #review-score-banner .text-primary {
    color: #00b8cc !important; /* Ciano ajustado */
}
[data-theme="light"] #review-score-banner .text-slate-500 {
    color: #94a3b8 !important; /* Mantém cinza neutro no / 10 */
}
[data-theme="light"] #review-score-banner .neon-text {
    text-shadow: 0 0 8px rgba(0, 184, 204, 0.4) !important;
}

[data-theme="light"] .pros-block {
    background: rgba(16, 185, 129, 0.1) !important;
    border-color: rgba(16, 185, 129, 0.3) !important;
}

[data-theme="light"] .pros-block h4 {
    color: #10b981 !important;
}

[data-theme="light"] .pros-block ul {
    color: #1e293b !important; /* Texto escuro para leitura no fundo verde claro */
}

[data-theme="light"] .cons-block {
    background: rgba(239, 68, 68, 0.1) !important;
    border-color: rgba(239, 68, 68, 0.3) !important;
}

[data-theme="light"] .cons-block h4 {
    color: #ef4444 !important;
}

[data-theme="light"] .cons-block ul {
    color: #1e293b !important; /* Texto escuro para leitura no fundo vermelho claro */
}

[data-theme="light"] #linked-controller-mini .text-white {
    color: #ffffff !important;
}

[data-theme="light"] #linked-controller-mini.glass {
    background: #0f172a !important; /* Force mini controller card to be dark */
}

/* Ajustes no mobile para a primeira coluna da tabela do Comparativo */
@media (max-width: 768px) {
    [data-theme="light"] #comparison-table-section .compare-cell.label-cell {
        background-color: #060b13 !important;
    }
    [data-theme="light"] #comparison-table-section .compare-sticky-header .compare-cell.label-cell {
        background: rgba(8, 12, 22, 0.98) !important;
    }
    [data-theme="light"] #comparison-table-section .compare-row {
        background: #060b13 !important;
    }
    [data-theme="light"] #comparison-table-section .compare-row:hover {
        background: rgba(255, 255, 255, 0.05) !important;
    }
}
