/* ===========================
   THÈME KIWI PRECISION
   =========================== */

:root {
    /* Couleurs principales Kiwi Precision */
    --kiwi-primary: #9ACD32;        /* Vert kiwi principal */
    --kiwi-primary-dark: #7CB342;   /* Vert kiwi foncé */
    --kiwi-primary-light: #CDDC39;  /* Vert kiwi clair */
    --kiwi-secondary: #2C2C2C;      /* Gris foncé/noir */
    --kiwi-accent: #4CAF50;         /* Vert accent */
    
    /* Couleurs de support */
    --kiwi-white: #FFFFFF;
    --kiwi-light-gray: #F5F5F5;
    --kiwi-medium-gray: #666666;
    --kiwi-dark-gray: #333333;
    --kiwi-border: #E0E0E0;
    
    /* Couleurs fonctionnelles */
    --kiwi-success: #4CAF50;
    --kiwi-warning: #FF9800;
    --kiwi-error: #F44336;
    --kiwi-info: #2196F3;
    
    /* Redéfinition des variables CSS existantes */
    --primary-color: var(--kiwi-primary);
    --secondary-color: var(--kiwi-secondary);
    --accent-color: var(--kiwi-accent);
    --background-color: var(--kiwi-white);
    --card-background: var(--kiwi-white);
    --text-color: var(--kiwi-secondary);
    --text-primary: var(--kiwi-secondary);
    --text-secondary: var(--kiwi-medium-gray);
    --border-color: var(--kiwi-border);
    --success-color: var(--kiwi-success);
    --warning-color: var(--kiwi-warning);
    --error-color: var(--kiwi-error);
    --info-color: var(--kiwi-info);
    
    /* Variables pour les modales et composants */
    --bg-primary: #FFFFFF;
    --bg-secondary: #F5F5F5;
    --bg-tertiary: #FAFAFA;
}



/* ===========================
   MODE CLAIR FORCÉ - Annule @media (prefers-color-scheme: dark)
   quand l'utilisateur a explicitement choisi le mode clair.
   html[data-theme="light"] a une spécificité (0,1,1) vs :root (0,0,1)
   sous la media query → remporte toujours.
   =========================== */
html[data-theme="light"] {
    /* Variables kiwi */
    --kiwi-white:       #FFFFFF;
    --kiwi-light-gray:  #F5F5F5;
    --kiwi-medium-gray: #666666;
    --kiwi-dark-gray:   #333333;
    --kiwi-border:      #E0E0E0;
    --kiwi-secondary:   #2C2C2C;

    /* Variables fonctionnelles remontées à light (main.css dark override) */
    --bg-primary:            #ffffff;
    --bg-secondary:          #f8fafc;
    --bg-tertiary:           #e2e8f0;
    --card-background:       #ffffff;
    --secondary-background:  #f1f5f9;
    --hover-background:      #f8fafc;
    --input-background:      #ffffff;

    --text-primary:    #1e293b;
    --text-secondary:  #64748b;
    --text-muted:      #94a3b8;
    --text-color:      #1e293b;
    --muted-text:      #94a3b8;

    --border-color: #e2e8f0;
    --border-light: #f1f5f9;

    --background-color: #FFFFFF;
}

/* Réinitialise explicitement le fond et la couleur des tableaux en mode clair forcé.
   Cible les règles hardcodées dans @media (prefers-color-scheme: dark) */
html[data-theme="light"] table {
    background-color: var(--card-background) !important;
    color: var(--text-primary) !important;
}
html[data-theme="light"] table thead {
    background-color: var(--bg-secondary) !important;
    color: var(--text-primary) !important;
}
html[data-theme="light"] table tbody tr {
    border-bottom-color: var(--border-color) !important;
    background-color: transparent !important;
    color: var(--text-primary) !important;
}
html[data-theme="light"] table th:not(.adc-cell):not(.pdval-cell),
html[data-theme="light"] table td:not(.adc-cell):not(.pdval-cell) {
    color: var(--text-primary) !important;
    background-color: inherit !important;
}
/* Remet les inputs/formulaires en clair */
html[data-theme="light"] input,
html[data-theme="light"] select,
html[data-theme="light"] textarea {
    background-color: var(--input-background) !important;
    color: var(--text-primary) !important;
    border-color: var(--border-color) !important;
}
/* Scrollbar clair */
html[data-theme="light"] .table-wrapper::-webkit-scrollbar-track,
html[data-theme="light"] .register-table-container::-webkit-scrollbar-track {
    background: #f1f1f1 !important;
}

/* ===========================
   LOGO ET BRANDING
   =========================== */

.kiwi-logo {
    height: 40px;
    width: auto;
    margin-right: 10px;
    transition: all 0.3s ease;
}

