/* public/assets/css/themes.css */
[data-bs-theme="light"], body.tema-claro {
    --hms-bg: var(--hms-bg-page);
    --hms-surface: var(--hms-bg-surface);
    --hms-surface-muted: var(--hms-bg-surface-muted);
    --hms-border: var(--hms-border-color);
    --hms-text: var(--hms-text-primary);
    --hms-text-muted: var(--hms-color-brand-gray-500);
    --hms-primary: var(--hms-color-primary-50);
    --hms-primary-hover: var(--hms-color-primary-700);
    --hms-accent: var(--hms-color-accent);
    --hms-accent-hover: var(--hms-color-accent-dark);
    --hms-link: var(--hms-color-brand-blue-600);
    --hms-shadow: var(--hms-shadow-md);
    --hms-focus: var(--hms-focus-ring);
}

[data-bs-theme="dark"], body.tema-escuro {
    /* Surface tokens (modo escuro quente) — base + tematizados alinhados (#141210 fundo) */
    --hms-bg: #141210;
    --hms-bg-page: #141210;
    --hms-bg-page-rgb: 20, 18, 16;
    --hms-surface: #1E1A17;
    --hms-bg-surface: #1E1A17;
    --hms-bg-surface-rgb: 30, 26, 23;
    --hms-surface-muted: #2A2521;
    --hms-bg-surface-muted: #2A2521;
    --hms-border: #3A342E;
    --hms-border-color: #3A342E;
    --hms-text: #F5F1EA;
    --hms-text-muted: #D5CEC4;
    --hms-text-primary: #F5F1EA;
    --hms-text-secondary: #D5CEC4;

    /* Cor PRIMÁRIA permanece VERMELHO no escuro (identidade da marca); laranja é acento */
    --hms-primary: var(--hms-color-brand-red-500);
    --hms-primary-rgb: 229, 57, 53;
    --hms-primary-hover: var(--hms-color-brand-red-400);
    --hms-accent: var(--hms-color-brand-orange-400);
    --hms-accent-rgb: 247, 163, 64;
    --hms-accent-hover: var(--hms-color-brand-orange-300);
    
    --hms-link: var(--hms-color-brand-blue-400); /* Azul claro de apoio para contraste */
    --hms-link-rgb: 96, 165, 250;
    
    --hms-shadow-color-rgb: 0, 0, 0;
    --hms-shadow: 0 0.125rem 0.75rem rgba(var(--hms-shadow-color-rgb), .35);
    --hms-table-striped-bg: rgba(255, 255, 255, .02);
    --hms-focus-ring-color-rgb: 247, 163, 64;
    --hms-focus-outline-color: rgb(var(--hms-focus-ring-color-rgb));
    --hms-focus: 0 0 0 0.22rem rgba(var(--hms-focus-ring-color-rgb), .28);
    
    --hms-color-info: var(--hms-color-brand-blue-400);
    --hms-color-info-rgb: 96, 165, 250;
    --hms-color-info-bg: rgba(var(--hms-color-info-rgb), 0.16);
    
    --hms-color-secondary: var(--hms-color-brand-gray-300);
    --hms-color-secondary-rgb: 184, 184, 184;
    --hms-color-secondary-bg: rgba(var(--hms-color-secondary-rgb), 0.12);
    
    --hms-color-danger: var(--hms-color-brand-red-400);
    --hms-color-danger-rgb: 234, 98, 94;
    --hms-color-danger-bg: rgba(var(--hms-color-danger-rgb), 0.18);
    
    --hms-color-warning: var(--hms-color-brand-orange-400);
    --hms-color-warning-rgb: 247, 163, 64;
    --hms-color-warning-bg: rgba(var(--hms-color-warning-rgb), 0.16);
    
    --hms-color-success: var(--hms-color-brand-green-400);
    --hms-color-success-rgb: 103, 187, 112;
    --hms-color-success-bg: rgba(103, 187, 112, 0.16);
    --hms-color-success-dark: var(--hms-color-brand-green-500);

    /* Pontes de retrocompatibilidade para app.css */
    --ms-green: var(--hms-primary) !important;
    --ms-green-dark: var(--hms-primary-hover) !important;
    --ms-green-soft: rgba(var(--hms-color-danger-rgb), 0.18) !important;
    --ms-brand-orange-soft: rgba(var(--hms-color-warning-rgb), 0.18) !important;
    --ms-yellow: var(--hms-accent) !important;
    --ms-bg: var(--hms-bg) !important;
    --ms-ink: var(--hms-text) !important;
    --ms-muted: var(--hms-text-muted) !important;
    --ms-border: var(--hms-border) !important;
    --ms-bg-light: var(--hms-surface-muted) !important;

    /* Pontes Bootstrap */
    --bs-primary: var(--hms-primary);
    --bs-primary-rgb: var(--hms-primary-rgb);
    --bs-success: var(--hms-color-success);
    --bs-success-rgb: var(--hms-color-success-rgb);
    --bs-warning: var(--hms-accent);
    --bs-warning-rgb: var(--hms-accent-rgb);
    --bs-info: var(--hms-color-info);
    --bs-info-rgb: var(--hms-color-info-rgb);
    --bs-secondary: var(--hms-color-secondary);
    --bs-secondary-rgb: var(--hms-color-secondary-rgb);
    --bs-danger: var(--hms-color-danger);
    --bs-danger-rgb: var(--hms-color-danger-rgb);
    --bs-body-bg: var(--hms-bg);
    --bs-body-color: var(--hms-text);
    --bs-border-color: var(--hms-border);
    --bs-link-color: var(--hms-link);
    --bs-link-hover-color: var(--hms-primary-hover);
}

