/* CSS-Only Theme Loader - Include this BEFORE themes.css */
/* This ensures themes apply instantly without JavaScript flash */

/* Default theme footer background */
:root {
    --footer-bg: #1a252f;
    --sidebar-bg: #1a252f;
    --navbar-dark-bg: #151e26;
    --sidebar-sub-bg: #1b212a;
    /* Default theme badge colors */
    --badge-light-color: #495057;
    --badge-dark-color: #ffffff;
    --badge-primary-color: #ffffff;
    --badge-secondary-color: #ffffff;
    --badge-success-color: #ffffff;
    --badge-info-color: #ffffff;
    --badge-warning-color: #212529;
    --badge-danger-color: #ffffff;
}

/* Theme Detection via CSS Classes */
html.theme-ocean { 
    --theme-mode: ocean; 
}
html.theme-forest { 
    --theme-mode: forest; 
}
html.theme-sunset { 
    --theme-mode: sunset; 
}
html.theme-dark { 
    --theme-mode: dark; 
}
html.theme-corporate { 
    --theme-mode: corporate; 
}

/* Apply themes based on CSS classes */
html.theme-ocean {
    /* Ocean Blue Theme Variables */
    --bs-primary: #0077be;
    --bs-primary-rgb: 0, 119, 190;
    --bs-body-bg: #f4f6f8;
    --bs-body-color: #1a2b3d;
    --bs-link-color: #0077be;
    --bs-border-color: #d1e7f0;
    --primary-color: #0077be;
    --bg-card: #ffffff;
    --card-header-bg: #0077be;
    --card-header-color: white;
    --sidebar-bg: #1a2a3a;
    --navbar-dark-bg: #15232f;
    --sidebar-sub-bg: #1b212a;
    --sidebar-link-color: #a8b7c5;
    --sidebar-scrollbar-color: #758089;
    --footer-bg: #0f1e2b;
    /* Ocean theme badge colors */
    --badge-light-color: #1a2b3d;
    --badge-dark-color: #ffffff;
    --badge-primary-color: #ffffff;
    --badge-secondary-color: #ffffff;
    --badge-success-color: #ffffff;
    --badge-info-color: #ffffff;
    --badge-warning-color: #212529;
    --badge-danger-color: #ffffff;
}

html.theme-forest {
    /* Forest Green Theme Variables */
    --bs-primary: #2d5016;
    --bs-primary-rgb: 45, 80, 22;
    --bs-body-bg: #f7fafc;
    --bs-body-color: #1a202c;
    --bs-link-color: #2d5016;
    --bs-border-color: #e2e8f0;
    --primary-color: #2d5016;
    --bg-card: #ffffff;
    --card-header-bg: #2d5016;
    --card-header-color: white;
    --sidebar-bg: #1a2f1a;
    --navbar-dark-bg: #152615;
    --sidebar-sub-bg: #1b212a;
    --sidebar-link-color: #a8c5a8;
    --sidebar-scrollbar-color: #758a75;
    --footer-bg: #0f1e0f;
    /* Forest theme badge colors */
    --badge-light-color: #1a202c;
    --badge-dark-color: #ffffff;
    --badge-primary-color: #ffffff;
    --badge-secondary-color: #ffffff;
    --badge-success-color: #ffffff;
    --badge-info-color: #ffffff;
    --badge-warning-color: #212529;
    --badge-danger-color: #ffffff;
}

html.theme-sunset {
    /* Sunset Orange Theme Variables */
    --bs-primary: #ff6b35;
    --bs-primary-rgb: 255, 107, 53;
    --bs-body-bg: #fffaf7;
    --bs-body-color: #1a202c;
    --bs-link-color: #ff6b35;
    --bs-border-color: #f7e6dc;
    --primary-color: #ff6b35;
    --bg-card: #ffffff;
    --card-header-bg: #ff6b35;
    --card-header-color: white;
    --sidebar-bg: #2d1a0f;
    --navbar-dark-bg: #24150c;
    --sidebar-sub-bg: #1b212a;
    --sidebar-link-color: #c5b5a8;
    --sidebar-scrollbar-color: #8a7e75;
    --footer-bg: #1f0e08;
    /* Sunset theme badge colors */
    --badge-light-color: #1a202c;
    --badge-dark-color: #ffffff;
    --badge-primary-color: #ffffff;
    --badge-secondary-color: #ffffff;
    --badge-success-color: #ffffff;
    --badge-info-color: #ffffff;
    --badge-warning-color: #212529;
    --badge-danger-color: #ffffff;
}