.kiwi-brand {
    display: flex;
    align-items: center;
    font-weight: bold;
    color: var(--kiwi-secondary);
}

.kiwi-brand h1 {
    margin: 0;
    color: var(--kiwi-secondary);
    font-size: 1.5rem;
}

/* Style pour la page d'auth avec logo */
.auth-header .kiwi-brand {
    justify-content: center;
    flex-direction: column;
    text-align: center;
    margin-bottom: 2rem;
}

.auth-header .kiwi-brand .kiwi-logo {
    height: 60px;
    margin-bottom: 1rem;
    margin-right: 0;
}

/* Navbar avec logo */
.navbar .kiwi-brand {
    flex-direction: row;
    align-items: center;
}

.navbar .kiwi-brand h1 {
    color: var(--kiwi-white) !important;
}

/* ===========================
   NAVIGATION ET HEADER
   =========================== */

.navbar {
    background: linear-gradient(135deg, var(--kiwi-primary) 0%, var(--kiwi-primary-dark) 100%);
    border-bottom: 2px solid var(--kiwi-secondary);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* Navbar compacte sur mobile */
@media (max-width: 768px) {
    .navbar {
        border-bottom: 1px solid var(--kiwi-secondary);
        box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
    }
}

@media (max-width: 480px) {
    .navbar {
        border-bottom: 1px solid var(--kiwi-secondary);
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    }
}

@media (max-width: 360px) {
    .navbar {
        border-bottom: none;
        box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
    }
}

.navbar-brand h1 {
    color: var(--kiwi-white) !important;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
}

.navbar-user {
    color: var(--kiwi-white);
}

.navbar-user #user-info {
    color: var(--kiwi-white);
    font-weight: 500;
}

/* ===========================
   BOUTONS ET INTERACTIONS
   =========================== */

.btn-primary {
    background: linear-gradient(135deg, var(--kiwi-primary) 0%, var(--kiwi-primary-dark) 100%);
    border: 2px solid var(--kiwi-primary-dark);
    color: var(--kiwi-white);
    font-weight: 600;
    transition: all 0.3s ease;
}

.btn-primary:hover {
    background: linear-gradient(135deg, var(--kiwi-primary-dark) 0%, var(--kiwi-primary) 100%);
    border-color: var(--kiwi-secondary);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(154, 205, 50, 0.4);
}

.btn-secondary {
    background: var(--kiwi-white);
    border: 2px solid var(--kiwi-primary);
    color: var(--kiwi-primary);
    font-weight: 600;
}

.btn-secondary:hover {
    background: var(--kiwi-primary);
    border-color: var(--kiwi-primary);
    color: var(--kiwi-white);
}

.btn-outline {
    background: transparent;
    border: 2px solid var(--kiwi-white);
    color: var(--kiwi-white);
}

.btn-outline:hover {
    background: var(--kiwi-white);
    color: var(--kiwi-primary);
}

