/* ═══════════════════════════════════════════════════════════════════════
   CISNET — MODE SOMBRE (NUIT)
   Activé par <html data-theme="dark"> (voir partials/theme_init).
   Couche 1 : composants partagés du thème (cette feuille).
   Couche 2 : public/js/cisnet-theme-sombre.js adapte les couleurs écrites
   en dur dans les vues (fonds clairs assombris, textes sombres éclaircis,
   teinte conservée).
   Impression et PDF : toujours en clair (règles limitées à @media screen).
   ═══════════════════════════════════════════════════════════════════════ */

:root {
    --cn-fond: #eef5f9;
    --cn-surface: #ffffff;
    --cn-surface-2: #f8fafb;
    --cn-bord: #e3ecf5;
    --cn-texte: #16324F;
    --cn-texte-2: #5b7185;
    --cn-accent: #185fa5;
    --cn-champ: #ffffff;
    --cn-tete-tableau: #e3f2fd;
}

@media screen {
html[data-cn-theme="dark"] {
    color-scheme: dark;
    --cn-fond: #0f1720;
    --cn-surface: #16212c;
    --cn-surface-2: #1b2836;
    --cn-surface-3: #213244;
    --cn-bord: #2b3c4e;
    --cn-texte: #f1f5f9;
    --cn-texte-2: #c9d4df;
    --cn-texte-3: #a9b8c7;
    --cn-accent: #8cc2f5;
    --cn-champ: #111b25;
    --cn-tete-tableau: #1d3247;
    --cn-survol: #1f3044;
    --cn-ombre: 0 1px 3px rgba(0, 0, 0, .45);
}

/* ── Fond, textes, titres ─────────────────────────────────────────────── */
html[data-cn-theme="dark"] body,
html[data-cn-theme="dark"] .page-wrapper,
html[data-cn-theme="dark"] #main-wrapper { background: var(--cn-fond) !important; color: var(--cn-texte); }
html[data-cn-theme="dark"] :is(h1, h2, h3, h4, h5, h6, .card-title, label, .control-label, strong, b):not(:is(.scope-dashboard-hero, .cx-header, .student-welcome-card, .topbar, .page-titles, .modal-header, .btn) *) { color: var(--cn-texte); }
html[data-cn-theme="dark"] p, html[data-cn-theme="dark"] li, html[data-cn-theme="dark"] dd, html[data-cn-theme="dark"] td, html[data-cn-theme="dark"] th { color: inherit; }
html[data-cn-theme="dark"] .text-muted, html[data-cn-theme="dark"] .text-secondary, html[data-cn-theme="dark"] small.text-muted,
html[data-cn-theme="dark"] .form-text { color: var(--cn-texte-2) !important; }
html[data-cn-theme="dark"] .text-dark, html[data-cn-theme="dark"] .text-body, html[data-cn-theme="dark"] .text-black-50 { color: var(--cn-texte) !important; }
html[data-cn-theme="dark"] a { color: var(--cn-accent); }
html[data-cn-theme="dark"] a:hover { color: #9ccaf7; }
html[data-cn-theme="dark"] hr { border-color: var(--cn-bord); }
html[data-cn-theme="dark"] code { color: #f39bc0; background: rgba(255, 255, 255, .06); }
html[data-cn-theme="dark"] pre { color: var(--cn-texte); background: var(--cn-surface-2); border-color: var(--cn-bord); }
html[data-cn-theme="dark"] ::selection { background: #2c5d8f; color: #fff; }

/* ── Menu latéral ─────────────────────────────────────────────────────── */
html[data-cn-theme="dark"] .left-sidebar,
html[data-cn-theme="dark"] .scroll-sidebar,
html[data-cn-theme="dark"] .sidebar-nav,
html[data-cn-theme="dark"] .sidebar-nav ul,
html[data-cn-theme="dark"] .sidebar-footer { background: #121c26 !important; }
html[data-cn-theme="dark"] .sidebar-nav ul li a,
html[data-cn-theme="dark"] .sidebar-nav > ul > li > a i,
html[data-cn-theme="dark"] .sidebar-nav .nav-small-cap,
html[data-cn-theme="dark"] .user-profile .profile-text a { color: #d5dee8 !important; }
html[data-cn-theme="dark"] .sidebar-nav ul li a:hover,
html[data-cn-theme="dark"] .sidebar-nav ul li a.active,
html[data-cn-theme="dark"] .sidebar-nav > ul > li.active > a,
html[data-cn-theme="dark"] .sidebar-nav > ul > li.active > a i { color: #ffffff !important; background: rgba(106, 174, 240, .12) !important; }
html[data-cn-theme="dark"] .user-profile, html[data-cn-theme="dark"] .sidebar-nav ul li.nav-devider { border-color: var(--cn-bord) !important; background-color: transparent; }

/* ── Barre du haut et fil d'Ariane ────────────────────────────────────── */
html[data-cn-theme="dark"] .topbar .top-navbar .navbar-header { background: rgba(0, 0, 0, .18); }
html[data-cn-theme="dark"] .footer { background: var(--cn-surface) !important; color: var(--cn-texte-2) !important; border-color: var(--cn-bord) !important; }
html[data-cn-theme="dark"] .breadcrumb { background: transparent; }

/* ── Cartes et blocs ──────────────────────────────────────────────────── */
/* Les bandeaux aux couleurs de l'université (scope-dashboard-hero, cx-header,
   student-welcome-card…) tirent leur dégradé de la carte : leur card-body,
   transparent, ne doit jamais recevoir de fond. Seule la carte reçoit la
   surface sombre ; un dégradé posé dessus reste visible par-dessus. */
html[data-cn-theme="dark"] .card:not(.scope-dashboard-hero):not(.cx-header):not(.student-welcome-card),
html[data-cn-theme="dark"] .card-header:not([class*="bg-"]),
html[data-cn-theme="dark"] .card-footer:not([class*="bg-"]),
html[data-cn-theme="dark"] .jumbotron,
html[data-cn-theme="dark"] .well,
html[data-cn-theme="dark"] .header_description,
html[data-cn-theme="dark"] .cx-filter { background-color: var(--cn-surface) !important; border-color: var(--cn-bord) !important; color: var(--cn-texte); }
html[data-cn-theme="dark"] .card { box-shadow: var(--cn-ombre); }
html[data-cn-theme="dark"] .card-body { border-color: var(--cn-bord) !important; color: var(--cn-texte); }
html[data-cn-theme="dark"] .card .card:not(.scope-dashboard-hero):not(.cx-header):not(.student-welcome-card) { background-color: var(--cn-surface-2) !important; }
/* Bandeaux : textes et dégradés intacts, quel que soit le thème. */
html[data-cn-theme="dark"] .scope-dashboard-hero, html[data-cn-theme="dark"] .scope-dashboard-hero *,
html[data-cn-theme="dark"] .cx-header, html[data-cn-theme="dark"] .cx-header *,
html[data-cn-theme="dark"] .student-welcome-card, html[data-cn-theme="dark"] .student-welcome-card * { border-color: inherit; }
html[data-cn-theme="dark"] .bg-white, html[data-cn-theme="dark"] .bg-light { background-color: var(--cn-surface-2) !important; }
html[data-cn-theme="dark"] .border, html[data-cn-theme="dark"] .border-top, html[data-cn-theme="dark"] .border-bottom,
html[data-cn-theme="dark"] .border-left, html[data-cn-theme="dark"] .border-right { border-color: var(--cn-bord) !important; }
html[data-cn-theme="dark"] .cx-stat .v, html[data-cn-theme="dark"] .cx-entete-title { color: var(--cn-texte) !important; }
html[data-cn-theme="dark"] .cx-stat .l { color: var(--cn-texte-2) !important; }
html[data-cn-theme="dark"] .cx-entete-year { background: #1d3247; color: #8cc0ef; }

/* ── Tableaux et DataTables ───────────────────────────────────────────── */
html[data-cn-theme="dark"] .table { color: var(--cn-texte); background: transparent; }
html[data-cn-theme="dark"] .table thead th,
html[data-cn-theme="dark"] .table th { background-color: var(--cn-tete-tableau) !important; color: #e6f0fa !important; border-color: var(--cn-bord) !important; }
html[data-cn-theme="dark"] .table td, html[data-cn-theme="dark"] .table-bordered,
html[data-cn-theme="dark"] .table-bordered td, html[data-cn-theme="dark"] .table-bordered th { border-color: var(--cn-bord) !important; }
html[data-cn-theme="dark"] .table-striped tbody tr:nth-of-type(odd) { background-color: rgba(255, 255, 255, .025) !important; }
html[data-cn-theme="dark"] .table-hover tbody tr:hover, html[data-cn-theme="dark"] .table tbody tr:hover { background-color: var(--cn-survol) !important; }
html[data-cn-theme="dark"] .table-responsive { border-color: var(--cn-bord) !important; }
html[data-cn-theme="dark"] .dataTables_wrapper, html[data-cn-theme="dark"] .dataTables_info,
html[data-cn-theme="dark"] .dataTables_length, html[data-cn-theme="dark"] .dataTables_filter { color: var(--cn-texte-2) !important; }
html[data-cn-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button { color: var(--cn-texte) !important; }
html[data-cn-theme="dark"] .dataTables_wrapper .dataTables_paginate .paginate_button.current { background: var(--cn-tete-tableau) !important; border-color: var(--cn-bord) !important; }
html[data-cn-theme="dark"] table.dataTable tbody tr { background-color: transparent; }
html[data-cn-theme="dark"] .dataTables_processing { background: var(--cn-surface-2) !important; color: var(--cn-texte) !important; }

/* ── Formulaires ──────────────────────────────────────────────────────── */
html[data-cn-theme="dark"] .form-control,
html[data-cn-theme="dark"] .custom-select,
html[data-cn-theme="dark"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
html[data-cn-theme="dark"] select, html[data-cn-theme="dark"] textarea {
    background-color: var(--cn-champ) !important; color: var(--cn-texte) !important; border-color: var(--cn-bord) !important;
}
html[data-cn-theme="dark"] .form-control:focus { border-color: var(--cn-accent) !important; box-shadow: 0 0 0 3px rgba(106, 174, 240, .2) !important; }
html[data-cn-theme="dark"] .form-control[readonly], html[data-cn-theme="dark"] .form-control:disabled { background-color: #18242f !important; color: var(--cn-texte-2) !important; }
html[data-cn-theme="dark"] ::placeholder { color: #93a5b7 !important; opacity: 1; }
html[data-cn-theme="dark"] .input-group-text { background: var(--cn-surface-2); color: var(--cn-texte-2); border-color: var(--cn-bord); }
html[data-cn-theme="dark"] .select2-container--default .select2-selection--single,
html[data-cn-theme="dark"] .select2-container--default .select2-selection--multiple { background-color: var(--cn-champ) !important; border-color: var(--cn-bord) !important; }
html[data-cn-theme="dark"] .select2-container--default .select2-selection--single .select2-selection__rendered { color: var(--cn-texte) !important; }
html[data-cn-theme="dark"] .select2-dropdown { background: var(--cn-surface-2) !important; border-color: var(--cn-bord) !important; color: var(--cn-texte); }
html[data-cn-theme="dark"] .select2-results__option { color: var(--cn-texte); }
html[data-cn-theme="dark"] .select2-container--default .select2-results__option--highlighted[aria-selected] { background: #2c5d8f !important; color: #fff !important; }
html[data-cn-theme="dark"] .select2-container--default .select2-results__option[aria-selected=true] { background: var(--cn-surface-3) !important; }
html[data-cn-theme="dark"] .select2-container--default .select2-search--dropdown .select2-search__field { background: var(--cn-champ) !important; color: var(--cn-texte) !important; }
html[data-cn-theme="dark"] .dropify-wrapper { background: var(--cn-champ) !important; border-color: var(--cn-bord) !important; color: var(--cn-texte-2) !important; }

/* ── Menus, modales, onglets, listes ──────────────────────────────────── */
html[data-cn-theme="dark"] .dropdown-menu,
html[data-cn-theme="dark"] .mailbox, html[data-cn-theme="dark"] .popover { background: var(--cn-surface-2) !important; border-color: var(--cn-bord) !important; color: var(--cn-texte); }
html[data-cn-theme="dark"] .dropdown-item, html[data-cn-theme="dark"] .dropdown-user li a { color: var(--cn-texte) !important; }
html[data-cn-theme="dark"] .dropdown-item:hover, html[data-cn-theme="dark"] .dropdown-item:focus,
html[data-cn-theme="dark"] .dropdown-user li a:hover { background: var(--cn-survol) !important; }
html[data-cn-theme="dark"] .dropdown-divider, html[data-cn-theme="dark"] .dropdown-user li.divider { border-color: var(--cn-bord) !important; background: var(--cn-bord) !important; }
html[data-cn-theme="dark"] .modal-content { background: var(--cn-surface) !important; color: var(--cn-texte); border-color: var(--cn-bord); }
html[data-cn-theme="dark"] .modal-header, html[data-cn-theme="dark"] .modal-footer { border-color: var(--cn-bord) !important; }
html[data-cn-theme="dark"] .modal-header:not([style*="gradient"]) { background-color: var(--cn-surface-2); }
html[data-cn-theme="dark"] .close { color: var(--cn-texte); text-shadow: none; }
html[data-cn-theme="dark"] .modal-backdrop.show { opacity: .7; }
html[data-cn-theme="dark"] .nav-tabs { border-color: var(--cn-bord); }
html[data-cn-theme="dark"] .nav-tabs .nav-link { color: var(--cn-texte-2); }
html[data-cn-theme="dark"] .nav-tabs .nav-link.active, html[data-cn-theme="dark"] .nav-tabs .nav-item.show .nav-link {
    background: var(--cn-surface) !important; color: var(--cn-texte) !important; border-color: var(--cn-bord) var(--cn-bord) var(--cn-surface) !important; }
html[data-cn-theme="dark"] .list-group-item { background: var(--cn-surface) !important; border-color: var(--cn-bord) !important; color: var(--cn-texte); }
html[data-cn-theme="dark"] .list-group-item-action:hover { background: var(--cn-survol) !important; }
html[data-cn-theme="dark"] .page-link { background: var(--cn-surface-2); border-color: var(--cn-bord); color: var(--cn-texte); }
html[data-cn-theme="dark"] .page-item.active .page-link { background: #2c5d8f; border-color: #2c5d8f; color: #fff; }
html[data-cn-theme="dark"] .page-item.disabled .page-link { background: var(--cn-surface); color: var(--cn-texte-3); }
html[data-cn-theme="dark"] .tooltip-inner { background: #e6edf4; color: #0f1720; }

/* ── Boutons et badges neutres ────────────────────────────────────────── */
html[data-cn-theme="dark"] .btn-light, html[data-cn-theme="dark"] .btn-default,
html[data-cn-theme="dark"] .btn-white { background: var(--cn-surface-3) !important; border-color: var(--cn-bord) !important; color: var(--cn-texte) !important; }
html[data-cn-theme="dark"] .btn-outline-secondary, html[data-cn-theme="dark"] .btn-outline-dark { color: var(--cn-texte) !important; border-color: #4a5d70 !important; }
html[data-cn-theme="dark"] .btn-outline-secondary:hover, html[data-cn-theme="dark"] .btn-outline-dark:hover { background: var(--cn-survol) !important; }
html[data-cn-theme="dark"] .btn-inverse, html[data-cn-theme="dark"] .btn-secondary { background: #34465a !important; border-color: #34465a !important; color: #e6edf4 !important; }
html[data-cn-theme="dark"] .badge-light { background: var(--cn-surface-3); color: var(--cn-texte); }
html[data-cn-theme="dark"] .badge-dark { background: #4a5d70; color: #fff; }

/* ── Alertes : fonds assombris, teinte conservée ──────────────────────── */
html[data-cn-theme="dark"] .alert-info    { background: #12304a !important; border-color: #1d4a70 !important; color: #b9dcff !important; }
html[data-cn-theme="dark"] .alert-success { background: #12341f !important; border-color: #1d5233 !important; color: #b6e9c8 !important; }
html[data-cn-theme="dark"] .alert-warning { background: #3a2c0d !important; border-color: #5e4614 !important; color: #f5d690 !important; }
html[data-cn-theme="dark"] .alert-danger  { background: #3d1518 !important; border-color: #63242a !important; color: #f7b9bd !important; }
html[data-cn-theme="dark"] .alert-light, html[data-cn-theme="dark"] .alert-secondary { background: var(--cn-surface-2) !important; color: var(--cn-texte) !important; border-color: var(--cn-bord) !important; }

/* ── SweetAlert2, Flatpickr, éditeurs ─────────────────────────────────── */
html[data-cn-theme="dark"] .swal2-popup { background: var(--cn-surface) !important; color: var(--cn-texte) !important; }
html[data-cn-theme="dark"] .swal2-title, html[data-cn-theme="dark"] .swal2-html-container, html[data-cn-theme="dark"] .swal2-content { color: var(--cn-texte) !important; }
html[data-cn-theme="dark"] .swal2-input, html[data-cn-theme="dark"] .swal2-select, html[data-cn-theme="dark"] .swal2-textarea { background: var(--cn-champ) !important; color: var(--cn-texte) !important; }
html[data-cn-theme="dark"] .flatpickr-calendar { background: var(--cn-surface-2); box-shadow: 0 6px 20px rgba(0, 0, 0, .5); }
html[data-cn-theme="dark"] .flatpickr-day, html[data-cn-theme="dark"] .flatpickr-weekday, html[data-cn-theme="dark"] .flatpickr-month,
html[data-cn-theme="dark"] .flatpickr-current-month .flatpickr-monthDropdown-months { color: var(--cn-texte) !important; fill: var(--cn-texte); }
html[data-cn-theme="dark"] .ck.ck-editor__main > .ck-editor__editable { background: var(--cn-champ) !important; color: var(--cn-texte) !important; border-color: var(--cn-bord) !important; }
html[data-cn-theme="dark"] .ck.ck-toolbar { background: var(--cn-surface-2) !important; border-color: var(--cn-bord) !important; }
html[data-cn-theme="dark"] .ck.ck-button, html[data-cn-theme="dark"] .ck.ck-toolbar .ck-toolbar__separator { color: var(--cn-texte) !important; }

/* ── Images : légère atténuation des photos très lumineuses ───────────── */
html[data-cn-theme="dark"] .card img:not([src*=".svg"]):not(.profile-pic):not([class*="logo"]) { filter: brightness(.92); }

/* ── Transition douce au changement de thème (pas au chargement) ─────── */
html.cn-transition, html.cn-transition * { transition: background-color .25s ease, color .25s ease, border-color .25s ease !important; }
}

/* ── Bouton de la barre du haut ───────────────────────────────────────── */
.cn-theme-menu .dropdown-item { display: flex; align-items: center; gap: 10px; }
.cn-theme-menu .dropdown-item svg { flex: 0 0 auto; }
.cn-theme-menu .dropdown-item .coche { margin-left: auto; visibility: hidden; color: var(--cn-accent); }
.cn-theme-menu .dropdown-item.actif .coche { visibility: visible; }
.cn-theme-btn svg { vertical-align: -3px; }

/* ── Bouton dans la bande du fil d'Ariane (téléphone) ────────────────────
   Gabarit hérité des classes cx-apps cx-apps-barre (bouton Applications) ;
   ici, seulement l'écart entre les deux boutons. Interrupteur direct,
   sans menu. */
.cn-theme-barre { margin-right: 8px; }

/* ── Panneau des Applications (barre du haut et bande du fil d'Ariane) ────
   Il vit dans des zones que le moteur laisse intactes (couleurs de
   l'université) : ses couleurs sont donc reprises ici, une par une, en
   gardant la teinte de chaque application. */
@media screen {
html[data-cn-theme="dark"] .cx-apps-panneau { background: var(--cn-surface) !important; box-shadow: 0 16px 48px rgba(0, 0, 0, .55) !important; }
html[data-cn-theme="dark"] .cx-apps-modules { background: var(--cn-surface) !important; }
html[data-cn-theme="dark"] .cx-apps-liens { background: var(--cn-surface-2) !important; border-left-color: var(--cn-bord) !important; }
html[data-cn-theme="dark"] .cx-apps-titre { color: var(--cn-texte-3) !important; }
html[data-cn-theme="dark"] .cx-app:hover { background: var(--cn-survol) !important; }
html[data-cn-theme="dark"] .cx-app .txt strong { color: var(--cn-texte) !important; }
html[data-cn-theme="dark"] .cx-app .txt small { color: var(--cn-texte-2) !important; }
html[data-cn-theme="dark"] .cx-app .ico.bleu   { background: #17304a !important; color: #7fb6ec !important; }
html[data-cn-theme="dark"] .cx-app .ico.indigo { background: #232a52 !important; color: #a3abf0 !important; }
html[data-cn-theme="dark"] .cx-app .ico.vert   { background: #153424 !important; color: #6fdc98 !important; }
html[data-cn-theme="dark"] .cx-app .ico.ambre  { background: #3a2b12 !important; color: #f0bb63 !important; }
html[data-cn-theme="dark"] .cx-app .ico.violet { background: #2f1f44 !important; color: #c79bf0 !important; }
html[data-cn-theme="dark"] .cx-app .ico.gris   { background: #273443 !important; color: #b6c3d1 !important; }
html[data-cn-theme="dark"] .cx-app-bientot:hover { background: var(--cn-survol) !important; }
html[data-cn-theme="dark"] .cx-app-bientot .etiquette { background: var(--cn-surface-3) !important; border-color: var(--cn-bord) !important; color: var(--cn-texte-2) !important; }
html[data-cn-theme="dark"] .cx-apps-liens a { color: var(--cn-texte-2) !important; }
html[data-cn-theme="dark"] .cx-apps-liens a:hover { background: var(--cn-survol) !important; color: var(--cn-texte) !important; }
html[data-cn-theme="dark"] .cx-apps-liens a i { color: inherit; }
html[data-cn-theme="dark"] .cx-apps-pied { background: var(--cn-surface) !important; border-top-color: var(--cn-bord) !important; }
html[data-cn-theme="dark"] .cx-apps-pied span, html[data-cn-theme="dark"] .cx-apps-pied i { color: var(--cn-texte-2) !important; }
html[data-cn-theme="dark"] .cx-apps-grille { scrollbar-color: #3a4d61 transparent; }
}

/* ── Lignes de tableau : survol et zébrage suivent le thème ───────────────
   Le survol (:hover) est un état passager que le moteur ne voit pas : les
   vues qui colorent leurs lignes au survol en bleu très clair sont
   couvertes ici, pour tous les tableaux. */
@media screen {
html[data-cn-theme="dark"] table tbody tr:hover,
html[data-cn-theme="dark"] table tbody tr:hover > td:not(.decision),
html[data-cn-theme="dark"] table tbody tr:hover > th { background-color: var(--cn-survol) !important; }
html[data-cn-theme="dark"] table.dataTable tbody tr.selected,
html[data-cn-theme="dark"] table.dataTable tbody tr.selected > td { background-color: #23405f !important; }
}

/* ── Interrupteurs Switchery (paramètres, modules activés…) ───────────────
   Switchery écrit ses couleurs dans l'attribut style et les change à chaque
   clic : le moteur ne les touche pas. Seul l'état DÉSACTIVÉ — fond blanc —
   est assombri ici ; l'état activé garde sa couleur, la pastille reste
   blanche, et le basculement fonctionne normalement. */
@media screen {
html[data-cn-theme="dark"] .switchery[style*="background-color: rgb(255, 255, 255)"],
html[data-cn-theme="dark"] .switchery[style*="background-color: #fff"],
html[data-cn-theme="dark"] .switchery[style*="background-color: white"] {
    background-color: #2b3c4e !important;
    border-color: #3d5266 !important;
    box-shadow: #3d5266 0 0 0 0 inset !important;
}
html[data-cn-theme="dark"] .switchery > small { box-shadow: 0 1px 3px rgba(0, 0, 0, .5) !important; }
html[data-cn-theme="dark"] .switchery-disabled { opacity: .45; }
}

/* ── Paramètres généraux (settings/all/dashboard et variantes) ────────────
   Styles d'origine dans public/css/settings-dashboard.css. Le bandeau
   (theme-hero) garde ses couleurs ; tout le reste passe au thème sombre. */
@media screen {
/* Recherche */
html[data-cn-theme="dark"] .settings-search-panel { background: var(--cn-surface) !important; border-color: var(--cn-bord) !important; box-shadow: none !important; }
html[data-cn-theme="dark"] .settings-search-panel label { color: var(--cn-texte) !important; }
html[data-cn-theme="dark"] .settings-search-control { background: var(--cn-champ) !important; border-color: var(--cn-bord) !important; }
html[data-cn-theme="dark"] .settings-search-control > i { color: var(--cn-texte-3) !important; }
html[data-cn-theme="dark"] .settings-search-empty { background: var(--cn-surface-2) !important; color: var(--cn-texte-2) !important; border-color: var(--cn-bord) !important; }
html[data-cn-theme="dark"] .settings-search-results,
html[data-cn-theme="dark"] .settings-search-results > * { background: var(--cn-surface-2) !important; border-color: var(--cn-bord) !important; color: var(--cn-texte) !important; }
html[data-cn-theme="dark"] .settings-search-results > *:hover { background: var(--cn-survol) !important; }
html[data-cn-theme="dark"] .settings-search-results small, html[data-cn-theme="dark"] .settings-search-results .text-muted { color: var(--cn-texte-2) !important; }
html[data-cn-theme="dark"] .settings-search-results mark { background: #5b4a12 !important; color: #ffe8a3 !important; }

/* Onglets des catégories */
html[data-cn-theme="dark"] .settings-tabs { background: transparent !important; border-color: var(--cn-bord) !important; }
html[data-cn-theme="dark"] .settings-tabs .nav-link { background: var(--cn-surface) !important; border-color: var(--cn-bord) !important; color: var(--cn-texte-2) !important; }
/* Tuiles d'icônes des catégories : toutes identiques, sombres. */
html[data-cn-theme="dark"] .settings-tabs .nav-link i {
    color: var(--cn-accent) !important;
    background-color: var(--cn-surface-2) !important; background-image: none !important;
    border-color: var(--cn-bord) !important; box-shadow: none !important;
}
html[data-cn-theme="dark"] .settings-tabs .nav-link.active i { background-color: #1d3a57 !important; color: #9ccaf7 !important; }
html[data-cn-theme="dark"] .settings-tabs .nav-link .lib, html[data-cn-theme="dark"] .settings-tabs .nav-link span { color: var(--cn-texte) !important; }
html[data-cn-theme="dark"] .settings-tabs .nav-link small { color: var(--cn-texte-3) !important; }
html[data-cn-theme="dark"] .settings-tabs .nav-link:hover { background: var(--cn-survol) !important; }
html[data-cn-theme="dark"] .settings-tabs .nav-link { box-shadow: none !important; }
html[data-cn-theme="dark"] .settings-tabs .nav-link.active { background: var(--cn-tete-tableau) !important; border-color: var(--cn-bord) !important; box-shadow: inset 0 -2px 0 var(--cn-accent) !important; }
html[data-cn-theme="dark"] .settings-tabs .nav-link.active .lib, html[data-cn-theme="dark"] .settings-tabs .nav-link.active span { color: #ffffff !important; }

/* Contenu des onglets, sections et champs */
/* Cadre du contenu de l'onglet : même bordure sombre et discrète que le
   bloc des catégories au-dessus — la bordure claire d'origine dessinait un
   grand cadre blanc autour de chaque onglet. */
html[data-cn-theme="dark"] #generalSettingsTabContent,
html[data-cn-theme="dark"] .settings-category-pane,
html[data-cn-theme="dark"] .settings-category-pane.active,
html[data-cn-theme="dark"] .tab-content > .tab-pane {
    background: transparent !important;
    border-color: var(--cn-bord) !important;
    box-shadow: none !important; outline: none !important;
}
html[data-cn-theme="dark"] .settings-category-pane:focus,
html[data-cn-theme="dark"] .settings-category-pane:focus-visible { outline: none !important; box-shadow: none !important; }
html[data-cn-theme="dark"] .setting-section { background: var(--cn-surface) !important; border-color: var(--cn-bord) !important; box-shadow: none !important; outline: none !important; }
html[data-cn-theme="dark"] .setting-section-header { background: var(--cn-surface-2) !important; border-color: var(--cn-bord) !important; }
html[data-cn-theme="dark"] .setting-section-title { color: var(--cn-texte) !important; }
html[data-cn-theme="dark"] .setting-section-count { background: var(--cn-tete-tableau) !important; color: #b9dcff !important; border-color: var(--cn-bord) !important; }
/* Cartes de champs : comme dans l'onglet « Délibération et cotes », elles
   se détachent par leur fond seul — aucune bordure, aucun halo. Un trait,
   même sombre, ressortait trop sur le fond de la section. */
html[data-cn-theme="dark"] .setting-field-inner {
    background: var(--cn-surface-2) !important;
    border-color: transparent !important;
    box-shadow: none !important; outline: none !important;
}
html[data-cn-theme="dark"] .setting-field-inner:hover,
html[data-cn-theme="dark"] .setting-field-inner:focus-within { background: #1e2e3e !important; border-color: transparent !important; box-shadow: none !important; }
html[data-cn-theme="dark"] .setting-field-inner .form-group { border-color: transparent !important; box-shadow: none !important; background: transparent !important; }
html[data-cn-theme="dark"] .setting-field .control-label, html[data-cn-theme="dark"] .setting-field label { color: var(--cn-texte) !important; }
html[data-cn-theme="dark"] .setting-field .text-danger { color: #f7a1a6 !important; }
html[data-cn-theme="dark"] .setting-annual-hint { color: var(--cn-accent) !important; background: rgba(106, 174, 240, .1) !important; border-color: transparent !important; }

/* Images (logo, en-têtes…) */
html[data-cn-theme="dark"] .setting-image,
html[data-cn-theme="dark"] .setting-image-editor,
html[data-cn-theme="dark"] .setting-image-footer { background: var(--cn-surface-2) !important; border-color: var(--cn-bord) !important; box-shadow: none !important; color: var(--cn-texte) !important; }
html[data-cn-theme="dark"] .setting-image-heading, html[data-cn-theme="dark"] .setting-image-label { color: var(--cn-texte) !important; }
html[data-cn-theme="dark"] .setting-image-empty { background: var(--cn-champ) !important; border-color: var(--cn-bord) !important; color: var(--cn-texte-3) !important; }
/* La vignette garde un fond clair : un logo sombre resterait visible. */
html[data-cn-theme="dark"] .setting-image-thumbnail { background: #e9eef3 !important; border-color: var(--cn-bord) !important; }
html[data-cn-theme="dark"] .setting-image-edit, html[data-cn-theme="dark"] .setting-image-cancel { background: var(--cn-surface-3) !important; border-color: var(--cn-bord) !important; color: var(--cn-texte) !important; }
html[data-cn-theme="dark"] .setting-image-remove { background: #3d1518 !important; border-color: #63242a !important; color: #f7b9bd !important; }

/* Sélecteur de couleur */
html[data-cn-theme="dark"] .colorpicker, html[data-cn-theme="dark"] .asColorPicker-dropdown { background: var(--cn-surface-2) !important; border-color: var(--cn-bord) !important; }

/* Barre d'enregistrement et état */
html[data-cn-theme="dark"] .sd-barre { background: rgba(22, 33, 44, .96) !important; border-color: var(--cn-bord) !important; box-shadow: 0 -6px 20px rgba(0, 0, 0, .45) !important; }
html[data-cn-theme="dark"] .sd-barre .etat { color: var(--cn-texte-2) !important; }
html[data-cn-theme="dark"] .sd-barre.modifie .etat, html[data-cn-theme="dark"] .sd-barre .etat.modifie { color: #f5d690 !important; }
html[data-cn-theme="dark"] .sd-etat-haut { background: #3a2c0d !important; color: #f5d690 !important; border-color: #5e4614 !important; }
}

/* ── Grille de délibération : cellules de décision ────────────────────────
   Les décisions gardent EXACTEMENT les couleurs du mode clair — c'est une
   information, pas une décoration —, avec un texte foncé lisible.
   Au chargement, la grille pose bg-succeeded (COMP, bleu ciel),
   bg-succeeded2 (ADM) ou bg-dangereux (AJ) ; après un recalcul en direct,
   bg_comp, bg_adm, bg_val, bg_aj, bg_nval. Les deux familles sont couvertes. */
@media screen {
html[data-cn-theme="dark"] td.decision.bg-succeeded,
html[data-cn-theme="dark"] td.decision.bg_comp   { background-color: #caeefc !important; }
html[data-cn-theme="dark"] td.decision.bg-succeeded2,
html[data-cn-theme="dark"] td.decision.bg_adm,
html[data-cn-theme="dark"] td.decision.bg_val    { background-color: #63b60f !important; }
html[data-cn-theme="dark"] td.decision.bg-dangereux,
html[data-cn-theme="dark"] td.decision.bg_aj,
html[data-cn-theme="dark"] td.decision.bg_nval   { background-color: #ff5050 !important; }
html[data-cn-theme="dark"] td.decision:is(.bg-succeeded, .bg-succeeded2, .bg-dangereux, .bg_comp, .bg_adm, .bg_val, .bg_aj, .bg_nval),
html[data-cn-theme="dark"] td.decision:is(.bg-succeeded, .bg-succeeded2, .bg-dangereux, .bg_comp, .bg_adm, .bg_val, .bg_aj, .bg_nval) * {
    color: #10202f !important;
}
/* Bordure : la même que les autres cellules du tableau, jamais blanche. */
html[data-cn-theme="dark"] td.decision {
    border-color: var(--cn-bord) !important;
    box-shadow: none !important;
    outline: none !important;
}
}