/* ═══════════════════════════════════════════════════════════════
   DARK MODE OVERRIDES — Composants globaux v2.0
   ═══════════════════════════════════════════════════════════════
   
   🌙 OBJECTIF :
   Override les couleurs hardcodées dans les CSS de composants qui
   n'utilisent pas encore les design tokens (var(--dt-*)).
   
   Ce fichier est chargé APRÈS design-tokens.css et theme-base.css.
   Il complète les overrides dark déjà présents dans :
     ✅ homepage.css      (sections 7-8, complet)
     ✅ modal-unified.css (section Dark Mode, complet)
     ✅ confirm-modal.css (section Dark mode, complet)
     ✅ design-tokens.css (variables root, complet)
   
   Convention de couleurs dark :
     Body       #0b1017
     Surface    #0f1923  /  #1e2130
     Elevated   #252940
     Border     #2a2e42  /  #353a52
     Text       #e4e6f0  /  #c8cad8  /  #a0a4b8  /  #8b8fa3
     Accent     #10b981 (menthe — identique light/dark)
   
   ═══════════════════════════════════════════════════════════════ */


/* ═══════════════════════════════════════════════════════════════
   1. STYLE.CSS — Header, Menu, Dropdowns, Forms, Buttons
   ═══════════════════════════════════════════════════════════════ */

/* .header, .logo-text → voir Section 31 */

/* --- Bouton Connexion (btn-auth) --- */
[data-theme="dark"] .btn-auth {
    background: #252940;
    color: #e4e6f0;
    border: 1px solid #353a52;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .btn-auth:hover {
    background: #353a52;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4);
}

/* --- User Avatar --- */
[data-theme="dark"] .user-avatar {
    background: #252940;
    color: #e4e6f0;
    border-color: #353a52;
}

[data-theme="dark"] .user-avatar:hover {
    border-color: #10b981;
    background: rgba(43, 196, 138, 0.08);
}

/* .user-dropdown → voir Section 31 */

/* --- Auth Modal (style.css) --- */
[data-theme="dark"] .auth-modal-content {
    background: #1e2130;
    border-color: #2a2e42;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .modal-header {
    border-bottom-color: #2a2e42;
}

[data-theme="dark"] .auth-tabs {
    background: #0f1923;
}

[data-theme="dark"] .tab-btn {
    color: #6b7094;
}

[data-theme="dark"] .tab-btn.active {
    background: #1e2130;
    color: #e4e6f0;
    border-bottom-color: #10b981;
}

[data-theme="dark"] .tab-btn:hover:not(.active) {
    color: #a0a4b8;
}

[data-theme="dark"] .tab-btn.pro-tab {
    background: rgba(245, 101, 101, 0.08);
    color: #f88b8b;
}

[data-theme="dark"] .tab-btn.pro-tab.active {
    background: #1e2130;
    color: #f88b8b;
    border-bottom-color: #f56565;
}

[data-theme="dark"] .close-modal {
    color: #6b7094;
}

[data-theme="dark"] .close-modal:hover {
    color: #e4e6f0;
}

[data-theme="dark"] .modal-body {
    background: inherit;
}

[data-theme="dark"] .modal-content {
    background: #1e2130;
    border-color: #353a52;
}

[data-theme="dark"] .modal-close:hover {
    background: #ef4444;
    color: #fff;
}

/* --- Forms (style.css .form-group) --- */
[data-theme="dark"] .form-group label {
    color: #c8cad8;
}

[data-theme="dark"] .form-group label i {
    color: #6b7094;
}

[data-theme="dark"] .form-group input,
[data-theme="dark"] .form-group textarea {
    background: #252940;
    border-color: #353a52;
    color: #e4e6f0;
}

[data-theme="dark"] .form-group select {
    background-color: #252940 !important;
    border-color: #353a52;
    color: #e4e6f0;
    appearance: none !important;
    -webkit-appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M6 8L1 3h10z' fill='%238b8fa3'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 10px center !important;
    background-size: 12px !important;
    padding-right: 32px;
}

[data-theme="dark"] .form-group input:focus,
[data-theme="dark"] .form-group textarea:focus,
[data-theme="dark"] .form-group select:focus {
    border-color: #10b981;
    box-shadow: 0 0 0 3px rgba(43, 196, 138, 0.12);
}

[data-theme="dark"] .form-group input::placeholder,
[data-theme="dark"] .form-group textarea::placeholder {
    color: #6b7094;
}

