/* ════════════════════════════════════════════════════════════════════
   PNVB · DMGV -- Thème « Programmes »  (v1.0)
   Aligne toute la plateforme sur le design des pages du module
   Programmes (modules/programmes/assets/css/app.css) :
     - police Inter 14 px, aplats vert / jaune / rouge du logo, aucun dégradé ;
     - fond #F3F5F0, surfaces blanches arrondies (14 px) à ombre douce ;
     - menu latéral vert fixe (ordinateur), barre verte + tiroir (mobile) ;
     - indicateurs à liseré supérieur, tableaux et pastilles des Programmes.
   Chargé EN DERNIER sur chaque page (après pnvb-pro.css / pnvb-mobile.css).
   100 % local, aucune ressource externe.
   ════════════════════════════════════════════════════════════════════ */

/* Police Inter servie localement, garantie sur toutes les pages */
@import url("inter-local.css");

/* ── 1. Jetons : ceux des Programmes ───────────────────────────────── */
html:root {
  /* Palette Programmes */
  --p-vert: #0E7131;  --p-vert-fonce: #0A5424;  --p-vert-pale: #E6F1E9;
  --p-rouge: #D4140B; --p-rouge-fonce: #A50F08; --p-rouge-pale: #FCEAE9;
  --p-jaune: #FFBC04; --p-jaune-pale: #FFF6DA;
  --p-fond: #F3F5F0;  --p-papier: #FFFFFF;      --p-champ: #FBFCFA;
  --p-encre: #17221A; --p-gris: #56635A;
  --p-ligne: #D3DBD1; --p-ligne-2: #E7ECE5;
  --p-r-sm: 8px;      --p-r-md: 14px;
  --p-ombre: 0 1px 2px rgba(5, 63, 11, .06), 0 10px 28px -14px rgba(5, 63, 11, .28);
  --p-side: 250px;

  /* Réalignement du thème historique (pnvb-pro.css) sur la palette Programmes */
  --pv-vert-700: #0A5424;  --pv-vert-900: #0A5424;  --pv-vert-600: #0E7131;
  --pv-vert-50:  #E6F1E9;  --pv-vert-100: #D6EADB;
  --pv-rouge-50: #FCEAE9;  --pv-or-50: #FFF6DA;
  --pv-encre: #17221A;     --pv-encre-2: #2C3A31;
  --pv-muet: #56635A;      --pv-muet-2: #8A968E;
  --pv-ligne: #E7ECE5;     --pv-ligne-2: #D3DBD1;
  --pv-fond: #F3F5F0;
  --pv-r: 8px;  --pv-r-lg: 14px;  --pv-r-sm: 6px;
  --pv-ombre-1: var(--p-ombre);
  --pv-ombre-2: 0 2px 4px rgba(5, 63, 11, .08), 0 16px 34px -14px rgba(5, 63, 11, .34);
  --bs-body-bg: #F3F5F0;
  --bs-border-radius: 8px; --bs-border-radius-lg: 14px;

  /* Menu : vert Programmes */
  --pv-menu-bg: #0E7131; --pv-menu-bg-hover: #0A5424; --pv-menu-btn: #0A5424; --pv-menu-btn-line: #0A5424;
}

/* ── 2. Base ───────────────────────────────────────────────────────── */
body:not(.login-page) { background-color: var(--p-fond) !important; }
body { color: var(--p-encre); }
a { color: var(--p-vert); }
a:hover { color: var(--p-vert-fonce); }

/* Titres de page : vert foncé, graisse forte (comme .topbar h1 des Programmes) */
body > header h1, .page-title, .page-title h1, .top-header h1, .header-title-main {
  color: var(--p-vert-fonce) !important; font-weight: 800 !important; letter-spacing: -.02em;
}
.card-title, .card-header h1, .card-header h2, .card-header h3, .card-header h4, .card-header h5,
.section-title, .panel-title, .chart-title {
  color: var(--p-vert-fonce) !important; font-weight: 750 !important;
}

/* En-têtes blancs collants des modules (« logo carré + titre ») */
body > header[style*="background:white"], body > header[style*="background: white"], body > header[style*="#fff"] {
  background: var(--p-papier) !important;
  border-bottom: 1px solid var(--p-ligne-2) !important;
  box-shadow: 0 1px 0 rgba(5, 63, 11, .04) !important;
}

/* Pastilles d'icône de titre : carré vert Programmes */
[style*="width:44px;height:44px"][style*="background:#0A5626"],
[style*="width:44px;height:44px"][style*="background:#0E7131"],
[style*="width:44px;height:44px"][style*="background: #0A5626"] {
  background: var(--p-vert) !important; border-radius: 10px !important;
  box-shadow: inset 0 -3px 0 var(--p-jaune) !important;
}

