/* ==========================================================================
   EasyOpto — Calque de thème global (Design System) pour l'admin "Pages".
   --------------------------------------------------------------------------
   Chargé APRÈS le thème, scopé sous body.eo-themed. Principe : RESKIN, pas de
   relayout — on ne touche qu'aux couleurs, typographies, bordures, rayons,
   ombres et états. Aucune propriété de positionnement (position/float/width)
   n'est modifiée, donc la mise en page du thème reste intacte.
   Police Nunito chargée via <link> dans le header. Réversible (retirer le lien).
   ========================================================================== */

body.eo-themed{
  --eo:#4f8eaa; --eo-dark:#2c5b75; --eo-deep:#1f4254; --eo-light:#8fb8c9;
  --eo-tint:#e3eef3; --eo-wash:#f4f8fa;
  --ao:#8c8cc4; --ea:#9cc5a5;
  --ink:#1a2730; --fg2:#3c4a55; --fg3:#6b7a85; --fg4:#9aa6ae;
  --bg2:#f3f7f9; --surface:#ffffff; --border:#e2eaee; --border2:#c8d4da;
  --success:#4a9f6f; --warning:#d99846; --danger:#c14e4e;
  --r1:8px; --r2:10px; --r3:14px; --rpill:999px;
  --sh1:0 1px 2px rgba(28,50,68,.06),0 1px 3px rgba(28,50,68,.05);
  --sh2:0 4px 14px rgba(28,50,68,.08),0 2px 5px rgba(28,50,68,.05);
  --font-d:'Nunito','Nunito Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-b:'Nunito Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  font-family:var(--font-b);
  color:var(--ink);
  background:var(--bg2) !important;
  -webkit-font-smoothing:antialiased;
}
body.eo-themed .page-container,
body.eo-themed .content,
body.eo-themed .page-content-wrapper{ background:transparent !important; }

/* ---- Typographie ---- */
body.eo-themed h1, body.eo-themed h2, body.eo-themed h3,
body.eo-themed h4, body.eo-themed h5, body.eo-themed .bold{ font-family:var(--font-d); color:var(--ink); }
body.eo-themed a{ color:var(--eo-dark); }
body.eo-themed a:hover{ color:var(--eo-deep); }

/* ==========================================================================
   Bandeau du haut (.header)
   ========================================================================== */
body.eo-themed .header{
  background:var(--surface) !important;
  box-shadow:inset 0 -1px 0 var(--border) !important;
  border:0 !important;
}
body.eo-themed .header .user-infos-name{ font-family:var(--font-d); font-weight:700; color:var(--ink); }
/* Logos de marque alignés à gauche (au lieu de centrés). On garde la largeur du
   bloc (pour ne pas décaler le bloc utilisateur à droite) et on aligne à gauche. */
body.eo-themed .header .brand{ text-align:left !important; }
body.eo-themed .navbar-avatar img{ border-radius:50%; box-shadow:0 0 0 2px var(--eo-tint); }
body.eo-themed .profile-dropdown.dropdown-menu{
  border:1px solid var(--border) !important; border-radius:var(--r2) !important;
  box-shadow:var(--sh2) !important; padding:6px !important;
}
body.eo-themed .profile-dropdown .dropdown-item{ border-radius:var(--r1); color:var(--fg2); font-weight:600; padding:9px 12px; }
body.eo-themed .profile-dropdown .dropdown-item:hover{ background:var(--eo-wash); color:var(--eo-deep); }

/* ==========================================================================
   Barre latérale (.page-sidebar) — REFONTE thème-adaptative (style "CodingLab").
   Blanche en clair / sombre en sombre. Icône À GAUCHE + label, pilule active
   bleu EasyOpto. On surcharge le template "Pages" en CSS uniquement (sa
   mécanique JS — accordéon des sous-menus — reste intacte).
   Desktop : repli en RAIL icônes-seules (html[data-eo-rail="1"], bloc plus bas) —
   le texte est masqué, les icônes restent visibles ("minimaliste mais explicite").
   Mobile (<=991px) : la barre est un overlay ouvert/fermé (body.menu-pin).
   ========================================================================== */
/* ---- Variables sidebar (LIGHT par défaut) ---- */
body.eo-themed .page-sidebar{
  --sb-bg:#ffffff; --sb-fg:#5b6b76; --sb-strong:#16242c; --sb-muted:#9aa6ae;
  --sb-hover:#eef3f6; --sb-active:#2c5b75; --sb-active-fg:#ffffff;
  --sb-border:#e8edf1; --sb-icon:#6b7a85; --sb-scroll:#cdd9df;
  background:var(--sb-bg) !important;
  box-shadow:inset -1px 0 0 var(--sb-border) !important;
}
html[data-theme="dark"] body.eo-themed .page-sidebar{
  --sb-bg:#101e26; --sb-fg:#9fb0b9; --sb-strong:#eef4f7; --sb-muted:#74858f;
  --sb-hover:#1b2c35; --sb-active:#3f7fa0; --sb-active-fg:#ffffff;
  --sb-border:#223139; --sb-icon:#9fb0b9; --sb-scroll:#2a3b45;
}

