/* ═══════════════════════════════════════════════════════════════════════
   DonnaChrome — header unifié de TOUTES les pages (handoff Margot donna__7).
   Deux bandes empilées, FIXES (sticky) hors du scroll :
     .dchrome-head   (titre + compteur | actions)
     .dchrome-filters(FILTRES | chips scroll | Tout effacer + rightSlot)
   Seul le contenu (#page-X, donna propose inclus) défile dessous.
   Une seule source de style pour toutes les pages -> cohérence 100%.
   ═══════════════════════════════════════════════════════════════════════ */

/* Bloc de chrome : collé en haut du conteneur qui scrolle (.shellv2-main),
   reste fixe pendant que le contenu défile. Déborde du padding-x du main
   (marge négative, comme .ph) pour aller bord à bord ; fond = canvas --bg. */
.donna-chrome{
  position: sticky;
  top: 0;
  z-index: 30;
  flex-shrink: 0;
  background: var(--bg);
  margin-top: 0 !important;
  margin-left: calc(-1 * var(--shellv2-main-px, 24px)) !important;
  margin-right: calc(-1 * var(--shellv2-main-px, 24px)) !important;
  margin-bottom: 18px !important;
}

/* ── Bande 1 : header ────────────────────────────────────────────────── */
.dchrome-head{
  height: 48px;
  display: flex;
  align-items: center;
  gap: 12px;
  /* padding interne = main-px + 24 -> le contenu s'aligne sur le tableau (48px) */
  padding: 0 calc(var(--shellv2-main-px, 24px) + 24px);
  background: var(--bg);
  border-bottom: 1px solid var(--border);
}
.dchrome-hl{ display:flex; align-items:center; gap:10px; min-width:0; }
.dchrome-icon{ display:inline-flex; color:var(--text-dim); flex-shrink:0; }
.dchrome-icon svg{ width:18px; height:18px; }
.dchrome-title{ font-weight:800; font-size:16px; letter-spacing:-.01em; color:var(--text); white-space:nowrap; }
.dchrome-count{ font-size:12.5px; font-weight:600; color:var(--muted); white-space:nowrap; }
.dchrome-actions{ margin-left:auto; display:flex; align-items:center; gap:8px; flex-shrink:0; }

/* ── Bande 2 : filtres ───────────────────────────────────────────────── */
.dchrome-filters{
  height: 44px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 calc(var(--shellv2-main-px, 24px) + 24px);
  background: var(--bg);
  border-bottom: 1px solid var(--border);
}
.dchrome-lead{
  font-family: var(--mono, 'JetBrains Mono', monospace);
  font-size: 11px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .07em;
  color: var(--muted);
  padding-right: 12px;
  border-right: 1px solid var(--border);
  flex-shrink: 0;
  white-space: nowrap;
}
.dchrome-scroll{
  display:flex; align-items:center; gap:6px;
  flex:1; min-width:0;
  overflow-x:auto; overflow-y:visible;
  scrollbar-width:none;
}
.dchrome-scroll::-webkit-scrollbar{ display:none; }
.dchrome-fright{
  flex-shrink:0;
  display:flex; align-items:center; gap:8px;
  padding-left:12px;
  border-left:1px solid var(--border);
}
.dchrome-fright:empty{ display:none; }

/* ── La barre de filtres du kit (.dfb-bar) rendue DANS la bande chrome :
   display:contents -> le box .dfb-bar disparaît, ses chips deviennent enfants
   DIRECTS de .dchrome-scroll (un seul conteneur de scroll horizontal, plus de
   double-scroll imbriqué qui faisait sauter/reset la position). Le cadre b2047
   et le label ::before ne s'appliquent plus (box absent). */
.dchrome-scroll .dfb-bar{
  display: contents;
}
/* [v2060] Masque le label 'Filtres' ::before de b2047 (déjà porté par .dchrome-lead)
   — display:contents ne supprime pas les pseudo-éléments -> double 'FILTRES'. */
.dchrome-scroll .dfb-bar::before{ display:none !important; content:none !important; }