/* Tous les aplats vert très foncé (#06321A) deviennent le vert du logo */
[style*="background:#06321A"], [style*="background: #06321A"], [style*="background:#06321a"],
[style*="background-color:#06321A"], [style*="background: #06321a"] {
  background: var(--p-vert) !important;
}
.page-header, .topbar, .detail-card-header, .rt, .np,
.modal-header.green, .table-container.is-fullscreen .table-topbar,
.tbl-container.is-fullscreen .tbl-topbar {
  background-color: var(--p-vert) !important;
  background-image: none !important;
}
#fsBtn:hover { background: var(--p-vert) !important; border-color: var(--p-vert) !important; color: #fff !important; }
.modal-header.gold, .modal-header.hdr-warning { background: var(--p-jaune) !important; color: #3B2C00 !important; }
.modal-header.gold .modal-title, .modal-header.hdr-warning .modal-title { color: #3B2C00 !important; }

/* ── 3. Surfaces (panneaux des Programmes) ─────────────────────────── */
.card, .panel, .filters-card, .filter-card, .table-container, .tbl-container, .chart-card,
.info-card, .section-card, .content-card, .form-card, .summary-card, .detail-card, .box {
  background: var(--p-papier);
  border: 0 !important;
  border-radius: var(--p-r-md) !important;
  box-shadow: var(--p-ombre) !important;
}
.filters-card:hover, .table-container:hover, .tbl-container:hover { box-shadow: var(--p-ombre) !important; }
.card-header { background: var(--p-papier) !important; border-bottom: 1px solid var(--p-ligne-2) !important; padding: .9rem 1.2rem; }
.card-header.bg-success, .card-header.bg-primary, .card-header.bg-dark { background: var(--p-vert) !important; }
.card-footer { background: #FAFCF9 !important; border-top: 1px solid var(--p-ligne-2) !important; }
.bg-white.rounded-2xl, .bg-white.rounded-xl, .bg-white.rounded-lg {
  border-radius: var(--p-r-md) !important; box-shadow: var(--p-ombre) !important; border-color: transparent !important;
}

/* ── 4. Indicateurs (.kpi des Programmes : liseré supérieur coloré) ── */
.stat-card, .kpi-card {
  background: var(--p-papier) !important;
  border: 0 !important;
  border-top: 4px solid var(--p-ligne-2) !important;
  border-radius: var(--p-r-md) !important;
  box-shadow: var(--p-ombre) !important;
  position: relative; overflow: hidden;
}
.stat-card:hover, .kpi-card:hover { transform: none !important; box-shadow: var(--pv-ombre-2) !important; }
/* L'ancien liseré latéral (::before) est remplacé par la bordure supérieure */
.stat-card::before, .kpi-card::before { display: none !important; }
.stat-card.total, .stat-card.primary, .kpi-card.total      { border-top-color: var(--p-rouge) !important; }
.stat-card.attente, .stat-card.warning, .stat-card.pending,
.stat-card.en_attente, .kpi-card.attente                    { border-top-color: var(--p-jaune) !important; }
.stat-card.approuve, .stat-card.success, .stat-card.valide,
.stat-card.unique, .kpi-card.approuve                       { border-top-color: var(--p-vert) !important; }
.stat-card.rejete, .stat-card.danger, .kpi-card.rejete      { border-top-color: var(--p-rouge-fonce) !important; }
.stat-card.today, .stat-card.info                           { border-top-color: var(--p-vert-fonce) !important; }
.stat-value, .stat-number, .kpi-value {
  font-weight: 850 !important; letter-spacing: -.02em; color: var(--p-vert-fonce) !important;
  font-variant-numeric: tabular-nums;
}
.stat-label { color: var(--p-gris) !important; }

/* ── 5. Boutons (formes des Programmes) ────────────────────────────── */
.btn { --bs-btn-border-radius: var(--p-r-sm); --bs-btn-font-weight: 700; font-weight: 700; border-radius: var(--p-r-sm); }
.btn-sm { border-radius: var(--p-r-sm); }
.btn-primary, .btn-success { --bs-btn-hover-bg: var(--p-vert-fonce); --bs-btn-hover-border-color: var(--p-vert-fonce); }
.btn-secondary, .btn-light, .btn-outline-secondary {
  --bs-btn-bg: #fff; --bs-btn-border-color: var(--p-ligne); --bs-btn-color: var(--p-encre);
  --bs-btn-hover-bg: #fff; --bs-btn-hover-border-color: var(--p-vert); --bs-btn-hover-color: var(--p-vert);
}
.btn-act, .action-btn, .btn-action { border-radius: var(--p-r-sm) !important; box-shadow: none !important; border: 1px solid var(--p-ligne) !important; }
.btn-act:hover, .action-btn:hover { transform: none !important; border-color: var(--p-vert) !important; }
.tab-btn { border-radius: 99px !important; font-weight: 700 !important; }
.tab-btn.active { background: var(--p-vert) !important; box-shadow: none !important; color: #fff !important; }

/* ── 6. Champs ─────────────────────────────────────────────────────── */
.form-control, .form-select, .search-wrap .form-control, .modal-body .form-control, .modal-body .form-select {
  border: 1.5px solid var(--p-ligne) !important;
  border-radius: var(--p-r-sm) !important;
  background-color: var(--p-champ);
}
.form-control:hover, .form-select:hover { border-color: #AEBBB0 !important; }
.form-control:focus, .form-select:focus, input:focus, select:focus, textarea:focus {
  border-color: var(--p-vert) !important; background-color: #fff;
  box-shadow: 0 0 0 3px rgba(14, 113, 49, .14) !important;
}
.form-label, label.form-label { font-weight: 600; color: var(--p-encre); }

/* ── 7. Tableaux (en-têtes et lignes des Programmes) ───────────────── */
table th, .table > thead > tr > th, .table thead th, .data-table th, .tbl th {
  background: #FAFCF9 !important;
  color: var(--p-gris) !important;
  font-size: .78rem !important;
  font-weight: 700 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  border-bottom: 2px solid var(--p-ligne) !important;
}
.table-dark th, thead.table-dark th, thead.table-success th { background: var(--p-vert) !important; color: #fff !important; }
.table > tbody > tr > td, .data-table td, .tbl td { border-bottom: 1px solid var(--p-ligne-2) !important; }
.table-hover > tbody > tr:hover > *, .data-table tbody tr:hover td, .tbl tbody tr:hover td { background: #F5F9F3 !important; --bs-table-bg-state: #F5F9F3; }
.table-topbar, .tbl-topbar, .tabs-bar, .pagination-custom, .pagination-bar {
  background: #FAFCF9 !important; border-color: var(--p-ligne-2) !important;
}

/* ── 8. Pastilles et badges (.tag des Programmes) ──────────────────── */
.badge, .badge-status, .badge-role, .status-badge, .role-badge {
  border-radius: 99px !important; font-weight: 700 !important; font-size: .76rem !important;
  border: 0 !important; padding: .28em .75em !important; text-transform: none !important; letter-spacing: 0 !important;
}
.badge.bg-success, .badge-approuve, .badge-valide  { background: var(--p-vert-pale) !important; color: var(--p-vert-fonce) !important; }
.badge.bg-warning, .badge-en_attente, .badge-attente { background: var(--p-jaune-pale) !important; color: #6B4F00 !important; }
.badge.bg-danger, .badge-rejete                     { background: var(--p-rouge-pale) !important; color: var(--p-rouge-fonce) !important; }
.badge.bg-primary                                   { background: var(--p-vert) !important; color: #fff !important; }

/* ── 9. Alertes (liseré gauche épais des Programmes) ───────────────── */
.alert { border-radius: var(--p-r-sm) !important; border: 0 !important; border-left: 5px solid transparent !important; font-weight: 500; }
.alert-success { background: var(--p-vert-pale) !important; color: var(--p-vert-fonce) !important; border-left-color: var(--p-vert) !important; }
.alert-danger  { background: var(--p-rouge-pale) !important; color: var(--p-rouge-fonce) !important; border-left-color: var(--p-rouge) !important; }
.alert-warning, .alert-info { background: var(--p-jaune-pale) !important; color: #5E4600 !important; border-left-color: var(--p-jaune) !important; }

/* ── 10. Modales et pagination ─────────────────────────────────────── */
.modal-content { border-radius: var(--p-r-md) !important; }
.modal-header { border-radius: var(--p-r-md) var(--p-r-md) 0 0 !important; }
.modal-header.bg-success, .modal-header.bg-primary, .modal-header.bg-dark { background: var(--p-vert) !important; }
.modal-footer { border-radius: 0 0 var(--p-r-md) var(--p-r-md) !important; background: #FAFCF9 !important; }
.pagination .page-link { border-radius: var(--p-r-sm) !important; border: 1px solid var(--p-ligne) !important; box-shadow: none !important; color: var(--p-encre); }
.pagination .page-item.active .page-link { background: var(--p-vert) !important; border-color: var(--p-vert) !important; color: #fff !important; }

/* ════════════════════════════════════════════════════════════════════
   11. Coquille des tableaux de bord (dashboard*.php)
       Menu latéral vert des Programmes (ordinateur) / barre + tiroir (mobile)
   ════════════════════════════════════════════════════════════════════ */

/* Tiroir = menu latéral vert, à toutes les tailles */
#mobileDrawer {
  background: var(--p-vert) !important;
  color: #D5E7D4;
  border-right: 0 !important;
}
#mobileDrawer .drawer-header {
  flex-direction: column !important; align-items: center !important; justify-content: center !important;
  text-align: center; gap: .45rem; padding: 22px 16px 16px !important;
  background: transparent !important;
  border-top: 6px solid var(--p-jaune);
  border-bottom: 1px solid rgba(255, 255, 255, .12) !important;
  position: relative;
}
/* Ruban tricolore en haut du menu (rouge | jaune | vert), en aplats */
#mobileDrawer .drawer-header::before, #mobileDrawer .drawer-header::after {
  content: ""; position: absolute; top: -6px; bottom: auto !important; height: 6px; width: 33.4% !important;
}
#mobileDrawer .drawer-header::before { left: 0; background: var(--p-rouge) !important; }
#mobileDrawer .drawer-header::after  { right: 0; left: auto; background: #13801F !important; }
#mobileDrawer .drawer-logo { flex-direction: column; gap: .5rem; }
#mobileDrawer .drawer-logo-img {
  width: 76px !important; height: 76px !important; padding: 5px !important;
  background: #fff !important; border-radius: 16px !important; box-shadow: 0 4px 14px rgba(0, 0, 0, .18) !important;
}
#mobileDrawer .drawer-logo-text { align-items: center; }
#mobileDrawer .drawer-logo-text .main { color: #fff !important; font-size: 1.1rem !important; font-weight: 800 !important; }
#mobileDrawer .drawer-logo-text .sub  { color: var(--p-jaune) !important; opacity: 1 !important; font-weight: 600 !important; font-size: .7rem !important; line-height: 1.3; }
#mobileDrawer .drawer-close {
  position: absolute; top: 10px; right: 10px;
  background: rgba(255, 255, 255, .12) !important; color: #fff !important;
}

/* Profil et raccourcis sur fond vert */
#mobileDrawer .drawer-profil {
  background: rgba(255, 255, 255, .08); border: 0; margin: 12px 12px 6px; border-radius: var(--p-r-sm);
}
#mobileDrawer .drawer-profil .avatar { background: var(--p-jaune); color: #0A5424; }
#mobileDrawer .drawer-profil .qui b { color: #fff; }
#mobileDrawer .drawer-profil .qui span { color: #A9C7A8; }
#mobileDrawer .drawer-raccourcis { margin: 6px 12px 8px; }
#mobileDrawer .drawer-raccourcis button {
  background: rgba(255, 255, 255, .08); border: 0; color: #D5E7D4; border-radius: var(--p-r-sm);
}
#mobileDrawer .drawer-raccourcis button .icon { color: var(--p-jaune); }
#mobileDrawer .drawer-raccourcis button:hover { background: rgba(255, 255, 255, .14); color: #fff; }
#mobileDrawer .drawer-raccourcis button.actif { background: rgba(255, 255, 255, .16); color: #fff; box-shadow: inset 0 -3px 0 var(--p-jaune); }
#mobileDrawer .drawer-raccourcis .pastille { background: var(--p-jaune); color: #3B2C00; }

/* Rubriques : titres jaunes en capitales (.nav-titre des Programmes) */
#mobileDrawer .drawer-body { padding: 4px 12px 12px !important; }
#mobileDrawer .drawer-cat { background: transparent !important; border: 0 !important; border-radius: 0 !important; margin: 0 0 2px !important; }
#mobileDrawer .drawer-cat-title {
  background: transparent !important; border: 0 !important;
  color: var(--p-jaune) !important;
  font: 800 .72rem var(--pv-police) !important; letter-spacing: .08em !important; text-transform: uppercase !important;
  padding: 12px 10px 6px !important; min-height: 0;
}
#mobileDrawer .drawer-cat-title > .icon:first-child { display: none; }
#mobileDrawer .drawer-cat-title .cat-caret { color: rgba(255, 255, 255, .5) !important; }
#mobileDrawer .drawer-cat.open > .drawer-cat-title { border-bottom: 0 !important; }
#mobileDrawer .drawer-cat-body { padding: 0 !important; }

/* Liens du menu */
#mobileDrawer .drawer-item {
  color: #D5E7D4 !important; background: transparent !important;
  border: 0 !important; border-radius: var(--p-r-sm) !important;
  padding: 9px 12px !important; min-height: 40px; font-size: .9rem !important; font-weight: 500;
}
#mobileDrawer .drawer-item.indented { padding-left: 24px !important; }
#mobileDrawer .drawer-item .icon.int { color: rgba(255, 255, 255, .45) !important; }
#mobileDrawer .drawer-item .icon.ext { color: var(--p-jaune) !important; }
#mobileDrawer .drawer-item:hover { background: rgba(255, 255, 255, .08) !important; color: #fff !important; }
#mobileDrawer .drawer-item.actif {
  background: rgba(255, 255, 255, .14) !important; color: #fff !important; font-weight: 700;
  box-shadow: inset 4px 0 0 var(--p-jaune) !important;
}
#mobileDrawer .drawer-subgroup-title {
  background: transparent !important; border: 0 !important; color: #fff !important;
  font-size: .84rem !important; font-weight: 700 !important; padding: 8px 12px !important; border-radius: var(--p-r-sm);
}
#mobileDrawer .drawer-subgroup-title:hover { background: rgba(255, 255, 255, .06) !important; }
#mobileDrawer .drawer-subgroup-title .icon { color: var(--p-jaune); }
#mobileDrawer .drawer-subgroup-title .sg-caret { color: rgba(255, 255, 255, .5) !important; }

/* Pied du menu */
#mobileDrawer .drawer-footer { background: transparent !important; border-top: 1px solid rgba(255, 255, 255, .12) !important; padding: 12px !important; }
#mobileDrawer .drawer-logout {
  background: rgba(255, 255, 255, .08) !important; border: 1px solid rgba(255, 255, 255, .22) !important;
  color: #fff !important; border-radius: var(--p-r-sm) !important;
}
#mobileDrawer .drawer-logout:hover { background: var(--p-rouge) !important; border-color: var(--p-rouge) !important; }
#mobileDrawer .drawer-logout#drawerPushButton { border-color: rgba(255, 188, 4, .6) !important; color: var(--p-jaune) !important; }
#mobileDrawer .drawer-logout#drawerPushButton:hover { background: var(--p-jaune) !important; color: #3B2C00 !important; }
#mobileDrawer ::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, .25); }
#mobileDrawer * { scrollbar-color: rgba(255, 255, 255, .3) transparent; }