@media (prefers-color-scheme: dark) {
    [data-bs-theme="auto"], body.tema-auto {
        /* Surface tokens (modo escuro quente) — base + tematizados alinhados (#141210 fundo) */
        --hms-bg: #141210;
        --hms-bg-page: #141210;
        --hms-bg-page-rgb: 20, 18, 16;
        --hms-surface: #1E1A17;
        --hms-bg-surface: #1E1A17;
        --hms-bg-surface-rgb: 30, 26, 23;
        --hms-surface-muted: #2A2521;
        --hms-bg-surface-muted: #2A2521;
        --hms-border: #3A342E;
        --hms-border-color: #3A342E;
        --hms-text: #F5F1EA;
        --hms-text-muted: #D5CEC4;
        --hms-text-primary: #F5F1EA;
        --hms-text-secondary: #D5CEC4;

        /* Cor PRIMÁRIA permanece VERMELHO no escuro (identidade da marca); laranja é acento */
        --hms-primary: var(--hms-color-brand-red-500);
        --hms-primary-rgb: 229, 57, 53;
        --hms-primary-hover: var(--hms-color-brand-red-400);
        --hms-accent: var(--hms-color-brand-orange-400);
        --hms-accent-rgb: 247, 163, 64;
        --hms-accent-hover: var(--hms-color-brand-orange-300);
        
        --hms-link: var(--hms-color-brand-blue-400);
        --hms-link-rgb: 96, 165, 250;
        
        --hms-shadow-color-rgb: 0, 0, 0;
        --hms-shadow: 0 0.125rem 0.75rem rgba(var(--hms-shadow-color-rgb), .35);
        --hms-table-striped-bg: rgba(255, 255, 255, .02);
        --hms-focus-ring-color-rgb: 247, 163, 64;
        --hms-focus-outline-color: rgb(var(--hms-focus-ring-color-rgb));
        --hms-focus: 0 0 0 0.22rem rgba(var(--hms-focus-ring-color-rgb), .28);
        
        --hms-color-info: var(--hms-color-brand-blue-400);
        --hms-color-info-rgb: 96, 165, 250;
        --hms-color-info-bg: rgba(var(--hms-color-info-rgb), 0.16);
        
        --hms-color-secondary: var(--hms-color-brand-gray-300);
        --hms-color-secondary-rgb: 184, 184, 184;
        --hms-color-secondary-bg: rgba(var(--hms-color-secondary-rgb), 0.12);
        
        --hms-color-danger: var(--hms-color-brand-red-400);
        --hms-color-danger-rgb: 234, 98, 94;
        --hms-color-danger-bg: rgba(var(--hms-color-danger-rgb), 0.18);
        
        --hms-color-warning: var(--hms-color-brand-orange-400);
        --hms-color-warning-rgb: 247, 163, 64;
        --hms-color-warning-bg: rgba(var(--hms-color-warning-rgb), 0.16);
        
        --hms-color-success: var(--hms-color-brand-green-400);
        --hms-color-success-rgb: 103, 187, 112;
        --hms-color-success-bg: rgba(103, 187, 112, 0.16);
        --hms-color-success-dark: var(--hms-color-brand-green-500);

        /* Pontes de retrocompatibilidade para app.css */
        --ms-green: var(--hms-primary) !important;
        --ms-green-dark: var(--hms-primary-hover) !important;
        --ms-green-soft: rgba(var(--hms-color-danger-rgb), 0.18) !important;
        --ms-brand-orange-soft: rgba(var(--hms-color-warning-rgb), 0.18) !important;
        --ms-yellow: var(--hms-accent) !important;
        --ms-bg: var(--hms-bg) !important;
        --ms-ink: var(--hms-text) !important;
        --ms-muted: var(--hms-text-muted) !important;
        --ms-border: var(--hms-border) !important;
        --ms-bg-light: var(--hms-surface-muted) !important;

        /* Pontes Bootstrap */
        --bs-primary: var(--hms-primary);
        --bs-primary-rgb: var(--hms-primary-rgb);
        --bs-success: var(--hms-color-success);
        --bs-success-rgb: var(--hms-color-success-rgb);
        --bs-warning: var(--hms-accent);
        --bs-warning-rgb: var(--hms-accent-rgb);
        --bs-info: var(--hms-color-info);
        --bs-info-rgb: var(--hms-color-info-rgb);
        --bs-secondary: var(--hms-color-secondary);
        --bs-secondary-rgb: var(--hms-color-secondary-rgb);
        --bs-danger: var(--hms-color-danger);
        --bs-danger-rgb: var(--hms-color-danger-rgb);
        --bs-body-bg: var(--hms-bg);
        --bs-body-color: var(--hms-text);
        --bs-border-color: var(--hms-border);
        --bs-link-color: var(--hms-link);
        --bs-link-hover-color: var(--hms-primary-hover);
    }
}

