/* ================================================================
   LEEK FOOD — THÈME SOMBRE
   ----------------------------------------------------------------
   Chargé EN DERNIER, après tokens.css, style.css, backoffice.css et
   le CSS de l'espace courant. Il couvre donc les trois espaces :
   client, restaurant, admin.

   Principe : les jetons de tokens.css basculent déjà seuls sous
   body.dark-theme. Tout ce qui suit ne concerne donc QUE les
   endroits qui ne passent pas par des jetons :

     1. les utilitaires Bootstrap, qui codent leurs couleurs en dur
        (bg-white, bg-light, text-dark, table-light…) ;
     2. les règles historiques de style.css écrites avec des valeurs
        figées (navbar blanche, carte blanche, panier blanc…) ;
     3. les blocs <style> embarqués dans les pages (restaurants.php,
        restaurant.php).

   C'est ce trou qui faisait qu'en sombre le panneau « Filtres
   avancés » restait blanc avec du texte clair, illisible.
   ================================================================ */

/* ================================================================
   1. FONDATIONS BOOTSTRAP
   Redéfinir les variables de Bootstrap 5.3 évite des dizaines de
   règles ciblées : tout ce qui s'appuie sur --bs-body-bg,
   --bs-border-color, etc. suit automatiquement.

   On ne touche PAS à --bs-white-rgb ni --bs-light-rgb : elles
   servent aussi à .text-white et .text-light, qui doivent rester
   blancs sur les fonds orange et les héros sombres.
   ================================================================ */
