/**
 * themes.css - Thèmes multiples : Jaune, Bleu, Vert, Orange, Clair et Noir
 * Étend dark-mode.css pour supporter 6 thèmes au lieu de 2
 */

/* ========== THÈME CLAIR (par défaut) ========== */
[data-theme="clair"] {
    --bg-color: #ffffff;
    --text-color: #212529;
    --card-bg: #ffffff;
    --border-color: #dee2e6;
    --footer-bg: #f8f9fa;
    --accent-color: #0d6efd;
    --accent-hover: #0b5ed7;
    --body-bg: #f8f9fa;
    --container-bg: #ffffff;
    --heading-color: #343a40;
    --navbar-bg: #0d6efd;
}

/* ========== THÈME NOIR (mode sombre) ========== */
[data-theme="noir"] {
    --bg-color: #0d0d0d;
    --text-color: #e8e8e8;
    --card-bg: #1a1a1a;
    --border-color: #404040;
    --footer-bg: #1a1a1a;
    --accent-color: #6ea8fe;
    --accent-hover: #8ec0fe;
    --table-header-bg: #171717;
    --table-border-color: #404040;
    --table-hover-bg: #2a2a2a;
    --navbar-bg: #0d0d0d;
}

/* ========== THÈME JAUNE ========== */
[data-theme="jaune"] {
    --bg-color: #fffde7;
    --text-color: #3e2723;
    --card-bg: #fff9c4;
    --border-color: #f9a825;
    --footer-bg: #fff59d;
    --accent-color: #f57f17;
    --accent-hover: #e65100;
    --body-bg: #fffde7;
    --container-bg: #fff9c4;
    --heading-color: #3e2723;
    --table-header-bg: #f9a825;
    --table-border-color: #f9a825;
    --table-hover-bg: #fff59d;
    --input-bg: #fff9c4;
    --input-border: #f9a825;
    --input-text: #3e2723;
    --navbar-bg: #f9a825;
}

/* ========== THÈME BLEU ========== */
[data-theme="bleu"] {
    --bg-color: #e3f2fd;
    --text-color: #0d47a1;
    --card-bg: #bbdefb;
    --border-color: #1976d2;
    --footer-bg: #90caf9;
    --accent-color: #1565c0;
    --accent-hover: #0d47a1;
    --body-bg: #e3f2fd;
    --container-bg: #bbdefb;
    --heading-color: #0d47a1;
    --table-header-bg: #1976d2;
    --table-border-color: #1976d2;
    --table-hover-bg: #90caf9;
    --input-bg: #bbdefb;
    --input-border: #1976d2;
    --input-text: #0d47a1;
    --navbar-bg: #1976d2;
}

/* ========== THÈME VERT ========== */
[data-theme="vert"] {
    --bg-color: #e8f5e9;
    --text-color: #1b5e20;
    --card-bg: #c8e6c9;
    --border-color: #43a047;
    --footer-bg: #a5d6a7;
    --accent-color: #2e7d32;
    --accent-hover: #1b5e20;
    --body-bg: #e8f5e9;
    --container-bg: #c8e6c9;
    --heading-color: #1b5e20;
    --table-header-bg: #43a047;
    --table-border-color: #43a047;
    --table-hover-bg: #a5d6a7;
    --input-bg: #c8e6c9;
    --input-border: #43a047;
    --input-text: #1b5e20;
    --navbar-bg: #43a047;
}

/* ========== THÈME ORANGE ========== */
[data-theme="orange"] {
    --bg-color: #fff3e0;
    --text-color: #e65100;
    --card-bg: #ffe0b2;
    --border-color: #ff9800;
    --footer-bg: #ffcc80;
    --accent-color: #ef6c00;
    --accent-hover: #d84315;
    --body-bg: #fff3e0;
    --container-bg: #ffe0b2;
    --heading-color: #e65100;
    --table-header-bg: #ff9800;
    --table-border-color: #ff9800;
    --table-hover-bg: #ffcc80;
    --input-bg: #ffe0b2;
    --input-border: #ff9800;
    --input-text: #e65100;
    --navbar-bg: #ff9800;
}

/* ========== Règles communes pour thèmes clairs (clair, jaune, bleu, vert, orange) ========== */
[data-theme="clair"] body,
[data-theme="jaune"] body,
[data-theme="bleu"] body,
[data-theme="vert"] body,
[data-theme="orange"] body {
    background-color: var(--bg-color) !important;
    color: var(--text-color) !important;
}