/* --- Inputs autonomes (global) --- */
[data-theme="dark"] input[type="text"],
[data-theme="dark"] input[type="email"],
[data-theme="dark"] input[type="password"],
[data-theme="dark"] input[type="number"],
[data-theme="dark"] input[type="tel"],
[data-theme="dark"] input[type="url"],
[data-theme="dark"] input[type="search"],
[data-theme="dark"] input[type="date"],
[data-theme="dark"] textarea {
    background: var(--dt-input-bg, #252940);
    color: var(--dt-text-primary, #c8cad8);
    border-color: var(--dt-border-input, #353a52);
}

/* Select séparé : chevron SVG dark + !important pour override
   les CSS spécifiques (admin-premium.css select.settings-input etc.) */
[data-theme="dark"] select,
[data-theme="dark"] select.settings-input,
[data-theme="dark"] select.pm-input,
[data-theme="dark"] .admin-filter-select,
[data-theme="dark"] .form-select,
[data-theme="dark"] .lf-select,
[data-theme="dark"] .filter-select {
    background-color: var(--dt-input-bg, #252940) !important;
    color: var(--dt-text-primary, #c8cad8);
    border-color: var(--dt-border-input, #353a52);
    appearance: none !important;
    -webkit-appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M6 8L1 3h10z' fill='%238b8fa3'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 10px center !important;
    background-size: 12px !important;
    padding-right: 32px;
}

[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder {
    color: var(--dt-text-tertiary, #8b8fa3);
}

[data-theme="dark"] input:focus,
[data-theme="dark"] textarea:focus,
[data-theme="dark"] select:focus {
    border-color: var(--dt-brand, #10b981);
    box-shadow: var(--dt-input-focus-ring, 0 0 0 3px rgba(43, 196, 138, 0.12));
    outline: none;
}

[data-theme="dark"] label {
    color: var(--dt-text-primary, #c8cad8);
}

/* --- Bouton Submit (style.css) --- */
[data-theme="dark"] .btn-submit {
    box-shadow: 0 2px 10px rgba(43, 196, 138, 0.3);
}

/* --- Pro Warning (style.css) --- */
[data-theme="dark"] .pro-warning {
    background: rgba(245, 101, 101, 0.08);
    border-left-color: #f56565;
}

[data-theme="dark"] .pro-warning i {
    color: #f88b8b;
}

[data-theme="dark"] .pro-warning p {
    color: #f88b8b;
}

/* --- Mobile bottom sheet handle (style.css) --- */
@media (max-width: 768px) {
    [data-theme="dark"] .modal-content:not(.auth-modal-content) .modal-header::before {
        background: #353a52;
    }

    [data-theme="dark"] .modal-content:not(.auth-modal-content) {
        box-shadow: 0 -10px 40px rgba(0, 0, 0, 0.5) !important;
    }

    /* Recenter button dark mobile — aligned with Google Maps FAB v6.8.0 */
    [data-theme="dark"] .recenter-control-btn.leaflet-control-custom {
        background: #2d2d2d !important;
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.5) !important;
    }
}

/* --- Leaflet Zoom Controls (style.css) --- */
[data-theme="dark"] .leaflet-control-zoom a {
    background: #1e2130 !important;
    color: #a0a4b8 !important;
    border-bottom-color: #2a2e42 !important;
}

[data-theme="dark"] .leaflet-control-zoom a:hover {
    background: #252940 !important;
    color: #10b981 !important;
}

[data-theme="dark"] .leaflet-control-custom {
    background: #1e2130 !important;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3) !important;
}

[data-theme="dark"] .leaflet-control-custom:hover {
    background: #252940 !important;
}

[data-theme="dark"] .leaflet-control-attribution {
    background: rgba(15, 17, 23, 0.85) !important;
    color: #6b7094 !important;
}

[data-theme="dark"] .leaflet-control-attribution a {
    color: #10b981 !important;
}

/* --- Leaflet Popup Dark --- */
[data-theme="dark"] .leaflet-popup-content-wrapper {
    background: #1e2130 !important;
    color: #c8cad8 !important;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.5) !important;
}

[data-theme="dark"] .leaflet-popup-tip {
    background: #1e2130 !important;
}

/* --- Map Controls Grid buttons (homepage.css shared) --- */
[data-theme="dark"] .leaflet-bar a,
[data-theme="dark"] .leaflet-control-custom.lc-btn {
    background: #1e2130 !important;
    color: #a0a4b8 !important;
    border-bottom-color: #2a2e42 !important;
}

[data-theme="dark"] .leaflet-bar a:hover,
[data-theme="dark"] .leaflet-control-custom.lc-btn:hover {
    background: #252940 !important;
    color: #10b981 !important;
}

[data-theme="dark"] .leaflet-bar {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
}



/* ═══════════════════════════════════════════════════════════════
   2. COMPONENTS.CSS — Flash, KPI, Empty, Pagination, Tables, Boutons
   ═══════════════════════════════════════════════════════════════ */

/* --- Flash Messages (alerts) --- */
[data-theme="dark"] .alert-success {
    background: rgba(72, 187, 120, 0.12);
    color: #6ee7b7;
}

[data-theme="dark"] .alert-error {
    background: rgba(245, 101, 101, 0.12);
    color: #fca5a5;
}

[data-theme="dark"] .alert-warning {
    background: rgba(237, 137, 54, 0.12);
    color: #fcd34d;
}

[data-theme="dark"] .alert-info {
    background: rgba(66, 153, 225, 0.12);
    color: #93c5fd;
}

/* .kpi-card → voir Section 40.4 / 40.5 */

/* --- Empty State --- */
[data-theme="dark"] .empty-state__icon,
[data-theme="dark"] .au-empty-state__icon {
    color: #555873;
}

[data-theme="dark"] .empty-state__title,
[data-theme="dark"] .au-empty-state__title {
    color: #a0a4b8;
}

[data-theme="dark"] .empty-state__message,
[data-theme="dark"] .au-empty-state__desc {
    color: #8b8fa3;
}

[data-theme="dark"] .empty-state__btn {
    background: var(--dt-brand, #10b981);
    color: #fff;
}

/* --- Pagination --- */
[data-theme="dark"] .pagination a {
    background: #0f1923;
    color: #a0a4b8;
    border-color: #2a2e42;
}

[data-theme="dark"] .pagination a:hover {
    background: var(--dt-brand, #10b981);
    color: #fff;
    border-color: var(--dt-brand, #10b981);
}

[data-theme="dark"] .pagination span.current {
    background: #e4e6f0;
    color: #0b1017;
}

[data-theme="dark"] .pagination span.dots {
    color: #8b8fa3;
}

/* --- Modal Container (components.css) --- */
[data-theme="dark"] .modal-container {
    background: #252940;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}

[data-theme="dark"] .modal-title {
    color: #e4e6f0;
}

[data-theme="dark"] .modal-title i {
    color: #e4e6f0;
}

[data-theme="dark"] .modal-close {
    background: #0f1923;
    color: #a0a4b8;
}

[data-theme="dark"] .modal-footer {
    border-top-color: #2a2e42;
    background: #0f1923;
}

/* --- Data Table Header --- */
[data-theme="dark"] .data-table-header {
    border-bottom-color: #2a2e42;
}

[data-theme="dark"] .data-table-header__title {
    color: #e4e6f0;
}

[data-theme="dark"] .data-table-header__count {
    background: rgba(43, 196, 138, 0.12);
    color: #e4e6f0;
}

/* --- Boutons Admin Unifiés (au-btn) --- */
[data-theme="dark"] .au-btn--primary {
    background: var(--dt-brand, #10b981);
    color: #fff;
}

[data-theme="dark"] .au-btn--primary:hover {
    background: var(--dt-brand-hover, #059669);
}

[data-theme="dark"] .au-btn--secondary {
    color: #e4e6f0;
    border-color: #2a2e42;
}

[data-theme="dark"] .au-btn--secondary:hover {
    border-color: #e4e6f0;
    background: #252940;
}

[data-theme="dark"] .au-btn--danger {
    color: #fca5a5;
    border-color: rgba(245, 101, 101, 0.3);
}

[data-theme="dark"] .au-btn--danger:hover {
    background: rgba(245, 101, 101, 0.12);
    border-color: #f56565;
}

/* --- Tables --- */
[data-theme="dark"] table,
[data-theme="dark"] .data-table {
    background: #0f1923;
}

[data-theme="dark"] thead th,
[data-theme="dark"] .data-table th {
    background: #1e2130;
    color: #e4e6f0;
    border-bottom-color: #2a2e42;
}

[data-theme="dark"] tbody td,
[data-theme="dark"] .data-table td {
    color: #c8cad8;
    border-bottom-color: #2a2e42;
}

[data-theme="dark"] tbody tr:hover,
[data-theme="dark"] .data-table tr:hover {
    background: #1e2130;
}

[data-theme="dark"] tbody tr:nth-child(even) {
    background: rgba(30, 33, 48, 0.5);
}


/* ═══════════════════════════════════════════════════════════════
   3. ADMIN.CSS — Header Admin, Dropdowns
   ═══════════════════════════════════════════════════════════════ */

/* Note : admin.css utilise var(--ds-*) qui mappent déjà vers --dt-*.
   Ces overrides sont une couche de sécurité pour les propriétés
   qui n'utilisent pas de variables. */

[data-theme="dark"] .admin-header {
    background-color: var(--dt-bg-surface, #0f1923);
    border-bottom-color: var(--dt-border, #2a2e42);
}

[data-theme="dark"] .page-title {
    color: var(--dt-text-title, #e4e6f0);
}

[data-theme="dark"] .page-subtitle {
    color: var(--dt-text-tertiary, #8b8fa3);
}

[data-theme="dark"] .header-icon {
    color: var(--dt-text-secondary, #a0a4b8);
}

[data-theme="dark"] .header-icon:hover {
    background-color: var(--dt-bg-elevated, #252940);
    color: var(--dt-text-title, #e4e6f0);
}

[data-theme="dark"] .badge-dot {
    border-color: var(--dt-bg-surface, #0f1923);
}

[data-theme="dark"] .user-name {
    color: var(--dt-text-title, #e4e6f0);
}

[data-theme="dark"] .user-role {
    color: var(--dt-text-tertiary, #8b8fa3);
}

[data-theme="dark"] .user-profile:hover {
    background-color: var(--dt-bg-elevated, #252940);
}

/* --- Dropdown Menu (admin header) --- */
[data-theme="dark"] .dropdown-menu {
    background: var(--dt-bg-surface, #0f1923);
    border-color: var(--dt-border, #2a2e42);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .dropdown-item {
    color: var(--dt-text-primary, #c8cad8);
}

[data-theme="dark"] .dropdown-item:hover {
    background-color: var(--dt-bg-elevated, #252940);
}

[data-theme="dark"] .dropdown-item i {
    color: var(--dt-text-tertiary, #8b8fa3);
}

[data-theme="dark"] .dropdown-divider {
    background-color: var(--dt-border, #2a2e42);
}


/* ═══════════════════════════════════════════════════════════════
   4. LANDING.CSS — Page À propos
   ═══════════════════════════════════════════════════════════════ */

/* lp-feature, lp-pricing, lp-testimonial → voir Section 30 + 39 */


/* ═══════════════════════════════════════════════════════════════
   5. SEARCH.CSS — Recherche avancée
   ═══════════════════════════════════════════════════════════════ */

[data-theme="dark"] .search-container,
[data-theme="dark"] .search-card,
[data-theme="dark"] .search-result-card,
[data-theme="dark"] .search-filters,
[data-theme="dark"] .search-form,
[data-theme="dark"] .search-suggestions,
[data-theme="dark"] .search-results-header,
[data-theme="dark"] .search-sort-select,
[data-theme="dark"] .search-bar {
    background: #0f1923 !important;
    color: #c8cad8;
    border-color: #2a2e42;
}

[data-theme="dark"] .search-input,
[data-theme="dark"] .search-bar input {
    background: #252940 !important;
    color: #c8cad8;
    border-color: #353a52;
}

[data-theme="dark"] .search-input::placeholder,
[data-theme="dark"] .search-bar input::placeholder {
    color: #8b8fa3;
}

[data-theme="dark"] .search-input:focus,
[data-theme="dark"] .search-bar input:focus {
    border-color: #10b981;
    box-shadow: 0 0 0 3px rgba(43, 196, 138, 0.12);
}

[data-theme="dark"] .search-suggestion-item:hover,
[data-theme="dark"] .search-result-card:hover {
    background: #252940 !important;
}


/* Section 6 (user-dashboard) → voir Section 40 */


/* Section 7 (pro-dashboard) → voir Section 39 + 40 */


/* ═══════════════════════════════════════════════════════════════
   8. ADMIN SETTINGS & LEAFLET ADMIN
   ═══════════════════════════════════════════════════════════════ */

[data-theme="dark"] .settings-container {
    background: transparent;
}

/* Sections leaflet admin */
[data-theme="dark"] .lf-section {
    background: #0f1923;
    border-color: #2a2e42;
}

[data-theme="dark"] .lf-section-header {
    border-bottom-color: #2a2e42;
}

[data-theme="dark"] .lf-section-body {
    background: #0f1923;
}

[data-theme="dark"] .lf-row {
    border-bottom-color: #22263a;
}

[data-theme="dark"] .lf-label h3 {
    color: #e4e6f0;
}

[data-theme="dark"] .lf-label p {
    color: #a0a4b8;
}

[data-theme="dark"] .lf-input,
[data-theme="dark"] .lf-select {
    background: #252940;
    border-color: #353a52;
    color: #c8cad8;
}

[data-theme="dark"] .lf-select-premium,
[data-theme="dark"] select.lf-input {
    background-color: #252940;
    border-color: #353a52;
    color: #c8cad8;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    box-shadow: 0 1px 3px rgba(0, 0, 0, .2);
}

[data-theme="dark"] .lf-select-premium:hover,
[data-theme="dark"] select.lf-input:hover {
    background-color: #2d3250;
    border-color: var(--section-color, #3b82f6);
}

[data-theme="dark"] .lf-info-box {
    background: rgba(59, 130, 246, 0.06);
    color: #a0a4b8;
    border-color: rgba(59, 130, 246, 0.12);
}


/* Section 9 (cards/panels) → voir Section 39 (transparent) */


/* ═══════════════════════════════════════════════════════════════
   10. ICONS — Ajuster les icônes pour la visibilité
   ═══════════════════════════════════════════════════════════════ */

[data-theme="dark"] .fa-icon-muted,
[data-theme="dark"] .icon-muted {
    color: #8b8fa3;
}

/* Icônes dans les sections settings */
[data-theme="dark"] .section-icon {
    opacity: 0.85;
}

/* SVG icons fill/stroke */
[data-theme="dark"] .icon-dark {
    fill: #e4e6f0;
}


/* ═══════════════════════════════════════════════════════════════
   11. LINKS — Liens globaux
   ═══════════════════════════════════════════════════════════════ */

[data-theme="dark"] a {
    color: var(--dt-text-link, #34d496);
}

[data-theme="dark"] a:hover {
    color: var(--dt-text-link-hover, #5ddda8);
}

/* Ne pas changer les liens dans les boutons et éléments spécifiques */
[data-theme="dark"] .btn a,
[data-theme="dark"] .au-btn a,
[data-theme="dark"] .lp-btn a,
[data-theme="dark"] .nav-item a {
    color: inherit;
}


/* ═══════════════════════════════════════════════════════════════
   12. BADGES & PILLS
   ═══════════════════════════════════════════════════════════════ */

[data-theme="dark"] .badge {
    border-color: #2a2e42;
}

[data-theme="dark"] .status-badge {
    border-color: #2a2e42;
}

[data-theme="dark"] .badge-light {
    background: #252940;
    color: #c8cad8;
}


/* ═══════════════════════════════════════════════════════════════
   13. NOTIFICATIONS & TOASTS
   ═══════════════════════════════════════════════════════════════ */

[data-theme="dark"] .notification-card,
[data-theme="dark"] .toast {
    background: #252940;
    border-color: #2a2e42;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .notification-card:hover {
    background: #2a2e42;
}


/* ═══════════════════════════════════════════════════════════════
   14. TOOLTIPS (global)
   ═══════════════════════════════════════════════════════════════ */

[data-theme="dark"] .tooltip,
[data-theme="dark"] [data-tooltip]::after {
    background: #252940;
    color: #c8cad8;
    border-color: #353a52;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
}


/* ═══════════════════════════════════════════════════════════════
   15. WIZARD (ajout distributeur)
   ═══════════════════════════════════════════════════════════════ */

[data-theme="dark"] .wizard-container,
[data-theme="dark"] .wizard-step,
[data-theme="dark"] .wizard-card {
    background: #0f1923;
    border-color: #2a2e42;
}

[data-theme="dark"] .wizard-progress {
    background: #1e2130;
}

[data-theme="dark"] .wizard-btn {
    background: #252940;
    color: #c8cad8;
    border-color: #2a2e42;
}

[data-theme="dark"] .wizard-btn:hover {
    background: #2a2e42;
    border-color: #10b981;
}

[data-theme="dark"] .wizard-btn-primary {
    background: var(--dt-brand, #10b981);
    color: #fff;
    border-color: var(--dt-brand, #10b981);
}


/* ═══════════════════════════════════════════════════════════════
   16. DISTRIBUTOR PAGES — Detail, Show, Form
   ═══════════════════════════════════════════════════════════════ */

[data-theme="dark"] .distributor-card,
[data-theme="dark"] .distributor-detail-card,
[data-theme="dark"] .detail-section {
    background: #0f1923;
    border-color: #2a2e42;
}

[data-theme="dark"] .detail-header {
    background: #252940;
    border-bottom-color: #2a2e42;
}

[data-theme="dark"] .detail-label {
    color: #a0a4b8;
}

[data-theme="dark"] .detail-value {
    color: #e4e6f0;
}


/* ═══════════════════════════════════════════════════════════════
   17. LOGIN PAGE
   ═══════════════════════════════════════════════════════════════ */

[data-theme="dark"] .login-card,
[data-theme="dark"] .login-container {
    background: #0f1923;
    border-color: #2a2e42;
    box-shadow: 0 25px 50px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .login-header {
    border-bottom-color: #2a2e42;
}


/* ═══════════════════════════════════════════════════════════════
   18. BOTTOM NAVIGATION (Mobile)
   ═══════════════════════════════════════════════════════════════ */

[data-theme="dark"] .bottom-nav,
[data-theme="dark"] .mobile-nav {
    background: #0f1923;
    border-top-color: #2a2e42;
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .bottom-nav-item {
    color: #8b8fa3;
}

[data-theme="dark"] .bottom-nav-item.active {
    color: var(--dt-brand, #10b981);
}

/* Bottom nav avec glassmorphism en dark */
[data-theme="dark"] .bottom-nav.glass {
    background: rgba(26, 29, 39, 0.92);
    backdrop-filter: blur(20px);
}


/* ═══════════════════════════════════════════════════════════════
   19. SCROLLBARS — Global dark
   ═══════════════════════════════════════════════════════════════ */

[data-theme="dark"] ::-webkit-scrollbar-track {
    background: #0f1923;
}

[data-theme="dark"] ::-webkit-scrollbar-thumb {
    background: #353a52;
}

[data-theme="dark"] ::-webkit-scrollbar-thumb:hover {
    background: #3e4360;
}


/* ═══════════════════════════════════════════════════════════════
   20. HR & DIVIDERS & INFO BOXES
   ═══════════════════════════════════════════════════════════════ */

[data-theme="dark"] .divider,
[data-theme="dark"] hr {
    border-color: #2a2e42;
}

[data-theme="dark"] .info-box,
[data-theme="dark"] .help-text {
    background: rgba(59, 130, 246, 0.06);
    color: #a0a4b8;
}


/* ═══════════════════════════════════════════════════════════════
   21. 404 / ERREUR PAGES
   ═══════════════════════════════════════════════════════════════ */

[data-theme="dark"] .error-page {
    background: #0b1017;
    color: #c8cad8;
}


/* ═══════════════════════════════════════════════════════════════
   22. TABS (global)
   ═══════════════════════════════════════════════════════════════ */

[data-theme="dark"] .tab-nav,
[data-theme="dark"] .tabs {
    border-bottom-color: #2a2e42;
}

[data-theme="dark"] .tab-link {
    color: #a0a4b8;
}

[data-theme="dark"] .tab-link:hover {
    color: #e4e6f0;
}

[data-theme="dark"] .tab-link.active {
    color: var(--dt-brand, #10b981);
    border-bottom-color: var(--dt-brand, #10b981);
}


/* ═══════════════════════════════════════════════════════════════
   23. UTILITY OVERRIDES — Catch-all
   ═══════════════════════════════════════════════════════════════ */

[data-theme="dark"] .text-dark,
[data-theme="dark"] .text-black {
    color: #e4e6f0 !important;
}

[data-theme="dark"] .bg-white {
    background: #0f1923 !important;
}

[data-theme="dark"] .bg-light,
[data-theme="dark"] .bg-gray-50 {
    background: #1e2130 !important;
}

[data-theme="dark"] .border-gray {
    border-color: #2a2e42 !important;
}

/* Selection couleur en dark */
[data-theme="dark"] ::selection {
    background: rgba(43, 196, 138, 0.3);
    color: #e4e6f0;
}

/* Focus visible accessibilité — dark */
[data-theme="dark"] :focus-visible {
    outline-color: var(--dt-brand, #10b981);
}


/* ═══════════════════════════════════════════════════════════════
   24. SETTINGS MODAL (user preferences)
   ═══════════════════════════════════════════════════════════════ */

[data-theme="dark"] .settings-modal,
[data-theme="dark"] .settings-panel {
    background: #252940;
    border-color: #2a2e42;
}

[data-theme="dark"] .settings-section {
    border-bottom-color: #2a2e42;
}

[data-theme="dark"] .settings-label {
    color: #c8cad8;
}


/* ═══════════════════════════════════════════════════════════════
   25. CHECKBOX & TOGGLE SWITCHES
   ═══════════════════════════════════════════════════════════════ */

[data-theme="dark"] .lf-toggle-slider {
    background: #353a52;
}

[data-theme="dark"] .lf-toggle input:checked+.lf-toggle-slider {
    background: var(--dt-brand, #10b981);
}

[data-theme="dark"] input[type="checkbox"] {
    accent-color: var(--dt-brand, #10b981);
}

[data-theme="dark"] input[type="radio"] {
    accent-color: var(--dt-brand, #10b981);
}


/* ═══════════════════════════════════════════════════════════════
   26. COLOR PICKERS & RANGE SLIDERS
   ═══════════════════════════════════════════════════════════════ */

[data-theme="dark"] input[type="range"] {
    accent-color: var(--dt-brand, #10b981);
}

[data-theme="dark"] input[type="color"] {
    background: #252940;
    border-color: #353a52;
}


/* ═══════════════════════════════════════════════════════════════
   27. LOGIN.CSS — Page connexion standalone
   ═══════════════════════════════════════════════════════════════ */

[data-theme="dark"] .auth-container {
    background: #1e2130;
    border-color: #2a2e42;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .form-label {
    color: #c8cad8;
}

[data-theme="dark"] .form-input {
    background: #252940;
    border-color: #353a52;
    color: #e4e6f0;
}

[data-theme="dark"] .form-input:focus {
    border-color: #10b981;
    box-shadow: 0 0 0 3px rgba(43, 196, 138, 0.12);
}

[data-theme="dark"] .form-input::placeholder {
    color: #6b7094;
}

[data-theme="dark"] .btn-primary {
    background: #e4e6f0;
    color: #0b1017;
}

[data-theme="dark"] .btn-primary:hover {
    background: #ffffff;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

/* Alertes login dark */
[data-theme="dark"] .alert-error {
    background: rgba(245, 101, 101, 0.08);
    border-color: rgba(245, 101, 101, 0.2);
    color: #f88b8b;
}

[data-theme="dark"] .alert-success {
    background: rgba(43, 196, 138, 0.08);
    border-color: rgba(43, 196, 138, 0.2);
    color: #5dd9a8;
}

[data-theme="dark"] .alert-pro-pending {
    background: rgba(139, 92, 246, 0.08);
    border-color: rgba(139, 92, 246, 0.2);
    color: #c4b5fd;
}

[data-theme="dark"] .alert-pro-pending i {
    color: #a78bfa;
}

[data-theme="dark"] .alert-pro-pending strong {
    color: #c4b5fd;
}


/* ═══════════════════════════════════════════════════════════════
   28. DISTRIBUTOR-SHOW.CSS — Page fiche distributeur
   ═══════════════════════════════════════════════════════════════ */

/* Note : distributor-show.css utilise principalement les
   design tokens (--dt-*), donc il s'adapte automatiquement.
   Ces overrides couvrent les propriétés hardcodées restantes. */

[data-theme="dark"] .ds-hero-bg {
    background: linear-gradient(135deg, #0f1923 0%, #252940 100%);
}

/* ds-stat-card, ds-review-card → voir Section 39 (transparent) */

[data-theme="dark"] .ds-info-row {
    border-bottom-color: #22263a;
}

[data-theme="dark"] .ds-section-title {
    color: #e4e6f0;
}

[data-theme="dark"] .ds-dock {
    background: rgba(26, 29, 39, 0.95);
    border-top-color: #2a2e42;
    backdrop-filter: blur(20px);
}


/* ═══════════════════════════════════════════════════════════════
   29. SEARCH.CSS — Page recherche complète
   ═══════════════════════════════════════════════════════════════ */

/* --- Body & background --- */
[data-theme="dark"] .search-page {
    background: #0b1017;
    color: #c8cad8;
}

/* --- Search bar dans le hero --- */
[data-theme="dark"] .s-search-bar {
    background: rgba(37, 41, 64, 0.95);
    border-color: #353a52;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .s-search-bar:focus-within {
    border-color: #10b981;
    box-shadow: 0 8px 40px rgba(16, 163, 127, 0.2), 0 0 0 4px rgba(16, 163, 127, 0.1);
}

[data-theme="dark"] .s-search-bar .search-icon {
    color: #6b7094;
}

[data-theme="dark"] .s-search-bar input[type="text"] {
    color: #e4e6f0;
}

[data-theme="dark"] .s-search-bar input::placeholder {
    color: #6b7094;
}

[data-theme="dark"] .s-search-submit {
    background: #e4e6f0;
    color: #0b1017;
}

[data-theme="dark"] .s-search-submit:hover {
    background: #ffffff;
}

/* --- Barre de filtres horizontale --- */
[data-theme="dark"] .s-filters-bar {
    background: #0f1923;
    border-color: #2a2e42;
}

[data-theme="dark"] .s-filters-bar:hover {
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
}

[data-theme="dark"] .s-filter-label-inline {
    color: #8b8fa3;
}

/* --- Type chips (catégories) --- */
[data-theme="dark"] .s-type-chip {
    background: #252940;
    border-color: #353a52;
}

[data-theme="dark"] .s-type-chip:hover {
    border-color: #4e5370;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}

[data-theme="dark"] .s-type-chip.active {
    border-color: #10b981;
    background: rgba(43, 196, 138, 0.08);
}

[data-theme="dark"] .s-type-chip-label {
    color: #a0a4b8;
}

[data-theme="dark"] .s-type-chip.active .s-type-chip-label {
    color: #e4e6f0;
}

/* --- Filter inputs inline (ville, dept, tri) --- */
[data-theme="dark"] .s-filter-inline-group {
    background: #252940;
    border-color: #353a52;
}

[data-theme="dark"] .s-filter-inline-group:focus-within {
    border-color: #10b981;
    box-shadow: 0 0 0 3px rgba(43, 196, 138, 0.12);
    background: #1e2130;
}

[data-theme="dark"] .s-filter-inline-label {
    color: #6b7094;
}

[data-theme="dark"] .s-filter-inline-input {
    color: #e4e6f0;
}

[data-theme="dark"] .s-filter-inline-input::placeholder {
    color: #6b7094;
}

[data-theme="dark"] .s-filter-inline-select {
    color: #e4e6f0;
}

[data-theme="dark"] .s-btn-apply-inline {
    background: #e4e6f0;
    color: #0b1017;
}

[data-theme="dark"] .s-btn-apply-inline:hover {
    background: #ffffff;
}

[data-theme="dark"] .s-btn-reset-inline {
    background: #252940;
    border-color: #353a52;
    color: #f88b8b;
}

[data-theme="dark"] .s-btn-reset-inline:hover {
    background: rgba(245, 101, 101, 0.12);
    border-color: rgba(245, 101, 101, 0.3);
}

/* --- Filter standard inputs & selects --- */
[data-theme="dark"] .s-filter-input,
[data-theme="dark"] .s-filter-select {
    background: #252940;
    border-color: #353a52;
    color: #e4e6f0;
}

[data-theme="dark"] .s-filter-input:focus,
[data-theme="dark"] .s-filter-select:focus {
    border-color: #10b981;
    box-shadow: 0 0 0 3px rgba(43, 196, 138, 0.12);
}

[data-theme="dark"] .s-filter-input::placeholder {
    color: #6b7094;
}

[data-theme="dark"] .s-btn-apply {
    background: #e4e6f0;
    color: #0b1017;
}

[data-theme="dark"] .s-btn-apply:hover {
    background: #ffffff;
}

[data-theme="dark"] .s-btn-reset {
    background: #252940;
    color: #a0a4b8;
}

[data-theme="dark"] .s-btn-reset:hover {
    background: #353a52;
    color: #e4e6f0;
}

/* --- Type Grid (mobile cards) --- */
[data-theme="dark"] .s-type-card {
    background: #252940;
    border-color: #353a52;
}

[data-theme="dark"] .s-type-card:hover {
    border-color: #4e5370;
}

[data-theme="dark"] .s-type-card.active {
    border-color: #10b981;
    background: rgba(43, 196, 138, 0.06);
}

[data-theme="dark"] .s-type-card-emoji {
    background: #1e2130;
}

[data-theme="dark"] .s-type-card-label {
    color: #a0a4b8;
}

[data-theme="dark"] .s-type-card.active .s-type-card-label {
    color: #e4e6f0;
}

/* --- Results header --- */
[data-theme="dark"] .s-results-count {
    color: #8b8fa3;
}

[data-theme="dark"] .s-results-count strong {
    color: #e4e6f0;
}

/* --- View toggle --- */
[data-theme="dark"] .s-view-toggle {
    background: #1e2130;
}

[data-theme="dark"] .s-view-btn {
    color: #6b7094;
}

[data-theme="dark"] .s-view-btn:hover {
    color: #a0a4b8;
}

[data-theme="dark"] .s-view-btn.active {
    background: #252940;
    color: #e4e6f0;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

/* --- Active filter badges --- */
[data-theme="dark"] .s-active-badge {
    background: #252940;
    border-color: #353a52;
    color: #a0a4b8;
}

[data-theme="dark"] .s-active-badge:hover {
    border-color: #4e5370;
}

/* --- Result Cards --- */
[data-theme="dark"] .sr-card {
    background: #0f1923;
    border-color: #2a2e42;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
}

[data-theme="dark"] .sr-card:hover {
    box-shadow: 0 20px 25px rgba(0, 0, 0, 0.3);
    border-color: #353a52;
}

[data-theme="dark"] .sr-card-avatar-wrap {
    background: #1e2130;
}

[data-theme="dark"] .sr-card-avatar-initial {
    background: #252940;
}

[data-theme="dark"] .sr-card-type-float {
    border-color: #0f1923;
}

[data-theme="dark"] .sr-card-name {
    color: #e4e6f0;
}

[data-theme="dark"] .sr-card-name:hover {
    color: #10b981;
}

[data-theme="dark"] .sr-card-info-grid {
    border-top-color: #2a2e42;
}

[data-theme="dark"] .sr-card-info-label {
    color: #6b7094;
}

[data-theme="dark"] .sr-card-info-value {
    color: #c8cad8;
}

[data-theme="dark"] .sr-card-description {
    color: #8b8fa3;
    border-top-color: #2a2e42;
}

[data-theme="dark"] .sr-card-actions {
    background: #1e2130;
    border-top-color: #2a2e42;
}

[data-theme="dark"] .sr-payment-pill {
    background: #252940;
    border-color: #353a52;
    color: #a0a4b8;
}

[data-theme="dark"] .sr-payment-pill:hover {
    border-color: #6b7094;
    color: #e4e6f0;
}

[data-theme="dark"] .sr-btn-itineraire {
    background: rgba(59, 130, 246, 0.1);
    border-color: rgba(59, 130, 246, 0.2);
}

[data-theme="dark"] .sr-btn-view {
    background: #252940;
    border-color: #353a52;
    color: #a0a4b8;
}

[data-theme="dark"] .sr-btn-view:hover {
    background: #353a52;
    color: #e4e6f0;
}

[data-theme="dark"] .sr-card-distance {
    background: rgba(59, 130, 246, 0.1);
    border-color: rgba(59, 130, 246, 0.2);
    color: #93c5fd;
}

/* --- Mode liste --- */
[data-theme="dark"] .s-results-list .sr-card-actions {
    border-left-color: #2a2e42;
}

/* --- Pagination --- */
[data-theme="dark"] .s-page-btn {
    background: #0f1923;
    border-color: #2a2e42;
    color: #a0a4b8;
}

[data-theme="dark"] .s-page-btn:hover {
    border-color: #e4e6f0;
    color: #e4e6f0;
}

[data-theme="dark"] .s-page-btn.active {
    background: #e4e6f0;
    color: #0b1017;
    border-color: #e4e6f0;
}

[data-theme="dark"] .s-page-dots {
    color: #6b7094;
}

/* --- Empty State --- */
[data-theme="dark"] .s-empty h3 {
    color: #e4e6f0;
}

[data-theme="dark"] .s-empty p {
    color: #8b8fa3;
}

[data-theme="dark"] .s-empty-circle {
    background: linear-gradient(135deg, rgba(43, 196, 138, 0.08), rgba(43, 196, 138, 0.04));
}

[data-theme="dark"] .s-empty-tag {
    background: #252940;
    border-color: #353a52;
    color: #a0a4b8;
}

[data-theme="dark"] .s-empty-tag:hover {
    border-color: #10b981;
    color: #10b981;
    box-shadow: 0 4px 16px rgba(16, 163, 127, 0.15);
}

[data-theme="dark"] .s-empty-reset {
    background: #e4e6f0;
    color: #0b1017;
}

[data-theme="dark"] .s-empty-reset:hover {
    background: #ffffff;
}

/* --- Footer search --- */
[data-theme="dark"] .s-footer {
    border-top-color: #2a2e42;
}

[data-theme="dark"] .s-footer p {
    color: #6b7094;
}

[data-theme="dark"] .s-footer a {
    color: #8b8fa3;
}

/* --- Mobile filter toggle --- */
[data-theme="dark"] .s-mobile-toggle {
    background: #0f1923;
    border-color: #2a2e42;
    color: #e4e6f0;
}

[data-theme="dark"] .s-mobile-toggle:hover {
    border-color: #10b981;
}

/* --- Scrollbar types dark --- */
[data-theme="dark"] .s-type-scroll::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.08);
}


/* ═══════════════════════════════════════════════════════════════
   30. LANDING.CSS — Page à propos complète
   ═══════════════════════════════════════════════════════════════ */

/* lp-stat-card, lp-feature-card bg → voir Section 39 (transparent) */

[data-theme="dark"] .lp-stat-card:hover {
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3);
    border-color: rgba(43, 196, 138, 0.3);
}

[data-theme="dark"] .lp-stat-value {
    color: #e4e6f0;
}

[data-theme="dark"] .lp-stat-desc {
    color: #8b8fa3;
}

[data-theme="dark"] .lp-stats {
    border-top-color: #2a2e42;
    border-bottom-color: #2a2e42;
}

[data-theme="dark"] .lp-section-alt {
    background: #0b1017;
}

[data-theme="dark"] .lp-section-header h2 {
    color: #e4e6f0;
}

[data-theme="dark"] .lp-section-header p {
    color: #8b8fa3;
}

[data-theme="dark"] .lp-feature-card h4 {
    color: #e4e6f0;
}

[data-theme="dark"] .lp-feature-card p {
    color: #8b8fa3;
}

/* --- Showcase sections --- */
[data-theme="dark"] .lp-showcase-img {
    border-color: #2a2e42;
}

[data-theme="dark"] .lp-showcase-content h3 {
    color: #e4e6f0;
}

[data-theme="dark"] .lp-showcase-content p {
    color: #8b8fa3;
}

[data-theme="dark"] .lp-feature-list li {
    color: #c8cad8;
}

/* --- Steps --- */
[data-theme="dark"] .lp-step h4 {
    color: #e4e6f0;
}

[data-theme="dark"] .lp-step p {
    color: #8b8fa3;
}

[data-theme="dark"] .lp-step-connector {
    background: repeating-linear-gradient(90deg, #2a2e42 0, #2a2e42 6px, transparent 6px, transparent 12px);
}

/* lp-testimonial, lp-pricing bg → voir Section 39 (transparent) */

[data-theme="dark"] .lp-testimonial:hover {
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .lp-testimonial-text {
    color: #a0a4b8;
}

[data-theme="dark"] .lp-testimonial-name {
    color: #e4e6f0;
}

[data-theme="dark"] .lp-testimonial-role {
    color: #6b7094;
}

[data-theme="dark"] .lp-pricing-card.featured {
    background: linear-gradient(180deg, rgba(43, 196, 138, 0.06) 0%, transparent 100%) !important;
    border-color: #10b981 !important;
}

[data-theme="dark"] .lp-pricing-price {
    color: #e4e6f0;
}

[data-theme="dark"] .lp-pricing-features li {
    border-bottom-color: #22263a;
    color: #c8cad8;
}

/* --- Buttons landing --- */
[data-theme="dark"] .lp-btn-outline {
    color: #c8cad8;
    border-color: #353a52;
}

[data-theme="dark"] .lp-btn-outline:hover {
    border-color: #10b981;
    color: #10b981;
}

[data-theme="dark"] .lp-btn-white {
    background: #252940;
    color: var(--dt-brand, #10b981);
}

[data-theme="dark"] .lp-btn-white:hover {
    background: #353a52;
}

/* --- Contribute section --- */
[data-theme="dark"] .lp-contribute-avatars .avatar {
    border-color: #0b1017;
}

/* --- Footer landing --- */
[data-theme="dark"] .lp-footer {
    background: #0a0c12;
}


/* ═══════════════════════════════════════════════════════════════
   31. HEADER FRONTEND PUBLIC — Boutons + Notifications + Dropdowns
   ═══════════════════════════════════════════════════════════════ */

/* --- Header bar frontend (glass → dark glass) --- */
[data-theme="dark"] .header {
    background: rgba(15, 17, 23, 0.92) !important;
    border-bottom-color: #2a2e42 !important;
}

/* --- Logo text gradient (clair → light) --- */
[data-theme="dark"] .logo-text h1 {
    background: linear-gradient(135deg, #e4e6f0, #a0a4b8) !important;
    background-clip: text !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

[data-theme="dark"] .logo-text p {
    color: #6b7094 !important;
}

/* --- Boutons action header (.header-btn) — Infos, Notif, Carte, Loupe --- */
[data-theme="dark"] .header-btn {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: #353a52 !important;
    color: #a0a4b8 !important;
}

[data-theme="dark"] .header-btn:hover {
    background: rgba(255, 255, 255, 0.12) !important;
    border-color: #e4e6f0 !important;
    color: #e4e6f0 !important;
}

/* --- Bouton Login invité (.header-btn.primary) --- */
[data-theme="dark"] .header-btn.primary {
    background: #252940 !important;
    color: #a0a4b8 !important;
}

[data-theme="dark"] .header-btn.primary:hover {
    background: #353a52 !important;
    color: #e4e6f0 !important;
}

/* --- Notification badge (pastille rouge) --- */
[data-theme="dark"] .notif-badge-header {
    border-color: #0b1017 !important;
}

/* --- Avatar utilisateur/pro header --- */
[data-theme="dark"] .user-avatar-btn {
    background: #252940 !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3) !important;
}

[data-theme="dark"] .user-avatar-btn.no-img {
    background: linear-gradient(135deg, #5b5fc7, #4338ca) !important;
}

[data-theme="dark"] .user-avatar-btn.no-img.pro-avatar {
    background: linear-gradient(135deg, #0d9488, #0f766e) !important;
}

/* --- User dropdown menu --- */
[data-theme="dark"] .user-dropdown {
    background: #0f1923 !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5), 0 0 0 1px #2a2e42 !important;
}

[data-theme="dark"] .dropdown-header-info {
    border-bottom-color: #2a2e42 !important;
}

[data-theme="dark"] .dropdown-user-name {
    color: #e4e6f0 !important;
}

[data-theme="dark"] .dropdown-user-email {
    color: #6b7094 !important;
}

[data-theme="dark"] .dropdown-link {
    color: #a0a4b8 !important;
}

[data-theme="dark"] .dropdown-link:hover {
    background: rgba(255, 255, 255, 0.04) !important;
    color: #e4e6f0 !important;
}

[data-theme="dark"] .dropdown-link i {
    color: #6b7094 !important;
}

[data-theme="dark"] .dropdown-link:hover i {
    color: #10b981 !important;
}

[data-theme="dark"] .dropdown-divider {
    background: #2a2e42 !important;
}

/* --- Notification dropdown --- */
[data-theme="dark"] .notif-dropdown {
    background: #0f1923 !important;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5), 0 0 0 1px #2a2e42 !important;
}

[data-theme="dark"] .notif-dropdown-head {
    border-bottom-color: #2a2e42 !important;
    color: #e4e6f0 !important;
}

[data-theme="dark"] .notif-dropdown-item {
    color: #a0a4b8 !important;
    border-bottom-color: #22263a !important;
}

[data-theme="dark"] .notif-dropdown-item:hover {
    background: rgba(255, 255, 255, 0.03) !important;
}

[data-theme="dark"] .notif-dropdown-title {
    color: #e4e6f0 !important;
}

[data-theme="dark"] .notif-dropdown-msg {
    color: #6b7094 !important;
}

[data-theme="dark"] .notif-dropdown-time {
    color: #555873 !important;
}

[data-theme="dark"] .notif-dropdown-empty {
    color: #6b7094 !important;
}

[data-theme="dark"] .notif-dropdown-footer {
    border-top-color: #2a2e42 !important;
}

/* --- Version Badge --- */
[data-theme="dark"] .version-badge {
    background: rgba(16, 185, 129, 0.15) !important;
}

/* --- Mobile : Map-page header btn fond sombre transparent --- */
@media (max-width: 768px) {
    [data-theme="dark"] .map-page .header-btn {
        background: rgba(15, 17, 23, 0.85) !important;
        box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3), 0 0 0 1px rgba(255, 255, 255, 0.06) !important;
    }

    [data-theme="dark"] .map-page .user-avatar-btn {
        background: rgba(15, 17, 23, 0.85) !important;
        box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3), 0 0 0 1px rgba(255, 255, 255, 0.06) !important;
    }

    [data-theme="dark"] .logo-container {
        background: rgba(15, 17, 23, 0.92) !important;
        box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3), 0 0 0 1px rgba(255, 255, 255, 0.06) !important;
    }
}

/* --- Container d'icônes header admin (sidebar-based) --- */
[data-theme="dark"] .user-avatar-container {
    border-color: #353a52;
}

[data-theme="dark"] .header-actions .header-icon,
[data-theme="dark"] .header-actions button,
[data-theme="dark"] .header-actions a:not(.btn-auth) {
    color: #a0a4b8;
}

[data-theme="dark"] .header-actions .header-icon:hover,
[data-theme="dark"] .header-actions button:hover {
    color: #e4e6f0;
    background: rgba(255, 255, 255, 0.06);
}

/* Notification badge admin (pastille rouge) */
[data-theme="dark"] .notification-badge,
[data-theme="dark"] .badge-count {
    box-shadow: 0 0 0 2px #0f1923;
}

/* Header icon circles admin */
[data-theme="dark"] .header-icon-circle,
[data-theme="dark"] .header-btn-circle {
    background: #252940;
    border-color: #353a52;
    color: #a0a4b8;
}

[data-theme="dark"] .header-icon-circle:hover,
[data-theme="dark"] .header-btn-circle:hover {
    background: #353a52;
    color: #e4e6f0;
}


/* ═══════════════════════════════════════════════════════════════
   32. VPANEL COUNT — Badge compteur distributeurs
   ═══════════════════════════════════════════════════════════════ */

[data-theme="dark"] .vpanel-count {
    background: #252940;
    color: #6b7094;
}

[data-theme="dark"] .vpanel-actions.has-results .vpanel-count {
    background: rgba(59, 130, 246, 0.12);
    color: #93c5fd;
}

/* --- Toggle filter buttons (vpanel) --- */
[data-theme="dark"] .vpanel-btn.reset-btn.filter-on {
    background: rgba(43, 196, 138, 0.12);
    color: #5dd9a8;
    border-color: rgba(43, 196, 138, 0.3);
}

[data-theme="dark"] .vpanel-btn.reset-btn.filter-off {
    background: #252940;
    color: #6b7094;
    border-color: #353a52;
}

[data-theme="dark"] .vpanel-btn.reset-btn.filter-off:hover {
    border-color: #4e5370;
    color: #a0a4b8;
}

/* --- Divider --- */
[data-theme="dark"] .vpanel-divider {
    background: #353a52;
}

/* --- Slider label & icon --- */
[data-theme="dark"] .vslider-label {
    color: #e4e6f0;
}

[data-theme="dark"] .vslider-icon {
    color: #6b7094;
}

/* --- vslider track --- */
[data-theme="dark"] .vslider-track {
    background: #353a52;
}

/* --- Pro button --- */
[data-theme="dark"] .vpanel-pro-label {
    color: #e4e6f0;
}


/* ═══════════════════════════════════════════════════════════════
   33. BOTTOM SHEET FILTER — Collapsed bar dark
   ═══════════════════════════════════════════════════════════════ */

/* Les overrides principaux sont dans homepage.css (lignes 3415+).
   Ici on attrape les éléments complémentaires. */

[data-theme="dark"] .bs-collapsed-bar {
    background: rgba(26, 29, 39, 0.97);
    border-top-color: rgba(255, 255, 255, 0.06);
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .bs-collapsed-bar:hover {
    background: rgba(30, 33, 48, 0.98);
}

[data-theme="dark"] .bs-handle {
    background: #4e5370;
}

[data-theme="dark"] .bs-radius-badge {
    color: #e4e6f0;
    background: rgba(43, 196, 138, 0.1);
}

[data-theme="dark"] .bs-count-badge {
    color: #93c5fd;
    background: rgba(59, 130, 246, 0.1);
}


/* ═══════════════════════════════════════════════════════════════
   34. FLASH TOASTS — Notifications éphémères
   ═══════════════════════════════════════════════════════════════ */

[data-theme="dark"] .flash-toast {
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4);
}

/* Les flash-toast success/error utilisent déjà des fonds colorés
   qui fonctionnent en dark. On renforce juste les ombres. */

/* Toast style pages frontend (homepage info bar) */
[data-theme="dark"] .info-toast,
[data-theme="dark"] .map-info-bar {
    background: #1e2130;
    border-color: #2a2e42;
    color: #c8cad8;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4);
}


/* ═══════════════════════════════════════════════════════════════
   35. TEXTES GLOBAUX — Catch-all couleurs hardcodées
   ═══════════════════════════════════════════════════════════════ */

/* Tous les #1a1a1a / #1a1a2e / #111 / #333 → light text */
[data-theme="dark"] [style*="color: #1a1a1a"],
[data-theme="dark"] [style*="color: #111"],
[data-theme="dark"] [style*="color: #333"] {
    color: #e4e6f0 !important;
}

/* Texte secondaire gris hardcodé courant */
[data-theme="dark"] .text-muted {
    color: #8b8fa3 !important;
}

[data-theme="dark"] .text-secondary {
    color: #a0a4b8 !important;
}

/* body.search-page, body.landing-page → voir Section 39 */


/* ═══════════════════════════════════════════════════════════════
   36. ADMIN-PROS.CSS — Page Professionnels
   ═══════════════════════════════════════════════════════════════ */

/* --- KPI Stat cards (blanc → dark) --- */
[data-theme="dark"] .pros-container .stat-card {
    background: #0f1923;
    border-color: #2a2e42;
}

[data-theme="dark"] .pros-container .stat-card:hover {
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .pros-container .stat-card .info .value {
    color: #e4e6f0;
}

[data-theme="dark"] .pros-container .stat-card .info .label {
    color: #6b7094;
}

[data-theme="dark"] .pros-container .stat-card.total .icon {
    background: #252940;
}

/* --- Filter Tabs (TOUS, EN ATTENTE, etc.) --- */
[data-theme="dark"] .pros-filter-tab {
    background: #0f1923;
    border-color: #2a2e42;
    color: #8b8fa3;
}

[data-theme="dark"] .pros-filter-tab:hover {
    border-color: #e4e6f0;
    color: #e4e6f0;
}

[data-theme="dark"] .pros-filter-tab.active {
    background: #e4e6f0;
    border-color: transparent;
    color: #0b1017;
}

[data-theme="dark"] .pros-filter-tab .count {
    background: rgba(255, 255, 255, 0.06);
}

[data-theme="dark"] .pros-filter-tab.active .count {
    background: rgba(0, 0, 0, 0.12);
}

/* --- View Toggle --- */
[data-theme="dark"] .pros-view-toggle {
    background: #0f1923;
    border-color: #2a2e42;
}

[data-theme="dark"] .pros-view-btn {
    color: #6b7094;
}

[data-theme="dark"] .pros-view-btn:hover {
    color: #e4e6f0;
}

[data-theme="dark"] .pros-view-btn.active {
    background: #e4e6f0;
    color: #0b1017;
}

/* --- Search Input --- */
[data-theme="dark"] .pros-search input {
    background: #252940;
    border-color: #353a52;
    color: #e4e6f0;
}

[data-theme="dark"] .pros-search input::placeholder {
    color: #6b7094;
}

[data-theme="dark"] .pros-search input:focus {
    border-color: #10b981;
    box-shadow: 0 0 0 3px rgba(16, 163, 127, 0.12);
}

[data-theme="dark"] .pros-search i {
    color: #6b7094;
}

/* --- Bouton Nouveau Pro --- */
[data-theme="dark"] .pros-btn-new {
    background: #e4e6f0;
    color: #0b1017;
}

[data-theme="dark"] .pros-btn-new:hover {
    background: #ffffff;
    color: #0b1017;
}

/* .pro-card bg → voir Section 39 (transparent) */
[data-theme="dark"] .pro-card:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
    border-color: #353a52;
}

[data-theme="dark"] .pro-card-header {
    border-bottom-color: #22263a;
}

[data-theme="dark"] .pro-card-avatar {
    background: #252940;
}

[data-theme="dark"] .pro-card-company {
    color: #e4e6f0;
}

[data-theme="dark"] .pro-card-name {
    color: #8b8fa3;
}

[data-theme="dark"] .pro-card-body {
    color: #c8cad8;
}

[data-theme="dark"] .pro-card-info {
    color: #a0a4b8;
}

[data-theme="dark"] .pro-card-info i {
    color: #10b981;
}

[data-theme="dark"] .pro-card-footer {
    background: #141620;
    border-top-color: #22263a;
}

[data-theme="dark"] .pro-card-date {
    color: #6b7094;
}

[data-theme="dark"] .pro-card-actions .btn-delete,
[data-theme="dark"] .pro-row-actions .btn-delete {
    background: #252940;
    border-color: #353a52;
    color: #8b8fa3;
}

[data-theme="dark"] .pro-card-actions .btn-edit,
[data-theme="dark"] .pro-row-actions .btn-edit {
    background: #e4e6f0;
    color: #0b1017;
}

/* --- Table View (Liste) --- */
[data-theme="dark"] .pros-list {
    background: #0f1923;
    border-color: #2a2e42;
}

[data-theme="dark"] .pros-table thead {
    background: #141620;
}

[data-theme="dark"] .pros-table th {
    color: #6b7094;
    border-bottom-color: #2a2e42;
}

[data-theme="dark"] .pros-table td {
    color: #a0a4b8;
    border-bottom-color: #22263a;
}

[data-theme="dark"] .pros-table tbody tr:hover {
    background: rgba(255, 255, 255, 0.02);
}

[data-theme="dark"] .pro-row-info h4 {
    color: #e4e6f0;
}

[data-theme="dark"] .pro-row-info .sub {
    color: #6b7094;
}

[data-theme="dark"] .pro-row-avatar {
    background: #252940;
}

[data-theme="dark"] .pros-table .td-contact,
[data-theme="dark"] .pros-table .td-date,
[data-theme="dark"] .pros-table .td-mono {
    color: #a0a4b8;
}

[data-theme="dark"] .pros-table .td-contact-sub,
[data-theme="dark"] .pros-table .td-date-sub,
[data-theme="dark"] .pros-table .td-muted {
    color: #6b7094;
}

/* --- Empty State --- */
[data-theme="dark"] .pros-container .empty-state {
    background: #0f1923;
    border-color: #2a2e42;
}

[data-theme="dark"] .pros-container .empty-state i {
    color: #353a52;
}

[data-theme="dark"] .pros-container .empty-state h3 {
    color: #e4e6f0;
}

[data-theme="dark"] .pros-container .empty-state p {
    color: #8b8fa3;
}


/* ═══════════════════════════════════════════════════════════════
   37. PDF-GENERATOR.CSS — Page Générateur PDF
   ═══════════════════════════════════════════════════════════════ */

/* --- PDF Stat cards (KPI blancs) --- */
[data-theme="dark"] .pdf-stat-card {
    background: #0f1923;
    border-color: #2a2e42;
}

[data-theme="dark"] .pdf-stat-card:hover {
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.3);
}

[data-theme="dark"] .pdf-stat-card .stat-icon.blue {
    background: #252940;
}

[data-theme="dark"] .pdf-stat-card .stat-info .stat-value {
    color: #e4e6f0;
}

[data-theme="dark"] .pdf-stat-card .stat-info .stat-label {
    color: #6b7094;
}

/* --- Template cards (rapport PDF) --- */
[data-theme="dark"] .pdf-template-card {
    background: #0f1923;
    border-color: #2a2e42;
}

[data-theme="dark"] .pdf-template-card:hover {
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
    border-color: #353a52;
}

[data-theme="dark"] .pdf-template-card .card-header {
    border-bottom-color: #22263a;
}

[data-theme="dark"] .pdf-template-card .card-header h3 {
    color: #e4e6f0;
}

[data-theme="dark"] .pdf-template-card .card-header p {
    color: #8b8fa3;
}

[data-theme="dark"] .pdf-template-card .feature-list li,
[data-theme="dark"] .feature-list li {
    color: #a0a4b8;
}

/* --- Form elements --- */
[data-theme="dark"] .pdf-form-group label {
    color: #6b7094;
}

[data-theme="dark"] .pdf-form-group select,
[data-theme="dark"] .pdf-form-group input[type="text"],
[data-theme="dark"] .pdf-form-group input[type="number"],
[data-theme="dark"] .pdf-form-group input[type="date"] {
    background: #252940;
    border-color: #353a52;
    color: #e4e6f0;
}

[data-theme="dark"] .pdf-form-group select:focus,
[data-theme="dark"] .pdf-form-group input:focus {
    border-color: #10b981;
    box-shadow: 0 0 0 3px rgba(16, 163, 127, 0.12);
}

/* --- Options checkboxes --- */
[data-theme="dark"] .pdf-option-check {
    background: #1e2130;
    border-color: #2a2e42;
    color: #a0a4b8;
}

[data-theme="dark"] .pdf-option-check:hover {
    border-color: #353a52;
    background: #252940;
}

[data-theme="dark"] .pdf-option-check:has(input:checked) {
    background: rgba(16, 163, 127, 0.08);
    border-color: rgba(16, 163, 127, 0.3);
    color: #e4e6f0;
}

/* --- Section labels --- */
[data-theme="dark"] .pdf-columns-section .section-label {
    color: #6b7094;
}

/* --- Bouton Générer PDF (fond dark → inversé) --- */
[data-theme="dark"] .btn-generate-pdf {
    background: #e4e6f0;
    color: #0b1017;
}

[data-theme="dark"] .btn-generate-pdf:hover {
    background: #ffffff;
    color: #0b1017;
    box-shadow: 0 4px 12px rgba(228, 230, 240, 0.15);
}

/* --- Alerte limite --- */
[data-theme="dark"] .pdf-limit-warning {
    background: rgba(245, 158, 11, 0.1);
    border-color: rgba(245, 158, 11, 0.2);
    color: #fbbf24;
}


/* ═══════════════════════════════════════════════════════════════
   38. ADMIN PROFILE — Sections & inputs inline
   ═══════════════════════════════════════════════════════════════ */

/* --- Profile header card (photo section) --- */
[data-theme="dark"] .profile-banner,
[data-theme="dark"] .profile-photo-section {
    background: #1e2130;
    border-color: #2a2e42;
}

/* --- Profile section cards (info sections bordurées) --- */
[data-theme="dark"] .profile-section-card {
    background: #0f1923;
    border-color: #2a2e42;
}

[data-theme="dark"] .profile-section-card .section-title {
    color: #e4e6f0;
}

[data-theme="dark"] .profile-section-card .section-subtitle {
    color: #8b8fa3;
}

/* --- Inline form fields --- */
[data-theme="dark"] .profile-field-value {
    background: #252940;
    border-color: #353a52;
    color: #e4e6f0;
}

[data-theme="dark"] .profile-field-label {
    color: #6b7094;
}

/* --- Timeline / activity list --- */
[data-theme="dark"] .activity-item {
    border-bottom-color: #22263a;
}

[data-theme="dark"] .activity-item .activity-date {
    color: #6b7094;
}

[data-theme="dark"] .activity-item .activity-text {
    color: #a0a4b8;
}

/* --- Boutons profil --- */
[data-theme="dark"] .btn-choose-photo,
[data-theme="dark"] .btn-upload-photo {
    background: #252940;
    border-color: #353a52;
    color: #a0a4b8;
}

[data-theme="dark"] .btn-choose-photo:hover,
[data-theme="dark"] .btn-upload-photo:hover {
    background: #353a52;
    color: #e4e6f0;
}


/* ═══════════════════════════════════════════════════════════════
   39. FOND DE PAGE UNIFIÉ — Pas de "boîte dans boîte"
   ═══════════════════════════════════════════════════════════════
   
   En thème clair : body #f9f9f9 + cards #ffffff → séparation naturelle.
   En thème sombre : le contenu doit se poser DIRECTEMENT sur le fond,
   comme le thème clair. Les bordures suffisent pour la hiérarchie.
   
   On supprime les fonds intermédiaires qui créent l'effet wrapper visible.
   ═══════════════════════════════════════════════════════════════ */

/* --- Body / Admin-main / Content → même fond sombre unifié --- */
[data-theme="dark"] body,
[data-theme="dark"] .admin-main,
[data-theme="dark"] .admin-content,
[data-theme="dark"] .page-content,
[data-theme="dark"] .content-wrapper,
[data-theme="dark"] .main-content {
    background-color: #0b1017 !important;
}

/* --- Cards / Dashboard cards / Panels → fond transparent sur le body --- */
/* Ils gardent juste leur bordure pour la séparation visuelle */
[data-theme="dark"] .dashboard-card:not(.preview-card):not(.adm-card),
[data-theme="dark"] .card:not(.preview-card):not(.adm-card):not(.am-stat-card):not(.am-check-card),
[data-theme="dark"] .panel:not(.am-panel) {
    background: transparent !important;
    box-shadow: none !important;
    border-color: #2a2e42 !important;
}

/* --- Header admin — reste surface pour ancrage visuel --- */
[data-theme="dark"] .admin-header {
    background-color: #0f1923 !important;
    border-bottom-color: #2a2e42 !important;
}

/* --- Page wrappers spécifiques (inbox, email, etc.) --- */
[data-theme="dark"] .inbox-wrapper,
[data-theme="dark"] .email-wrapper,
[data-theme="dark"] .email-content,
[data-theme="dark"] .inbox-main {
    background: transparent !important;
}

/* --- Stat-card-unified et PDF/Pros stat-cards → bordure uniquement --- */
[data-theme="dark"] .stat-card-unified,
[data-theme="dark"] .pros-container .stat-card,
[data-theme="dark"] .pdf-stat-card {
    background: transparent !important;
    border-color: #2a2e42 !important;
}

/* --- Pro cards → bordure uniquement --- */
[data-theme="dark"] .pro-card {
    background: transparent !important;
    border-color: #2a2e42 !important;
}

[data-theme="dark"] .pro-card-footer {
    background: rgba(255, 255, 255, 0.02) !important;
}

/* --- PDF template cards --- */
[data-theme="dark"] .pdf-template-card {
    background: transparent !important;
    border-color: #2a2e42 !important;
}

/* --- List/Table containers --- */
[data-theme="dark"] .pros-list {
    background: transparent !important;
    border-color: #2a2e42 !important;
}

[data-theme="dark"] .pros-table thead {
    background: rgba(255, 255, 255, 0.02) !important;
}

/* --- Empty states --- */
[data-theme="dark"] .pros-container .empty-state {
    background: transparent !important;
}

/* --- Filter components → légère surface pour distinction --- */
[data-theme="dark"] .pros-filter-tab {
    background: transparent !important;
    border-color: #2a2e42 !important;
}

[data-theme="dark"] .pros-view-toggle {
    background: transparent !important;
    border-color: #2a2e42 !important;
}

/* --- Option checks (PDF) --- */
[data-theme="dark"] .pdf-option-check {
    background: transparent !important;
    border-color: #2a2e42 !important;
}

/* --- Search page body --- */
[data-theme="dark"] body.search-page,
[data-theme="dark"] body.landing-page {
    background: #0b1017 !important;
}

/* --- Search cards sur fond direct --- */
[data-theme="dark"] .sr-card {
    background: transparent !important;
    border-color: #2a2e42 !important;
}

[data-theme="dark"] .sr-card-actions {
    background: rgba(255, 255, 255, 0.02) !important;
}

/* --- Landing page cards --- */
[data-theme="dark"] .lp-stat-card,
[data-theme="dark"] .lp-feature-card,
[data-theme="dark"] .lp-testimonial,
[data-theme="dark"] .lp-pricing-card {
    background: transparent !important;
    border-color: #2a2e42 !important;
}

/* --- Profile sections --- */
[data-theme="dark"] .profile-section-card {
    background: transparent !important;
    border-color: #2a2e42 !important;
}

[data-theme="dark"] .profile-banner,
[data-theme="dark"] .profile-photo-section {
    background: transparent !important;
}

/* --- Distributor show --- */
[data-theme="dark"] .ds-stat-card,
[data-theme="dark"] .ds-review-card {
    background: transparent !important;
    border-color: #2a2e42 !important;
}

/* --- Login ne change pas (page standalone) --- */
/* La page login garde son propre fond, c'est correct. */

/* --- Inbox / Email page wrappers → transparents --- */
[data-theme="dark"] .inbox-toolbar {
    background: transparent !important;
    border-color: #2a2e42 !important;
}

[data-theme="dark"] .email-list-container {
    background: transparent !important;
    border-color: #2a2e42 !important;
}

[data-theme="dark"] .email-list-header {
    background: rgba(255, 255, 255, 0.02) !important;
    border-bottom-color: #2a2e42 !important;
}

[data-theme="dark"] .service-status-bar {
    background: transparent !important;
    border-color: #2a2e42 !important;
}

[data-theme="dark"] .service-status-group {
    background: rgba(255, 255, 255, 0.03) !important;
    border-color: #2a2e42 !important;
}

[data-theme="dark"] .status-tab {
    background: transparent !important;
    border-color: #2a2e42 !important;
}

[data-theme="dark"] .inbox-search input {
    background: rgba(255, 255, 255, 0.04) !important;
    border-color: #2a2e42 !important;
    color: #e4e6f0 !important;
}

[data-theme="dark"] .filter-select {
    background-color: rgba(255, 255, 255, 0.04) !important;
    border-color: #2a2e42 !important;
    color: #e4e6f0 !important;
}

/* --- CSV Exchange panels → transparents --- */
[data-theme="dark"] .csv-panel-card,
[data-theme="dark"] .export-options,
[data-theme="dark"] .import-panel,
[data-theme="dark"] .import-results,
[data-theme="dark"] .export-recap {
    background: transparent !important;
    border-color: #2a2e42 !important;
}

[data-theme="dark"] .table-card {
    background: transparent !important;
    border-color: #2a2e42 !important;
}

[data-theme="dark"] .table-card.selected {
    background: rgba(16, 185, 129, 0.04) !important;
    border-color: #10b981 !important;
}

/* --- Settings / Forms unified sections → card surface (aligné dashboard) --- */
[data-theme="dark"] .settings-section,
[data-theme="dark"] .form-section,
[data-theme="dark"] .settings-card {
    background: #0f1923 !important;
    border: 1px solid rgba(255, 255, 255, 0.06) !important;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3), 0 2px 4px -1px rgba(0, 0, 0, 0.15) !important;
}

/* --- Upload zones / Dropzones restent légèrement visibles --- */
[data-theme="dark"] .upload-zone {
    background: rgba(255, 255, 255, 0.02) !important;
    border-color: #353a52 !important;
}

[data-theme="dark"] .upload-zone:hover,
[data-theme="dark"] .upload-zone.dragover {
    background: rgba(16, 185, 129, 0.04) !important;
    border-color: #10b981 !important;
}

/* --- Modales : gardent un fond distinct (overlay superposé) --- */
/* On ne rend PAS les modales transparentes - elles ont besoin
   de se détacher visuellement du fond. */
[data-theme="dark"] .email-config-modal {
    background: #0f1923 !important;
}

/* --- Server sections dans les modales config --- */
[data-theme="dark"] .server-section {
    background: rgba(255, 255, 255, 0.02) !important;
    border-color: #2a2e42 !important;
}


/* ═══════════════════════════════════════════════════════════════
   40. ESPACE UTILISATEUR (/user/) + ESPACE PRO (/pro/)
   ═══════════════════════════════════════════════════════════════
   
   Les deux espaces utilisent des palettes Slate (#0f172a, #1e293b)
   via des CSS variables locales. On force la palette unifiée
   (#0b1017 body, transparent cards, #2a2e42 bordures).
   ═══════════════════════════════════════════════════════════════ */

/* ── 40.1 Body & Layout containers ── */
[data-theme="dark"] .user-main,
[data-theme="dark"] .pro-main {
    background-color: #0b1017 !important;
}

[data-theme="dark"] .user-content,
[data-theme="dark"] .pro-content {
    background: transparent !important;
}

/* ── 40.2 Header espace user/pro ── */
[data-theme="dark"] .user-header,
[data-theme="dark"] .pro-header {
    background: rgba(15, 17, 23, 0.92) !important;
    border-bottom-color: #2a2e42 !important;
}

/* Boutons header espace user — fond blanc hardcodé → dark */
[data-theme="dark"] .user-header .header-btn,
[data-theme="dark"] .user-header .notification-trigger>i {
    background: rgba(255, 255, 255, 0.06) !important;
    border-color: #353a52 !important;
    color: #a0a4b8 !important;
}

[data-theme="dark"] .user-header .header-btn:hover,
[data-theme="dark"] .user-header .notification-trigger:hover>i {
    background: rgba(255, 255, 255, 0.12) !important;
    border-color: #e4e6f0 !important;
    color: #e4e6f0 !important;
}

/* Mobile menu btn */
[data-theme="dark"] .mobile-menu-btn {
    background: rgba(255, 255, 255, 0.04) !important;
    border-color: #353a52 !important;
    color: #a0a4b8 !important;
}

/* ── 40.3 Sidebar user/pro → unifié ── */
[data-theme="dark"] .user-sidebar,
[data-theme="dark"] .pro-sidebar {
    background: #0b1017 !important;
    border-right-color: #2a2e42 !important;
}

[data-theme="dark"] .sidebar-nav a,
[data-theme="dark"] .user-sidebar .nav-link,
[data-theme="dark"] .pro-sidebar .nav-link {
    color: #a0a4b8 !important;
}

[data-theme="dark"] .sidebar-nav a:hover,
[data-theme="dark"] .user-sidebar .nav-link:hover,
[data-theme="dark"] .pro-sidebar .nav-link:hover {
    background: rgba(255, 255, 255, 0.04) !important;
    color: #e4e6f0 !important;
}

[data-theme="dark"] .sidebar-nav a.active,
[data-theme="dark"] .user-sidebar .nav-link.active,
[data-theme="dark"] .pro-sidebar .nav-link.active {
    background: rgba(16, 185, 129, 0.08) !important;
    color: #10b981 !important;
}

/* Sidebar footer / user info */
[data-theme="dark"] .sidebar-foot {
    border-top-color: #2a2e42 !important;
}

/* ── 40.4 Cards principales — transparentes ── */
[data-theme="dark"] .dash-card,
[data-theme="dark"] .user-card-item,
[data-theme="dark"] .kpi-card,
[data-theme="dark"] .pro-dash-card,
[data-theme="dark"] .pro-kpi-card,
[data-theme="dark"] .pro-claim-card,
[data-theme="dark"] .pro-guide-step {
    background: transparent !important;
    border-color: #2a2e42 !important;
    box-shadow: none !important;
}

/* Card headers légèrement visibles */
[data-theme="dark"] .dash-card-head,
[data-theme="dark"] .card-header,
[data-theme="dark"] .user-card-header {
    background: rgba(255, 255, 255, 0.02) !important;
    border-bottom-color: #2a2e42 !important;
}

/* Card footers */
[data-theme="dark"] .user-card-footer {
    border-top-color: #2a2e42 !important;
}

/* ── 40.5 KPI specifics ── */
[data-theme="dark"] .kpi-card:hover,
[data-theme="dark"] .pro-kpi-card:hover,
[data-theme="dark"] .pro-dash-card:hover {
    border-color: rgba(16, 185, 129, 0.3) !important;
    transform: translateY(-3px);
}

[data-theme="dark"] .kpi-card-trend.up,
[data-theme="dark"] .pro-kpi-trend.up {
    background: rgba(22, 163, 74, 0.12) !important;
}

[data-theme="dark"] .kpi-card-trend.down,
[data-theme="dark"] .pro-kpi-trend.down {
    background: rgba(220, 38, 38, 0.12) !important;
}

[data-theme="dark"] .kpi-card-trend.neutral {
    background: rgba(255, 255, 255, 0.04) !important;
}

/* KPI backgrounds (accent décoratif semi-transparent) */
[data-theme="dark"] .pro-kpi-card-bg,
[data-theme="dark"] .pro-dash-card-bg {
    opacity: 0.06 !important;
}

/* ── 40.6 Stat items inline ── */
[data-theme="dark"] .dash-stat,
[data-theme="dark"] .stat-item,
[data-theme="dark"] .pro-perf-stat-item,
[data-theme="dark"] .perf-stat-item {
    background: rgba(255, 255, 255, 0.03) !important;
    border-color: #2a2e42 !important;
}

/* ── 40.7 Listes & list items ── */
[data-theme="dark"] .list-item,
[data-theme="dark"] .pro-dist-item,
[data-theme="dark"] .contrib-item,
[data-theme="dark"] .distrib-card {
    border-color: #2a2e42 !important;
}

[data-theme="dark"] .list-item:hover,
[data-theme="dark"] .pro-dist-item:hover,
[data-theme="dark"] .contrib-item:hover {
    background: rgba(255, 255, 255, 0.03) !important;
}

/* ── 40.8 Hero sections (gardent le gradient, pas transparent) ── */
/* Les hero Hero sections ont des gradients → on ne les rend PAS transparents */

/* ── 40.9 Formulaires ── */
[data-theme="dark"] .pro-form-input,
[data-theme="dark"] .pro-form-textarea,
[data-theme="dark"] .pro-form-select {
    background: rgba(255, 255, 255, 0.04) !important;
    border-color: #2a2e42 !important;
    color: #e4e6f0 !important;
}

[data-theme="dark"] .pro-form-input:focus,
[data-theme="dark"] .pro-form-textarea:focus {
    border-color: #10b981 !important;
}

/* ── 40.10 FAQ sections ── */
[data-theme="dark"] .pro-faq-question {
    border-color: #2a2e42 !important;
}

[data-theme="dark"] .pro-faq-question:hover {
    background: rgba(255, 255, 255, 0.03) !important;
}

[data-theme="dark"] .pro-faq-answer {
    border-color: #2a2e42 !important;
    background: rgba(255, 255, 255, 0.02) !important;
}

/* ── 40.11 Notification list (page complète) ── */
[data-theme="dark"] .pro-notif-item,
[data-theme="dark"] .notif-page-item {
    border-color: #2a2e42 !important;
}

[data-theme="dark"] .pro-notif-item:hover {
    background: rgba(255, 255, 255, 0.03) !important;
}

[data-theme="dark"] .pro-notif-unread {
    background: rgba(16, 185, 129, 0.04) !important;
}

/* ── 40.12 Notification dropdown user ── */
[data-theme="dark"] .notification-dropdown {
    background: #0f1923 !important;
    border-color: #2a2e42 !important;
}

[data-theme="dark"] .dropdown-header {
    border-bottom-color: #2a2e42 !important;
    background: #0f1923 !important;
}

[data-theme="dark"] .notification-item {
    border-bottom-color: #22263a !important;
}

[data-theme="dark"] .notification-item:hover {
    background: rgba(255, 255, 255, 0.03) !important;
}

[data-theme="dark"] .dropdown-footer {
    border-top-color: #2a2e42 !important;
    background: #0f1923 !important;
}

/* ── 40.13 Progression / progression ── */
[data-theme="dark"] .progression-card,
[data-theme="dark"] .achievement-card,
[data-theme="dark"] .level-card,
[data-theme="dark"] .parcours-card {
    background: transparent !important;
    border-color: #2a2e42 !important;
}

/* Progress bars */
[data-theme="dark"] .progress-track {
    background: rgba(255, 255, 255, 0.06) !important;
}

/* ── 40.14 Favoris ── */
[data-theme="dark"] .fav-card,
[data-theme="dark"] .favorite-item {
    background: transparent !important;
    border-color: #2a2e42 !important;
}

/* ── 40.15 Signalements ── */
[data-theme="dark"] .report-card,
[data-theme="dark"] .signal-item {
    background: transparent !important;
    border-color: #2a2e42 !important;
}

/* ── 40.16 Photos / Contributions ── */
[data-theme="dark"] .photo-card,
[data-theme="dark"] .contrib-card {
    background: transparent !important;
    border-color: #2a2e42 !important;
}

/* ── 40.17 Avis ── */
[data-theme="dark"] .review-card,
[data-theme="dark"] .avis-item {
    background: transparent !important;
    border-color: #2a2e42 !important;
}

/* ── 40.18 Badges/Status ── */
[data-theme="dark"] .status-badge.active {
    background: rgba(16, 185, 129, 0.12) !important;
    color: #10b981 !important;
}

[data-theme="dark"] .status-badge.inactive,
[data-theme="dark"] .status-badge.pending {
    background: rgba(255, 255, 255, 0.04) !important;
}

/* ── 40.19 Pro claim cards ── */
[data-theme="dark"] .pro-claim-card:hover,
[data-theme="dark"] .pro-guide-step:hover {
    border-color: rgba(16, 185, 129, 0.3) !important;
    background: rgba(255, 255, 255, 0.02) !important;
}

/* ── 40.20 Boutons espaces user/pro ── */
[data-theme="dark"] .btn-pro.btn-outline {
    border-color: #353a52 !important;
    color: #a0a4b8 !important;
}

[data-theme="dark"] .btn-pro.btn-outline:hover {
    background: rgba(255, 255, 255, 0.06) !important;
    color: #e4e6f0 !important;
}

/* ── 40.21 Toggle switches ── */
[data-theme="dark"] .pro-toggle-slider {
    background: #252940 !important;
}

/* ── 40.22 Pro empty state ── */
[data-theme="dark"] .pro-dash-empty-icon {
    background: rgba(255, 255, 255, 0.04) !important;
}

/* ── 40.23 Pro theme card selected ── */
[data-theme="dark"] .pro-theme-card.active {
    border-color: #10b981 !important;
}

/* ── 40.24 Pro dashboard badge ── */
[data-theme="dark"] .pro-dash-badge {
    background: rgba(255, 255, 255, 0.06) !important;
}

/* ── 40.25 Tabs filtres espace user ── */
[data-theme="dark"] .filter-tabs .tab,
[data-theme="dark"] .content-tabs .tab,
[data-theme="dark"] .tab-btn {
    background: transparent !important;
    border-color: #2a2e42 !important;
    color: #a0a4b8 !important;
}

[data-theme="dark"] .filter-tabs .tab.active,
[data-theme="dark"] .content-tabs .tab.active,
[data-theme="dark"] .tab-btn.active {
    background: #e4e6f0 !important;
    color: #0b1017 !important;
    border-color: transparent !important;
}

/* ── 40.26 Search bars in user/pro spaces ── */
[data-theme="dark"] .user-content .search-input,
[data-theme="dark"] .pro-content .search-input,
[data-theme="dark"] .user-content input[type="search"],
[data-theme="dark"] .pro-content input[type="search"],
[data-theme="dark"] .user-content input[type="text"],
[data-theme="dark"] .pro-content input[type="text"] {
    background: rgba(255, 255, 255, 0.04) !important;
    border-color: #2a2e42 !important;
    color: #e4e6f0 !important;
}

/* ── 40.27 Distributor mini-cards dans user space ── */
[data-theme="dark"] .distrib-mini-card {
    background: transparent !important;
    border-color: #2a2e42 !important;
}

[data-theme="dark"] .distrib-mini-card:hover {
    border-color: rgba(16, 185, 129, 0.3) !important;
}

/* ── 40.28 Quick stats row (tableau de bord user) ── */
[data-theme="dark"] .quick-stats .stat-box {
    background: transparent !important;
    border-color: #2a2e42 !important;
}

/* ── 40.29 Override variables locales user/pro pour cohérence ── */
[data-theme="dark"] .user-main {
    --bg-body: #0b1017;
    --bg-surface: transparent;
    --bg-glass: rgba(15, 17, 23, 0.7);
    --bg-glass-heavy: rgba(15, 17, 23, 0.9);
    --glass-border: 1px solid #2a2e42;
    --border-light: #2a2e42;
}

[data-theme="dark"] .pro-main {
    --bg-body: #0b1017;
    --bg-card: transparent;
    --bg-sidebar: #0b1017;
    --bg-header: rgba(15, 17, 23, 0.92);
    --bg-input: rgba(255, 255, 255, 0.04);
    --border-subtle: #2a2e42;
    --border-strong: #353a52;
}

/* ═══════════════════════════════════════════════════════════════
   41. TILE SELECTOR — Dark Mode
   ═══════════════════════════════════════════════════════════════ */
[data-theme="dark"] .tile-selector-btn {
    background: rgba(15, 17, 23, 0.9) !important;
    border-color: #2a2e42 !important;
    color: #94a3b8 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
}

[data-theme="dark"] .tile-selector-btn:hover {
    background: rgba(15, 17, 23, 1) !important;
    color: #38bdf8 !important;
    box-shadow: 0 4px 12px rgba(56, 189, 248, 0.2) !important;
}

[data-theme="dark"] .tile-selector-control.open .tile-selector-btn {
    background: linear-gradient(135deg, #0ea5e9, #0284c7) !important;
    color: #ffffff !important;
}

[data-theme="dark"] .tile-selector-panel {
    background: rgba(15, 17, 23, 0.97) !important;
    border-color: #2a2e42 !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4),
        0 4px 16px rgba(0, 0, 0, 0.2) !important;
}

[data-theme="dark"] .tile-option {
    color: #94a3b8 !important;
}

[data-theme="dark"] .tile-option:hover {
    background: rgba(56, 189, 248, 0.1) !important;
    color: #38bdf8 !important;
}

[data-theme="dark"] .tile-option.active {
    background: linear-gradient(135deg, rgba(14, 165, 233, 0.15), rgba(2, 132, 199, 0.1)) !important;
    color: #38bdf8 !important;
}

[data-theme="dark"] .tile-option.active::before {
    background: linear-gradient(180deg, #38bdf8, #0ea5e9) !important;
}


/* ═══════════════════════════════════════════════════════════════
   42. COMPONENTS.CSS — Composants UI partagés
   ═══════════════════════════════════════════════════════════════ */

[data-theme="dark"] .alert-success {
    background: rgba(72, 187, 120, 0.1);
    color: #68d391;
    border-left-color: #48bb78;
}

[data-theme="dark"] .alert-warning {
    background: rgba(237, 137, 54, 0.1);
    color: #fbd38d;
    border-left-color: #ed8936;
}

[data-theme="dark"] .alert-info {
    background: rgba(66, 153, 225, 0.1);
    color: #90cdf4;
    border-left-color: #4299e1;
}

[data-theme="dark"] .alert-danger {
    background: rgba(245, 101, 101, 0.1);
    color: #fc8181;
    border-left-color: #f56565;
}

[data-theme="dark"] .kpi-card {
    background: #0f1923;
    border-color: #2a2e42;
}

[data-theme="dark"] .kpi-card__label {
    color: #8b8fa3;
}

[data-theme="dark"] .kpi-card__value {
    color: #e4e6f0;
}

[data-theme="dark"] .modal-container {
    background: #0f1923;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.4);
}

[data-theme="dark"] .modal-header {
    border-bottom-color: #2a2e42;
}

[data-theme="dark"] .modal-title {
    color: #e4e6f0;
}

[data-theme="dark"] .modal-body {
    color: #c8cad8;
}

[data-theme="dark"] .modal-footer {
    border-top-color: #2a2e42;
    background: #1e2130;
}

[data-theme="dark"] .data-table-header {
    border-bottom-color: #2a2e42;
}

[data-theme="dark"] .data-table-header__title {
    color: #e4e6f0;
}

[data-theme="dark"] .data-table-header__count {
    color: #8b8fa3;
}

[data-theme="dark"] .empty-state__title,
[data-theme="dark"] .au-empty-state__title {
    color: #a0a4b8;
}

[data-theme="dark"] .empty-state__desc,
[data-theme="dark"] .au-empty-state__desc {
    color: #8b8fa3;
}