/* Style spécifique pour btn-outline sur fond clair */
.module-content-header .btn-outline,
.module-header .btn-outline,
.list-actions .btn-outline,
.detailed-monitoring-module .btn-outline {
    background: var(--kiwi-white);
    border: 2px solid var(--kiwi-primary);
    color: var(--kiwi-primary);
    font-weight: 600;
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.module-content-header .btn-outline:hover,
.module-header .btn-outline:hover,
.list-actions .btn-outline:hover,
.detailed-monitoring-module .btn-outline:hover {
    background: var(--kiwi-primary);
    border-color: var(--kiwi-primary);
    color: var(--kiwi-white);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(154, 205, 50, 0.3);
}

/* Amélioration visuelle pour les boutons Retour */
.module-content-actions .btn-outline {
    min-width: 110px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 8px 16px;
}

/* ===========================
   MODULES ET CARTES
   =========================== */

.dashboard-module {
    border: 2px solid var(--kiwi-border);
    border-radius: 12px;
    transition: all 0.3s ease;
    background: var(--kiwi-white);
}

.dashboard-module:hover {
    border-color: var(--kiwi-primary);
    box-shadow: 0 8px 24px rgba(154, 205, 50, 0.2);
    transform: translateY(-4px);
}

.dashboard-module h3 {
    color: var(--kiwi-secondary);
}

.dashboard-module .module-icon {
    color: var(--kiwi-primary);
}

/* ===========================
   SYSTÈME MODULE
   =========================== */

.system-header {
    background: linear-gradient(135deg, var(--kiwi-primary) 0%, var(--kiwi-accent) 100%);
    color: var(--kiwi-white);
}

.system-tab.active {
    background: var(--kiwi-primary);
    color: var(--kiwi-white);
    border-bottom: 3px solid var(--kiwi-secondary);
}

.system-tab:hover {
    background: var(--kiwi-primary-light);
    color: var(--kiwi-secondary);
}

/* Boutons de mesure auto */
.adc-action-btn,
.pdval-action-btn {
    background: var(--kiwi-primary);
    border: 2px solid var(--kiwi-primary-dark);
    color: var(--kiwi-white);
}

.adc-action-btn:hover,
.pdval-action-btn:hover {
    background: var(--kiwi-primary-dark);
    border-color: var(--kiwi-secondary);
}

.adc-action-btn.active-loop,
.pdval-action-btn.active-loop {
    background: var(--kiwi-error) !important;
    border-color: var(--kiwi-error) !important;
    animation: pulse-kiwi 2s infinite;
}

@keyframes pulse-kiwi {
    0% { 
        box-shadow: 0 0 0 0 rgba(154, 205, 50, 0.7);
    }
    70% { 
        box-shadow: 0 0 0 10px rgba(154, 205, 50, 0);
    }
    100% { 
        box-shadow: 0 0 0 0 rgba(154, 205, 50, 0);
    }
}

/* ===========================
   TABLEAUX ET DONNÉES
   =========================== */

.register-table th {
    background: linear-gradient(135deg, var(--kiwi-primary) 0%, var(--kiwi-primary-dark) 100%);
    color: var(--kiwi-white);
    border: 1px solid var(--kiwi-primary-dark);
}

.register-table td {
    border: 1px solid var(--kiwi-border);
}

.register-table tr:hover {
    background-color: rgba(154, 205, 50, 0.1);
}

/* ===========================
   STATUTS ET INDICATEURS
   =========================== */

.status-indicator.ok {
    background: var(--kiwi-success);
    color: var(--kiwi-white);
}

.status-indicator.warning {
    background: var(--kiwi-warning);
    color: var(--kiwi-white);
}

.status-indicator.error {
    background: var(--kiwi-error);
    color: var(--kiwi-white);
}

/* ===========================
   AUTHENTIFICATION
   =========================== */

.auth-container {
    border: 2px solid var(--kiwi-primary);
    border-radius: 16px;
    background: var(--kiwi-white);
    box-shadow: 0 8px 32px rgba(154, 205, 50, 0.2);
}

.auth-header h1 {
    color: var(--kiwi-primary);
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.1);
}

.auth-header p {
    color: var(--kiwi-medium-gray);
}

/* ===========================
   RESPONSIVE ET ACCESSIBILITÉ
   =========================== */

@media (max-width: 768px) {
    .kiwi-logo {
        height: 32px;
    }
    
    .kiwi-brand h1 {
        font-size: 1.2rem;
    }
}

/* ===========================
   ANIMATIONS PERSONNALISÉES
   =========================== */