html.theme-dark {
    /* Dark Theme Variables */
    --bs-primary: #667eea;
    --bs-primary-rgb: 102, 126, 234;
    --bs-body-bg: #1a202c;
    --bs-body-color: #f7fafc;
    --bs-link-color: #667eea;
    --bs-border-color: #8c8c8c;
    --primary-color: #667eea;
    --bg-card: #2d3748;
    --card-header-bg: #667eea;
    --card-header-color: white;
    --sidebar-bg: #0f1419;
    --navbar-dark-bg: #0a0e12;
    --sidebar-sub-bg: #1b212a;
    --sidebar-link-color: #a8b7c5;
    --sidebar-scrollbar-color: #758089;
    --footer-bg: #08090b;
    /* Table striping variables for dark theme */
    --bs-table-striped-bg: #374151;
    --bs-table-striped-color: #f7fafc;
    --bs-table-bg: #2d3748;
    --bs-table-color: #f7fafc;
    /* Dark theme badge colors */
    --badge-light-color: #212529;
    --badge-dark-color: #f7fafc;
    --badge-primary-color: #ffffff;
    --badge-secondary-color: #f7fafc;
    --badge-success-color: #ffffff;
    --badge-info-color: #ffffff;
    --badge-warning-color: #212529;
    --badge-danger-color: #ffffff;
}

/* Dark theme table striping rules */
html.theme-dark .table-striped tbody tr:nth-of-type(odd) {
    background-color: #374151 !important;
    color: #f7fafc !important;
}

html.theme-dark .table-striped tbody tr:nth-of-type(odd) td {
    background-color: #374151 !important;
    color: #f7fafc !important;
    --bs-table-bg-type: #374151;
}

/* Muted table borders for dark theme */
html.theme-dark .table-striped td,
html.theme-dark .table-striped th {
    border-color: #4a5568 !important;
}

html.theme-dark .table td,
html.theme-dark .table th {
    border-color: #4a5568 !important;
}

/* Theme-sensitive navbar-dark styling for all themes */
.navbar-dark {
    background-color: var(--sidebar-bg) !important;
}

.navbar-dark .navbar-nav .nav-link {
    color: var(--sidebar-link-color) !important;
}

.navbar-dark .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:focus {
    color: var(--bs-body-color) !important;
    opacity: 0.8;
}

.navbar-dark .navbar-brand {
    color: var(--bs-body-color) !important;
}

.navbar-dark .navbar-text {
    color: var(--sidebar-link-color) !important;
}

/* Invert logo colors for dark navbar backgrounds */
html.theme-dark .navbar-dark .toptoplogo {
    filter: invert(1) brightness(0.9) !important;
}

html.theme-corporate {
    /* Corporate Blue Theme Variables */
    --bs-primary: #1e3a8a;
    --bs-primary-rgb: 30, 58, 138;
    --bs-body-bg: #f8fafc;
    --bs-body-color: #0f172a;
    --bs-link-color: #1e3a8a;
    --bs-border-color: #e2e8f0;
    --primary-color: #1e3a8a;
    --bg-card: #ffffff;
    --card-header-bg: #1e3a8a;
    --card-header-color: white;
    --sidebar-bg: #1a2238;
    --navbar-dark-bg: #151c2c;
    --sidebar-sub-bg: #1b212a;
    --sidebar-link-color: #a8b7c5;
    --sidebar-scrollbar-color: #758089;
    --footer-bg: #0f1426;
    /* Corporate theme badge colors */
    --badge-light-color: #0f172a;
    --badge-dark-color: #ffffff;
    --badge-primary-color: #ffffff;
    --badge-secondary-color: #ffffff;
    --badge-success-color: #ffffff;
    --badge-info-color: #ffffff;
    --badge-warning-color: #212529;
    --badge-danger-color: #ffffff;
}

/* Badge CSS Classes */
.badge-light {
    color: var(--badge-light-color) !important;
}

.badge-dark {
    color: var(--badge-dark-color) !important;
}

.badge-primary {
    color: var(--badge-primary-color) !important;
}

.badge-secondary {
    color: var(--badge-secondary-color) !important;
}

.badge-success {
    color: var(--badge-success-color) !important;
}

.badge-info {
    color: var(--badge-info-color) !important;
}

.badge-warning {
    color: var(--badge-warning-color) !important;
}

.badge-danger {
    color: var(--badge-danger-color) !important;
}

/* Card Header Styling with Background Classes */
.card-header .card-title {
    color: var(--card-header-color, white) !important;
}

.card-header .card-title a {
    color: var(--card-header-color, white) !important;
}

/* Ensure card titles in dark background headers are light colored */
.card-header.bg-primary .card-title,
.card-header.bg-secondary .card-title,
.card-header.bg-success .card-title,
.card-header.bg-danger .card-title,
.card-header.bg-info .card-title,
.card-header.bg-dark .card-title {
    color: white !important;
}

.card-header.bg-primary .card-title a,
.card-header.bg-secondary .card-title a,
.card-header.bg-success .card-title a,
.card-header.bg-danger .card-title a,
.card-header.bg-info .card-title a,
.card-header.bg-dark .card-title a {
    color: white !important;
}

.card-header.bg-warning .card-title,
.card-header.bg-light .card-title {
    color: var(--bs-body-color) !important;
}