/* Chips compacts en mode chrome — hauteur fixe réduite (retour Anthony) */
.dchrome-scroll .df-pill{ height:26px; padding:0 10px; font-size:12px; box-sizing:border-box; border-radius:var(--radius); }
.dchrome-scroll .df-tog{ height:26px; box-sizing:border-box; }

/* "Tout effacer" migré dans la bande droite si présent */
.dchrome-fright .df-allclear{ white-space:nowrap; }

/* Page migrée : la barre de filtres historique DANS le contenu est masquée
   (ses chips vivent désormais dans la bande chrome). */
body.dchrome-on .clients-filters{ display:none !important; }

/* Le .shellv2-main garde son scroll ; le chrome sticky s'y ancre. Pas de
   gap flex entre le chrome et le contenu. */
.shellv2-main.shellv2-main--has-ph > .donna-chrome{ margin:0; }

/* Air autour de "donna propose" en mode chrome : le header fixe fournit le gap
   du haut (margin-bottom du .donna-chrome) ; on garantit l'air sous le bandeau
   avant le tableau. */
body.dchrome-on #page-clients .biens-rail-donna{
  margin-top: 0 !important;
  margin-bottom: 10px !important; /* [v2091] gap unifié Biens=Clients */
}
/* [v2091] On neutralise le margin-top de .clients-table (défini dans shell-v2.css,
   pas toujours redéployé) -> le gap Clients est piloté ICI, uniquement par le rail. */
body.dchrome-on #page-clients .clients-table{ margin-top: 0 !important; }

/* [v2073] GAP S1 (Biens + Prospects) aligné sur Clients (retour Anthony : le gap
   au-dessus du contenu était plus grand). Clients a padding-top:0 (shell-v2.css) ;
   Biens/Prospects ne l'avaient pas -> même traitement page-level. Le rail biens est
   déjà resserré (margin-bottom 6px via biens-dfb-on) : on n'y touche pas. */
body.dchrome-on.shell-v2-on #page-biens,
body.dchrome-on.shell-v2-on #page-prospects{ padding-top: 0 !important; }

/* [v2086] LE VRAI VRAI coupable (b2085 ratait à cause d'un MAUVAIS PARENT). Le markup
   de #biens-content (en dur dans index.html) contient EN TÊTE : #biens-ctrl-row (compteur
   + boutons de vue ≡Tableau/⊞Vignettes/🗺Carte) et #biens-arr-chips (div vide avec
   margin:0 0 12px 0 INLINE). Ces deux-là sont enfants de #biens-content, PAS de
   .biens-main-v2 -> mon `.biens-main-v2 > #biens-ctrl-row` ne matchait JAMAIS. Les boutons
   de vue vivent désormais dans le chrome -> cette ligne résiduelle EST le gap.
   FIX : on cible par ID sous #page-biens (2 ids = spécificité qui bat l'inline via
   !important) + toolbar-row/view-switch (enfants directs de .biens-main-v2, eux). */
/* [v2088] Le vide restant est un FLEX GAP DANS #biens-content (inspecteur Anthony :
   bande hachurée en tête = gap flex). #biens-content est flex-column avec gap:8px, et
   #biens-arr-chips (div VIDE, margin 0 0 12px inline) reste un item flex même vide ->
   le gap s'applique autour = du vide au sommet, en tableau ET vignette. FIX : on masque
   les items de tête (ctrl-row/arr-chips/filterbar) ET on met le gap de #biens-content à 0
   en mode chrome (une seule vue visible -> 0 gap ne resserre rien) + vues collées au haut.
   (#biens-bulk-bar RETIRÉ du masquage : il doit réapparaître en sélection multiple.) */
/* [v2089] Reste un gap AU-DESSUS de #biens-content (box model : #biens-content a
   margin/padding/gap = 0, donc plus rien à l'intérieur ; le vide est entre le rail et
   le contenu). Élément fantôme : .page-toolbar-row / .page-view-switcher / .page-chips-bar
   (résidus du view-switch migré dans le chrome) que mon `.biens-main-v2 > ...` ratait
   (mauvaise profondeur). On les masque à N'IMPORTE QUELLE profondeur sous #page-biens,
   + gap flex de #biens-content à 0. Rail descendu à 6px (Anthony : encore trop). */