@keyframes kiwi-fade-in {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.kiwi-animation {
    animation: kiwi-fade-in 0.6s ease-out;
}

/* ===========================
   ACCENT VERT POUR ÉLÉMENTS ACTIFS
   =========================== */

.active, .selected, .current {
    border-left: 4px solid var(--kiwi-primary) !important;
}

.highlight-kiwi {
    background: linear-gradient(90deg, transparent 0%, rgba(154, 205, 50, 0.1) 50%, transparent 100%);
}

/* ===========================
   MODE SOMBRE AUTOMATIQUE ET MANUEL
   =========================== */

/* Mode sombre via préférences système */
@media (prefers-color-scheme: dark) {
    :root {
        /* Couleurs principales adaptées au mode sombre */
        --kiwi-primary: #9ACD32;        /* Vert kiwi - reste visible */
        --kiwi-primary-dark: #7CB342;
        --kiwi-primary-light: #B8D332;
        --kiwi-secondary: #C5C5C5;      /* Texte clair doux */
        --kiwi-accent: #4CAF50;
        
        /* Couleurs de support inversées */
        --kiwi-white: #1A1A1A;          /* Fond très sombre */
        --kiwi-light-gray: #242424;     /* Gris foncé pour cartes */
        --kiwi-medium-gray: #A0A0A0;    /* Texte secondaire */
        --kiwi-dark-gray: #D0D0D0;      /* Texte principal */
        --kiwi-border: #333333;         /* Bordures subtiles */
        
        /* Couleurs fonctionnelles - ajustées pour contraste */
        --kiwi-success: #66BB6A;
        --kiwi-warning: #FFA726;
        --kiwi-error: #EF5350;
        --kiwi-info: #42A5F5;
        
        /* Variables CSS globales */
        --background-color: #1A1A1A;
        --card-background: #242424;
        --text-color: #C5C5C5;
        --text-primary: #D0D0D0;
        --text-secondary: #A0A0A0;
        --text-muted: #707070;
        --border-color: #333333;
    }
    
    body {
        background-color: #1A1A1A;
        color: #C5C5C5;
    }
    
    /* Tableaux en mode sombre */
    table {
        background-color: #242424;
        color: #C5C5C5;
    }
    
    table thead {
        background-color: #2D2D2D;
        color: #D0D0D0;
    }
    
    table tbody tr {
        border-bottom: 1px solid #333333;
    }
    
    table tbody tr:hover {
        background-color: #2A2A2A;
    }
    
    /* Inputs et formulaires en mode sombre */
    input, select, textarea {
        background-color: #242424;
        color: #C5C5C5;
        border-color: #333333;
    }
    
    input:focus, select:focus, textarea:focus {
        border-color: var(--kiwi-primary);
        background-color: #2A2A2A;
    }
    
    /* Boutons en mode sombre */
    .btn {
        background-color: #242424;
        color: #C5C5C5;
        border-color: #333333;
    }
    
    .btn:hover {
        background-color: #2D2D2D;
    }
    
    .btn-primary {
        background-color: var(--kiwi-primary);
        color: #1A1A1A;
    }
    
    /* Cartes en mode sombre */
    .card, .module-card {
        background-color: #242424;
        border-color: #333333;
        color: #C5C5C5;
    }
}

/* Mode sombre manuel via classe sur body */
body.dark-mode {
    --kiwi-primary: #9ACD32;
    --kiwi-primary-dark: #7CB342;
    --kiwi-primary-light: #B8D332;
    --kiwi-secondary: #C5C5C5;
    --kiwi-accent: #4CAF50;
    
    --kiwi-white: #1A1A1A;
    --kiwi-light-gray: #242424;
    --kiwi-medium-gray: #A0A0A0;
    --kiwi-dark-gray: #D0D0D0;
    --kiwi-border: #333333;
    
    --kiwi-success: #66BB6A;
    --kiwi-warning: #FFA726;
    --kiwi-error: #EF5350;
    --kiwi-info: #42A5F5;
    
    --background-color: #1A1A1A;
    --card-background: #242424;
    --text-color: #C5C5C5;
    --text-primary: #D0D0D0;
    --text-secondary: #A0A0A0;
    --text-muted: #707070;
    --border-color: #333333;
    
    /* Variables pour les modales et composants */
    --bg-primary: #242424;
    --bg-secondary: #2d2d2d;
    --bg-tertiary: #353535;
    
    background-color: #1A1A1A;
    color: #C5C5C5;
}

body.dark-mode table {
    background-color: #242424;
    color: #C5C5C5;
}

body.dark-mode table thead {
    background-color: #2D2D2D;
    color: #D0D0D0;
}

body.dark-mode table tbody tr {
    border-bottom: 1px solid #333333;
}

body.dark-mode table tbody tr:hover {
    background-color: #2A2A2A;
}

body.dark-mode input,
body.dark-mode select,
body.dark-mode textarea {
    background-color: #242424;
    color: #C5C5C5;
    border-color: #333333;
}

body.dark-mode input:focus,
body.dark-mode select:focus,
body.dark-mode textarea:focus {
    border-color: var(--kiwi-primary);
    background-color: #2A2A2A;
}

body.dark-mode .btn {
    background-color: #242424;
    color: #C5C5C5;
    border-color: #333333;
}

body.dark-mode .btn:hover {
    background-color: #2D2D2D;
}

body.dark-mode .btn-primary {
    background-color: var(--kiwi-primary);
    color: #1A1A1A;
}

body.dark-mode .card,
body.dark-mode .module-card {
    background-color: #242424;
    border-color: #333333;
    color: #C5C5C5;
}

/* Navbar et header en mode sombre */
body.dark-mode .navbar {
    background: linear-gradient(135deg, #2D2D2D 0%, #1F1F1F 100%) !important;
    border-bottom: 1px solid #333333;
}

body.dark-mode .navbar-brand h1,
body.dark-mode .navbar h1 {
    color: #9ACD32 !important;
}

body.dark-mode .navbar-user,
body.dark-mode .navbar-user span,
body.dark-mode #user-info {
    color: #C5C5C5 !important;
}

/* Boutons en mode sombre */
body.dark-mode .btn-outline {
    background-color: transparent;
    color: #9ACD32;
    border: 1px solid #9ACD32;
}

body.dark-mode .btn-outline:hover {
    background-color: #9ACD32;
    color: #1A1A1A;
}

body.dark-mode .btn-secondary {
    background-color: #2D2D2D;
    color: #C5C5C5;
    border: 1px solid #404040;
}

body.dark-mode .btn-secondary:hover {
    background-color: #383838;
    color: #D0D0D0;
}

/* Sections de contenu */
body.dark-mode .module-content-header {
    background-color: #242424;
    border-bottom: 1px solid #333333;
}

body.dark-mode .module-content-header h3,
body.dark-mode .module-content-header h4 {
    color: #D0D0D0;
}

/* Panneaux et cartes de modules */
body.dark-mode .module-panel,
body.dark-mode .monitoring-section,
body.dark-mode .control-panel {
    background-color: #242424;
    border: 1px solid #333333;
}

/* Zones de formulaire */
body.dark-mode .form-group label {
    color: #C5C5C5;
}

body.dark-mode .form-control {
    background-color: #2D2D2D;
    color: #C5C5C5;
    border: 1px solid #404040;
}

/* Info boxes en mode sombre */
body.dark-mode .info-box {
    background-color: #242424;
    border-left-color: var(--kiwi-primary);
}

body.dark-mode .info-box h4 {
    color: var(--kiwi-primary);
}

body.dark-mode .info-box p {
    color: #C5C5C5;
}

/* Programming form en mode sombre */
body.dark-mode .programming-card {
    background-color: #242424;
    border-color: #333333;
}

body.dark-mode .programming-card h5,
body.dark-mode .programming-card-wide h5 {
    color: #D0D0D0;
}

body.dark-mode .programming-form-group label {
    color: #C5C5C5;
}

body.dark-mode .programming-form-group select,
body.dark-mode .programming-form-group input {
    background-color: #2D2D2D;
    color: #C5C5C5;
    border-color: #404040;
}

body.dark-mode .programming-form-group select:focus,
body.dark-mode .programming-form-group input:focus {
    background-color: #333333;
    border-color: #9ACD32;
    color: #D0D0D0;
}

body.dark-mode .programming-btn {
    background-color: #2D2D2D;
    color: #C5C5C5;
    border-color: #404040;
}

body.dark-mode .programming-btn:hover:not(:disabled) {
    background-color: #9ACD32;
    color: #1A1A1A;
    border-color: #9ACD32;
}

body.dark-mode .programming-btn:disabled {
    background-color: #1F1F1F;
    color: #666666;
    border-color: #333333;
}

/* SVG de configuration des cibles en mode sombre */
body.dark-mode .config-targets-svg {
    background-color: #2D2D2D !important;
    border: 1px solid #404040 !important;
    --svg-grid-stroke: #3A3A3A;
    --svg-border-stroke: #404040;
    --svg-text-primary: #D0D0D0;
    --svg-text-secondary: #999999;
    --svg-axis-stroke: #555555;
}

body.dark-mode .targets-info {
    background-color: #1F3A28;
    color: #9ACD32;
    border: 1px solid #2D5A3A;
}

body.dark-mode .svg-container {
    background-color: #2D2D2D;
    border-color: #404040;
}

body.dark-mode .form-control:focus {
    background-color: #333333;
    border-color: #9ACD32;
    color: #D0D0D0;
}

/* Sélecteurs et dropdowns */
body.dark-mode select option {
    background-color: #2D2D2D;
    color: #C5C5C5;
}

/* === DASHBOARD EN MODE SOMBRE === */
body.dark-mode .dashboard-screen {
    background-color: #1A1A1A;
}

body.dark-mode .dashboard-content {
    background-color: #1A1A1A;
}

/* Cartes des modules du dashboard */
body.dark-mode .module-card {
    background-color: #242424;
    border: 1px solid #333333;
    color: #C5C5C5;
}

body.dark-mode .module-card:hover {
    background-color: #2A2A2A;
    border-color: #9ACD32;
    box-shadow: 0 4px 12px rgba(154, 205, 50, 0.15);
}

body.dark-mode .module-card.disabled {
    background-color: #1F1F1F;
    border-color: #2A2A2A;
}

body.dark-mode .module-title {
    color: #D0D0D0;
}

body.dark-mode .module-description {
    color: #A0A0A0;
}

/* Icônes des modules en mode sombre */
body.dark-mode .module-icon.primary {
    background-color: rgba(154, 205, 50, 0.15);
    color: #9ACD32;
}

body.dark-mode .module-icon.success {
    background-color: rgba(102, 187, 106, 0.15);
    color: #66BB6A;
}

body.dark-mode .module-icon.warning {
    background-color: rgba(255, 167, 38, 0.15);
    color: #FFA726;
}

body.dark-mode .module-icon.info {
    background-color: rgba(66, 165, 245, 0.15);
    color: #42A5F5;
}

body.dark-mode .module-icon.danger {
    background-color: rgba(239, 83, 80, 0.15);
    color: #EF5350;
}

/* Badges et statuts */
body.dark-mode .module-status {
    background-color: #2D2D2D;
    color: #C5C5C5;
    border: 1px solid #404040;
}

body.dark-mode .module-status.active {
    background-color: rgba(102, 187, 106, 0.2);
    color: #66BB6A;
    border-color: #66BB6A;
}

body.dark-mode .module-status.inactive {
    background-color: rgba(144, 144, 144, 0.2);
    color: #909090;
    border-color: #606060;
}

/* === PAGES DE DIAGNOSTIC ET SYSTÈME === */

/* Cartes d'information (État Général, Réseau, Mémoire, etc.) */
body.dark-mode .info-card,
body.dark-mode .diagnostic-card,
body.dark-mode .status-card,
body.dark-mode .system-card {
    background-color: #242424 !important;
    border: 1px solid #333333 !important;
    color: #C5C5C5 !important;
}

body.dark-mode .info-card h3,
body.dark-mode .info-card h4,
body.dark-mode .diagnostic-card h3,
body.dark-mode .status-card h3,
body.dark-mode .system-card h3 {
    color: #D0D0D0 !important;
}

body.dark-mode .info-card p,
body.dark-mode .diagnostic-card p,
body.dark-mode .status-card p {
    color: #A0A0A0 !important;
}

/* Sections de diagnostic */
body.dark-mode .diagnostic-section,
body.dark-mode .system-section {
    background-color: #1F1F1F;
    border: 1px solid #333333;
}

body.dark-mode .diagnostic-section h2,
body.dark-mode .system-section h2 {
    color: #D0D0D0;
    border-bottom: 2px solid #333333;
}

/* Grilles de cartes */
body.dark-mode .cards-grid,
body.dark-mode .diagnostic-grid {
    gap: 1rem;
}

/* Labels et valeurs */
body.dark-mode .info-label,
body.dark-mode .status-label {
    color: #A0A0A0;
}

body.dark-mode .info-value,
body.dark-mode .status-value {
    color: #D0D0D0;
    font-weight: 500;
}

/* Indicateurs de statut */
body.dark-mode .status-indicator {
    background-color: #2D2D2D;
    border: 1px solid #404040;
}

body.dark-mode .status-indicator.online,
body.dark-mode .status-indicator.success {
    background-color: rgba(102, 187, 106, 0.2);
    border-color: #66BB6A;
    color: #66BB6A;
}

body.dark-mode .status-indicator.offline,
body.dark-mode .status-indicator.error {
    background-color: rgba(239, 83, 80, 0.2);
    border-color: #EF5350;
    color: #EF5350;
}

body.dark-mode .status-indicator.warning {
    background-color: rgba(255, 167, 38, 0.2);
    border-color: #FFA726;
    color: #FFA726;
}

/* Boutons d'action dans les cartes */
body.dark-mode .action-button,
body.dark-mode .diagnostic-button {
    background-color: #2D2D2D;
    color: #C5C5C5;
    border: 1px solid #404040;
}

body.dark-mode .action-button:hover,
body.dark-mode .diagnostic-button:hover {
    background-color: #383838;
    border-color: #4A4A4A;
}

body.dark-mode .action-button.primary,
body.dark-mode .diagnostic-button.primary {
    background-color: #42A5F5;
    color: #1A1A1A;
    border-color: #42A5F5;
}

body.dark-mode .action-button.primary:hover {
    background-color: #2196F3;
}

/* Titres de sections */
body.dark-mode .section-title,
body.dark-mode .panel-title {
    color: #D0D0D0;
    border-bottom: 1px solid #333333;
}

/* Conteneurs de contenu */
body.dark-mode .content-wrapper,
body.dark-mode .panel-content {
    background-color: #242424;
    border: 1px solid #333333;
}

/* Sélecteurs dans les headers */
body.dark-mode #module-header select,
body.dark-mode .header-select {
    background-color: rgba(26, 26, 26, 0.3);
    color: inherit;
    border: 1px solid rgba(0, 0, 0, 0.3);
}

body.dark-mode #module-header select option {
    background-color: #2D2D2D;
    color: #C5C5C5;
}