/* Thèmes colorés : masquer l'image de fond pour que la couleur du thème soit visible */
[data-theme="jaune"] body,
[data-theme="bleu"] body,
[data-theme="vert"] body,
[data-theme="orange"] body {
    background-image: none !important;
}

[data-theme="clair"] .card,
[data-theme="jaune"] .card,
[data-theme="bleu"] .card,
[data-theme="vert"] .card,
[data-theme="orange"] .card {
    background-color: var(--card-bg) !important;
    color: var(--text-color) !important;
    border-color: var(--border-color) !important;
}

/* Container principal - utilise les variables de style.css */
[data-theme="clair"] main,
[data-theme="clair"] .container,
[data-theme="jaune"] main,
[data-theme="jaune"] .container,
[data-theme="bleu"] main,
[data-theme="bleu"] .container,
[data-theme="vert"] main,
[data-theme="vert"] .container,
[data-theme="orange"] main,
[data-theme="orange"] .container {
    background-color: var(--container-bg) !important;
    color: var(--text-color) !important;
}

[data-theme="clair"] h1,
[data-theme="clair"] h2,
[data-theme="clair"] h3,
[data-theme="jaune"] h1,
[data-theme="jaune"] h2,
[data-theme="jaune"] h3,
[data-theme="bleu"] h1,
[data-theme="bleu"] h2,
[data-theme="bleu"] h3,
[data-theme="vert"] h1,
[data-theme="vert"] h2,
[data-theme="vert"] h3,
[data-theme="orange"] h1,
[data-theme="orange"] h2,
[data-theme="orange"] h3 {
    color: var(--heading-color) !important;
}

[data-theme="clair"] .footer,
[data-theme="jaune"] .footer,
[data-theme="bleu"] .footer,
[data-theme="vert"] .footer,
[data-theme="orange"] .footer,
[data-theme="clair"] footer,
[data-theme="jaune"] footer,
[data-theme="bleu"] footer,
[data-theme="vert"] footer,
[data-theme="orange"] footer {
    background-color: var(--footer-bg) !important;
    color: var(--text-color) !important;
}

/* ========== Thème NOIR - styles sombres (réutilise la logique dark-mode) ========== */
[data-theme="noir"] body {
    background-color: var(--bg-color) !important;
    color: var(--text-color) !important;
    background-blend-mode: darken;
}

[data-theme="noir"] body::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.85);
    z-index: -1;
    pointer-events: none;
}

[data-theme="noir"] .card,
[data-theme="noir"] .card-header,
[data-theme="noir"] .card-footer {
    background-color: var(--card-bg) !important;
    border-color: var(--border-color) !important;
    color: var(--text-color) !important;
}

[data-theme="noir"] .table,
[data-theme="noir"] .table td,
[data-theme="noir"] .table th,
[data-theme="noir"] .table thead th,
[data-theme="noir"] .table tbody tr {
    background-color: var(--card-bg) !important;
    color: var(--text-color) !important;
    border-color: var(--border-color) !important;
}

[data-theme="noir"] .form-control,
[data-theme="noir"] .form-select {
    background-color: #2a2a2a !important;
    color: var(--text-color) !important;
    border-color: var(--border-color) !important;
}

[data-theme="noir"] .modal-content,
[data-theme="noir"] .dropdown-menu {
    background-color: var(--card-bg) !important;
    border-color: var(--border-color) !important;
    color: var(--text-color) !important;
}

[data-theme="noir"] .dropdown-item {
    color: var(--text-color) !important;
}

[data-theme="noir"] .dropdown-item:hover,
[data-theme="noir"] .dropdown-item:focus {
    background-color: #2a2a2a !important;
}

[data-theme="noir"] .navbar-dark {
    background-color: #0d0d0d !important;
}

/* Thèmes colorés - tableaux */
[data-theme="jaune"] .table thead th,
[data-theme="bleu"] .table thead th,
[data-theme="vert"] .table thead th,
[data-theme="orange"] .table thead th {
    background-color: var(--border-color) !important;
    color: var(--text-color) !important;
    border-color: var(--border-color) !important;
}

[data-theme="jaune"] .form-control,
[data-theme="jaune"] .form-select,
[data-theme="bleu"] .form-control,
[data-theme="bleu"] .form-select,
[data-theme="vert"] .form-control,
[data-theme="vert"] .form-select,
[data-theme="orange"] .form-control,
[data-theme="orange"] .form-select {
    background-color: var(--card-bg) !important;
    color: var(--text-color) !important;
    border-color: var(--border-color) !important;
}

