/* Dark mode général */
body.dark-mode {
    background: #1e1e1e !important;
    color: #eee !important;
}

/* Contenu général */
body.dark-mode main,
body.dark-mode .content {
    color: #eee !important;
}

/* Cards */
body.dark-mode .card {
    background: #2c2c2c !important;
    color: #eee !important;
    border: 1px solid #444 !important;
}

/* Sidebar */
body.dark-mode .sidebar {
    background: #222 !important;
    color: #ccc !important;
}

body.dark-mode .sidebar .nav-link {
    color: #ccc !important;
}

body.dark-mode .sidebar .nav-link:hover,
body.dark-mode .sidebar .nav-link.active {
    background: #0d6efd !important;
    color: #fff !important;
}

/* Footer */
body.dark-mode footer {
    background: #222 !important;
    color: #ccc !important;
}

/* Notifications */
body.dark-mode .notif-menu {
    background: #2c2c2c !important;
    border-color: #444 !important;
    color: #eee !important;
}

body.dark-mode .notif-menu li {
    color: #eee !important;
}

body.dark-mode .notif-menu li i.bi {
    color: #eee !important;
}

body.dark-mode .notif-menu li:hover {
    background-color: #3a3a3a !important;
}

/* Badge notifications */
body.dark-mode #notifCount {
    background-color: #ff6b6b !important;
    color: #fff !important;
}

/* Inputs et placeholders */
body.dark-mode input,
body.dark-mode select,
body.dark-mode textarea {
    background: #333 !important;
    color: #eee !important;
    border: 1px solid #555 !important;
}

body.dark-mode input::placeholder,
body.dark-mode select::placeholder,
body.dark-mode textarea::placeholder {
    color: #bbb !important;
    opacity: 1 !important;
}

/* Text-muted */
body.dark-mode .text-muted {
    color: #aaa !important;
}

/* === Tables === */
body.dark-mode table,
body.dark-mode .table,
body.dark-mode .table th,
body.dark-mode .table td {
    background-color: #2c2c2c !important;
    color: #eee !important;
    border-color: #444 !important;
}

body.dark-mode .table-striped tbody tr:nth-of-type(odd) {
    background-color: #333 !important;
}

body.dark-mode .table-striped tbody tr:nth-of-type(even) {
    background-color: #2c2c2c !important;
}

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

/* Icônes Bootstrap dans les tables */
body.dark-mode .table i,
body.dark-mode .table i[class*="bi-"] {
    color: #ccc !important;
}

/* Texte inline dans table */
body.dark-mode .table span,
body.dark-mode .table small,
body.dark-mode .table h6,
body.dark-mode .table p,
body.dark-mode .table .text-info,
body.dark-mode .table .text-danger,
body.dark-mode .table .text-warning,
body.dark-mode .table .text-primary,
body.dark-mode .table .text-secondary {
    color: #eee !important;
}

/* Forcer le fond et texte des <thead> */
body.dark-mode .table thead th {
    background-color: #2c2c2c !important;
    color: #eee !important;
}
/* Dark mode pour la login-card */
body.dark-mode .login-card {
    background-color: #222 !important; /* fond sombre */
    color: #eee !important;            /* texte clair */
    border: 1px solid #444 !important;
}

/* Titres dans la login-card */
body.dark-mode .login-card h2 {
    color: #eee !important;
}

/* Labels */
body.dark-mode .login-card label {
    color: #ccc !important;
}

/* Inputs et textarea */
body.dark-mode .login-card input,
body.dark-mode .login-card select,
body.dark-mode .login-card textarea {
    background-color: #333 !important;
    color: #eee !important;
    border: 1px solid #555 !important;
}

/* Placeholder dans les inputs */
body.dark-mode .login-card input::placeholder,
body.dark-mode .login-card select::placeholder,
body.dark-mode .login-card textarea::placeholder {
    color: #bbb !important;
    opacity: 1 !important;
}

/* Boutons */
body.dark-mode .login-card button {
    background-color: #0d6efd !important;
    color: #fff !important;
    border: 1px solid #0b5ed7 !important;
}

/* Hover sur bouton */
body.dark-mode .login-card button:hover {
    background-color: #0b5ed7 !important;
}
/* Dark mode pour le panneau notifications mobile */
body.dark-mode #mobileNotifPanel {
    background-color: #1e1e2f;
    color: #f0f0f0;
}

body.dark-mode #mobileNotifPanel button#closeNotifPanel {
    color: #f0f0f0;
    border-color: #444;
}

body.dark-mode #mobileNotifPanel ul li {
    border-bottom: 1px solid #444;
}

/* Texte clair pour le bouton bascule mode clair sur mobile */
body.dark-mode #darkModeToggleMobile {
    color: #fff !important;      /* texte blanc */
}

body.dark-mode #darkModeToggleMobile:hover {
    background-color: #555 !important;
}

/* Container des toasts */
body.dark-mode #toastContainer {
    position: fixed;
    top: 1rem;
    right: 1rem;
    z-index: 9999;
}

/* Toast */
body.dark-mode .toast {
    background-color: #333;
    color: #eee;
    border: 1px solid #555;
    padding: 0.6rem 1rem;
    margin-bottom: 0.5rem;
    border-radius: 4px;
    opacity: 0;
    transform: translateX(100%);
    transition: all 0.3s ease-in-out;
    box-shadow: 0 2px 6px rgba(0,0,0,0.3);
}

/* Toast visible */
body.dark-mode .toast.show {
    opacity: 1;
    transform: translateX(0);
}

/* Modale confirmation */
body.dark-mode #confirmModal {
    background-color: rgba(30,30,30,0.9);
}

body.dark-mode #confirmModal .modal-content {
    background-color: #2c2c2c;
    color: #eee;
    border: 1px solid #444;
    padding: 1rem;
    border-radius: 6px;
    min-width: 300px;
}

/* Boutons modale */
body.dark-mode #confirmModal button {
    background-color: #0d6efd;
    color: #fff;
    border: 1px solid #0b5ed7;
    padding: 0.4rem 0.8rem;
    margin: 0 0.5rem;
    border-radius: 4px;
}

body.dark-mode #confirmModal button:hover {
    background-color: #0b5ed7;
}