/* === PAGE DE GESTION DES LOGS === */

/* Titre de la page */
body.dark-mode .server-title,
body.dark-mode .page-title {
    color: #9ACD32;
}

body.dark-mode .server-subtitle,
body.dark-mode .page-subtitle {
    color: #A0A0A0;
}

/* Sections de nettoyage des logs */
body.dark-mode .logs-section,
body.dark-mode .cleanup-section,
body.dark-mode .database-section {
    background-color: #242424;
    border: 1px solid #333333;
}

body.dark-mode .logs-section h3,
body.dark-mode .cleanup-section h3,
body.dark-mode .database-section h3 {
    color: #D0D0D0;
    border-bottom: 1px solid #333333;
}

body.dark-mode .logs-section h4,
body.dark-mode .cleanup-section h4 {
    color: #C5C5C5;
}

/* Cartes de statut et configuration */
body.dark-mode .status-box,
body.dark-mode .config-box,
body.dark-mode .retention-box {
    background-color: #242424;
    border: 1px solid #333333;
}

/* Labels et informations */
body.dark-mode .log-info-label {
    color: #A0A0A0;
}

body.dark-mode .log-info-value {
    color: #D0D0D0;
}

/* Badge ACTIF/INACTIF */
body.dark-mode .status-badge {
    background-color: #2D2D2D;
    color: #C5C5C5;
    border: 1px solid #404040;
}