body.dchrome-on.shell-v2-on #page-biens #biens-ctrl-row,
body.dchrome-on.shell-v2-on #page-biens #biens-arr-chips,
body.dchrome-on.shell-v2-on #page-biens #biens-filterbar,
body.dchrome-on.shell-v2-on #page-biens .page-chips-bar,
body.dchrome-on.shell-v2-on #page-biens .page-toolbar-row,
body.dchrome-on.shell-v2-on #page-biens .page-toolbar-spacer,
body.dchrome-on.shell-v2-on #page-biens .biens-main-v2 .page-view-switcher{
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
body.dchrome-on.shell-v2-on #page-biens #biens-content{
  gap: 0 !important;
  row-gap: 0 !important;
  padding-top: 0 !important;
}
body.dchrome-on.shell-v2-on #page-biens #biens-content > #biens-table-view,
body.dchrome-on.shell-v2-on #page-biens #biens-content > #biens-grid-view,
body.dchrome-on.shell-v2-on #page-biens #biens-content > #biens-map-view{
  margin-top: 0 !important;
}
/* Rail Biens = 6px (gap encore réduit). */
body.dchrome-on.shell-v2-on #page-biens .biens-main-v2 > .biens-rail-donna{
  margin-top: 0 !important;
  margin-bottom: 10px !important; /* [v2091] gap unifié Biens=Clients */
}
body.dchrome-on.shell-v2-on #page-biens .biens-main-v2 > #biens-content{
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* [v2074] GAP barre de filtres -> contenu sur PROSPECTS + DOSSIERS (retour Anthony :
   "pas bons"). Le SEUL gap doit être le margin-bottom:18px du chrome, comme Clients.
   Le wrapper de contenu de chaque page portait un padding-top résiduel (ou le
   double-padding legacy .vend-page 20px) qui s'ajoutait au gap du chrome. On force
   leur padding-top à 0 -> distance identique à Clients sous la bande de filtres. */
body.dchrome-on #page-prospects .prp-scope{ padding-top: 0 !important; }
body.dchrome-on #page-vendeurs .vend-page{ padding-top: 0 !important; }
/* [v2075] Prospects : la structure réelle est .prp-scope > .prp-onecol > (table),
   or la règle de reset margin-top de prospects.css cible .prp-scope > .prp-table-wrap
   (enfant DIRECT) -> elle rate le grand-enfant à cause du wrapper .prp-onecol, d'où
   une marge résiduelle au-dessus du contenu (gap plus grand que Dossier). On zéro-ise
   le 1er enfant de .prp-onecol -> aligné pile sur Dossier (18px du chrome, rien de plus). */
body.dchrome-on #page-prospects .prp-onecol > *:first-child{ margin-top: 0 !important; }

/* [v2053] FIX scroll horizontal des filtres qui "sautait"/revenait au début :
   - overflow-anchor:none coupe le scroll-anchoring du navigateur (reflow -> jump)
   - les popovers cachés sortent du flux (sinon ils gonflent le scrollWidth et
     le scroll "rebondit") */
.dchrome-scroll{ overflow-anchor:none; scroll-behavior:auto; }
.dchrome-scroll .df-pop:not(.show){ display:none !important; }


/* [v2056] Filtres ACTIFS en style "S1" : relief blanc (surface + bordure + ombre)
   comme un bouton en relief, au lieu du violet accent-dim. */
.dchrome-scroll .df-pill.applied{
  background: var(--surface) !important;
  border-color: var(--border-hi) !important;
  box-shadow: var(--shadow);
  color: var(--text);
}
.dchrome-scroll .df-pill.applied .lb{ color: var(--text-dim); }
.dchrome-scroll .df-pill.applied .vl{ color: var(--text); }
.dchrome-scroll .df-pill.applied .xr{ color: var(--muted); }
.dchrome-scroll .df-pill.applied .badge{ background: var(--text-dim); }