/* Barre du haut (mobile) : aplat vert Programmes, sans écharpe */
.app-header { background: var(--p-vert) !important; border-bottom: 0 !important; box-shadow: 0 2px 10px rgba(0, 0, 0, .15) !important; }
.app-header::before, .app-header::after { display: none !important; }
.app-header .header-page small { color: var(--p-jaune); opacity: 1; }
.app-header .header-avatar { background: var(--p-jaune) !important; color: #0A5424 !important; }

/* ── Ordinateur : menu horizontal en haut (barre verte Programmes) ─── */
@media (min-width: 993px) {
  .app-header { height: 60px !important; padding: 0 22px !important; }
  .app-header .nav-link-custom { border-radius: var(--p-r-sm) !important; font-weight: 600 !important; }
  .app-header .nav-link-custom:hover, .app-header .nav-link-custom.active { background: rgba(255, 255, 255, .14) !important; }
  .app-header .nav-link-custom.active::after { background: var(--p-jaune) !important; height: 3px; bottom: -11px; }
  .app-header .header-icon-btn { border-radius: var(--p-r-sm) !important; background: rgba(255, 255, 255, .1) !important; border-color: rgba(255, 255, 255, .22) !important; }
  .app-header .header-icon-btn:hover { background: rgba(255, 255, 255, .2) !important; }
  .app-header .logo-img, .app-header .logo-area img { border-radius: 10px !important; }
  /* Menus déroulants : panneaux blancs arrondis des Programmes */
  .dropdown-menu-custom, .submenu-panel { border-radius: var(--p-r-md) !important; border: 0 !important; box-shadow: var(--pv-ombre-2) !important; padding: 6px !important; }
  .dropdown-item-custom { border-radius: var(--p-r-sm) !important; }
  .dropdown-item-custom:hover { background: var(--p-vert-pale) !important; color: var(--p-vert-fonce) !important; }
}

/* ── Mobile : tiroir vert de largeur Programmes ─────────────────────── */
@media (max-width: 992px) {
  #mobileDrawer { width: min(300px, 86vw) !important; }
}

/* ════════════════════════════════════════════════════════════════════
   12. Page de connexion (gabarit .login des Programmes)
   ════════════════════════════════════════════════════════════════════ */
body.login-page { background: var(--p-vert) !important; }
body.login-page .auth-container { border-radius: var(--p-r-md) !important; position: relative; }
/* Ruban tricolore (rouge | jaune | vert) en haut de la carte, en aplats */
body.login-page .auth-container::before {
  content: ""; position: absolute; left: 0; right: 0; top: 0; height: 6px; z-index: 3; box-sizing: border-box;
  background: var(--p-jaune);
  border-left: min(300px, 31vw) solid var(--p-rouge);
  border-right: min(300px, 31vw) solid #13801F;
}
body.login-page .auth-header { background: var(--p-vert-fonce) !important; }
body.login-page .mode-switch { border-radius: var(--p-r-sm) !important; }
body.login-page .mode-btn.active { background: var(--p-vert) !important; color: #fff !important; }
body.login-page .auth-body h2, body.login-page .titles h2 { color: var(--p-vert-fonce) !important; font-weight: 850 !important; }

/* ── 13. Impression : pas de menu ─────────────────────────────────── */
@media print {
  #mobileDrawer, .app-header { display: none !important; }
  .card, .panel, .stat-card, .table-container { box-shadow: none !important; border: 1px solid #ddd !important; }
}

/* ════════════════════════════════════════════════════════════════════
   14. MODE SOMBRE  --  <html data-mode="sombre"> (voir assets/js/pnvb-mode.js)
       Mêmes couleurs du logo, surfaces vert-noir, textes clairs.
   ════════════════════════════════════════════════════════════════════ */
html[data-mode="sombre"] {
  color-scheme: dark;
  --p-fond: #0E1511;  --p-papier: #16201A;  --p-champ: #111A14;
  --p-encre: #E3EBE4; --p-gris: #9DAEA2;
  --p-ligne: #2F3C33; --p-ligne-2: #233029;
  --p-vert-pale: #173522; --p-rouge-pale: #3B1815; --p-jaune-pale: #3A310E;
  --p-vert-fonce: #8BD3A0;   /* titres et chiffres : vert clair lisible */
  --p-ombre: 0 1px 2px rgba(0, 0, 0, .45), 0 12px 30px -14px rgba(0, 0, 0, .75);

  --pv-fond: #0E1511; --pv-surface: #16201A;
  --pv-encre: #E3EBE4; --pv-encre-2: #C9D4CB; --pv-muet: #9DAEA2; --pv-muet-2: #7D8B81;
  --pv-ligne: #233029; --pv-ligne-2: #2F3C33;
  --pv-vert-50: #173522; --pv-vert-100: #1E4229; --pv-or-50: #3A310E; --pv-rouge-50: #3B1815;
  --pv-terre-50: #3B1815; --pv-bleu-50: #173522;
  --pv-ombre-1: var(--p-ombre);
  --pv-ombre-2: 0 2px 4px rgba(0, 0, 0, .5), 0 18px 36px -14px rgba(0, 0, 0, .8);

  /* Bootstrap 5.3 (complète data-bs-theme="dark") */
  --bs-body-bg: #0E1511; --bs-body-color: #E3EBE4; --bs-emphasis-color: #FFFFFF;
  --bs-secondary-color: #9DAEA2; --bs-tertiary-color: #7D8B81;
  --bs-secondary-bg: #16201A; --bs-tertiary-bg: #1B271F;
  --bs-border-color: #2F3C33; --bs-border-color-translucent: rgba(255, 255, 255, .1);
  --bs-link-color: #6CCB8A; --bs-link-hover-color: #9BE0AF; --bs-link-color-rgb: 108, 203, 138;
  --bs-heading-color: #E3EBE4;
}
html[data-mode="sombre"] body { background-color: var(--p-fond) !important; color: var(--p-encre) !important; }
html[data-mode="sombre"] a:not([class]) { color: #6CCB8A; }
html[data-mode="sombre"] a:not([class]):hover { color: #9BE0AF; }
html[data-mode="sombre"] h1, html[data-mode="sombre"] h2, html[data-mode="sombre"] h3,
html[data-mode="sombre"] h4, html[data-mode="sombre"] h5, html[data-mode="sombre"] h6 { color: inherit; }
html[data-mode="sombre"] img { opacity: .96; }

/* Surfaces */
html[data-mode="sombre"] :is(.card, .panel, .filters-card, .filter-card, .table-container, .tbl-container, .chart-card,
  .info-card, .section-card, .content-card, .form-card, .summary-card, .detail-card, .box, .stat-card, .kpi-card,
  .modal-content, .dropdown-menu, .dropdown-menu-custom, .submenu-panel, .list-group-item, .accordion-item,
  .accordion-button, .offcanvas, .toast, .notif-toast, .popover, .item, .empty, .hero-card, .meta div) {
  background-color: var(--p-papier) !important; color: var(--p-encre) !important;
}
html[data-mode="sombre"] :is(.card-header, .card-footer, .modal-header, .modal-footer, .table-topbar, .tbl-topbar,
  .tabs-bar, .pagination-custom, .pagination-bar, .filters-bar) {
  background-color: #1B271F !important; color: var(--p-encre) !important; border-color: var(--p-ligne-2) !important;
}
/* En-têtes colorés : on garde leur couleur (texte blanc) */
html[data-mode="sombre"] :is(.modal-header.green, .modal-header.bg-success, .modal-header.bg-primary, .modal-header.bg-dark,
  .card-header.bg-success, .card-header.bg-primary, .card-header.bg-dark, .page-header, .topbar, .detail-card-header) {
  background-color: var(--p-vert) !important; color: #fff !important;
}
html[data-mode="sombre"] :is(.modal-header.gold, .modal-header.hdr-warning) { background-color: #8A6A00 !important; color: #fff !important; }

/* Fonds blancs ou très clairs écrits en dur dans les pages */
html[data-mode="sombre"] :is([style*="background:white"], [style*="background: white"], [style*="background:#fff"],
  [style*="background: #fff"], [style*="background:#FFF"], [style*="background: #FFF"],
  [style*="background-color:#fff"], [style*="background-color: #fff"],
  [style*="background-color:white"], [style*="background:#F7F9F7"], [style*="background:#f7f9f7"],
  [style*="background:#F8FAF8"], [style*="background:#FAFBF9"], [style*="background:#f8fffe"]) {
  background-color: var(--p-papier) !important;
}
html[data-mode="sombre"] :is([style*="background:#F4F6F3"], [style*="background:#F0F3F0"], [style*="background: #F4F6F3"],
  [style*="background:#EEF6EF"], [style*="background:#E8F3EA"], [style*="background:#DCEEDF"]) {
  background-color: #1B271F !important;
}
/* Textes sombres écrits en dur */
html[data-mode="sombre"] :is([style*="color:#15211A"], [style*="color: #15211A"], [style*="color:#1C2B23"], [style*="color:#15211a"],
  [style*="color:#34443B"], [style*="color:#111"], [style*="color:#333"], [style*="color:#222"], [style*="color:#000"],
  [style*="color: #1C2B23"], [style*="color:#1f2937"], [style*="color:#374151"]) {
  color: var(--p-encre) !important;
}
html[data-mode="sombre"] :is([style*="color:#4A5A51"], [style*="color:#5E6B63"], [style*="color:#8C9890"], [style*="color: #5E6B63"],
  [style*="color:#6b7280"], [style*="color:#666"], [style*="color:#555"], [style*="color:#888"]) {
  color: var(--p-gris) !important;
}

/* Tailwind (statistiques, erreurs, contrats, codes d'accès…) */
html[data-mode="sombre"] :is(.bg-white, .bg-gray-50, .bg-slate-50, .bg-zinc-50, .bg-neutral-50, .bg-stone-50) { background-color: var(--p-papier) !important; }
html[data-mode="sombre"] :is(.bg-gray-100, .bg-slate-100, .bg-gray-200, .bg-slate-200, .hover\:bg-gray-50:hover, .hover\:bg-slate-50:hover,
  .hover\:bg-gray-100:hover, .hover\:bg-slate-100:hover) { background-color: #1B271F !important; }
html[data-mode="sombre"] :is(.text-gray-900, .text-gray-800, .text-gray-700, .text-slate-900, .text-slate-800, .text-slate-700,
  .text-black, .text-dark, .text-body) { color: var(--p-encre) !important; }
html[data-mode="sombre"] :is(.text-gray-600, .text-gray-500, .text-gray-400, .text-slate-600, .text-slate-500, .text-slate-400,
  .text-muted, .text-secondary, .text-body-secondary) { color: var(--p-gris) !important; }
html[data-mode="sombre"] :is(.border, .border-gray-100, .border-gray-200, .border-gray-300, .border-slate-100, .border-slate-200,
  .border-slate-300, .divide-y > *, .divide-gray-100 > *, .divide-gray-200 > *, .divide-slate-100 > *) { border-color: var(--p-ligne-2) !important; }
html[data-mode="sombre"] :is(.bg-emerald-50, .bg-green-50, .bg-emerald-100, .bg-green-100, .bg-blue-50, .bg-blue-100) { background-color: var(--p-vert-pale) !important; }
html[data-mode="sombre"] :is(.bg-amber-50, .bg-yellow-50, .bg-amber-100, .bg-yellow-100) { background-color: var(--p-jaune-pale) !important; }
html[data-mode="sombre"] :is(.bg-red-50, .bg-rose-50, .bg-red-100, .bg-rose-100, .bg-indigo-50, .bg-indigo-100, .bg-violet-100, .bg-purple-100) { background-color: var(--p-rouge-pale) !important; }
html[data-mode="sombre"] :is(.text-emerald-700, .text-emerald-800, .text-green-700, .text-green-800, .text-success) { color: #8BD3A0 !important; }
html[data-mode="sombre"] :is(.text-amber-700, .text-amber-800, .text-yellow-700, .text-yellow-800) { color: #F2CF6B !important; }
html[data-mode="sombre"] :is(.text-red-700, .text-red-800, .text-rose-700) { color: #F3A29C !important; }
html[data-mode="sombre"] .bg-light { background-color: #1B271F !important; }

/* Tableaux */
html[data-mode="sombre"] .table { --bs-table-bg: transparent; --bs-table-color: var(--p-encre); --bs-table-border-color: var(--p-ligne-2);
  --bs-table-striped-bg: rgba(255, 255, 255, .025); --bs-table-hover-bg: rgba(255, 255, 255, .05); color: var(--p-encre); }
html[data-mode="sombre"] :is(table th, .table > thead > tr > th, .table thead th, .data-table th, .tbl th) {
  background: #1B271F !important; color: var(--p-gris) !important; border-bottom-color: var(--p-ligne) !important;
}
html[data-mode="sombre"] :is(.data-table td, .tbl td, .table > tbody > tr > td, table td) {
  background-color: transparent !important; color: inherit; border-color: var(--p-ligne-2) !important;
}
html[data-mode="sombre"] :is(.table-hover > tbody > tr:hover > *, .data-table tbody tr:hover td, .tbl tbody tr:hover td, tbody tr:hover > td) {
  background-color: rgba(255, 255, 255, .045) !important;
}
html[data-mode="sombre"] tr.selected td, html[data-mode="sombre"] tr.table-active td { background-color: var(--p-vert-pale) !important; }

/* Champs */
html[data-mode="sombre"] :is(.form-control, .form-select, input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]),
  select, textarea, .input-group-text) {
  background-color: var(--p-champ) !important; color: var(--p-encre) !important; border-color: var(--p-ligne) !important;
}
html[data-mode="sombre"] :is(.form-control, input, textarea)::placeholder { color: #6F7D73 !important; }
html[data-mode="sombre"] :is(.form-control:disabled, .form-control[readonly], input[readonly]) { background-color: #1B271F !important; color: var(--p-gris) !important; }
html[data-mode="sombre"] select:not([multiple]):not([size]) { color-scheme: dark; }
html[data-mode="sombre"] :is(.form-label, label) { color: var(--p-encre); }

/* Boutons neutres */
html[data-mode="sombre"] :is(.btn-secondary, .btn-light, .btn-outline-secondary, .btn-outline-dark, .btn-act, .action-btn, .btn-action) {
  --bs-btn-bg: #1B271F; --bs-btn-color: var(--p-encre); --bs-btn-border-color: var(--p-ligne);
  --bs-btn-hover-bg: #223027; --bs-btn-hover-color: #fff; --bs-btn-hover-border-color: #6CCB8A;
  background-color: #1B271F; color: var(--p-encre); border-color: var(--p-ligne) !important;
}
html[data-mode="sombre"] .tab-btn:not(.active) { background: #1B271F !important; color: var(--p-gris) !important; }
html[data-mode="sombre"] .btn-close { filter: invert(1) grayscale(1) brightness(1.8); }

/* Pastilles, alertes, code */
html[data-mode="sombre"] :is(.badge.bg-success, .badge-approuve, .badge-valide, .badge-role) { color: #8BD3A0 !important; background: var(--p-vert-pale) !important; }
html[data-mode="sombre"] :is(.badge.bg-warning, .badge-en_attente, .badge-attente) { color: #F2CF6B !important; background: var(--p-jaune-pale) !important; }
html[data-mode="sombre"] :is(.badge.bg-danger, .badge-rejete) { color: #F3A29C !important; background: var(--p-rouge-pale) !important; }
html[data-mode="sombre"] .badge.bg-secondary { background: #243029 !important; color: var(--p-encre) !important; }
html[data-mode="sombre"] .alert-success { color: #A6E0B8 !important; }
html[data-mode="sombre"] :is(.alert-warning, .alert-info) { color: #F2D98A !important; }
html[data-mode="sombre"] .alert-danger { color: #F6B7B2 !important; }
html[data-mode="sombre"] :is(code, kbd) { background: var(--p-rouge-pale); color: #F3A29C; }

/* Pagination, onglets, barres de progression */
html[data-mode="sombre"] .pagination .page-link { background: #1B271F !important; color: var(--p-encre) !important; border-color: var(--p-ligne) !important; }
html[data-mode="sombre"] .pagination .page-item.active .page-link { background: var(--p-vert) !important; color: #fff !important; }
html[data-mode="sombre"] .nav-tabs .nav-link.active { color: #8BD3A0; }
html[data-mode="sombre"] .progress { background: #243029; }

/* Coquille des tableaux de bord */
html[data-mode="sombre"] #mobileDrawer { background: #0B3F1D !important; }
html[data-mode="sombre"] .app-header { background: #0B3F1D !important; }
html[data-mode="sombre"] #drawerBackdrop { background: rgba(0, 0, 0, .65) !important; }
html[data-mode="sombre"] .content-frame, html[data-mode="sombre"] #mainFrame { background: var(--p-fond) !important; color-scheme: dark; }
@media (min-width: 993px) {
  html[data-mode="sombre"] .app-header .nav-link-custom.active::after { background: var(--p-jaune) !important; }
  html[data-mode="sombre"] .dropdown-item-custom:hover { background: #1E4229 !important; color: #fff !important; }
}

/* Page de connexion */
html[data-mode="sombre"] body.login-page { background: #0B3F1D !important; }
html[data-mode="sombre"] body.login-page .auth-container, html[data-mode="sombre"] body.login-page .auth-body { background: var(--p-papier) !important; color: var(--p-encre); }
html[data-mode="sombre"] body.login-page .mode-switch { background: #1B271F !important; }
html[data-mode="sombre"] body.login-page .mode-btn:not(.active) { color: var(--p-gris) !important; }
html[data-mode="sombre"] body.login-page .info-box { background: #1B271F !important; color: var(--p-encre) !important; }

/* Barres de défilement */
html[data-mode="sombre"] * { scrollbar-color: #3A4A3F transparent; }
html[data-mode="sombre"] *::-webkit-scrollbar-thumb { background-color: #3A4A3F; }

/* Bouton de mode d'affichage */
[data-pnvb-mode-toggle] { display: inline-flex; align-items: center; justify-content: center; gap: 8px; cursor: pointer; }
[data-pnvb-mode-toggle] svg { flex: none; }
.pv-mode-choix { display: inline-flex; gap: 4px; padding: 4px; border-radius: 10px; background: var(--p-fond); border: 1px solid var(--p-ligne-2); }
.pv-mode-choix button { border: 0; background: transparent; color: var(--p-gris); font: 600 .84rem var(--pv-police); padding: 8px 14px; border-radius: 7px; cursor: pointer; }
.pv-mode-choix button:hover { background: var(--p-vert-pale); color: var(--p-encre); }
.pv-mode-choix button.actif, .pv-mode-choix button.actif:hover { background: var(--p-vert); color: #fff; }
html[data-mode="sombre"] :is(.pushbox, .topnav a, .logoutbox button, .pushbox button.off) { background: #1B271F !important; border-color: var(--p-ligne) !important; color: var(--p-encre) !important; }
html[data-mode="sombre"] .pushbox.pv-mode-box { background: var(--p-papier) !important; }

/* Impression : toujours en clair */
@media print {
  html[data-mode="sombre"] body, html[data-mode="sombre"] :is(.card, .panel, table td, table th) { background: #fff !important; color: #000 !important; }
}

/* ════════════════════════════════════════════════════════════════════
   15. Contrôle de la liste numérique Excel (formulaires de soumission)
   ════════════════════════════════════════════════════════════════════ */
.verif-liste { margin: 8px 0 4px; padding: 10px 12px; border-radius: var(--p-r-sm); border-left: 5px solid var(--p-ligne); font-size: .86rem; line-height: 1.45; background: var(--p-fond); color: var(--p-encre); }
.verif-liste small { display: block; margin-top: 6px; color: var(--p-gris); }
.verif-liste.ok { background: var(--p-vert-pale); border-left-color: var(--p-vert); color: var(--p-vert-fonce); }
.verif-liste.ko { background: var(--p-rouge-pale); border-left-color: var(--p-rouge); color: var(--p-rouge-fonce, #A50F08); }
.verif-liste.attention { background: var(--p-jaune-pale); border-left-color: var(--p-jaune); color: #5E4600; }
.verif-liste.encours { display: flex; align-items: center; gap: 8px; }
.verif-roue { width: 16px; height: 16px; border: 2px solid var(--p-ligne); border-top-color: var(--p-vert); border-radius: 50%; animation: verifTourne .8s linear infinite; flex: none; }
@keyframes verifTourne { to { transform: rotate(360deg); } }
.verif-liste-resume { display: flex; flex-wrap: wrap; gap: 6px; margin: 8px 0; }
.verif-liste-resume span { background: var(--p-papier); border: 1px solid #f3c3c0; color: var(--p-rouge-fonce, #A50F08); border-radius: 99px; padding: 2px 10px; font-weight: 700; font-size: .78rem; }
.verif-liste-table { max-height: 280px; overflow: auto; background: var(--p-papier); border-radius: 6px; border: 1px solid var(--p-ligne-2); }
.verif-liste-table table { width: 100%; border-collapse: collapse; font-size: .8rem; color: var(--p-encre); }
.verif-liste-table th { position: sticky; top: 0; z-index: 1; text-align: left; padding: 6px 8px !important; }
.verif-liste-table td { padding: 5px 8px; border-bottom: 1px solid var(--p-ligne-2); vertical-align: top; }
.verif-liste-table td:first-child { font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.file-upload.liste-ko { border-color: var(--p-rouge) !important; background: var(--p-rouge-pale) !important; }
.file-upload.liste-ok { border-color: var(--p-vert) !important; }
html[data-mode="sombre"] .verif-liste.ok { color: #A6E0B8; }
html[data-mode="sombre"] .verif-liste.ko { color: #F6B7B2; }
html[data-mode="sombre"] .verif-liste.attention { color: #F2D98A; }
html[data-mode="sombre"] .verif-liste-resume span { border-color: #6B2A25; color: #F6B7B2; }
/* Barre de progression du contrôle, lien de téléchargement, champs numériques */
.verif-liste.encours { display: block; }
.verif-progress-tete { display: flex; justify-content: space-between; gap: 10px; margin-bottom: 6px; font-weight: 600; }
.verif-progress-tete b { font-variant-numeric: tabular-nums; color: var(--p-vert-fonce); }
.verif-progress { height: 10px; border-radius: 99px; background: var(--p-ligne-2); overflow: hidden; }
.verif-progress i { display: block; height: 100%; width: 0; background: var(--p-vert); border-radius: 99px; transition: width .25s ease; }
.verif-liste-dl { display: inline-flex; align-items: center; gap: 6px; margin: 8px 0 2px; padding: 7px 14px; border-radius: var(--p-r-sm);
  background: var(--p-rouge); color: #fff !important; font-weight: 700; text-decoration: none !important; }
.verif-liste-dl::before { content: "⬇"; }
.verif-liste-dl:hover { background: #A50F08; }
.chiffres-aide { display: block; min-height: 1em; margin-top: 4px; color: var(--p-rouge); font-weight: 600; font-size: .8rem; }
.form-control.chiffres-refus { border-color: var(--p-rouge) !important; box-shadow: 0 0 0 3px rgba(212, 20, 11, .15) !important; }

/* Correction d'une soumission : informations générales en lecture seule */
.corr-infos { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 8px; margin: 0; }
.corr-infos > div { background: var(--p-fond); border: 1px solid var(--p-ligne-2); border-radius: var(--p-r-sm); padding: 8px 12px; }
.corr-infos dt { font-size: .72rem; font-weight: 700; color: var(--p-gris); text-transform: uppercase; letter-spacing: .04em; margin: 0 0 2px; }
.corr-infos dd { margin: 0; font-weight: 700; color: var(--p-encre); word-break: break-word; }
.file-slot.liste-ko { border-color: var(--p-rouge) !important; background: var(--p-rouge-pale) !important; }
.file-slot.liste-ok { border-color: var(--p-vert) !important; }
#corr_fichiers_row + .verif-liste { margin: -10px 0 18px; }

/* ════════════════════════════════════════════════════════════════════
   Sous-menus d'un sous-menu (includes/menu_groupes.php) : ex. Service Placement › Décisions et mandats, Assurance,
   Suivi des volontaires -- chacun s'ouvre sur ses entrées (à côté sur ordinateur, en accordéon dans le tiroir mobile)
   ════════════════════════════════════════════════════════════════════ */
.menu-sous-groupe > .dropdown-item-custom { font-weight: 600; }
.menu-sous-groupe > .dropdown-item-custom .menu-sg-nom { flex: 1; }
.menu-sg-nb { min-width: 20px; padding: 0 6px; border-radius: 99px; background: #E8F3EA; color: #0A5626; font-size: .7rem; font-weight: 800; text-align: center; line-height: 18px; }
.menu-sous-groupe > .dropdown-item-custom .submenu-arrow { margin-left: 2px !important; }
.menu-sous-groupe.sub-open > .dropdown-item-custom, .menu-sous-groupe:hover > .dropdown-item-custom { background: var(--p-vert-pale, #E8F3EA); color: var(--p-vert-fonce, #0A5626); }
html[data-mode="sombre"] .menu-sg-nb { background: #1E4229; color: #CDE7D2; }
html[data-mode="sombre"] .menu-sous-groupe.sub-open > .dropdown-item-custom, html[data-mode="sombre"] .menu-sous-groupe:hover > .dropdown-item-custom { background: #1E4229; color: #fff; }

/* Tiroir mobile */
.drawer-sg2-titre { display: flex; align-items: center; gap: .55rem; padding: .55rem .9rem .55rem 1.9rem; font-size: .84rem; font-weight: 600; cursor: pointer; user-select: none; min-height: 42px; }
.drawer-sg2-titre span { flex: 1; }
.drawer-sg2-nb { min-width: 20px; padding: 0 6px; border-radius: 99px; font-size: .68rem; text-align: center; line-height: 18px; background: #E8F3EA; color: #0A5626; }
.drawer-sg2-titre .sg-caret { font-size: .7rem; transition: transform .2s; }
.drawer-sg2-titre.open .sg-caret { transform: rotate(90deg); }
.drawer-sg2-items { display: none; margin: 0 0 4px 1.9rem; border-left: 2px solid #CFE5D3; }
.drawer-sg2-items.open { display: block; animation: sg2-ouvre .18s ease-out; }
.drawer-sg2-items .drawer-item.indented { padding-left: 14px !important; min-height: 40px; }
@keyframes sg2-ouvre { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
#mobileDrawer .drawer-sg2-titre { color: #EAF4EC; }
#mobileDrawer .drawer-sg2-titre:hover { background: rgba(255, 255, 255, .06); }
#mobileDrawer .drawer-sg2-titre .icon { color: var(--p-jaune, #FFBC04); }
#mobileDrawer .drawer-sg2-titre .sg-caret { color: rgba(255, 255, 255, .5); }
#mobileDrawer .drawer-sg2-nb { background: rgba(255, 255, 255, .14); color: #fff; }
#mobileDrawer .drawer-sg2-items { border-left-color: rgba(255, 188, 4, .55); }
@media (prefers-reduced-motion: reduce) { .drawer-sg2-items.open { animation: none; } }