body.dark-mode .status-badge.active {
    background-color: rgba(102, 187, 106, 0.2);
    color: #66BB6A;
    border-color: #66BB6A;
}

body.dark-mode .status-badge.inactive {
    background-color: rgba(144, 144, 144, 0.2);
    color: #909090;
    border-color: #606060;
}

/* Inputs de configuration */
body.dark-mode .retention-input,
body.dark-mode .config-input {
    background-color: #2D2D2D;
    color: #C5C5C5;
    border: 1px solid #404040;
}

body.dark-mode .retention-input:focus,
body.dark-mode .config-input:focus {
    background-color: #333333;
    border-color: #9ACD32;
}

/* Boutons verts d'action */
body.dark-mode .btn-success,
body.dark-mode .action-button.success {
    background-color: #66BB6A;
    color: #1A1A1A;
    border: 1px solid #66BB6A;
}

body.dark-mode .btn-success:hover,
body.dark-mode .action-button.success:hover {
    background-color: #7CB342;
}

/* Boutons de rafraîchissement */
body.dark-mode .btn-refresh,
body.dark-mode .refresh-button {
    background-color: #4A5568;
    color: #E0E0E0;
    border: 1px solid #4A5568;
}

body.dark-mode .btn-refresh:hover,
body.dark-mode .refresh-button:hover {
    background-color: #5A6678;
}