[data-theme="jaune"] .modal-content,
[data-theme="jaune"] .dropdown-menu,
[data-theme="bleu"] .modal-content,
[data-theme="bleu"] .dropdown-menu,
[data-theme="vert"] .modal-content,
[data-theme="vert"] .dropdown-menu,
[data-theme="orange"] .modal-content,
[data-theme="orange"] .dropdown-menu {
    background-color: var(--card-bg) !important;
    border-color: var(--border-color) !important;
    color: var(--text-color) !important;
}

[data-theme="jaune"] .dropdown-item,
[data-theme="bleu"] .dropdown-item,
[data-theme="vert"] .dropdown-item,
[data-theme="orange"] .dropdown-item {
    color: var(--text-color) !important;
}

[data-theme="jaune"] .dropdown-item:hover,
[data-theme="jaune"] .dropdown-item:focus,
[data-theme="bleu"] .dropdown-item:hover,
[data-theme="bleu"] .dropdown-item:focus,
[data-theme="vert"] .dropdown-item:hover,
[data-theme="vert"] .dropdown-item:focus,
[data-theme="orange"] .dropdown-item:hover,
[data-theme="orange"] .dropdown-item:focus {
    background-color: var(--border-color) !important;
    color: var(--text-color) !important;
    opacity: 0.9;
}

/* Thèmes colorés - tableaux */
[data-theme="jaune"] .table,
[data-theme="bleu"] .table,
[data-theme="vert"] .table,
[data-theme="orange"] .table {
    color: var(--text-color) !important;
    border-color: var(--border-color) !important;
    background-color: var(--card-bg) !important;
}

[data-theme="jaune"] .table td,
[data-theme="jaune"] .table th,
[data-theme="bleu"] .table td,
[data-theme="bleu"] .table th,
[data-theme="vert"] .table td,
[data-theme="vert"] .table th,
[data-theme="orange"] .table td,
[data-theme="orange"] .table th {
    border-color: var(--border-color) !important;
    color: var(--text-color) !important;
}

[data-theme="jaune"] .table thead th,
[data-theme="jaune"] .table thead td,
[data-theme="bleu"] .table thead th,
[data-theme="bleu"] .table thead td,
[data-theme="vert"] .table thead th,
[data-theme="vert"] .table thead td,
[data-theme="orange"] .table thead th,
[data-theme="orange"] .table thead td {
    background-color: var(--border-color) !important;
    color: var(--text-color) !important;
    border-color: var(--border-color) !important;
}

[data-theme="jaune"] .table tbody tr:nth-of-type(even),
[data-theme="bleu"] .table tbody tr:nth-of-type(even),
[data-theme="vert"] .table tbody tr:nth-of-type(even),
[data-theme="orange"] .table tbody tr:nth-of-type(even) {
    background-color: var(--footer-bg) !important;
}

/* Override modern-home.css et autres styles en dur */
[data-theme="jaune"] .feature-card,
[data-theme="jaune"] .glass-card,
[data-theme="jaune"] .active-year-card,
[data-theme="jaune"] .btn-white,
[data-theme="bleu"] .feature-card,
[data-theme="bleu"] .glass-card,
[data-theme="bleu"] .active-year-card,
[data-theme="bleu"] .btn-white,
[data-theme="vert"] .feature-card,
[data-theme="vert"] .glass-card,
[data-theme="vert"] .active-year-card,
[data-theme="vert"] .btn-white,
[data-theme="orange"] .feature-card,
[data-theme="orange"] .glass-card,
[data-theme="orange"] .active-year-card,
[data-theme="orange"] .btn-white {
    background-color: var(--card-bg) !important;
    color: var(--text-color) !important;
    border-color: var(--border-color) !important;
}

[data-theme="jaune"] .feature-content h5,
[data-theme="jaune"] .active-year-title,
[data-theme="bleu"] .feature-content h5,
[data-theme="bleu"] .active-year-title,
[data-theme="vert"] .feature-content h5,
[data-theme="vert"] .active-year-title,
[data-theme="orange"] .feature-content h5,
[data-theme="orange"] .active-year-title {
    color: var(--heading-color) !important;
}

[data-theme="jaune"] .feature-content p,
[data-theme="bleu"] .feature-content p,
[data-theme="vert"] .feature-content p,
[data-theme="orange"] .feature-content p {
    color: var(--text-color) !important;
}

/* Application du thème à la navbar */
.navbar.navbar-theme {
    background-color: var(--navbar-bg) !important;
    transition: background-color 0.3s ease;
}