.card-header.bg-warning .card-title a,
.card-header.bg-light .card-title a {
    color: var(--bs-body-color) !important;
}

/* Bootstrap Background Utility Classes */
.bg-primary {
    background-color: var(--bs-primary) !important;
    color: white !important;
}

.bg-secondary {
    background-color: var(--bs-secondary) !important;
    color: white !important;
}

.bg-success {
    background-color: var(--bs-success) !important;
    color: white !important;
}

.bg-danger {
    background-color: var(--bs-danger) !important;
    color: white !important;
}

.bg-warning {
    background-color: var(--bs-warning) !important;
    color: var(--bs-body-color) !important;
}

.bg-info {
    background-color: var(--bs-info) !important;
    color: white !important;
}

.bg-light {
    background-color: var(--bs-light) !important;
    color: var(--bs-body-color) !important;
}

.bg-dark {
    background-color: var(--bs-dark) !important;
    color: white !important;
}

/* Modal Header Styling with Background Classes */
.modal-header .modal-title {
    color: white !important;
}

/* Ensure modal titles in dark background headers are light colored */
.modal-header.bg-primary .modal-title,
.modal-header.bg-secondary .modal-title,
.modal-header.bg-success .modal-title,
.modal-header.bg-danger .modal-title,
.modal-header.bg-info .modal-title,
.modal-header.bg-dark .modal-title {
    color: white !important;
}

.modal-header.bg-warning .modal-title,
.modal-header.bg-light .modal-title {
    color: var(--bs-body-color) !important;
}

/* Bootstrap Table Header Theme Classes */

/* Standard theme classes */
.table .thead-primary th,
.thead-primary th,
.thead-primary {
    background-color: var(--bs-primary);
    color: #fff;
    border-color: var(--bs-primary);
}

.table .thead-secondary th,
.thead-secondary th,
.thead-secondary {
    background-color: var(--bs-secondary);
    color: #fff;
    border-color: var(--bs-secondary);
}

.table .thead-success th,
.thead-success th,
.thead-success {
    background-color: var(--bs-success);
    color: #fff;
    border-color: var(--bs-success);
}

.table .thead-info th,
.thead-info th,
.thead-info {
    background-color: var(--bs-info);
    color: #fff;
    border-color: var(--bs-info);
}

.table .thead-warning th,
.thead-warning th,
.thead-warning {
    background-color: var(--bs-warning);
    color: #212529;
    border-color: var(--bs-warning);
}

.table .thead-danger th,
.thead-danger th,
.thead-danger {
    background-color: var(--bs-danger);
    color: #fff;
    border-color: var(--bs-danger);
}

.table .thead-light th,
.thead-light th,
.thead-light {
    background-color: var(--bs-light);
    color: #495057;
    border-color: var(--bs-border-color);
}

.table .thead-dark th,
.thead-dark th,
.thead-dark {
    background-color: var(--bs-dark);
    color: #fff;
    border-color: var(--bs-dark);
}

/* Subtle variants using Bootstrap's subtle colors */
.table .thead-primary-subtle th,
.thead-primary-subtle th,
.thead-primary-subtle {
    background-color: var(--bs-primary-bg-subtle);
    color: var(--bs-primary-text-emphasis);
    border-color: var(--bs-primary-border-subtle);
}

.table .thead-secondary-subtle th,
.thead-secondary-subtle th,
.thead-secondary-subtle {
    background-color: var(--bs-secondary-bg-subtle);
    color: var(--bs-secondary-text-emphasis);
    border-color: var(--bs-secondary-border-subtle);
}

.table .thead-success-subtle th,
.thead-success-subtle th,
.thead-success-subtle {
    background-color: var(--bs-success-bg-subtle);
    color: var(--bs-success-text-emphasis);
    border-color: var(--bs-success-border-subtle);
}

.table .thead-info-subtle th,
.thead-info-subtle th,
.thead-info-subtle {
    background-color: var(--bs-info-bg-subtle);
    color: var(--bs-info-text-emphasis);
    border-color: var(--bs-info-border-subtle);
}

.table .thead-warning-subtle th,
.thead-warning-subtle th,
.thead-warning-subtle {
    background-color: var(--bs-warning-bg-subtle);
    color: var(--bs-warning-text-emphasis);
    border-color: var(--bs-warning-border-subtle);
}

.table .thead-danger-subtle th,
.thead-danger-subtle th,
.thead-danger-subtle {
    background-color: var(--bs-danger-bg-subtle);
    color: var(--bs-danger-text-emphasis);
    border-color: var(--bs-danger-border-subtle);
}

/* Instant Theme Application Script */
/* Add this inline script to the <head> of your pages */
/*
<script>
(function() {
    const theme = localStorage.getItem('proteus-theme');
    if (theme && theme !== 'default') {
        document.documentElement.className = 'theme-' + theme;
    }
})();
</script>
*/