/* Alertes de succès */
body.dark-mode .alert-success,
body.dark-mode .success-message {
    background-color: rgba(102, 187, 106, 0.15);
    color: #66BB6A;
    border: 1px solid #66BB6A;
}

body.dark-mode .alert-info {
    background-color: rgba(66, 165, 245, 0.15);
    color: #42A5F5;
    border: 1px solid #42A5F5;
}

body.dark-mode .alert-warning {
    background-color: rgba(255, 167, 38, 0.15);
    color: #FFA726;
    border: 1px solid #FFA726;
}

/* Texte descriptif */
body.dark-mode .description-text,
body.dark-mode .help-text {
    color: #A0A0A0;
}

/* Statistiques de logs */
body.dark-mode .log-stats {
    color: #C5C5C5;
}

body.dark-mode .log-stats strong {
    color: #D0D0D0;
}

/* === PAGE DES DOSSARDS - MODE CLAIR === */
body:not(.dark-mode) .bibs-module,
body:not(.dark-mode) .dossards-module {
    background-color: #FAFAFA !important;
}

/* Cartes de statistiques en haut */
body:not(.dark-mode) .stats-cards,
body:not(.dark-mode) .bibs-stats {
    background-color: #FFFFFF !important;
    border-color: #E0E0E0 !important;
}

body:not(.dark-mode) .stat-card {
    background: #FFFFFF !important;
    border-color: #E0E0E0 !important;
    color: #2C2C2C !important;
}

body:not(.dark-mode) .stat-card h3,
body:not(.dark-mode) .stat-card .stat-number {
    color: #7CB342 !important;
}

body:not(.dark-mode) .stat-card p,
body:not(.dark-mode) .stat-card .stat-label {
    color: #666666 !important;
}

body:not(.dark-mode) .data-table thead th {
    background: #9ACD32 !important;
    color: #1A1A1A !important;
}

/* === PAGE DES DOSSARDS === */
body.dark-mode .bibs-module,
body.dark-mode .dossards-module {
    background-color: #1A1A1A !important;
}

/* Cartes de statistiques en haut */
body.dark-mode .stats-cards,
body.dark-mode .bibs-stats {
    background-color: #242424 !important;
    border-color: #333333 !important;
}

body.dark-mode .stat-card {
    background: #242424 !important;
    border-color: #333333 !important;
    color: #C5C5C5 !important;
}

body.dark-mode .stat-card h3,
body.dark-mode .stat-card .stat-number {
    color: #9ACD32 !important;
}

body.dark-mode .stat-card p,
body.dark-mode .stat-card .stat-label {
    color: #A0A0A0 !important;
}

body.dark-mode .data-table thead th {
    background: #2D2D2D !important;
    color: #D0D0D0 !important;
}

/* Zone de contenu principale */
body.dark-mode .bibs-content,
body.dark-mode .dossards-content {
    background-color: #242424 !important;
    border-color: #333333 !important;
}