/* [v2061] Pages migrées : les hosts de filtres HISTORIQUES (dans le contenu)
   sont masqués — leurs chips vivent désormais dans le slot du chrome. */
body.dchrome-on #biens-filterbar,
body.dchrome-on #vf-chips-host{ display:none !important; }

/* [v2067] Dossiers : le view-switch (Tableau/Kanban) + l'engrenage colonnes sont
   désormais dans la barre du chrome (comme Prospects). La .vend-main-toolbar ne
   portait plus que le switcher flottant (host filtres déjà masqué) -> on la masque
   pour supprimer le gap au-dessus du contenu. Les selects d'état #ef-an/#ef-etape
   restent dans le DOM et lisibles (display:none). */
body.dchrome-on #page-vendeurs .vend-main-toolbar{ display:none !important; }

/* [v2062] Toggles ACTIFS en style "S1" (blanc-relief) comme les pills actives,
   plus de violet. Le switch en ton neutre. */
.dchrome-scroll .df-tog.on{
  background: var(--surface) !important;
  border-color: var(--border-hi) !important;
  box-shadow: var(--shadow);
  color: var(--text);
}
.dchrome-scroll .df-tog.on .sw{ background: var(--text-dim) !important; }

/* [v2062] Tâches migrée : padding symétrique 24px des deux côtés (aligné sur
   les bandes du chrome), fini l'extra gauche seul qui décalait le contenu. */
body.dchrome-on.shell-v2-on #page-tasks{ padding: 0 24px 40px !important; margin: 0 !important; }

/* [v2063] Prospects migré : masque une éventuelle toolbar inline résiduelle
   (rendue avant que le slot chrome existe) — la vraie vit dans le slot. */
body.dchrome-on #page-prospects .prp-onecol > .dfb-bar{ display:none !important; }

/* [v2064] Engrenage (kanban cols) centré verticalement dans la bande */
.dchrome-scroll .prp-kb-gear{ align-self:center; display:inline-flex; align-items:center; justify-content:center; height:26px; }

/* [v2065] Prospection : sous-vues (dashboard/fiche/sous-capot) gardent leur
   en-tête inline -> on masque le chrome quand body.pp-subview est posé. La vue
   leads retire pp-subview et affiche le chrome (header + filtres). */
body.pp-subview .donna-chrome{ display:none !important; }

/* [v2066] S2 — Boutons SUPERADMIN / Beta Test / Modèle / Zone de Prospection.
   Ces boutons sont des .ph-add.ghost stylés par `.pp-ph-r .ph-add.ghost`
   (width:auto + padding label) dans le header custom .pp-scope. Dans le chrome
   ils vivent dans .dchrome-actions (HORS #page-prospection) -> ils perdent cet
   override et retombent sur le .ph-add.ghost de base (page-header.css : icon-only
   width:26px, padding:0) -> le label est écrasé et les boutons se chevauchent.
   FIX : on dé-scope la largeur/padding, ciblé sur les data-act de prospection
   (prospection-only -> aucun autre bouton d'action de page n'est touché).
   Spécificité (0,3,0) > base (0,1,0). */
.dchrome-actions .ph-add.ghost[data-act="toggle-superadmin"],
.dchrome-actions .ph-add.ghost[data-act="pp-su-toggle"],
.dchrome-actions .ph-add.ghost[data-act="pp-model-selector"],
.dchrome-actions .ph-add.ghost[data-act="open-zone-modal"]{
  width: auto;
  padding: 0 10px 0 8px;
}

/* ══════════ [v2072] AGENDA migré dans le chrome (composants classiques) ══════════
   La barre d'options de l'agenda est rendue dans #dchrome-slot-agenda en
   composants CLASSIQUES (.dfb-bar + .df-dd, stylés par filter-bar.css) : Vue /
   Événement / Consultant en dropdowns comme les autres pages (retour Anthony).
   Nav ‹ Aujourd'hui › + date compacte = styles dédiés ci-dessous. Icônes
   utilitaires (recherche/sync/zoom/refresh/réglages) dans le fright. */
