/* ===================================
   FORCE SIDEBAR COULEUR VERTE
   Priorité absolue pour mobile et tablette
   FIX: Z-index et zones blanches
   =================================== */

/* MOBILE (max-width: 768px) */
@media screen and (max-width: 768px) {
    .dashboard-sidebar,
    .dashboard-sidebar.active,
    .dashboard-sidebar.open,
    .dashboard-sidebar[style*="background"] {
        background: #2c5530 !important;
        background-color: #2c5530 !important;
        /* FIX: z-index pour passer sous le header */
        z-index: 998 !important;
        /* FIX: position depuis le bas du header */
        top: 56px !important;
        height: calc(100vh - 56px) !important;
    }
    
    /* Texte et éléments en blanc */
    .dashboard-sidebar,
    .dashboard-sidebar * {
        color: white !important;
    }
    
    .sidebar-header {
        border-bottom: 1px solid rgba(255,255,255,0.2) !important;
        color: white !important;
    }
    
    .sidebar-nav .nav-item {
        color: white !important;
    }
    
    .sidebar-nav .nav-item:hover {
        background: rgba(255,255,255,0.1) !important;
    }
    
    .sidebar-nav .nav-item.active {
        background: rgba(255,255,255,0.2) !important;
        color: white !important;
    }
    
    .user-section {
        border-top: 1px solid rgba(255,255,255,0.2) !important;
        color: white !important;
    }
    
    /* Icônes en blanc */
    .dashboard-sidebar svg,
    .dashboard-sidebar i,
    .sidebar-nav svg,
    .sidebar-nav i {
        stroke: white !important;
        fill: none !important;
        color: white !important;
    }
    
    /* Logo et texte */
    .sidebar-header .logo {
        color: white !important;
    }
    
    .user-info strong,
    .user-info span {
        color: white !important;
    }
    
    /* Bouton déconnexion */
    .logout-btn {
        background: rgba(255,255,255,0.1) !important;
        color: white !important;
        border: 1px solid rgba(255,255,255,0.3) !important;
    }
    
    .logout-btn:hover {
        background: rgba(255,255,255,0.2) !important;
        color: white !important;
    }
}

/* TABLETTE (769px - 1024px) */
@media screen and (min-width: 769px) and (max-width: 1024px) {
    .dashboard-sidebar,
    .dashboard-sidebar.active,
    .dashboard-sidebar.open,
    .dashboard-sidebar[style*="background"] {
        background: #2c5530 !important;
        background-color: #2c5530 !important;
        /* FIX: z-index pour passer sous le header */
        z-index: 998 !important;
        /* FIX: position depuis le bas du header */
        top: 60px !important;
        height: calc(100vh - 60px) !important;
    }
    
    /* Texte et éléments en blanc */
    .dashboard-sidebar,
    .dashboard-sidebar * {
        color: white !important;
    }
    
    .sidebar-header {
        border-bottom: 1px solid rgba(255,255,255,0.2) !important;
        color: white !important;
    }
    
    .sidebar-nav .nav-item {
        color: white !important;
    }
    
    .sidebar-nav .nav-item:hover {
        background: rgba(255,255,255,0.1) !important;
    }
    
    .sidebar-nav .nav-item.active {
        background: rgba(255,255,255,0.2) !important;
        color: white !important;
    }
    
    .user-section {
        border-top: 1px solid rgba(255,255,255,0.2) !important;
        color: white !important;
    }
    
    /* Icônes en blanc */
    .dashboard-sidebar svg,
    .dashboard-sidebar i,
    .sidebar-nav svg,
    .sidebar-nav i {
        stroke: white !important;
        fill: none !important;
        color: white !important;
    }
    
    /* Logo et texte */
    .sidebar-header .logo {
        color: white !important;
    }
    
    .user-info strong,
    .user-info span {
        color: white !important;
    }
    
    /* Bouton déconnexion */
    .logout-btn {
        background: rgba(255,255,255,0.1) !important;
        color: white !important;
        border: 1px solid rgba(255,255,255,0.3) !important;
    }
    
    .logout-btn:hover {
        background: rgba(255,255,255,0.2) !important;
        color: white !important;
    }
}

/* DESKTOP - Pour cohérence (min-width: 1025px) */
@media screen and (min-width: 1025px) {
    .dashboard-sidebar {
        background: #2c5530 !important;
        background-color: #2c5530 !important;
    }
}

/* FORCE ABSOLUE - Override tous les styles inline JavaScript */
.dashboard-sidebar[style] {
    background: #2c5530 !important;
    background-color: #2c5530 !important;
}

/* FIX: Zones blanches - Force le fond vert sur TOUS les éléments enfants */
.dashboard-sidebar,
.dashboard-sidebar > *,
.dashboard-sidebar .sidebar-header,
.dashboard-sidebar .sidebar-nav,
.dashboard-sidebar .user-section,
.dashboard-sidebar .user-info,
.dashboard-sidebar .logout-btn {
    background-color: transparent !important;
}

/* Seule la sidebar elle-même a le fond vert */
.dashboard-sidebar {
    background: #2c5530 !important;
    background-color: #2c5530 !important;
}

/* FIX: Header z-index pour qu'il reste au-dessus */
.dashboard-header {
    z-index: 9999 !important;
    position: relative !important;
}

/* FIX: Items actifs avec fond semi-transparent */
.sidebar-nav .nav-item.active {
    background: rgba(255,255,255,0.15) !important;
    background-color: rgba(255,255,255,0.15) !important;
}

.sidebar-nav .nav-item:hover {
    background: rgba(255,255,255,0.1) !important;
    background-color: rgba(255,255,255,0.1) !important;
}

/* FIX: Bouton déconnexion */
.logout-btn {
    background: rgba(255,255,255,0.1) !important;
    background-color: rgba(255,255,255,0.1) !important;
}

.logout-btn:hover {
    background: rgba(255,255,255,0.2) !important;
    background-color: rgba(255,255,255,0.2) !important;
}

/* Debug - indicateur visuel */
.dashboard-sidebar::before {
    content: "SIDEBAR GREEN FORCED" !important;
    display: none !important;
}