/* Tableau des dossards */
body.dark-mode .bibs-table,
body.dark-mode .dossards-table {
    background-color: #242424 !important;
}

body.dark-mode .bibs-table thead,
body.dark-mode .dossards-table thead {
    background-color: #9ACD32 !important;
    color: #1A1A1A !important;
}

body.dark-mode .bibs-table th,
body.dark-mode .dossards-table th {
    color: #1A1A1A !important;
    background-color: #9ACD32 !important;
}

body.dark-mode .bibs-table tbody tr,
body.dark-mode .dossards-table tbody tr {
    background-color: #2D2D2D !important;
    border-color: #333333 !important;
}

/* Tables utilisateurs et autres - Dark mode */
body.dark-mode .data-table tbody tr:nth-child(even) {
    background-color: #2A2A2A !important;
}

body.dark-mode .data-table tbody tr:nth-child(odd) {
    background-color: #242424 !important;
}

body.dark-mode .data-table tbody tr:hover {
    background-color: #333333 !important;
}

body.dark-mode .bibs-table tbody tr:nth-child(even),
body.dark-mode .dossards-table tbody tr:nth-child(even) {
    background-color: #262626 !important;
}

body.dark-mode .bibs-table tbody tr:hover,
body.dark-mode .dossards-table tbody tr:hover {
    background-color: #383838 !important;
}

body.dark-mode .bibs-table td,
body.dark-mode .dossards-table td {
    color: #C5C5C5 !important;
    border-color: #333333 !important;
}

/* Titre de la section */
body.dark-mode .bibs-header h3,
body.dark-mode .dossards-header h3 {
    color: #D0D0D0 !important;
}

/* Boutons d'action */
body.dark-mode .bibs-actions button,
body.dark-mode .dossards-actions button {
    background-color: #2D2D2D;
    color: #C5C5C5;
    border: 1px solid #404040;
}

body.dark-mode .bibs-actions button:hover,
body.dark-mode .dossards-actions button:hover {
    background-color: #383838;
}

/* ===========================
   RESPONSIVE NAVBAR OPTIMIZATIONS
   =========================== */

/* DÉSACTIVÉ - Règles navbar déplacées vers main.css pour uniformisation */
@media screen and (max-width: 768px) {
    /* Toutes les règles navbar sont maintenant dans main.css avec spécificité maximale */
}

/* Optimisations pour smartphones */
@media screen and (max-width: 480px) {
    .navbar {
        padding: 0.4rem 0.8rem !important;
        min-height: unset !important;
    }
    
    .navbar-brand .kiwi-logo {
        height: 30px !important;
        margin-right: 5px !important;
    }
    
    .navbar-brand h1 {
        font-size: 1rem !important;
        margin: 0 !important;
    }
    
    .navbar-user {
        gap: 0.15rem !important;
        flex-wrap: nowrap !important;
    }
    
    .navbar-user .btn {
        padding: 0.3rem 0.6rem !important;
        font-size: 0.75rem !important;
        min-width: unset !important;
        flex-shrink: 1 !important;
    }
    
    .navbar-user #theme-toggle-btn {
        padding: 4px 6px !important;
        width: auto !important;
        height: 26px !important;
        font-size: 0.7rem !important;
    }
    
    .language-selector-mini {
        min-width: 50px !important;
        max-width: 60px !important;
        flex-shrink: 1 !important;
    }
    
    .language-selector-mini select {
        padding: 2px 4px !important;
        font-size: 0.7rem !important;
        width: 100% !important;
        height: 26px !important;
    }
    
    /* Masque le nom, garde le badge de rôle visible sur smartphone */
    #user-info {
        display: flex !important;
        align-items: center !important;
        gap: 0.2rem !important;
    }
    #user-info strong {
        display: none !important;
    }
    #user-info .badge,
    #user-info .role-switcher-select {
        font-size: 0.6rem !important;
        padding: 0.1rem 0.3rem !important;
        white-space: nowrap !important;
    }
}

/* Optimisations pour très petits écrans */
@media screen and (max-width: 360px) {
    .navbar {
        padding: 0.3rem 0.5rem !important;
    }
    
    .navbar-brand h1 {
        font-size: 0.9rem !important;
    }
    
    .navbar-user .btn {
        padding: 0.25rem 0.4rem !important;
        font-size: 0.7rem !important;
    }
    
    .navbar-user #logout-btn {
        padding: 0.25rem 0.35rem !important;
        font-size: 0.65rem !important;
    }
    
    .language-selector-mini {
        min-width: 45px !important;
        max-width: 50px !important;
    }
    
    .language-selector-mini select {
        font-size: 0.65rem !important;
    }
}