body.dchrome-on .donna-chrome[data-pg-hero="agenda"] .dchrome-lead{ display:none !important; }
/* Nav ‹ Aujourd'hui › — groupe bordé compact (fix UI du bandeau précédent) */
.ag-cbar-nav{
  display:inline-flex; align-items:center; gap:2px; flex-shrink:0;
  border:1px solid var(--border); border-radius:8px;
  background:var(--surface); padding:2px; box-shadow:var(--shadow);
}
.ag-cbar-nav .ag-cbar-arrow{
  width:24px; height:24px; display:grid; place-items:center;
  background:transparent; color:var(--muted); border:0; border-radius:6px;
  cursor:pointer; font-size:16px; line-height:1; font-family:inherit;
}
.ag-cbar-nav .ag-cbar-arrow:hover{ background:var(--s2); color:var(--text); }
.ag-cbar-nav .ag-cbar-today{
  height:24px; padding:0 10px; background:transparent; color:var(--text);
  border:0; border-radius:6px; cursor:pointer;
  font-size:12px; font-weight:600; white-space:nowrap; font-family:inherit;
}
.ag-cbar-nav .ag-cbar-today:hover{ background:var(--s2); }
/* Date compacte (plus petite + année en muted) */
.ag-cbar-date{
  font-size:13px; font-weight:600; color:var(--text);
  white-space:nowrap; font-variant-numeric:tabular-nums; flex-shrink:0;
  display:inline-flex; align-items:baseline; gap:5px; margin-right:2px;
}
.ag-cbar-date .yr{ color:var(--muted); font-weight:400; }
/* Icônes utilitaires dans le fright (recherche/sync/zoom/refresh/réglages) */
.donna-chrome[data-pg-hero="agenda"] .dchrome-fright{ display:flex; align-items:center; gap:6px; }
.donna-chrome[data-pg-hero="agenda"] .agenda-settings-btn,
.donna-chrome[data-pg-hero="agenda"] .icon-btn{
  width:28px; height:28px; display:grid; place-items:center;
  background:var(--surface); color:var(--muted);
  border:1px solid var(--border); border-radius:8px; cursor:pointer;
  position:relative; flex-shrink:0;
}
.donna-chrome[data-pg-hero="agenda"] .agenda-settings-btn:hover,
.donna-chrome[data-pg-hero="agenda"] .icon-btn:hover{ background:var(--s2); color:var(--text); }
.donna-chrome[data-pg-hero="agenda"] .agenda-settings-btn svg,
.donna-chrome[data-pg-hero="agenda"] .icon-btn svg{ width:14px; height:14px; stroke:currentColor; fill:none; stroke-width:2; }
.donna-chrome[data-pg-hero="agenda"] .agenda-filter-badge{
  position:absolute; top:-4px; right:-4px; min-width:14px; height:14px; padding:0 3px;
  background:var(--accent); color:#fff; border-radius:99px; font-size:9px; font-weight:700;
  display:flex; align-items:center; justify-content:center;
}

/* ══════════ [v2077] COMPTA migrée dans le chrome ══════════
   La barre de filtres compta (#ca-filters-wrap = .cs-toolbar.ca-filters, statique
   dans index.html) est DÉPLACÉE dans #dchrome-slot-mandats par _DCHROME_FR.mandats.
   Dans le slot, elle perd son cadre (fond/bordure/ombre/marge du mode shell-v2) —
   la bande de filtres du chrome fournit déjà le conteneur — et défile horizontalement
   comme les autres pages. Recherche + dropdowns Année/Statut + actions (Graphique/
   Colonnes/Calculs) intacts (handlers câblés sur les éléments -> survivent au move). */
#dchrome-slot-mandats > .ca-filters,
#dchrome-slot-mandats > .cs-toolbar{
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  flex-wrap: nowrap !important;
  overflow: visible !important;
  width: 100%;
}
/* La recherche + les chips actions gardent leur relief propre (fond/bordure) mais
   compacts pour tenir dans la bande de 44px. */
#dchrome-slot-mandats .cs-search{ height: 30px; }