body.dark-theme {
    --bs-body-bg: var(--bg-page);
    --bs-body-color: var(--text-body);
    --bs-emphasis-color: var(--text-strong);
    --bs-heading-color: var(--text-strong);
    --bs-secondary-color: var(--text-muted);
    --bs-tertiary-color: var(--text-faint);
    --bs-border-color: var(--border);
    --bs-border-color-translucent: var(--border-subtle);
    --bs-secondary-bg: var(--bg-surface-2);
    --bs-tertiary-bg: var(--bg-surface-3);
    --bs-body-bg-rgb: 10, 16, 32;
    --bs-link-color: var(--brand-400);
    --bs-link-hover-color: var(--brand-300);
    --bs-link-color-rgb: 251, 146, 60;
    --bs-code-color: #fbbf24;
    --bs-highlight-bg: rgba(249, 115, 22, 0.2);

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

body.dark-theme ::selection {
    background: rgba(249, 115, 22, 0.32);
    color: #ffffff;
}

/* ================================================================
   2. UTILITAIRES BOOTSTRAP ÉCRITS EN DUR
   ================================================================ */
body.dark-theme .bg-white,
body.dark-theme .bg-body,
body.dark-theme .bg-body-tertiary,
body.dark-theme .bg-light {
    background-color: var(--bg-surface-2) !important;
    color: var(--text-body) !important;
}

body.dark-theme .bg-body-secondary {
    background-color: var(--bg-surface-3) !important;
    color: var(--text-body) !important;
}

/* Variantes translucides utilisées comme fonds de badges */
body.dark-theme .bg-white.bg-opacity-75,
body.dark-theme .bg-white.bg-opacity-50 {
    background-color: rgba(10, 16, 32, 0.78) !important;
}

body.dark-theme .text-dark {
    color: var(--text-strong) !important;
}

body.dark-theme .text-body {
    color: var(--text-body) !important;
}

body.dark-theme .text-muted,
body.dark-theme .text-secondary {
    color: var(--text-muted) !important;
}

body.dark-theme .text-black,
body.dark-theme .text-black-50 {
    color: var(--text-strong) !important;
}

body.dark-theme .border,
body.dark-theme .border-top,
body.dark-theme .border-bottom,
body.dark-theme .border-start,
body.dark-theme .border-end,
body.dark-theme .border-light {
    border-color: var(--border) !important;
}

body.dark-theme .border-white {
    border-color: var(--bg-surface) !important;
}

body.dark-theme hr {
    border-color: var(--border);
    opacity: 1;
}

body.dark-theme .shadow-sm,
body.dark-theme .shadow,
body.dark-theme .shadow-lg,
body.dark-theme .shadow-xs {
    box-shadow: var(--shadow-md) !important;
}

body.dark-theme .bg-primary-subtle {
    background-color: var(--brand-subtle) !important;
}
body.dark-theme .bg-warning-subtle {
    background-color: var(--warning-bg) !important;
}
body.dark-theme .bg-success-subtle {
    background-color: var(--success-bg) !important;
}
body.dark-theme .bg-danger-subtle {
    background-color: var(--danger-bg) !important;
}
body.dark-theme .bg-info-subtle {
    background-color: var(--info-bg) !important;
}

/* ================================================================
   3. COMPOSANTS BOOTSTRAP
   ================================================================ */

/* --- Modales --- */
body.dark-theme .modal-content {
    background-color: var(--bg-surface);
    border: 1px solid var(--border);
    color: var(--text-body);
}

body.dark-theme .modal-header,
body.dark-theme .modal-footer {
    border-color: var(--border);
}

body.dark-theme .modal-title {
    color: var(--text-strong);
}

body.dark-theme .btn-close {
    filter: invert(1) grayscale(100%) brightness(200%);
    opacity: 0.6;
}
body.dark-theme .btn-close:hover {
    opacity: 1;
}

/* --- Menus déroulants --- */
body.dark-theme .dropdown-menu {
    background-color: var(--bg-surface);
    border: 1px solid var(--border);
    box-shadow: var(--shadow-lg);
}

body.dark-theme .dropdown-item {
    color: var(--text-body);
}

body.dark-theme .dropdown-item:hover,
body.dark-theme .dropdown-item:focus {
    background-color: var(--bg-surface-2);
    color: var(--text-strong);
}

body.dark-theme .dropdown-divider {
    border-color: var(--border);
}

body.dark-theme .dropdown-header {
    color: var(--text-muted);
}

/* --- Panneaux coulissants --- */
body.dark-theme .offcanvas {
    background-color: var(--bg-surface);
    color: var(--text-body);
}

body.dark-theme .offcanvas-header {
    border-color: var(--border);
}

/* --- Listes --- */
body.dark-theme .list-group-item {
    background-color: var(--bg-surface);
    color: var(--text-body);
    border-color: var(--border);
}

body.dark-theme .list-group-item-action:hover,
body.dark-theme .list-group-item-action:focus {
    background-color: var(--bg-surface-2);
    color: var(--text-strong);
}

body.dark-theme .list-group-item.active {
    background: linear-gradient(135deg, var(--brand-500) 0%, var(--brand-600) 100%);
    border-color: transparent;
    color: var(--on-brand);
}

/* --- Tableaux --- */
body.dark-theme .table {
    --bs-table-bg: transparent;
    --bs-table-color: var(--text-body);
    --bs-table-border-color: var(--border);
    --bs-table-striped-bg: var(--bg-surface-2);
    --bs-table-striped-color: var(--text-body);
    --bs-table-hover-bg: var(--bg-surface-2);
    --bs-table-hover-color: var(--text-strong);
    color: var(--text-body);
}

body.dark-theme .table > :not(caption) > * > * {
    background-color: transparent;
    border-color: var(--border);
    color: var(--text-body);
}

body.dark-theme .table thead th {
    background-color: var(--bg-surface-2);
    color: var(--text-muted);
    border-color: var(--border);
}

body.dark-theme .table-light,
body.dark-theme .table-light > th,
body.dark-theme .table-light > td {
    background-color: var(--bg-surface-2) !important;
    color: var(--text-body) !important;
    border-color: var(--border) !important;
}

body.dark-theme .table-hover > tbody > tr:hover > * {
    background-color: var(--bg-surface-2);
    color: var(--text-strong);
}

body.dark-theme .table-responsive {
    border-color: var(--border);
}

/* --- Formulaires --- */
body.dark-theme .form-control,
body.dark-theme .form-select,
body.dark-theme .input-group-text {
    background-color: var(--bg-surface);
    border-color: var(--border);
    color: var(--text-strong);
}

body.dark-theme .form-control:focus,
body.dark-theme .form-select:focus {
    background-color: var(--bg-surface);
    border-color: var(--brand);
    color: var(--text-strong);
}

body.dark-theme .form-control::placeholder {
    color: var(--text-faint);
}

body.dark-theme .form-control:disabled,
body.dark-theme .form-select:disabled {
    background-color: var(--bg-inset);
    color: var(--text-faint);
}

body.dark-theme .form-label,
body.dark-theme .form-check-label {
    color: var(--text-body);
}

body.dark-theme .form-check-input {
    background-color: var(--bg-inset);
    border-color: var(--border-strong);
}

body.dark-theme .form-check-input:checked {
    background-color: var(--brand);
    border-color: var(--brand);
}

body.dark-theme .input-group-text {
    color: var(--text-muted);
}

/* --- Boutons --- */
body.dark-theme .btn-light,
body.dark-theme .btn-outline-secondary {
    background-color: var(--bg-surface-2);
    border-color: var(--border);
    color: var(--text-body);
}

body.dark-theme .btn-light:hover,
body.dark-theme .btn-outline-secondary:hover {
    background-color: var(--bg-surface-3);
    border-color: var(--border-strong);
    color: var(--text-strong);
}

body.dark-theme .btn-outline-primary {
    border-color: var(--brand-border);
    color: var(--brand-400);
}

body.dark-theme .btn-outline-primary:hover {
    background-color: var(--brand);
    border-color: var(--brand);
    color: var(--on-brand);
}

body.dark-theme .btn-outline-danger {
    border-color: var(--danger-border);
    color: var(--danger);
}

body.dark-theme .btn-outline-danger:hover {
    background-color: var(--danger);
    border-color: var(--danger);
    color: #fff;
}

body.dark-theme .btn-outline-success {
    border-color: var(--success-border);
    color: var(--success);
}

body.dark-theme .btn-outline-warning {
    border-color: var(--warning-border);
    color: var(--warning);
}

body.dark-theme .btn-outline-light {
    border-color: var(--border);
    color: var(--text-body);
}

/* --- Badges --- */
body.dark-theme .badge.bg-light,
body.dark-theme .badge.text-bg-light {
    background-color: var(--bg-surface-3) !important;
    color: var(--text-body) !important;
}

body.dark-theme .badge.bg-secondary {
    background-color: var(--bg-surface-3) !important;
    color: var(--text-body) !important;
}

/* Un badge « bg-warning text-dark » doit garder son texte sombre sur
   l'ambre clair. Mais « bg-light text-dark » est un badge clair : lui
   forcer un texte sombre le rendait illisible. D'où le :not(). */
body.dark-theme .badge.text-dark:not(.bg-light):not(.bg-white):not(.bg-body) {
    color: var(--slate-900) !important;
}

/* --- Navigation par onglets --- */
body.dark-theme .nav-tabs {
    border-color: var(--border);
}

body.dark-theme .nav-tabs .nav-link {
    color: var(--text-muted);
}

body.dark-theme .nav-tabs .nav-link:hover {
    border-color: var(--border);
    color: var(--text-body);
}

body.dark-theme .nav-tabs .nav-link.active {
    background-color: var(--bg-surface);
    border-color: var(--border) var(--border) var(--bg-surface);
    color: var(--brand-400);
}

body.dark-theme .nav-pills .nav-link {
    color: var(--text-body);
}

body.dark-theme .nav-pills .nav-link.active {
    background-color: var(--brand);
    color: var(--on-brand);
}

/* --- Alertes --- */
body.dark-theme .alert-success {
    background-color: var(--success-bg);
    border-color: var(--success-border);
    color: var(--success);
}
body.dark-theme .alert-danger {
    background-color: var(--danger-bg);
    border-color: var(--danger-border);
    color: var(--danger);
}
body.dark-theme .alert-warning {
    background-color: var(--warning-bg);
    border-color: var(--warning-border);
    color: var(--warning);
}
body.dark-theme .alert-info {
    background-color: var(--info-bg);
    border-color: var(--info-border);
    color: var(--info);
}
body.dark-theme .alert-link {
    color: inherit;
    text-decoration: underline;
}

/* --- Pagination, accordéon, barres --- */
body.dark-theme .pagination .page-link {
    background-color: var(--bg-surface);
    border-color: var(--border);
    color: var(--text-body);
}
body.dark-theme .pagination .page-link:hover {
    background-color: var(--bg-surface-2);
    color: var(--text-strong);
}
body.dark-theme .pagination .active .page-link {
    background-color: var(--brand);
    border-color: var(--brand);
    color: var(--on-brand);
}

body.dark-theme .accordion-item {
    background-color: var(--bg-surface);
    border-color: var(--border);
}
body.dark-theme .accordion-button {
    background-color: var(--bg-surface);
    color: var(--text-strong);
}
body.dark-theme .accordion-button:not(.collapsed) {
    background-color: var(--brand-subtle);
    color: var(--brand-400);
}
body.dark-theme .accordion-button::after {
    filter: invert(1) brightness(180%);
}

body.dark-theme .progress {
    background-color: var(--bg-inset);
}

body.dark-theme .tooltip-inner {
    background-color: var(--slate-800);
    color: var(--text-strong);
}

/* ================================================================
   4. ESPACE CLIENT — CHROME DU SITE
   ================================================================ */

/* Barre de navigation principale */
body.dark-theme .custom-navbar {
    background: rgba(10, 16, 32, 0.88) !important;
    border-bottom: 1px solid var(--border) !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35) !important;
}