/* Custom Overrides linking Bootstrap elements to our theme variables if needed */
/* Note: Bootstrap 5.3 handles most of the dark mode natively via data-bs-theme="dark", 
   but our custom components can use --hms variables. */

body {
    background-color: var(--hms-bg);
    color: var(--hms-text);
}

.theme-switcher {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}

.theme-switcher select {
    min-width: 130px;
}

/* =========================================================
   THEME HARMONIZATION OVERRIDES FOR BOOTSTRAP UTILITIES
   ========================================================= */

body.tema-escuro .bg-white,
[data-bs-theme="dark"] .bg-white {
    background-color: var(--hms-surface) !important;
}

body.tema-escuro .bg-light,
[data-bs-theme="dark"] .bg-light {
    background-color: var(--hms-surface-muted) !important;
}

body.tema-escuro .text-dark,
[data-bs-theme="dark"] .text-dark,
body.tema-escuro .text-black,
[data-bs-theme="dark"] .text-black {
    color: var(--hms-text) !important;
}

body.tema-escuro .text-muted,
[data-bs-theme="dark"] .text-muted {
    color: var(--hms-text-muted) !important;
}

body.tema-escuro .border,
[data-bs-theme="dark"] .border,
body.tema-escuro .border-bottom,
[data-bs-theme="dark"] .border-bottom,
body.tema-escuro .border-top,
[data-bs-theme="dark"] .border-top,
body.tema-escuro .border-start,
[data-bs-theme="dark"] .border-start,
body.tema-escuro .border-end,
[data-bs-theme="dark"] .border-end {
    border-color: var(--hms-border) !important;
}