/* ---- Header / marque (carré arrondi dégradé + nom + sous-titre) ---- */
body.eo-themed .page-sidebar .sidebar-header{
  height:auto !important; line-height:normal !important; padding:16px 14px !important;
  background:transparent !important; border-bottom:0 !important;
  color:var(--sb-strong) !important;
  display:flex !important; align-items:center; justify-content:space-between; gap:8px;
}
body.eo-themed .page-sidebar .sidebar-header img[src=""]{ display:none !important; }
body.eo-themed .eo-side-brand{ display:flex !important; align-items:center; gap:12px; min-width:0; text-decoration:none; }
body.eo-themed .eo-side-monogram{
  width:42px; height:42px; border-radius:13px; flex:0 0 auto;
  display:inline-flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,#2c5b75,#4f8eaa); color:#fff !important;
  font-family:var(--font-d); font-weight:800; font-size:15px; letter-spacing:.03em;
}
body.eo-themed .eo-side-word{
  display:flex !important; flex-direction:column; line-height:1.15; min-width:0;
  color:var(--sb-strong) !important; font-family:var(--font-d); font-weight:800; font-size:16px;
}
body.eo-themed .eo-side-word small{ font-weight:600; font-size:11px; color:var(--sb-muted) !important; letter-spacing:.05em; }
/* Bouton replier (dans la sidebar) — rond, discret */
body.eo-themed .sidebar-header-controls{ transform:none !important; }
body.eo-themed .sidebar-header-controls .btn{
  width:30px; height:30px; padding:0; border-radius:50%; min-height:0; line-height:1;
  display:inline-flex; align-items:center; justify-content:center;
  background:var(--sb-hover) !important; color:var(--sb-fg) !important; border:1px solid var(--sb-border) !important;
}
body.eo-themed .sidebar-header-controls .btn:hover{ background:var(--sb-active) !important; color:#fff !important; border-color:transparent !important; }

/* ==========================================================================
   MENU REFONDU — markup propre .eo-nav-* (plus de .menu-items du template).
   État actif via .is-active (page courante) ; accordéon maison via .is-open.
   Layout : marque fixe en haut + menu qui remplit et scrolle (natif, fin).
   ========================================================================== */
body.eo-themed .page-sidebar{ display:flex !important; flex-direction:column; }
body.eo-themed .page-sidebar .sidebar-header{ flex:0 0 auto; }
body.eo-themed .page-sidebar .sidebar-menu{
  flex:1 1 auto; min-height:0; height:auto !important; width:100%;
  overflow-y:auto; overflow-x:hidden;
  scrollbar-width:thin; scrollbar-color:var(--sb-scroll) transparent;
}
body.eo-themed .page-sidebar .sidebar-menu::-webkit-scrollbar{ width:6px; }
body.eo-themed .page-sidebar .sidebar-menu::-webkit-scrollbar-track{ background:transparent; }
body.eo-themed .page-sidebar .sidebar-menu::-webkit-scrollbar-thumb{ background:var(--sb-scroll); border-radius:999px; }
body.eo-themed .page-sidebar .sidebar-menu::-webkit-scrollbar-thumb:hover{ background:var(--sb-muted); }

body.eo-themed .eo-nav{ display:flex; flex-direction:column; gap:3px; padding:10px 12px 18px; margin:0; list-style:none; }
/* Item (lien plat OU bouton de groupe) */
body.eo-themed .eo-nav-item{
  display:flex; align-items:center; gap:13px; width:100%; box-sizing:border-box;
  padding:11px 13px; border-radius:11px; border:0; background:transparent; cursor:pointer;
  color:var(--sb-fg); font-family:var(--font-d); font-weight:600; font-size:14px; line-height:1.2; text-align:left;
  text-decoration:none; transition:background .15s, color .15s;
}
body.eo-themed .eo-nav-item:hover{ background:var(--sb-hover); color:var(--sb-strong); }
body.eo-themed .eo-nav-ic{ flex:0 0 22px; width:22px; display:inline-flex; align-items:center; justify-content:center; font-size:16px; color:var(--sb-icon); }
body.eo-themed .eo-nav-item:hover .eo-nav-ic{ color:var(--sb-strong); }
body.eo-themed .eo-nav-tx{ flex:1 1 auto; min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
/* Item ACTIF (page courante) = pilule pleine bleu EasyOpto */
body.eo-themed .eo-nav-item.is-active{ background:var(--sb-active); color:var(--sb-active-fg); font-weight:800; }
body.eo-themed .eo-nav-item.is-active .eo-nav-ic{ color:var(--sb-active-fg); }
/* Groupe + chevron (pointe à droite, tourne vers le bas quand ouvert) */
body.eo-themed .eo-nav-group{ display:flex; flex-direction:column; }
body.eo-themed .eo-nav-arrow{ flex:0 0 auto; display:inline-flex; align-items:center; color:var(--sb-muted); transition:transform .22s ease; }
body.eo-themed .eo-nav-group.is-open > .eo-nav-parent .eo-nav-arrow{ transform:rotate(90deg); }
body.eo-themed .eo-nav-group.is-open > .eo-nav-parent{ color:var(--sb-strong); }
body.eo-themed .eo-nav-group.is-open > .eo-nav-parent .eo-nav-ic{ color:var(--sb-strong); }
/* Panneau de sous-menu : animation de hauteur (grid 0fr -> 1fr) */
body.eo-themed .eo-nav-sub{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .22s ease; }
body.eo-themed .eo-nav-group.is-open > .eo-nav-sub{ grid-template-rows:1fr; }
body.eo-themed .eo-nav-sub-in{ overflow:hidden; display:flex; flex-direction:column; gap:2px; padding-top:2px; }
/* Sous-item */
body.eo-themed .eo-nav-subitem{
  display:flex; align-items:center; gap:11px; box-sizing:border-box;
  margin-left:16px; padding:9px 13px; border-radius:9px;
  color:var(--sb-fg); font-family:var(--font-d); font-weight:600; font-size:13px; text-decoration:none;
  transition:background .15s, color .15s;
}
body.eo-themed .eo-nav-subitem:hover{ background:var(--sb-hover); color:var(--sb-strong); }
body.eo-themed .eo-nav-subitem .eo-nav-ic{ flex:0 0 20px; width:20px; font-size:14px; color:var(--sb-muted); }
body.eo-themed .eo-nav-subitem:hover .eo-nav-ic{ color:var(--sb-strong); }
/* Sous-item ACTIF : fond léger + accent bleu (bien visible) */
body.eo-themed .eo-nav-subitem.is-active{ background:var(--sb-hover); color:var(--sb-active); font-weight:800; }
body.eo-themed .eo-nav-subitem.is-active .eo-nav-ic{ color:var(--sb-active); }
html[data-theme="dark"] body.eo-themed .eo-nav-subitem.is-active{ color:#8fc4dd; }
html[data-theme="dark"] body.eo-themed .eo-nav-subitem.is-active .eo-nav-ic{ color:#8fc4dd; }

/* ==========================================================================
   REPLI EN RAIL (desktop >=992px) — barre minimaliste icônes-seules.
   Piloté par html[data-eo-rail="1"] (mémorisé, sans flash). Le texte (.eo-nav-tx),
   les chevrons (.eo-nav-arrow) et le mot-symbole (.eo-side-word) sont masqués ;
   les icônes + le monogramme restent visibles ("toujours explicite"). Un clic sur
   un groupe sort du rail (JS) pour afficher les sous-menus ; le title= des items
   sert d'info-bulle au survol. Mobile : la barre reste un overlay (menu-pin, plus bas).
   ========================================================================== */
@media (min-width:992px){
  html[data-eo-rail="1"] body.eo-themed .page-sidebar{ width:76px !important; }
  html[data-eo-rail="1"] body.eo-themed .page-container{ padding-left:76px !important; }
  /* Masquer libellés / chevrons / mot-symbole — garder icônes + monogramme */
  html[data-eo-rail="1"] body.eo-themed .eo-nav-tx,
  html[data-eo-rail="1"] body.eo-themed .eo-nav-arrow,
  html[data-eo-rail="1"] body.eo-themed .eo-side-word{ display:none !important; }
  /* Centrer le contenu de chaque item + l'en-tête de marque */
  html[data-eo-rail="1"] body.eo-themed .eo-nav{ padding-left:9px; padding-right:9px; }
  html[data-eo-rail="1"] body.eo-themed .eo-nav-item{ justify-content:center; gap:0; padding-left:0; padding-right:0; }
  html[data-eo-rail="1"] body.eo-themed .eo-side-brand,
  html[data-eo-rail="1"] body.eo-themed .sidebar-header{ justify-content:center; }
  /* En rail : masquer le bouton replier interne (on déplie via le bouton du bandeau) */
  html[data-eo-rail="1"] body.eo-themed .sidebar-header-controls{ display:none !important; }
  /* Sous-menus repliés masqués (pas de place) : un clic sur un groupe sort du rail */
  html[data-eo-rail="1"] body.eo-themed .eo-nav-sub{ display:none !important; }
  html[data-eo-rail="1"] body.eo-themed .eo-nav-item.is-active .eo-nav-ic{ color:var(--sb-active-fg); }
}

/* Bouton d'ouverture/fermeture dans le bandeau (toujours visible) */
body.eo-themed .eo-sidebar-toggle{
  display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px;
  margin-right:8px; border-radius:10px; border:1px solid var(--border); background:var(--bg2);
  color:var(--fg3); cursor:pointer; transition:background .15s,color .15s;
}
body.eo-themed .eo-sidebar-toggle:hover{ background:var(--eo-tint); color:var(--eo-dark); }
html[data-theme="dark"] body.eo-themed .eo-sidebar-toggle{ background:#22333c; border-color:#2a3b45; color:#cfe0e8; }

/* ---- Bouton de marque mobile (remplace l'ancien hamburger ☰) : ouvre l'overlay ----
   Monogramme EO en dégradé, cohérent avec celui de la barre latérale. Comme les 3
   logos du bandeau sont masqués sur mobile, ce bouton donne aussi une présence de marque. */
body.eo-themed .eo-mobile-brand{
  display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:40px; margin:0 6px 0 2px; padding:0; vertical-align:middle;
  text-decoration:none; -webkit-tap-highlight-color:transparent;
}
body.eo-themed .eo-mobile-mono{
  display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px;
  border-radius:11px; background:linear-gradient(135deg,#2c5b75,#4f8eaa); color:#fff;
  font-family:var(--font-d); font-weight:800; font-size:14px; letter-spacing:.03em; line-height:1;
}
body.eo-themed .eo-mobile-brand:active .eo-mobile-mono{ filter:brightness(.94); }

/* (Ancien bloc « marque/toggle » de la sidebar toujours-foncée RETIRÉ : il forçait
   le header en #11252e, le mot en blanc fixe et un monogramme 34px — tout cela est
   désormais géré, de façon thème-adaptative, par la refonte ci-dessus. Les règles
   [data-toggle-pin] sont également mortes : les boutons sont recâblés sur le toggle
   pur-DOM eoToggleSidebar(). Icône du bouton interne fournie en SVG dans la vue.) */

/* ==========================================================================
   Icônes DS inline (.eods …) — taille forcée : le thème "Pages" applique une
   règle sur svg qui gonfle les icônes. Haute spécificité (body.eo-themed) +
   !important pour gagner à coup sûr. N'affecte PAS les graphiques svg hors .eods.
   ========================================================================== */
body.eo-themed .eods svg{ width:16px !important; height:16px !important; flex:0 0 auto; }
body.eo-themed .eods-ct svg{ width:14px !important; height:14px !important; }
body.eo-themed .eods-btn-edit svg{ width:14px !important; height:14px !important; }
body.eo-themed .eods-ctrl svg{ width:15px !important; height:15px !important; }

/* ==========================================================================
   En-tête de page (.jumbotron) + fil d'ariane utilisé comme titre
   ========================================================================== */
body.eo-themed .jumbotron{
  background:transparent !important; background-image:none !important;
  min-height:0 !important; padding:18px 0 6px !important; margin:0 !important;
}
body.eo-themed .breadcrumb{ background:transparent !important; padding:0 !important; margin:0 0 4px !important; list-style:none !important; }
body.eo-themed .breadcrumb .breadcrumb-item{ font-size:14px; color:var(--fg3); }
body.eo-themed .breadcrumb .breadcrumb-item.active{
  font-family:var(--font-d); font-weight:800; font-size:27px; line-height:1.15;
  letter-spacing:-.01em; color:var(--ink);
}

/* En-tête de page standardisé (partial admin.partials.page-head) : kicker + titre
   + description, aligné sur la page Dossiers (.eods-head). */
body.eo-themed .eo-pagehead{ padding:18px 0 8px; }
/* Variante « actions à droite » : le bouton « + Ajouter » se place en face du titre
   et de la description (comme la page Dossiers), au lieu de pousser la table vers le bas. */
body.eo-themed .eo-pagehead--with-action{ display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; }
body.eo-themed .eo-pagehead-main{ min-width:0; flex:1 1 auto; }
body.eo-themed .eo-pagehead-actions{ flex:0 0 auto; display:flex; align-items:center; gap:10px; }
body.eo-themed .eo-pagehead-add .fa{ margin-right:5px; }
@media (max-width:575px){
  body.eo-themed .eo-pagehead--with-action{ align-items:flex-start; }
  body.eo-themed .eo-pagehead-actions{ width:100%; }
  body.eo-themed .eo-pagehead-add{ width:100%; justify-content:center; }
}
body.eo-themed .eo-pagehead-kicker{ font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--eo); margin-bottom:6px; }
body.eo-themed .eo-pagehead-title{ font-family:var(--font-d); font-weight:800; font-size:30px; line-height:1.1; letter-spacing:-.01em; color:var(--ink); margin:0; }
body.eo-themed .eo-pagehead-desc{ font-size:14.5px; color:var(--fg3); margin:7px 0 0; max-width:720px; line-height:1.45; }
html[data-theme="dark"] body.eo-themed .eo-pagehead-title{ color:#eef4f7; }
html[data-theme="dark"] body.eo-themed .eo-pagehead-kicker{ color:#8fc4dd; }
html[data-theme="dark"] body.eo-themed .eo-pagehead-desc{ color:#9fb0b9; }

/* ==========================================================================
   Cartes
   ========================================================================== */
body.eo-themed .card{ border:0; background:transparent; box-shadow:none; }
body.eo-themed .card.card-white,
body.eo-themed .container-fluid.bg-white{
  background:var(--surface) !important; border:1px solid var(--border) !important;
  border-radius:var(--r3) !important; box-shadow:var(--sh2) !important;
}
body.eo-themed .card.card-transparent{ background:transparent !important; border:0 !important; box-shadow:none !important; }
body.eo-themed .card .card-block{ padding:18px 20px; }

/* ==========================================================================
   Boutons
   ========================================================================== */
body.eo-themed .btn{
  font-family:var(--font-d); font-weight:700; font-size:14px;
  border-radius:var(--r2) !important; border:1px solid transparent;
  padding:9px 17px; transition:filter .15s,background .15s,box-shadow .15s;
  box-shadow:none; text-transform:none; letter-spacing:0;
}
body.eo-themed .btn:hover{ filter:brightness(.97); }
body.eo-themed .btn-primary{ background:var(--eo-dark) !important; border-color:var(--eo-dark) !important; color:#fff !important; box-shadow:0 6px 16px rgba(44,91,117,.26); }
body.eo-themed .btn-primary:hover{ background:var(--eo-deep) !important; }
body.eo-themed .btn-info, body.eo-themed .btn-default, body.eo-themed .btn-secondary{
  background:var(--eo-tint) !important; border-color:transparent !important; color:var(--eo-dark) !important;
}
body.eo-themed .btn-info:hover{ background:#d4e6ee !important; }
body.eo-themed .btn-success{ background:var(--success) !important; border-color:var(--success) !important; color:#fff !important; }
body.eo-themed .btn-danger{ background:var(--danger) !important; border-color:var(--danger) !important; color:#fff !important; }
body.eo-themed .btn-warning{ background:var(--warning) !important; border-color:var(--warning) !important; color:#fff !important; }
body.eo-themed .btn-link{ color:var(--eo-dark) !important; font-weight:700; box-shadow:none; }
body.eo-themed .btn-cons{ min-width:120px; }

/* ==========================================================================
   Tableaux (+ DataTables)
   ========================================================================== */
body.eo-themed .table{ background:transparent; color:var(--ink); border-collapse:collapse; }
body.eo-themed .table > thead > tr > th, body.eo-themed .table thead th{
  font-family:var(--font-d); text-transform:uppercase; font-size:11px; letter-spacing:.07em;
  font-weight:800; color:var(--fg3) !important; background:var(--bg2) !important;
  border:0 !important; border-bottom:1px solid var(--border) !important; padding:13px 16px !important;
}
body.eo-themed .table > tbody > tr > td, body.eo-themed .table tbody td{
  border:0 !important; border-bottom:1px solid var(--border) !important;
  padding:13px 16px !important; vertical-align:middle; color:var(--ink);
}
body.eo-themed .table.table-hover > tbody > tr:hover > td,
body.eo-themed .table.table-hover tbody tr:hover td{ background:var(--eo-wash) !important; }
body.eo-themed .dataTables_wrapper .dataTables_filter input,
body.eo-themed .dataTables_length select{
  border:1px solid var(--border) !important; border-radius:var(--r2) !important; height:40px; padding:0 12px;
}
body.eo-themed .dataTables_wrapper .paginate_button{
  border-radius:var(--r1) !important; border:1px solid var(--border) !important; color:var(--fg2) !important;
}
body.eo-themed .dataTables_wrapper .paginate_button.current{
  background:var(--eo-dark) !important; border-color:var(--eo-dark) !important; color:#fff !important;
}

/* ==========================================================================
   Formulaires
   ========================================================================== */
body.eo-themed .form-control{
  border:1px solid var(--border) !important; border-radius:var(--r2) !important;
  color:var(--ink); background:var(--surface); box-shadow:none !important;
  min-height:42px; padding:8px 13px; font-size:14px; font-family:var(--font-b);
  transition:border-color .15s, box-shadow .15s;
}
body.eo-themed .form-control:focus{
  border-color:var(--eo) !important; box-shadow:0 0 0 3px rgba(79,142,170,.18) !important; outline:none;
}
body.eo-themed .form-control::placeholder{ color:var(--fg4); }
body.eo-themed label, body.eo-themed .form-label{ font-weight:600; color:var(--fg2); }
body.eo-themed .card-title{ font-family:var(--font-d); color:var(--fg3); font-weight:700; }

/* ==========================================================================
   Badges, pagination native, divers
   ========================================================================== */
body.eo-themed .badge{ font-family:var(--font-d); font-weight:700; border-radius:var(--rpill); padding:4px 10px; }
body.eo-themed .badge-info{ background:var(--eo-tint) !important; color:var(--eo-dark) !important; }
body.eo-themed .badge-success{ background:#e6f2ea !important; color:#2d7350 !important; }
body.eo-themed .badge-danger{ background:#f6e2e2 !important; color:#9a3a3a !important; }
body.eo-themed .pagination > li > a, body.eo-themed .pagination > li > span{
  color:var(--eo-dark); border-color:var(--border);
}
body.eo-themed .pagination > .active > a, body.eo-themed .pagination > .active > span{
  background:var(--eo-dark) !important; border-color:var(--eo-dark) !important; color:#fff !important;
}
body.eo-themed hr{ border-color:var(--border); }

/* ---- Pastilles de statut Factures (.eoinv-pill) ---- */
body.eo-themed .eoinv-pill{
  display:inline-flex; align-items:center; gap:7px; padding:4px 11px; border-radius:var(--rpill);
  font-family:var(--font-d); font-weight:700; font-size:12.5px; white-space:nowrap; line-height:1.4;
}
body.eo-themed .eoinv-pill .eoinv-dot{ width:7px; height:7px; border-radius:50%; flex:0 0 auto; background:currentColor; }
body.eo-themed .eoinv-pill.is-paid{  background:#e6f2ea; color:#2d7350; }
body.eo-themed .eoinv-pill.is-sent{  background:#f8efdf; color:#b67c2c; }
body.eo-themed .eoinv-pill.is-late{  background:#f6e2e2; color:#9a3a3a; }
body.eo-themed .eoinv-pill.is-draft{ background:#eef1f3; color:#6b7a85; }
html[data-theme="dark"] body.eo-themed .eoinv-pill.is-paid{  background:#1e3a2c; color:#86c8a2; }
html[data-theme="dark"] body.eo-themed .eoinv-pill.is-sent{  background:#3a3120; color:#e0b870; }
html[data-theme="dark"] body.eo-themed .eoinv-pill.is-late{  background:#3d2222; color:#e09a9a; }
html[data-theme="dark"] body.eo-themed .eoinv-pill.is-draft{ background:#222f37; color:#9fb0b9; }

/* ---- État « liste vide » (.eo-empty) ---- */
body.eo-themed .eo-empty-cell{ padding:0 !important; background:transparent !important; border-bottom:0 !important; }
body.eo-themed .eo-empty{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:9px; padding:50px 20px; text-align:center; }
body.eo-themed .eo-empty-ico{ width:66px; height:66px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:var(--eo-tint); color:var(--eo); font-size:27px; }
body.eo-themed .eo-empty-title{ font-family:var(--font-d); font-weight:800; font-size:16px; color:var(--fg2); }
body.eo-themed .eo-empty-msg{ font-size:13.5px; color:var(--fg3); max-width:400px; line-height:1.5; }
html[data-theme="dark"] body.eo-themed .eo-empty-ico{ background:#22414f; color:#8fc4dd; }
html[data-theme="dark"] body.eo-themed .eo-empty-title{ color:#cdd9df; }
html[data-theme="dark"] body.eo-themed .eo-empty-msg{ color:#9fb0b9; }

/* ==========================================================================
   Tableau de bord — tuiles à HAUTEUR ÉGALE + chiffre mis en valeur
   ========================================================================== */
body.eo-themed .card.card-dashboard{
  height:100% !important; display:flex; flex-direction:column; overflow:hidden;
  transition:box-shadow .18s, transform .18s;
}
body.eo-themed .card.card-dashboard:hover{ box-shadow:0 12px 28px rgba(28,50,68,.13) !important; transform:translateY(-2px); }
body.eo-themed .card.card-dashboard .card-header{
  background:var(--bg2) !important; border-bottom:1px solid var(--border) !important;
  min-height:64px; display:flex; align-items:center; justify-content:center; padding:12px 16px; text-decoration:none;
}
body.eo-themed .card.card-dashboard .card-header .card-title{
  color:var(--eo-dark) !important; font-family:var(--font-d); font-weight:700; font-size:14px; margin:0; line-height:1.25;
}
body.eo-themed .card.card-dashboard .card-block{ flex:1; display:flex; align-items:center; justify-content:center; padding:20px; }
body.eo-themed .card.card-dashboard .card-block h1{
  font-family:var(--font-d); font-weight:800; font-size:46px; color:var(--eo-dark); margin:0; line-height:1;
}
/* ---- Grille des tuiles : espace homogène (gap) entre tuiles, responsive 3/2/1 col ---- */
body.eo-themed .eo-stat-grid{
  display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:26px; margin-top:6px;
}
@media (max-width:991px){ body.eo-themed .eo-stat-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:18px; } }
@media (max-width:575px){ body.eo-themed .eo-stat-grid{ grid-template-columns:minmax(0,1fr); gap:16px; } }
/* Sous-libellé doré (ex: « dont N candidats en suivi ») */
body.eo-themed .eo-stat-sub{ display:block; font-size:12px !important; font-weight:600; color:#b07d2e !important; margin-top:1px; }
html[data-theme="dark"] body.eo-themed .eo-stat-sub{ color:#e0b870 !important; }

/* ---- Tuiles statistiques (icône + chiffre + libellé), cliquables ---- */
body.eo-themed a.card-dashboard.eo-stat{
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:10px; padding:30px 18px; min-height:180px; text-decoration:none !important;
  position:relative; overflow:hidden;
}
body.eo-themed .eo-stat-ico{
  width:60px; height:60px; border-radius:18px; display:flex; align-items:center; justify-content:center;
  font-size:25px; transition:transform .18s;
}
body.eo-themed a.card-dashboard.eo-stat:hover .eo-stat-ico{ transform:scale(1.06); }
body.eo-themed .eo-stat-num{ font-family:var(--font-d); font-weight:800; font-size:48px; line-height:1; color:var(--ink); }
body.eo-themed .eo-stat-lbl{ font-family:var(--font-d); font-weight:700; font-size:14.5px; color:var(--fg3); text-align:center; }
/* Accent supérieur coloré */
body.eo-themed a.card-dashboard.eo-stat:before{ content:""; position:absolute; top:0; left:0; right:0; height:4px; }
body.eo-themed .eo-stat--blue .eo-stat-ico{ background:var(--eo-tint); color:var(--eo-dark); }
body.eo-themed .eo-stat--blue:before{ background:var(--eo); }
body.eo-themed .eo-stat--green .eo-stat-ico{ background:#e6f2ea; color:#2d7350; }
body.eo-themed .eo-stat--green:before{ background:var(--success); }
body.eo-themed .eo-stat--gold .eo-stat-ico{ background:#f8efdf; color:#b67c2c; }
body.eo-themed .eo-stat--gold:before{ background:var(--warning); }
body.eo-themed .eo-stat--amber .eo-stat-ico{ background:#fdf0db; color:#b06a12; }
body.eo-themed .eo-stat--amber:before{ background:#e0962a; }
body.eo-themed .eo-stat--red .eo-stat-ico{ background:#f7e4e4; color:#a83b3b; }
body.eo-themed .eo-stat--red:before{ background:var(--danger); }
body.eo-themed .eo-stat--teal .eo-stat-ico{ background:#dcf0ec; color:#1c8175; }
body.eo-themed .eo-stat--teal:before{ background:#2c9c8f; }
/* Sparkline de tendance (mini-graphe en bas de tuile, 6 derniers mois) */
body.eo-themed .eo-spark{ width:100%; height:30px; margin-top:4px; display:block; }
/* Mode sombre : chiffres/libellés lisibles + variants d'icône des nouvelles tuiles */
html[data-theme="dark"] body.eo-themed .eo-stat-num{ color:#eef4f7 !important; }
html[data-theme="dark"] body.eo-themed .eo-stat-lbl{ color:#9fb0b9 !important; }
html[data-theme="dark"] body.eo-themed .eo-stat--amber .eo-stat-ico{ background:#3a3120 !important; color:#e0b870 !important; }
html[data-theme="dark"] body.eo-themed .eo-stat--red .eo-stat-ico{ background:#3a2424 !important; color:#e29c9c !important; }
html[data-theme="dark"] body.eo-themed .eo-stat--teal .eo-stat-ico{ background:#16322e !important; color:#7fd0c4 !important; }

/* ==========================================================================
   Page de connexion — logos contraints (pas de débordement, responsive)
   ========================================================================== */
body.eo-themed .login-container img{ height:auto !important; max-height:50px; max-width:30%; object-fit:contain; }
@media (max-width:480px){ body.eo-themed .login-container img{ max-height:40px; } }

/* ==========================================================================
   Page de connexion : retrait du filtre bleu (photo en opacity .6 sur fond
   #48b0f7), champs avec icône flat à gauche, adaptation clair/sombre.
   ========================================================================== */
body.eo-themed .login-wrapper{ background-color:#152028 !important; }
body.eo-themed .login-wrapper .bg-pic > img{ opacity:1 !important; object-fit:cover; }

/* ---- Mise en page DEUX VOLETS : image à GAUCHE (toujours visible) + formulaire à
   DROITE. Surcharge la mise en page "Pages" (image en fond plein écran + panneau
   flottant qui recouvrait l'image) pour répondre au besoin : « ne pas cacher l'image,
   le menu identifiant à droite de l'image ». ---- */
body.eo-themed .login-wrapper{ display:flex !important; flex-direction:row; align-items:stretch; min-height:100vh; }
body.eo-themed .login-wrapper .bg-pic{
  position:relative !important; flex:1 1 auto !important; width:auto !important; height:auto !important;
  min-height:100vh; overflow:hidden; opacity:1 !important; margin:0 !important;
}
body.eo-themed .login-wrapper .bg-pic > img{
  position:absolute !important; inset:0; width:100% !important; height:100% !important; object-fit:cover;
}
body.eo-themed .login-wrapper .login-container{
  position:relative !important; float:none !important; right:auto !important; top:auto !important;
  flex:0 0 clamp(380px, 36vw, 480px) !important; width:auto !important; max-width:100% !important;
  min-height:100vh; height:auto !important; box-shadow:-14px 0 40px rgba(8,16,22,.22);
}
/* Marges internes raisonnables (le gabarit "Pages" en mettait trop pour un volet étroit) */
body.eo-themed .login-container > div{ padding-left:44px !important; padding-right:44px !important; margin-left:0 !important; margin-right:0 !important; }
/* Pied "Pas de compte…" : flux normal (évite les bugs de position absolue dans le volet) */
body.eo-themed .login-container .pull-bottom{ position:static !important; margin-top:26px; padding-right:0 !important; }
/* Empilement sous 860px : image en bandeau haut + formulaire dessous (image toujours visible) */
@media (max-width:860px){
  body.eo-themed .login-wrapper{ flex-direction:column; }
  body.eo-themed .login-wrapper .bg-pic{ flex:0 0 190px !important; min-height:190px; }
  body.eo-themed .login-wrapper .bg-pic .bg-caption{ display:none !important; }
  body.eo-themed .login-wrapper .login-container{ flex:1 1 auto !important; width:100% !important; min-height:0; box-shadow:0 -10px 30px rgba(8,16,22,.18); }
  body.eo-themed .login-container > div{ padding-top:30px !important; margin-top:0 !important; }
}
@media (max-width:480px){ body.eo-themed .login-container > div{ padding-left:22px !important; padding-right:22px !important; } }
/* Champs : icône flat à gauche */
body.eo-themed .eo-login-field{ position:relative; }
body.eo-themed .eo-login-ic{ position:absolute; left:1px; top:50%; transform:translateY(-50%); color:var(--fg4); font-size:15px; pointer-events:none; z-index:2; }
body.eo-themed .eo-login-field .form-control{ padding-left:26px !important; }
/* Mode sombre : le wrapper de champ "form-group-default" du template + labels + icône */
html[data-theme="dark"] body.eo-themed .form-group-default{ background:#16242c !important; border-color:#2a3b45 !important; }
html[data-theme="dark"] body.eo-themed .form-group-default label{ color:#9fb0b9 !important; }
html[data-theme="dark"] body.eo-themed .eo-login-ic{ color:#7e919b !important; }

/* ==========================================================================
   🌙 MODE SOMBRE — activé par html[data-theme="dark"]. Bascule mémorisée
   (localStorage 'eo-theme'), appliquée avant l'affichage (script dans le head).
   ========================================================================== */
html[data-theme="dark"] body.eo-themed{ background:#0f1c24 !important; color:#e6eef2; }
html[data-theme="dark"] body.eo-themed .page-container,
html[data-theme="dark"] body.eo-themed .content,
html[data-theme="dark"] body.eo-themed .page-content-wrapper{ background:transparent !important; }
/* Bandeau */
html[data-theme="dark"] body.eo-themed .header{ background:#16242c !important; box-shadow:inset 0 -1px 0 #2a3b45 !important; }
html[data-theme="dark"] body.eo-themed .header .user-infos-name{ color:#e6eef2 !important; }
html[data-theme="dark"] body.eo-themed .profile-dropdown.dropdown-menu{ background:#18272f !important; border-color:#2a3b45 !important; }
html[data-theme="dark"] body.eo-themed .profile-dropdown .dropdown-item{ color:#cdd9df !important; }
html[data-theme="dark"] body.eo-themed .profile-dropdown .dropdown-item:hover{ background:#22333c !important; color:#fff !important; }
/* Menu profil : neutraliser les fonds clairs du template (item .bg-master-lighter = #f0f0f0,
   item .active = #f0f0f0) pour que TOUT le menu soit sombre, pas seulement le fond. */
html[data-theme="dark"] body.eo-themed .profile-dropdown .dropdown-item{ background-color:transparent !important; }
html[data-theme="dark"] body.eo-themed .profile-dropdown .bg-master-lighter,
html[data-theme="dark"] body.eo-themed .profile-dropdown .dropdown-item.active{ background-color:#22333c !important; color:#fff !important; }
/* Avatar (bouton profil) : ring sombre au lieu du halo clair (eo-tint) + fond rond sombre. */
html[data-theme="dark"] body.eo-themed .navbar-avatar img{ box-shadow:0 0 0 2px #2a3b45 !important; }
html[data-theme="dark"] body.eo-themed .navbar-avatar,
html[data-theme="dark"] body.eo-themed .profile-dropdown-toggle .thumbnail-wrapper{ background:#16242c !important; }
/* Titres / texte */
html[data-theme="dark"] body.eo-themed .breadcrumb .breadcrumb-item.active{ color:#eef4f7 !important; }
html[data-theme="dark"] body.eo-themed .breadcrumb .breadcrumb-item{ color:#9fb0b9 !important; }
html[data-theme="dark"] body.eo-themed h1, html[data-theme="dark"] body.eo-themed h2,
html[data-theme="dark"] body.eo-themed h3, html[data-theme="dark"] body.eo-themed .bold{ color:#eef4f7 !important; }
/* Cartes / panneaux blancs */
html[data-theme="dark"] body.eo-themed .card.card-white,
html[data-theme="dark"] body.eo-themed .container-fluid.bg-white{ background:#18272f !important; border-color:#2a3b45 !important; box-shadow:0 4px 14px rgba(0,0,0,.35) !important; }
html[data-theme="dark"] body.eo-themed .card.card-dashboard{ background:#18272f !important; }
html[data-theme="dark"] body.eo-themed .card.card-dashboard .card-header{ background:#1d2e37 !important; border-color:#2a3b45 !important; }
html[data-theme="dark"] body.eo-themed .card.card-dashboard .card-header .card-title,
html[data-theme="dark"] body.eo-themed .card.card-dashboard .card-block h1{ color:#8fc4dd !important; }
html[data-theme="dark"] body.eo-themed .eo-stat-num{ color:#eef4f7 !important; }
html[data-theme="dark"] body.eo-themed .eo-stat-lbl{ color:#9fb0b9 !important; }
html[data-theme="dark"] body.eo-themed .eo-stat--blue .eo-stat-ico{ background:#22414f !important; color:#8fc4dd !important; }
html[data-theme="dark"] body.eo-themed .eo-stat--green .eo-stat-ico{ background:#1e3a2c !important; color:#86c8a2 !important; }
html[data-theme="dark"] body.eo-themed .eo-stat--gold .eo-stat-ico{ background:#3a3120 !important; color:#e0b870 !important; }
/* Tableaux */
html[data-theme="dark"] body.eo-themed .table > thead > tr > th,
html[data-theme="dark"] body.eo-themed .table thead th{ background:#1d2e37 !important; color:#9fb0b9 !important; border-color:#2a3b45 !important; }
html[data-theme="dark"] body.eo-themed .table > tbody > tr > td,
html[data-theme="dark"] body.eo-themed .table tbody td{ background-color:transparent !important; color:#dbe5ea !important; border-color:#2a3b45 !important; }
html[data-theme="dark"] body.eo-themed .table.table-hover > tbody > tr:hover > td,
html[data-theme="dark"] body.eo-themed .table.table-hover tbody tr:hover td{ background:#22333c !important; }
/* Le thème "Pages" force .table td,.table th{ background:#fff !important } + des fonds
   clairs sur lignes rayées / sélectionnées → on neutralise en sombre (cellules
   transparentes pour laisser remonter le fond sombre de la carte .card-white). */
html[data-theme="dark"] body.eo-themed .table.table-striped tbody tr td{ background-color:transparent !important; }
html[data-theme="dark"] body.eo-themed .table.table-striped tbody tr:nth-child(odd) td{ background-color:#16242c !important; }
html[data-theme="dark"] body.eo-themed .table tbody tr.selected td,
html[data-theme="dark"] body.eo-themed .table.table-hover tbody tr.selected:hover td{ background-color:#2a3b2f !important; color:#eef4f7 !important; }
/* Formulaires */
html[data-theme="dark"] body.eo-themed .form-control{ background:#16242c !important; color:#e6eef2 !important; border-color:#2a3b45 !important; }
html[data-theme="dark"] body.eo-themed .form-control::placeholder{ color:#7e919b !important; }
html[data-theme="dark"] body.eo-themed label, html[data-theme="dark"] body.eo-themed .card-title{ color:#c2cdd4 !important; }
/* Boutons secondaires */
html[data-theme="dark"] body.eo-themed .btn-info,
html[data-theme="dark"] body.eo-themed .btn-default,
html[data-theme="dark"] body.eo-themed .btn-secondary{ background:#22414f !important; color:#cfe0e8 !important; }
html[data-theme="dark"] body.eo-themed .btn-ghost{ background:#16242c !important; color:#cfe0e8 !important; border-color:#2a3b45 !important; }
html[data-theme="dark"] body.eo-themed hr{ border-color:#2a3b45 !important; }
/* Page Dossiers (.eods) en sombre */
html[data-theme="dark"] .eods{ color:#e6eef2; }
html[data-theme="dark"] .eods-card{ background:#18272f !important; border-color:#2a3b45 !important; box-shadow:0 4px 14px rgba(0,0,0,.35) !important; }
html[data-theme="dark"] .eods-table thead th{ background:#1d2e37 !important; color:#9fb0b9 !important; border-color:#2a3b45 !important; }
html[data-theme="dark"] .eods-table tbody td{ border-color:#2a3b45 !important; color:#dbe5ea; }
html[data-theme="dark"] .eods-table tbody tr:hover td{ background:#22333c !important; }
html[data-theme="dark"] .eods-cid{ color:#9fd0e6 !important; }
html[data-theme="dark"] .eods-nm{ color:#eef4f7 !important; }
html[data-theme="dark"] .eods-fname{ color:#c2cdd4 !important; }
html[data-theme="dark"] .eods-cdate, html[data-theme="dark"] .eods-ct{ color:#9fb0b9 !important; }
html[data-theme="dark"] .eods-kicker{ color:#8fc4dd !important; }
html[data-theme="dark"] .eods-ctrl, html[data-theme="dark"] .eods-input{ background:#16242c !important; color:#e6eef2 !important; border-color:#2a3b45 !important; }
html[data-theme="dark"] .eods-btn-edit{ background:#16242c !important; color:#cfe0e8 !important; border-color:#2a3b45 !important; }
html[data-theme="dark"] .eods-chip{ background:#22414f !important; color:#cfe0e8 !important; }
html[data-theme="dark"] .eods-count{ color:#9fb0b9 !important; }
html[data-theme="dark"] .eods-count b{ color:#eef4f7 !important; }
html[data-theme="dark"] .eods [id$="-panel"]{ background:#18272f !important; border-color:#2a3b45 !important; color:#dbe5ea !important; }
/* Correctifs dark — fonds clairs codés en dur que le reskin sombre avait oubliés.
   POURQUOI : .eods-table porte un background:#fff (inline dans index.blade.php) ; il
   n'était pas surchargé en sombre → la table restait BLANCHE tandis que le texte des
   cellules passait en clair = illisible. On la rend transparente pour laisser remonter
   le fond sombre de .eods-card (déjà géré). Idem pour le bouton "Exporter .csv"
   (.eods-btn-ghost, fond #fff) et le tag "Archivé" (.eods-arch, fond #eceff1). */
html[data-theme="dark"] .eods-table{ background:transparent !important; }
html[data-theme="dark"] .eods-btn-ghost{ background:#16242c !important; color:#cfe0e8 !important; border-color:#2a3b45 !important; }
html[data-theme="dark"] .eods-arch{ background:#22333c !important; color:#9fb0b9 !important; }
/* Login en sombre */
html[data-theme="dark"] body.eo-themed .login-container{ background:#16242c !important; }
html[data-theme="dark"] body.eo-themed .login-container p,
html[data-theme="dark"] body.eo-themed .login-container label{ color:#cdd9df !important; }
/* Bouton bascule de thème (dans le bandeau) */
body.eo-themed .eo-theme-toggle{ display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; border-radius:999px; background:var(--bg2); border:1px solid var(--border); color:var(--fg3); cursor:pointer; margin-right:6px; transition:background .15s,color .15s; }
body.eo-themed .eo-theme-toggle:hover{ background:var(--eo-tint); color:var(--eo-dark); }
html[data-theme="dark"] body.eo-themed .eo-theme-toggle{ background:#22333c; border-color:#2a3b45; color:#e6c46a; }
body.eo-themed .eo-theme-toggle .ic-moon{ display:none; }
html[data-theme="dark"] body.eo-themed .eo-theme-toggle .ic-sun{ display:none; }
html[data-theme="dark"] body.eo-themed .eo-theme-toggle .ic-moon{ display:inline-flex; }

/* ---- Accessibilité : focus visible homogène ---- */
body.eo-themed a:focus-visible, body.eo-themed .btn:focus-visible,
body.eo-themed .form-control:focus-visible, body.eo-themed button:focus-visible{
  outline:2px solid var(--eo); outline-offset:2px;
}
@media (prefers-reduced-motion: reduce){
  body.eo-themed *{ transition:none !important; animation:none !important; }
}

/* ==========================================================================
   Gestion des utilisateurs (Configuration > Utilisateurs) : pastilles de rôle
   et de statut, alertes flash, utilitaires de formulaire. Adaptatif Dark/Light.
   ========================================================================== */
body.eo-themed .eo-rolepill,
body.eo-themed .eo-statuspill{
  display:inline-flex; align-items:center; gap:6px; padding:4px 11px; border-radius:var(--rpill);
  font-family:var(--font-d); font-weight:700; font-size:12.5px; line-height:1.4; white-space:nowrap;
}
body.eo-themed .eo-rolepill .fa{ font-size:11px; }
body.eo-themed .eo-rolepill--admin{ background:var(--eo-tint); color:var(--eo-dark); }
body.eo-themed .eo-rolepill--administration{ background:#dcf0ec; color:#1c8175; }
body.eo-themed .eo-rolepill--gerant{ background:#f8efdf; color:#b67c2c; }
body.eo-themed .eo-rolepill--stagiaire{ background:#eef1f3; color:#6b7a85; }
html[data-theme="dark"] body.eo-themed .eo-rolepill--admin{ background:#22414f; color:#8fc4dd; }
html[data-theme="dark"] body.eo-themed .eo-rolepill--administration{ background:#16322e; color:#7fd0c4; }
html[data-theme="dark"] body.eo-themed .eo-rolepill--gerant{ background:#3a3120; color:#e0b870; }
html[data-theme="dark"] body.eo-themed .eo-rolepill--stagiaire{ background:#222f37; color:#9fb0b9; }
body.eo-themed .eo-statuspill--active{ background:#e6f2ea; color:#2d7350; }
body.eo-themed .eo-statuspill--pending{ background:#f8efdf; color:#b67c2c; }
body.eo-themed .eo-statuspill--suspended{ background:#f6e2e2; color:#9a3a3a; }
html[data-theme="dark"] body.eo-themed .eo-statuspill--active{ background:#1e3a2c; color:#86c8a2; }
html[data-theme="dark"] body.eo-themed .eo-statuspill--pending{ background:#3a3120; color:#e0b870; }
html[data-theme="dark"] body.eo-themed .eo-statuspill--suspended{ background:#3d2222; color:#e09a9a; }
/* Alertes flash */
body.eo-themed .eo-alert{ display:flex; align-items:flex-start; gap:10px; padding:13px 16px; border-radius:var(--r2); font-weight:600; font-size:14px; margin:16px 0 6px; }
body.eo-themed .eo-alert .fa{ margin-top:2px; }
body.eo-themed .eo-alert-list{ margin:0; padding-left:18px; }
body.eo-themed .eo-alert--success{ background:#e6f2ea; color:#256544; }
body.eo-themed .eo-alert--error{ background:#f7e4e4; color:#9a3a3a; }
html[data-theme="dark"] body.eo-themed .eo-alert--success{ background:#1e3a2c; color:#9bd8b5; }
html[data-theme="dark"] body.eo-themed .eo-alert--error{ background:#3d2222; color:#e6a6a6; }
/* Formulaires utilisateurs */
body.eo-themed .eo-form-cardtitle{ font-family:var(--font-d); font-weight:800; font-size:15px; color:var(--ink); margin:0 0 16px; }
html[data-theme="dark"] body.eo-themed .eo-form-cardtitle{ color:#eef4f7; }
body.eo-themed .eo-userform .form-group{ margin-bottom:16px; }
body.eo-themed .eo-userform label{ display:block; margin-bottom:6px; font-weight:700; font-size:13px; }
body.eo-themed .eo-req{ color:var(--danger); }
body.eo-themed .eo-form-actions{ display:flex; gap:10px; align-items:center; margin-top:8px; flex-wrap:wrap; }
body.eo-themed .eo-form-hint{ font-size:13px; color:var(--fg3); margin:0 0 12px; }
body.eo-themed .help-block{ color:var(--danger); font-size:13px; margin-top:5px; }
html[data-theme="dark"] body.eo-themed .help-block{ color:#e6a6a6; }
/* Select thémé : chevron custom + espace à droite */
body.eo-themed .eo-userform select.form-control{ appearance:none; -webkit-appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236b7a85' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 13px center; padding-right:34px; }

/* ==========================================================================
   RESPONSIVE — adaptation tablette / smartphone (première passe).
   ========================================================================== */
/* ---- Tablette & mobile (<=991px) : sidebar en OVERLAY, ne pousse plus le contenu ---- */
@media (max-width:991px){
  body.eo-themed .page-sidebar{ left:0 !important; width:250px !important; z-index:1050 !important; box-shadow:2px 0 18px rgba(8,16,22,.16) !important; }
  body.eo-themed.menu-pin .page-sidebar{ transform:translateX(0) !important; }
  body.eo-themed:not(.menu-pin) .page-sidebar{ transform:translateX(-100%) !important; }
  body.eo-themed .page-container,
  body.eo-themed.menu-pin .page-container{ padding-left:0 !important; }
  body.eo-themed .page-container .page-content-wrapper .content,
  body.eo-themed.menu-pin .page-container .page-content-wrapper .content{ padding-left:0 !important; }
}
/* ---- Smartphone (<=767px) ---- */
@media (max-width:767px){
  /* Titres de page plus compacts */
  body.eo-themed .eo-pagehead-title, body.eo-themed .eods-title{ font-size:22px !important; }
  body.eo-themed .eo-pagehead-desc{ font-size:13.5px !important; }
  body.eo-themed .breadcrumb .breadcrumb-item.active{ font-size:21px !important; }
  /* Tuiles dashboard plus compactes */
  body.eo-themed .eo-stat-num{ font-size:38px !important; }
  body.eo-themed a.card-dashboard.eo-stat{ min-height:0 !important; padding:24px 16px !important; }
  /* Tables larges (Dossiers) : scroll horizontal plutôt que casser la mise en page */
  body.eo-themed .eods-tcard{ overflow-x:auto !important; -webkit-overflow-scrolling:touch; }
  body.eo-themed .eods-table{ min-width:720px; }
  /* Filtres Dossiers : empilés, pleine largeur */
  body.eo-themed .eods-filters-row{ gap:10px; }
  body.eo-themed .eods-fg, body.eo-themed .eods-fg.grow{ width:100% !important; min-width:0 !important; flex:1 1 100% !important; }
  body.eo-themed .eods-ctrl, body.eo-themed .eods-search{ min-width:0 !important; width:100% !important; }
  body.eo-themed .eods-row-actions{ width:100%; }
  body.eo-themed .eods-row-actions .eods-btn{ flex:1 1 auto; justify-content:center; }
  /* En-tête Dossiers : titre + actions empilés */
  body.eo-themed .eods-head{ flex-direction:column; align-items:flex-start; gap:12px; }
  body.eo-themed .eods-actions{ width:100%; }
  /* 3 logos du bandeau masqués (le menu ☰ suffit) */
  body.eo-themed .header .brand{ display:none !important; }
  /* Marges latérales du contenu réduites */
  body.eo-themed .eods{ padding-left:14px !important; padding-right:14px !important; }
}

/* ==========================================================================
   JETONS MCP (Configuration > Jetons MCP) — Dark/Light compatible.
   Personal Access Tokens Sanctum en lecture seule. Secret affiché une seule
   fois. Styles scopés sous body.eo-themed, basés sur les tokens du thème.
   ========================================================================== */

/* Variantes d'alerte complémentaires (info + warning) */
body.eo-themed .eo-alert--info{ background:var(--eo-tint); color:var(--eo-deep); }
body.eo-themed .eo-alert--warning{ background:#f8efdf; color:#8a5d1c; }
html[data-theme="dark"] body.eo-themed .eo-alert--info{ background:#173343; color:#a9d6ec; }
html[data-theme="dark"] body.eo-themed .eo-alert--warning{ background:#3a3120; color:#e7c485; }

/* Nom du jeton dans la liste */
body.eo-themed .eo-mcp-tokname .fa{ color:var(--eo); margin-right:4px; }
body.eo-themed .eo-mcp-muted{ color:var(--fg4); }

/* Pastilles de capacités (liste des jetons) */
body.eo-themed .eo-mcp-scopes{ display:flex; flex-wrap:wrap; gap:6px; }
body.eo-themed .eo-mcp-scope{
  display:inline-flex; align-items:center; gap:5px;
  background:var(--eo-tint); color:var(--eo-dark);
  border-radius:var(--rpill); padding:3px 10px;
  font-family:var(--font-d); font-weight:700; font-size:11.5px; line-height:1.4;
}
body.eo-themed .eo-mcp-scope .fa{ font-size:11px; }
html[data-theme="dark"] body.eo-themed .eo-mcp-scope{ background:#173343; color:#a9d6ec; }

/* Liste de choix des capacités (formulaire de création) */
body.eo-themed .eo-mcp-scopelist{ display:flex; flex-direction:column; gap:10px; margin-top:8px; }
body.eo-themed .eo-mcp-scopeopt{
  display:flex; align-items:flex-start; gap:12px; margin:0; cursor:pointer;
  border:1px solid var(--border); border-radius:var(--r2);
  padding:13px 15px; background:var(--surface); transition:border-color .15s, background .15s, box-shadow .15s;
}
body.eo-themed .eo-mcp-scopeopt:hover{ border-color:var(--border2); background:var(--bg2); }
body.eo-themed .eo-mcp-scopeopt input[type="checkbox"]{ margin-top:3px; width:16px; height:16px; flex:0 0 auto; accent-color:var(--eo-dark); }
body.eo-themed .eo-mcp-scopeopt:has(input:checked){ border-color:var(--eo-dark); background:var(--eo-tint); box-shadow:inset 0 0 0 1px var(--eo-dark); }
html[data-theme="dark"] body.eo-themed .eo-mcp-scopeopt:has(input:checked){ background:#173343; box-shadow:inset 0 0 0 1px var(--eo); border-color:var(--eo); }
body.eo-themed .eo-mcp-scopeopt-body{ display:flex; flex-direction:column; gap:3px; min-width:0; }
body.eo-themed .eo-mcp-scopeopt-head{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
body.eo-themed .eo-mcp-scopeopt-head .fa{ color:var(--eo); }
body.eo-themed .eo-mcp-scopeopt-title{ font-family:var(--font-d); font-weight:800; font-size:14px; color:var(--ink); }
html[data-theme="dark"] body.eo-themed .eo-mcp-scopeopt-title{ color:#eef4f7; }
body.eo-themed .eo-mcp-scopeopt-code{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:11px;
  color:var(--fg3); background:var(--bg2); border:1px solid var(--border);
  border-radius:var(--r1); padding:1px 7px;
}
body.eo-themed .eo-mcp-scopeopt-desc{ font-size:13px; color:var(--fg3); line-height:1.45; }

/* Bandeau lecture seule + avertissement « affiché une fois » */
body.eo-themed .eo-mcp-readonly{ margin-top:18px; }
body.eo-themed .eo-mcp-onceonly{ align-items:flex-start; }

/* Boîte d'affichage du secret (page token-created) */
body.eo-themed .eo-mcp-tokenbox{
  display:flex; align-items:stretch; gap:10px; margin:6px 0 4px; flex-wrap:wrap;
}
body.eo-themed .eo-mcp-tokenval{
  flex:1 1 320px; min-width:0;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:14px;
  color:var(--ink); background:var(--bg2);
  border:1px solid var(--border2); border-radius:var(--r2);
  padding:13px 15px; line-height:1.5; word-break:break-all; user-select:all;
}
html[data-theme="dark"] body.eo-themed .eo-mcp-tokenval{ color:#eef4f7; }
body.eo-themed .eo-mcp-copybtn{ flex:0 0 auto; white-space:nowrap; }
body.eo-themed .eo-mcp-copybtn.is-copied{ background:var(--success) !important; border-color:var(--success) !important; }
body.eo-themed .eo-mcp-usagehint{ margin-top:12px; }
body.eo-themed .eo-mcp-usagehint code{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:12px;
  background:var(--bg2); border:1px solid var(--border); border-radius:var(--r1); padding:1px 6px; color:var(--fg2);
}
@media (max-width:767px){
  body.eo-themed .eo-mcp-copybtn{ width:100%; justify-content:center; }
}
/* Bloc « Connecter Claude » : téléchargement du bundle .mcpb + alternatives */
body.eo-themed .eo-mcp-cta{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin:4px 0 2px; }
body.eo-themed .eo-mcp-hint{ font-size:12.5px; color:var(--fg3); }
body.eo-themed .eo-mcp-adv{ margin-top:16px; border-top:1px solid var(--border); padding-top:12px; }
body.eo-themed .eo-mcp-adv > summary{ cursor:pointer; font-weight:700; font-size:13.5px; color:var(--eo-dark); list-style:none; }
body.eo-themed .eo-mcp-adv > summary::-webkit-details-marker{ display:none; }
body.eo-themed .eo-mcp-adv > summary:before{ content:"▸ "; color:var(--fg4); }
body.eo-themed .eo-mcp-adv[open] > summary:before{ content:"▾ "; }
html[data-theme="dark"] body.eo-themed .eo-mcp-adv{ border-color:#2a3b45; }
html[data-theme="dark"] body.eo-themed .eo-mcp-adv > summary{ color:#8fc4dd; }
body.eo-themed .eo-mcp-adv-in p{ margin:12px 0 4px; font-size:13.5px; color:var(--fg2); }
body.eo-themed .eo-mcp-code{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:12.5px;
  background:var(--bg2); border:1px solid var(--border); border-radius:var(--r2);
  padding:11px 13px; color:var(--ink); white-space:pre-wrap; word-break:break-word; line-height:1.5; margin:0;
}
html[data-theme="dark"] body.eo-themed .eo-mcp-code{ background:#16242c; border-color:#2a3b45; color:#dbe5ea; }
/* Logo « EasyOpto ⟷ Claude » de la carte de connexion */
body.eo-themed .eo-mcp-hero{ display:inline-flex; align-items:center; gap:11px; margin-bottom:12px; }
body.eo-themed .eo-mcp-hero-eo{
  width:42px; height:42px; border-radius:12px; flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,#2c5b75,#4f8eaa); color:#fff; font-family:var(--font-d); font-weight:800; font-size:15px; letter-spacing:.03em;
}
body.eo-themed .eo-mcp-hero-bridge{ color:var(--fg4); display:inline-flex; align-items:center; }
body.eo-themed .eo-mcp-hero-claude{
  width:42px; height:42px; border-radius:12px; flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center;
  background:#fbeee8; border:1px solid #f1d7ca;
}
html[data-theme="dark"] body.eo-themed .eo-mcp-hero-claude{ background:#33241d; border-color:#5a3d30; }
body.eo-themed .eo-claude-word{ color:#c4623f; }
html[data-theme="dark"] body.eo-themed .eo-claude-word{ color:#e2a081; }
/* Adresse de connexion (réutilisable par tout outil) */
body.eo-themed .eo-mcp-conn{ margin-top:16px; background:var(--bg2); border:1px solid var(--border); border-radius:var(--r2); padding:12px 14px; }
html[data-theme="dark"] body.eo-themed .eo-mcp-conn{ background:#16242c; border-color:#2a3b45; }
body.eo-themed .eo-mcp-conn-title{ font-weight:700; font-size:12.5px; color:var(--fg3); margin-bottom:9px; }
body.eo-themed .eo-mcp-conn-title .fa{ color:var(--eo); margin-right:5px; }
body.eo-themed .eo-mcp-conn-grid{ display:grid; grid-template-columns:auto 1fr; gap:7px 12px; align-items:center; }
body.eo-themed .eo-mcp-conn-k{ font-weight:800; font-size:10.5px; text-transform:uppercase; letter-spacing:.07em; color:var(--fg4); }
body.eo-themed .eo-mcp-conn-v{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:12.5px; color:var(--ink);
  background:var(--surface); border:1px solid var(--border); border-radius:var(--r1); padding:4px 9px; user-select:all; word-break:break-all;
}
html[data-theme="dark"] body.eo-themed .eo-mcp-conn-v{ color:#dbe5ea; background:#1d2e37; border-color:#2a3b45; }
@media (max-width:575px){
  body.eo-themed .eo-mcp-conn-grid{ grid-template-columns:1fr; gap:2px 0; }
  body.eo-themed .eo-mcp-conn-k{ margin-top:6px; }
}