body.dark-theme .custom-navbar .nav-link {
    color: var(--text-body) !important;
}

body.dark-theme .custom-navbar .nav-link:hover {
    color: var(--brand-400) !important;
    background: var(--brand-subtle);
}

body.dark-theme .custom-navbar .nav-link.active {
    color: var(--brand-400) !important;
    background: var(--brand-subtle);
}

body.dark-theme .btn-icon {
    background: var(--bg-surface-2);
    color: var(--text-body);
}

body.dark-theme .btn-icon:hover {
    background: var(--bg-surface-3);
}

/* Sélecteur de ville et menu utilisateur : ce sont des .btn-light */
body.dark-theme .location-selector > .btn-light,
body.dark-theme .user-dropdown > .btn-light {
    background-color: var(--bg-surface-2) !important;
    border-color: var(--border) !important;
    color: var(--text-body) !important;
}

body.dark-theme .location-selector > .btn-light:hover,
body.dark-theme .user-dropdown > .btn-light:hover {
    background-color: var(--bg-surface-3) !important;
    color: var(--text-strong) !important;
}

body.dark-theme .premium-dropdown {
    background: var(--bg-surface);
    border: 1px solid var(--border);
    box-shadow: var(--shadow-lg);
}

body.dark-theme .premium-dropdown .dropdown-item {
    color: var(--text-body);
}