/* Specific component fixes for dark mode */
body.tema-escuro .support-thread-body,
[data-bs-theme="dark"] .support-thread-body {
    background-color: var(--hms-surface-muted) !important;
}

body.tema-escuro .bg-secondary.bg-opacity-10.text-dark,
[data-bs-theme="dark"] .bg-secondary.bg-opacity-10.text-dark {
    background-color: rgba(var(--hms-text-inverse-rgb, 255, 255, 255), .08) !important;
    color: var(--hms-text) !important;
}

@media (prefers-color-scheme: dark) {
    [data-bs-theme="auto"] .bg-white,
    body.tema-auto .bg-white {
        background-color: var(--hms-surface) !important;
    }

    [data-bs-theme="auto"] .bg-light,
    body.tema-auto .bg-light {
        background-color: var(--hms-surface-muted) !important;
    }

    [data-bs-theme="auto"] .text-dark,
    body.tema-auto .text-dark,
    [data-bs-theme="auto"] .text-black,
    body.tema-auto .text-black {
        color: var(--hms-text) !important;
    }

    [data-bs-theme="auto"] .text-muted,
    body.tema-auto .text-muted {
        color: var(--hms-text-muted) !important;
    }

    [data-bs-theme="auto"] .border,
    body.tema-auto .border {
        border-color: var(--hms-border) !important;
    }

    [data-bs-theme="auto"] .support-thread-body,
    body.tema-auto .support-thread-body {
        background-color: var(--hms-surface-muted) !important;
    }

    [data-bs-theme="auto"] .bg-secondary.bg-opacity-10.text-dark,
    body.tema-auto .bg-secondary.bg-opacity-10.text-dark {
        background-color: rgba(var(--hms-text-inverse-rgb, 255, 255, 255), .08) !important;
        color: var(--hms-text) !important;
    }
}

/* =========================================================
   DARK MODE COMPONENT OVERRIDES (SIDEBAR, FOOTER)
   ========================================================= */

body.tema-escuro .app-sidebar,
[data-bs-theme="dark"] .app-sidebar,
body.tema-escuro .site-footer,
[data-bs-theme="dark"] .site-footer {
    background: var(--hms-surface-muted) !important;
    border-color: var(--hms-border) !important;
    color: var(--hms-text) !important;
}

body.tema-escuro .app-sidebar .sidebar-link,
[data-bs-theme="dark"] .app-sidebar .sidebar-link {
    color: var(--hms-text-muted);
}

body.tema-escuro .app-sidebar .sidebar-link:hover,
[data-bs-theme="dark"] .app-sidebar .sidebar-link:hover,
body.tema-escuro .app-sidebar .sidebar-link.active,
[data-bs-theme="dark"] .app-sidebar .sidebar-link.active {
    background: var(--hms-surface) !important;
    color: var(--hms-primary) !important;
}

body.tema-escuro .site-footer a,
[data-bs-theme="dark"] .site-footer a {
    color: var(--hms-link) !important;
}

body.tema-escuro .site-footer a:hover,
[data-bs-theme="dark"] .site-footer a:hover {
    color: var(--hms-primary) !important;
}

@media (prefers-color-scheme: dark) {
    body.tema-auto .app-sidebar,
    body.tema-auto .site-footer {
        background: var(--hms-surface-muted) !important;
        border-color: var(--hms-border) !important;
        color: var(--hms-text) !important;
    }
    body.tema-auto .app-sidebar .sidebar-link {
        color: var(--hms-text-muted);
    }
    body.tema-auto .app-sidebar .sidebar-link:hover,
    body.tema-auto .app-sidebar .sidebar-link.active {
        background: var(--hms-surface) !important;
        color: var(--hms-primary) !important;
    }
    body.tema-auto .site-footer a {
        color: var(--hms-link) !important;
    }
    body.tema-auto .site-footer a:hover {
        color: var(--hms-primary) !important;
    }
}