body.dark-theme .premium-dropdown .dropdown-item:hover {
    background: var(--bg-surface-2);
    color: var(--text-strong);
}

body.dark-theme .premium-offcanvas {
    background: var(--bg-surface);
    color: var(--text-body);
}

body.dark-theme .mobile-user-section {
    background: var(--bg-surface-2) !important;
}

/* Barre de navigation basse (mobile) */
body.dark-theme .bottom-nav,
body.dark-theme .bottom-nav-bar {
    background: rgba(10, 16, 32, 0.97);
    border-top: 1px solid var(--border);
}

body.dark-theme .bottom-nav a,
body.dark-theme .bottom-nav-bar .nav-item {
    color: var(--text-muted);
}

body.dark-theme .bottom-nav-bar .nav-item.active,
body.dark-theme .bottom-nav-bar .nav-item.active i {
    color: var(--brand-400);
}

/* Pied de page — déjà sombre, on l'aligne sur l'ardoise de la marque */
body.dark-theme footer {
    background: linear-gradient(180deg, #0c1425 0%, #080f1e 100%) !important;
    border-top: 1px solid var(--border);
}

/* ================================================================
   5. ESPACE CLIENT — CONTENU
   ================================================================ */

/* Cartes */
body.dark-theme .card {
    background: var(--bg-surface);
    border: 1px solid var(--border);
    box-shadow: var(--shadow-sm);
}

body.dark-theme .card:hover {
    box-shadow: var(--shadow-lg);
}

body.dark-theme .card-footer,
body.dark-theme .card-header {
    background: transparent;
    border-color: var(--border);
}

body.dark-theme .card-title {
    color: var(--text-strong);
}

body.dark-theme .card-text {
    color: var(--text-muted);
}

/* Titres et texte courant */
body.dark-theme h1,
body.dark-theme h2,
body.dark-theme h3,
body.dark-theme h4,
body.dark-theme h5,
body.dark-theme h6,
body.dark-theme .h1,
body.dark-theme .h2,
body.dark-theme .h3,
body.dark-theme .h4,
body.dark-theme .h5,
body.dark-theme .h6 {
    color: var(--text-strong);
}

body.dark-theme p,
body.dark-theme label,
body.dark-theme small,
body.dark-theme li,
body.dark-theme dd,
body.dark-theme dt {
    color: var(--text-body);
}

body.dark-theme a {
    color: var(--brand-400);
}

/* Formulaire du héros */
body.dark-theme .hero-section form {
    background: rgba(17, 26, 46, 0.85);
    border-color: var(--border);
}

body.dark-theme .hero-section .form-control,
body.dark-theme .hero-section .form-select {
    background: var(--bg-surface-2);
    color: var(--text-strong);
}

/* Entrées de menu (page restaurant publique) */
body.dark-theme .menu-item {
    background: var(--bg-surface);
    border: 1px solid var(--border);
}

/* Panier fixe sur mobile */
body.dark-theme .cart-container {
    background: var(--bg-surface);
    border: 1px solid var(--border);
}

/* Images de remplacement et aperçus */
body.dark-theme .avatar-circle {
    color: var(--on-brand);
}

body.dark-theme img.bg-white,
body.dark-theme .menu-item-img-wrap img {
    background: var(--bg-surface-2);
}

/* ================================================================
   6. BLOCS <style> EMBARQUÉS — restaurants.php / restaurant.php
   ----------------------------------------------------------------
   Ces deux pages embarquent leurs propres <style>. Ils ont été
   convertis en jetons : ils basculent donc seuls. Ne restent ici
   que les rares valeurs qui ne peuvent pas être des jetons.

   Le panneau « Filtres avancés » (.resto-filter-card) était la
   cause de l'illisibilité en sombre : il restait blanc pendant que
   ses libellés passaient en clair.
   ================================================================ */

/* Ombre de survol : une ombre ardoise est invisible sur fond sombre */
body.dark-theme .resto-card:hover {
    box-shadow: 0 16px 32px rgba(0, 0, 0, 0.5) !important;
}

body.dark-theme .menu-item-card:hover {
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.45) !important;
}

/* Le bandeau du héros est sombre dans les deux thèmes : on le
   désature légèrement en sombre pour qu'il ne « flotte » pas. */
body.dark-theme .resto-hero-banner {
    border-bottom: 1px solid var(--border);
}

/* Barre collante des catégories : elle doit se détacher du fond */
body.dark-theme .sticky-top-category,
body.dark-theme .sticky-top-sub {
    background: rgba(10, 16, 32, 0.92);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--border);
}

/* ================================================================
   8. BACK-OFFICES — AJUSTEMENTS CIBLÉS
   backoffice.css est entièrement piloté par jetons, donc le gros du
   travail est déjà fait. Restent les cas où une valeur claire a été
   écrite en dur dans le HTML ou dans une règle locale.
   ================================================================ */

/* En-tête collant : le fond vitreux clair devenait blanc opaque */
body.dark-theme .top-header {
    background: rgba(10, 16, 32, 0.86);
    border-bottom-color: var(--border);
}

body.dark-theme .top-header .header-date {
    background: var(--bg-surface-2);
    color: var(--text-muted);
    border-color: var(--border);
}

body.dark-theme .sidebar-toggle-btn {
    background: var(--bg-surface-2);
    color: var(--text-strong);
    border-color: var(--border);
}

/* Boutons d'action des tableaux : le fond blanc est écrit en dur */
body.dark-theme .btn-action {
    background: var(--bg-surface-2);
    border-color: var(--border);
    color: var(--text-muted);
}

body.dark-theme .btn-action:hover {
    background: var(--brand-subtle);
    border-color: var(--brand-border);
    color: var(--brand-400);
}

/* Vignettes de plats dans le menu du restaurant */
body.dark-theme .menu-card-img-wrapper {
    background: var(--bg-surface-3);
}

/* Aperçu du logo : bordure blanche sur fond clair */
body.dark-theme .profile-logo-preview,
body.dark-theme .avatar-sm,
body.dark-theme .avatar-md {
    border-color: var(--bg-surface);
    background: var(--bg-surface-3);
}

/* Les badges d'état, KPI, tableaux, formulaires et états vides
   utilisent tous des jetons : ils basculent sans règle dédiée. */

/* ================================================================
   9. BARRE DE DÉFILEMENT
   ================================================================ */
body.dark-theme ::-webkit-scrollbar-thumb {
    background: var(--border-strong);
}

body.dark-theme ::-webkit-scrollbar-thumb:hover {
    background: var(--text-faint);
}

/* ================================================================
   10. IMPRESSION — toujours en clair
   ================================================================ */
@media print {
    body.dark-theme,
    body.dark-theme .card,
    body.dark-theme .stat-card {
        background: #ffffff !important;
        color: #000000 !important;
    }

    body.dark-theme .sidebar,
    body.dark-theme .top-header {
        display: none !important;
    }
}