/* Le dossier : rubriques, en-tête et fiche, barre des chiffres, fiscalité.
   Extrait tel quel de index.html (découpage du front). */

/* Cadre « Dossier » regroupant Gérer / Supprimer / Favori. <fieldset>+<legend>
   donne nativement la bordure arrondie avec le libellé posé sur la ligne
   (interruption du trait). */
.dossier-actions {
  display: inline-flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.35rem;
  margin: 0;
  padding: 0.28rem 0.5rem 0.4rem;
  border: 1px solid #cbd5e1;
  border-radius: 0.8rem;
}
.dossier-actions > legend {
  width: auto;            /* annule la légende pleine largeur par défaut */
  float: none;
  padding: 0 0.3rem;
  margin-left: 0.1rem;
  font-size: 0.6rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #94a3b8;
}
/* Bouton « Supprimer le dossier » : danger discret, s'assume au survol. */
.dossier-del-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  height: 30px;
  padding: 0 0.6rem;
  border-radius: 0.5rem;
  border: 1px solid #fecaca;
  background: #fff;
  color: #dc2626;
  font-size: 0.78rem;
  font-weight: 700;
  cursor: pointer;
  transition: background .12s, border-color .12s;
}
.dossier-del-btn:hover { background: #fef2f2; border-color: #f87171; }
/* Pas de dossier à supprimer → bouton grisé, non cliquable (mais toujours visible). */
.dossier-del-btn:disabled {
  color: #cbd5e1;
  border-color: #e2e8f0;
  background: #fff;
  cursor: not-allowed;
}
.dossier-del-btn:disabled:hover { background: #fff; border-color: #e2e8f0; }

.field-chip-missing {
  background: #fee2e2;
  color: #b91c1c;
}

/* DEUX NIVEAUX, deux traitements DIFFÉRENTS — sinon rien ne hiérarchise.
   Niveau 1, la SECTION : même idiome que la bascule Recherche/Gestion en haut
   de page (piste arrondie, pastille active pleine). On réutilise la grammaire
   existante plutôt que d'en inventer une.
   Niveau 2, l'ONGLET : aucun fond, aucune ombre — juste un soulignement. Deux
   pastilles pleines superposées (marine puis bleue) se disputaient l'attention
   et n'indiquaient plus laquelle portait le choix structurant. */
.management-section-nav {
  display: inline-flex;
  flex-wrap: wrap;
  gap: .35rem;
  padding: .3rem;
  /* Demi-hauteur d'une ligne, pas 9999px : sur une ligne c'est la même
     capsule, et quand les neuf rubriques passent à la ligne le cadre reste un
     rectangle arrondi au lieu de se gonfler en ovale. */
  border-radius: 1.45rem;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
}
/* Sur téléphone, une seule ligne qui défile : quatre rangées de rubriques
   repoussaient le contenu d'un écran entier. */
@media (max-width: 640px) {
  .management-section-nav { display: flex; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
  .management-section-btn { white-space: nowrap; flex: 0 0 auto; }
}
.management-section-btn {
  position: relative;
  padding: .5rem 1.05rem;
  border: 0;
  border-radius: 9999px;
  background: transparent;
  font-size: .88rem;
  font-weight: 700;
  color: #475569;
  cursor: pointer;
  transition: background .18s, color .18s, box-shadow .18s;
}
.management-section-btn:hover { color: #0f172a; background: rgba(255, 255, 255, .8); }

.management-subtab-nav {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  padding-bottom: .25rem;
}

.management-subtab-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .65rem 1rem;
  border-radius: .85rem;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  color: #475569;
  font-size: .9rem;
  font-weight: 600;
  transition: all .18s ease;
}

.management-subtab-btn:hover {
  border-color: #cbd5e1;
  color: #0f172a;
}

.management-subtab-btn.active {
  background: #0f172a;
  border-color: #0f172a;
  color: #ffffff;
  box-shadow: 0 12px 24px rgba(15, 23, 42, .14);
}

/* Barre des onglets d'une section : du texte souligné, rien de plus. Le bleu
   plein d'avant introduisait un accent qui n'existe nulle part ailleurs. */
.management-subnav {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem;
  margin-top: .75rem;
  margin-bottom: .25rem;
  border-bottom: 1px solid #e2e8f0;
}
.management-subnav .management-subtab-btn {
  padding: .5rem .85rem .6rem;
  font-size: .85rem;
  font-weight: 600;
  color: #64748b;
  background: transparent;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  box-shadow: none;
  margin-bottom: -1px;
}
.management-subnav .management-subtab-btn:hover {
  color: #0f172a;
  border-bottom-color: #cbd5e1;
}
.management-subnav .management-subtab-btn.active {
  color: #0f172a;
  background: transparent;
  border-bottom-color: #0f172a;
  box-shadow: none;
}
.management-subnav:empty { display: none; }
/* Le badge de champs manquants suit le texte, plus une pastille flottante. */
.management-subnav .tab-badge { top: 2px; right: -2px; }

/* Une source est un LIEN : une pastille cliquable suffit. La tuile qui l'entourait
   affichait « 1 » en gros pour dire qu'il y en avait une. */
.source-chip {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .35rem .7rem; border-radius: 999px;
  border: 1px solid #e2e8f0; background: #f8fafc;
  font-size: .8rem; font-weight: 600; color: #334155;
  transition: border-color .14s, color .14s;
}
.source-chip:hover { border-color: #94a3b8; color: #0f172a; }

.energy-cell { cursor: pointer; transition: opacity .12s, transform .12s; }
.energy-cell:hover { opacity: .85 !important; transform: translateY(-1px); }

/* Décomposition : lignes d'un tableau, pas d'un formulaire. */
.lot-row:nth-child(odd) { background: rgba(148, 163, 184, .06); }
/* Le zébrage aide à suivre une longue rangée de colonnes ; sur des groupes de
   deux ou trois lignes, il ne fait que du bruit. */
.lot-row.sans-zebre:nth-child(odd) { background: transparent; }
/* SAISIE REPLIÉE. Un formulaire d'ajout ouvert en permanence occupe l'onglet
   alors qu'on ajoute rarement : il se demande. <details> plutôt qu'un bouton et
   du JS — l'état tient dans le DOM et survit à tout. */
.deplier > summary {
  display: inline-flex; align-items: center; gap: .4rem; cursor: pointer; list-style: none;
  font-size: .8rem; font-weight: 600; color: #334155;
  border: 1px dashed #cbd5e1; border-radius: .75rem; padding: .45rem .8rem;
}
.deplier > summary::-webkit-details-marker { display: none; }
.deplier > summary::before { content: '+'; font-size: 1rem; line-height: 1; }
.deplier[open] > summary::before { content: '−'; }
.deplier > summary:hover { background: rgba(15, 23, 42, .04); }
.deplier[open] > summary { margin-bottom: .75rem; }
.deplier-corps { border: 1px dashed #cbd5e1; border-radius: .75rem; padding: .75rem; }
/* Une rangée qui cache un message le dit par un chevron, sinon rien ne laisse
   deviner qu'elle s'ouvre. */
.echange-deplie > summary::-webkit-details-marker { display: none; }
/* `hidden` se fait battre par toute classe qui pose un display ; une classe
   dédiée, elle, ne se fait pas doubler. */
.est-cache { display: none !important; }
/* BANDEAU DU DOSSIER. Il portait un dégradé sombre en dur, et tout ce qu'il
   contient était écrit pour ce fond : il restait nuit en plein jour. Ses teintes
   passent par des jetons, définis ici en clair et redéfinis en sombre. Les
   quatre couleurs de catégorie, elles, ne bougent pas — elles portent du sens. */
.hero-dossier {
  background: linear-gradient(135deg, #eef3f9 0%, #e8eef7 58%, #dfe9f5 100%);
  --hero-ink: #0f172a;
  --hero-ink-2: #1e293b;
  --hero-ink-3: #64748b;
  --hero-voile: rgba(15, 23, 42, .06);
  --hero-voile-bord: rgba(15, 23, 42, .12);
  --hero-trait: rgba(15, 23, 42, .10);
  --hero-base-perso-fond: rgba(124, 58, 237, .12);
  --hero-base-perso-ink: #6d28d9;
  --hero-base-est-fond: rgba(2, 132, 199, .12);
  --hero-base-est-ink: #0369a1;
}
html[data-theme="dark"] .hero-dossier {
  background: linear-gradient(135deg, #162234 0%, #203248 58%, #26445f 100%);
  --hero-ink: #f8fafc;
  --hero-ink-2: #e2e8f0;
  --hero-ink-3: #94a3b8;
  --hero-voile: rgba(255, 255, 255, .14);
  --hero-voile-bord: rgba(255, 255, 255, .18);
  --hero-trait: rgba(255, 255, 255, .10);
  --hero-base-perso-fond: rgba(196, 181, 253, .2);
  --hero-base-perso-ink: #ddd6fe;
  --hero-base-est-fond: rgba(125, 211, 252, .18);
  --hero-base-est-ink: #bae6fd;
}
/* LE TABLEAU DES RÉGIMES. Une ligne par régime, les mêmes colonnes pour tous :
   c'est la comparabilité qui fait le choix. Sur téléphone, chaque chiffre
   porte son libellé et la ligne se replie. */
.fx-ligne { display: grid; grid-template-columns: minmax(11rem, 1.6fr) repeat(3, minmax(6rem, 1fr)) 7.5rem;
  align-items: center; gap: 8px 16px; padding: 8px 10px; border-top: 1px solid var(--hairline); font-size: 13px; }
.fx-tete { border-top: 0; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-3); padding-bottom: 4px; }
/* Des intitulés de deux mots et plus : ils passent à la ligne plutôt que de
   déborder sur la colonne voisine. */
.fx-tete .fx-nombre { white-space: normal; align-self: end; }
.fx-famille { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin-top: 10px; padding: 6px 10px;
  font-size: 12px; font-weight: 600; color: var(--ink-2); background: var(--surface-2); border-radius: 8px; }
.fx-classe { flex-basis: 100%; display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 400; color: var(--ink-2); }
.fx-classe[hidden] { display: none; }
.fx-nom { display: flex; align-items: center; flex-wrap: wrap; gap: 2px 6px; color: var(--ink); }
.fx-nombre { text-align: right; font-variant-numeric: tabular-nums; color: var(--ink-2); white-space: nowrap; }
.fx-fort { font-size: 15px; font-weight: 600; }
.fx-unite { font-size: 11px; font-weight: 400; color: var(--ink-3); margin-left: 2px; }
.fx-action { text-align: right; }
.fx-retenu { font-size: 12px; font-weight: 600; color: var(--cashflow-positive); }
.fx-retirer { display: block; margin-left: auto; font-size: 11px; color: var(--ink-3); text-decoration: underline; background: none; border: 0; padding: 0; cursor: pointer; }
@media (max-width: 640px) { .fx-retirer { display: inline; margin-left: 8px; } }
.fx-choisi { background: color-mix(in srgb, var(--cashflow-positive) 7%, transparent); border-radius: 8px; }
.fx-pastille { font-size: 11px; font-weight: 600; padding: 1px 7px; border-radius: 999px; cursor: help;
  color: var(--cashflow-ld-label); background: color-mix(in srgb, var(--cashflow-ld-label) 12%, transparent); }
.fx-tiret { color: var(--ink-3); font-weight: 400; }
.fx-detail { font-size: 11px; color: var(--ink-3); white-space: normal; }
/* Statut fiscal et régime social du meublé : deux lignes, une pastille chacune,
   teintée selon le cas. Les libellés sont alignés en colonne. */
.fx-statut-bloc { display: grid; gap: 8px; padding: 10px 12px; margin-bottom: 12px; border-radius: 10px;
  border: 1px solid var(--hairline); background: var(--surface-2); font-size: 13px; color: var(--ink-2); }
.fx-statut-ligne { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; }
.fx-statut-lib { flex: 0 0 9.5rem; font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-3); }
.fx-statut-pastille { font-size: 13px; font-weight: 700; padding: 2px 12px; border-radius: 999px;
  color: var(--statut-ink); background: color-mix(in srgb, var(--statut-ink) 14%, transparent); border: 1px solid color-mix(in srgb, var(--statut-ink) 40%, transparent); }
.fx-statut-texte { display: inline-flex; align-items: center; gap: 4px; }
.fx-option { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--ink-2); white-space: nowrap; }
@media (max-width: 640px) { .fx-option { margin-left: 0; } }
.fx-statut-ligne[data-statut="lmnp"], .fx-statut-ligne[data-statut="ps"] { --statut-ink: var(--cashflow-ld-label); }
.fx-statut-ligne[data-statut="lmp"], .fx-statut-ligne[data-statut="lmnpLmp"], .fx-statut-ligne[data-statut="ssi"] { --statut-ink: var(--cashflow-custom-label); }
.fx-statut-ligne[data-statut="inconnu"] { --statut-ink: var(--ink-3); }
.fx-statut-ligne[data-statut="inconnu"] .fx-statut-pastille { border-style: dashed; }
@media (max-width: 640px) { .fx-statut-lib { flex-basis: 100%; } }
.fx-ferme .fx-nom > .font-semibold { color: var(--ink-3); }
.fx-bascule { flex-basis: 100%; font-size: 11px; font-weight: 400; color: var(--ink-3); display: inline-flex; align-items: center; gap: 4px; }
.fx-amort { border-top: 1px solid var(--hairline); }
@media (max-width: 640px) {
  .fx-tete { display: none; }
  .fx-ligne { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fx-nom, .fx-action, .fx-fort { grid-column: 1 / -1; }
  .fx-action { text-align: left; }
  .fx-nombre { text-align: left; }
  .fx-nombre::before { content: attr(data-libelle); display: block; font-size: 10px; font-weight: 400; color: var(--ink-3); white-space: normal; }
  .fx-nombre { white-space: normal; }
  .fx-ligne { align-items: start; }
}
/* L'EN-TÊTE DU DOSSIER, en trois niveaux : identité, chiffres clés, détail. */
.hero-identite { display: grid; gap: 4px; }
.hero-type { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--hero-ink-3); }
.hero-adresse { display: grid; font-style: normal; font-size: 17px; font-weight: 600; line-height: 1.35; color: var(--hero-ink); }
.hero-cles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px 24px; }
.hero-cle-libelle { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: var(--hero-ink-3); }
.hero-cle-valeur { font-size: 26px; font-weight: 700; line-height: 1.15; color: var(--hero-ink); font-variant-numeric: tabular-nums; margin-top: 2px; }
.hero-cle-valeur .hf-unite { font-size: 14px; font-weight: 500; color: var(--hero-ink-3); margin-left: 3px; }
.hero-cle-note { font-size: 11px; color: var(--hero-ink-3); margin-top: 1px; }
.hero-details { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 22px; padding-top: 10px; border-top: 1px solid var(--hero-trait); font-size: 13px; color: var(--hero-ink-2); }
.hero-detail-libelle { color: var(--hero-ink-3); margin-right: 4px; }
.hero-vide { color: var(--hero-ink-3); }
@media (max-width: 640px) { .hero-cles { grid-template-columns: repeat(2, minmax(0, 1fr)); } .hero-cle-valeur { font-size: 21px; } }
/* Sur téléphone, deux colonnes et non une : onze cellules empilées faisaient
   défiler un écran entier avant l'échéancier. */
.echange-deplie > summary { list-style: none; }
.echange-deplie > summary::after {
  content: '⌄'; color: #94a3b8; font-size: .9rem; line-height: 1;
  flex: 0 0 auto; transition: transform .12s;
}
.echange-deplie[open] > summary::after { transform: rotate(180deg); }
html[data-theme="dark"] .deplier > summary,
html[data-theme="dark"] .deplier-corps { border-color: var(--hairline); }
html[data-theme="dark"] .deplier > summary { color: var(--ink-2); }
html[data-theme="dark"] .deplier > summary:hover { background: rgba(148, 163, 184, .12); }
/* Des groupes de hauteurs inégales : en grille, le troisième se posait sous le
   premier en laissant un trou sous le deuxième. Un flux en colonnes les enchaîne. */
.colonnes-lever { column-gap: 1.5rem; }
.colonnes-lever > div { break-inside: avoid; margin-bottom: 1rem; }
@media (min-width: 60rem) { .colonnes-lever { column-count: 2; } }
.lot-row.est-rempli { background: rgba(37, 99, 235, .06); }
.lot-row { padding-left: .5rem; padding-right: .5rem; border-radius: .35rem; }
.bp-surface-del {
  opacity: 0; transition: opacity .12s; line-height: 1;
  font-size: 17px; color: #94a3b8; padding: 0 .35rem;
}
.lot-row:hover .bp-surface-del,
.lot-row:focus-within .bp-surface-del { opacity: 1; }
.bp-surface-del:hover { color: #e11d48; }
.tab-badge {
  position: absolute; top: -7px; right: -7px;
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 18px; height: 18px; padding: 0 4px;
  border-radius: 999px; background: #ef4444; color: #fff;
  border: 2px solid #fff; box-shadow: 0 1px 3px rgba(15,23,42,.25);
  font-size: 10px; font-weight: 700; line-height: 1;
}

.management-panel {
  display: none;
}

.management-panel.active {
  display: block;
}

.metric-tile {
  border-radius: 1.15rem;
  border: 1px solid rgba(226, 232, 240, .95);
  background: rgba(255, 255, 255, .92);
  padding: 1rem;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .7);
}

.channel-tile {
  border-radius: 1rem;
  border: 1px solid #e2e8f0;
  background: #ffffff;
  padding: .95rem 1rem;
}

/* Cadre dossier sur deux lignes : ce qui QUALIFIE la fiche (source, part de
   donnees connues) au-dessus, ce qui l'ACTIONNE en dessous. */
.dossier-meta {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.4rem;
}

.dossier-buttons {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

/* « + » d'ajout, DANS l'onglet « Mes dossiers » : il suit le libelle et partage
   son alignement vertical, au lieu de flotter a cote avec des marges negatives.
   Visible seulement quand l'onglet est ouvert. */
.cases-add {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  margin-left: 0.4rem;
  border-radius: 999px;
  background: #e2e8f0;
  color: #475569;
  font-size: 13px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  transition: background .15s, color .15s;
}

.cases-add:hover {
  background: #0f172a;
  color: #ffffff;
}

/* LA BARRE DES FILTRES TIENT SUR UNE LIGNE. Elle empilait cinq rangées et
   trois intitulés de section — 287 pixels — pour annoncer « aucun filtre
   actif ». Les quatre commandes sont de même rang : quatre pastilles côte à
   côte. Un panneau ouvert passe en pleine largeur, sous la ligne. */
/* LES CHIFFRES DU BIEN NE QUITTENT PAS L'ÉCRAN. Quatre grandes tuiles
   faisaient 290 px : trop pour rester collées, alors une barre de rappel les
   remplaçait au défilement — deux rendus du même compte. Il n'en reste
   qu'un, sur une ligne, collé sous la navigation dès l'ouverture du dossier.
   Même verre que la navigation, qui traverse toute la fenêtre. */
.dossier-rappel {
  position: sticky; top: var(--nav-h); z-index: 44;
  display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 24px;
  padding: 8px 0; font-size: 13px; color: var(--ink);
}
.dossier-rappel::before {
  content: ''; position: absolute; top: 0; bottom: 0;
  left: 50%; transform: translateX(-50%); width: 100vw; z-index: -1;
  background: rgba(255, 255, 255, .92); backdrop-filter: blur(8px);
  border-bottom: 1px solid #e2e8f0; box-shadow: 0 2px 10px rgba(15, 23, 42, .05);
}
html[data-theme="dark"] .dossier-rappel::before { background: rgba(15, 23, 42, .92); border-color: var(--hairline); }
.dossier-rappel .dr-valeur { font-weight: 600; font-variant-numeric: tabular-nums; }
.dossier-rappel .dr-libelle { font-size: 11px; text-transform: uppercase;
  letter-spacing: .04em; color: #64748b; margin-right: 6px; }
html[data-theme="dark"] .dossier-rappel .dr-libelle { color: var(--ink-3); }
/* L'impôt non calculé est une commande : il mène au choix du régime. */
.dossier-rappel .dr-action { background: none; border: 0; padding: 0; font: inherit;
  color: inherit; cursor: pointer; }
.dossier-rappel .dr-action .dr-valeur { text-decoration: underline dotted; text-underline-offset: 3px; }
/* « Juste en dessous » : les marges de `space-y-6` puis `space-y-4` laissaient
   40 px de page nue entre la navigation et la barre tant qu'on n'avait pas
   défilé. */
#managementWorkspace:has(#dossier-rappel:not([hidden])),
#managementContent:has(> #dossier-rappel:not([hidden])) { margin-top: 0; }
.dossier-rappel .dr-alerte { font-weight: 600; color: var(--veille-hausse); margin-left: auto; }

/* Lien vers l'annonce dans l'en-tête du dossier : une pastille qui se clique.
   La flèche dit qu'elle ouvre un autre site ; le survol, qu'elle répond. */
.lien-annonce { display: inline-flex; align-items: center; gap: .3rem; cursor: pointer;
  background: var(--hero-voile); color: var(--hero-ink-2); border: 1px solid var(--hero-voile-bord);
  transition: background .15s, border-color .15s, color .15s; }
.lien-annonce:hover, .lien-annonce:focus-visible { background: var(--hero-voile-bord); color: var(--hero-ink); border-color: var(--hero-ink-3); }
.lien-annonce-fleche { font-size: .85em; opacity: .75; }

/* LES INFORMATIONS MINIMALES d'un bien saisi à la main : des bulles sur une
   ligne en tête du dossier, chacune avec son champ ; une bulle remplie
   disparaît, la ligne avec la dernière. */
.bulles-minimales { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 14px; }
.bulles-titre { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--ink-3); margin-right: 4px; }
.bulle { display: inline-flex; align-items: center; gap: 8px; padding: 4px 6px 4px 12px; border-radius: 999px;
  background: #fff7ed; border: 1px solid #fdba74; cursor: text; }
html[data-theme="dark"] .bulle { background: rgba(251, 146, 60, .12); border-color: rgba(251, 146, 60, .45); }
.bulle-libelle { font-size: 13px; font-weight: 600; color: #9a3412; white-space: nowrap; }
html[data-theme="dark"] .bulle-libelle { color: #fdba74; }
.bulle input, .bulle select { border: 0; border-radius: 999px; padding: 4px 10px; font-size: 13px; width: 8.5rem;
  background: var(--surface); color: var(--ink); }
.bulle select { width: auto; }
.bulle-unite { font-size: 12px; color: var(--ink-3); margin-right: 6px; white-space: nowrap; }
.bulle-manque { border-color: var(--veille-hausse); }
.bulles-brouillon { font-size: 11px; font-weight: 700; padding: 2px 9px; border-radius: 999px; border: 1px dashed var(--ink-3); color: var(--ink-3); margin-right: 4px; cursor: help; }
.bulle-message { font-size: 12px; color: var(--ink-2); margin-right: 6px; }
.bulle-manque .bulle-message { color: var(--veille-hausse); }
.bulle-doublon { cursor: default; }
.bulle-geste { font: inherit; font-size: 12px; font-weight: 600; border: 0; border-radius: 999px; padding: 4px 10px; background: var(--surface); color: var(--ink); cursor: pointer; }
.bulle-geste:hover { text-decoration: underline; }
.bulle-manque .bulle-libelle { color: var(--veille-hausse); }

/* LE PARTAGE D'UN BIEN SAISI, sur la ligne des informations minimales une fois
   celles-ci remplies : privé, public, retiré — ou partagé par un autre. */
.partage { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin-bottom: 14px; padding: 8px 12px;
  border: 1px solid var(--hairline); border-radius: 12px; background: var(--surface); font-size: 13px; color: var(--ink-2); }
.partage-etat { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; padding: 2px 9px; border-radius: 999px;
  background: var(--surface-2); color: var(--ink-3); }
.partage--public .partage-etat, .partage--communaute .partage-etat { background: color-mix(in srgb, var(--veille-baisse) 14%, transparent); color: var(--veille-baisse); }
.partage--retire { color: var(--veille-hausse); border-color: color-mix(in srgb, var(--veille-hausse) 40%, transparent); }
.partage-alerte { color: var(--veille-hausse); font-weight: 600; }
.partage-note { color: var(--ink-3); }
.partage-geste { margin-left: auto; font: inherit; font-size: 13px; font-weight: 600; border: 1px solid var(--hairline); border-radius: 999px;
  padding: 5px 12px; background: var(--surface); color: var(--ink); cursor: pointer; }
.partage-geste[disabled] { opacity: .45; cursor: not-allowed; }
.partage-signaler { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; font-weight: 600; }
.partage-signaler select { font-size: 13px; border: 1px solid var(--hairline); border-radius: 8px; padding: 3px 6px; background: var(--surface); color: var(--ink); }

/* UN OUTIL QUE LA FORMULE N'OUVRE PAS : l'onglet garde sa place, grisé, avec un
   cadenas ; son panneau dit quelle formule l'ouvre, et montre son contenu inerte. */
.outil-verrouille { opacity: .55; }
.outil-cadenas { font-size: .8em; margin-right: 4px; }
.outil-ferme-bandeau { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px;
  margin-bottom: 12px; padding: 12px 14px; border-radius: 14px; font-size: 13.5px; color: var(--ink);
  background: color-mix(in srgb, var(--insigne-or) 14%, var(--surface)); border: 1px solid color-mix(in srgb, var(--insigne-or) 45%, transparent); }
.outil-ferme-geste { font: inherit; font-size: 13px; font-weight: 700; border: 0; border-radius: 999px; padding: 7px 14px;
  cursor: pointer; white-space: nowrap; }
.outil-ferme-contenu { opacity: .45; filter: grayscale(1); pointer-events: none; user-select: none; }



/* LE DOSSIER POUR LA BANQUE (dossier/dossierBanque.js). Le bouton, dans l'en-tête
   du dossier ; la page, invisible à l'écran, seule à sortir à l'impression. */
.dossier-banque-btn { font: inherit; font-size: 12px; font-weight: 700; padding: 6px 12px; border-radius: 999px; border: 0; cursor: pointer;
  background: var(--hero-ink); color: #ffffff; }
html[data-theme="dark"] .dossier-banque-btn:not(.outil-verrouille) { color: #0f172a; }
.dossier-banque-btn.outil-verrouille { background: var(--hero-voile); color: var(--hero-ink-2); }
#impressionBanque { display: none; }
@media print {
  body.impression-banque > *:not(#impressionBanque) { display: none !important; }
  body.impression-banque #impressionBanque { display: block; }
  body.impression-banque { background: #fff !important; }
  @page { margin: 16mm; }
}
.banque-page { color: #0f172a; font: 11pt/1.45 system-ui, -apple-system, "Segoe UI", sans-serif; }
.banque-entete { border-bottom: 2px solid #0f172a; padding-bottom: 10px; margin-bottom: 14px; }
.banque-marque { font-size: 9pt; font-weight: 700; letter-spacing: .3em; color: #475569; }
.banque-entete h1 { font-size: 20pt; margin: 4px 0 2px; }
.banque-sous-titre { margin: 0; font-weight: 600; }
.banque-date { margin: 2px 0 0; font-size: 9pt; color: #475569; }
.banque-section { margin-top: 14px; }
/* Une section peut passer d'une page à l'autre ; ses graphes, tuiles, lignes de
   tableau ne se coupent pas, et un titre ne reste pas seul en bas de page. */
.banque-section > h2, .banque-aide, .banque-section h3, .banque-barre-titre { break-after: avoid; page-break-after: avoid; }
/* Un titre ne reste jamais seul en bas de page : il réserve sous lui la place
   d'un premier bloc, sans l'occuper (break-after seul n'est pas tenu partout). */
.banque-section > h2::after { content: ""; display: block; height: 130px; margin-bottom: -130px; }
.banque-svg, .banque-barre, .banque-tuile, .banque-legende, .banque-colonnes, .banque-entier, .banque-section tr { break-inside: avoid; page-break-inside: avoid; }
.banque-section h2 { font-size: 12pt; margin: 0 0 6px; text-transform: uppercase; letter-spacing: .06em; color: #334155; }
.banque-section table { width: 100%; border-collapse: collapse; }
.banque-section th, .banque-section td { padding: 4px 0; border-bottom: 1px solid #e2e8f0; text-align: left; font-weight: 400; }
.banque-section td { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.banque-total th, .banque-total td { font-weight: 700; border-bottom: 1.5px solid #0f172a; }
.banque-pied { margin-top: 18px; font-size: 8.5pt; color: #475569; }
.banque-norme { display: inline-block; margin-left: 8px; font-size: 8.5pt; font-weight: 600; color: #166534; }
.banque-norme--depasse { color: #b91c1c; }
.banque-manque { padding: 6px 0; color: #475569; font-style: italic; }
/* Les infographies (dossierBanqueGraphes.js) : couleurs imprimées telles quelles. */
.banque-page { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.banque-saut { break-before: page; }
.banque-aide { margin: -2px 0 8px; font-size: 9pt; color: #475569; }
.banque-aide--apres { margin: 6px 0 0; }
.banque-section h3 { font-size: 10pt; margin: 10px 0 4px; color: #334155; }
/* En flex, pas en grille : Chrome coupe un élément de grille entre deux pages
   même quand on lui demande de ne pas le faire. */
.banque-colonnes { display: flex; gap: 0 24px; align-items: flex-start; }
.banque-colonnes > div { flex: 1 1 0; min-width: 0; }
.banque-tuiles { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
.banque-tuile { border: 1px solid #e2e8f0; border-radius: 8px; padding: 8px 10px; background: #f8fafc; break-inside: avoid; }
.banque-tuile--bon { border-color: #86efac; background: #f0fdf4; }
.banque-tuile--alerte { border-color: #fca5a5; background: #fef2f2; }
.banque-tuile-libelle { font-size: 8.5pt; font-weight: 600; color: #475569; line-height: 1.25; }
.banque-tuile-valeur { font-size: 15pt; font-weight: 800; margin-top: 2px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.banque-tuile--bon .banque-tuile-valeur { color: #166534; }
.banque-tuile--alerte .banque-tuile-valeur { color: #b91c1c; }
.banque-tuile-detail { font-size: 8pt; color: #64748b; margin-top: 1px; line-height: 1.25; }
.banque-svg { display: block; width: 100%; height: auto; overflow: visible; font-family: inherit; }
.banque-svg text { font-size: 11px; fill: #0f172a; }
.banque-svg .banque-svg-petit { font-size: 10px; fill: #475569; }
.banque-svg .banque-svg-fort { font-size: 11px; font-weight: 700; }
.banque-svg .banque-svg-dans { font-size: 11px; font-weight: 700; fill: #ffffff; }
.banque-svg--dpe { max-width: 330px; margin: 4px 0 0 auto; }
.banque-barre { margin: 6px 0 10px; }
.banque-barre-titre { font-size: 9.5pt; font-weight: 600; color: #334155; margin-bottom: 4px; }
.banque-legende { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 5px; font-size: 8.5pt; color: #334155; }
.banque-legende span { display: inline-flex; align-items: center; gap: 5px; }
.banque-legende i { display: inline-block; width: 11px; height: 11px; border-radius: 3px; }
.banque-grille { margin-top: 8px; }
.banque-section .banque-grille th { font-size: 8.5pt; font-weight: 700; color: #475569; text-align: right; }
.banque-section .banque-grille th:first-child, .banque-section .banque-grille td:first-child { text-align: left; }
.banque-section .banque-grille td { text-align: right; }
.banque-grille--serree th, .banque-grille--serree td { padding: 2px 0; font-size: 9pt; }
.banque-reference td { font-weight: 700; background: #f8fafc; }
.banque-section td.banque-bon { color: #166534; font-weight: 700; }
.banque-section td.banque-mauvais { color: #b91c1c; font-weight: 700; }
.banque-reserve { margin: 8px 0 0; padding: 6px 10px; border-left: 3px solid #b45309; background: #fffbeb; font-size: 9pt; }

/* LES GRAPHIQUES DU DOSSIER (noyau/graphes.js) : grille et axes en retrait, la
   donnée en couleur ; textes dans l'encre du thème, jamais dans la couleur d'une
   série. */
.graphe { --graphe-encre: #475569; --graphe-grille: #eef2f7; --graphe-zero: #94a3b8; --graphe-fond: #ffffff; }
html[data-theme="dark"] .graphe { --graphe-encre: #94a3b8; --graphe-grille: #1f2937; --graphe-zero: #64748b; --graphe-fond: #111827; }
.graphe-legende { display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 12px; color: var(--graphe-encre); margin-bottom: 6px; }
.graphe-legende-item { display: inline-flex; align-items: center; gap: 6px; }
.graphe-legende-item i { display: inline-block; width: 12px; height: 10px; border-radius: 2px; }
.graphe-zone { position: relative; }
.graphe-svg { display: block; overflow: visible; }
.graphe-axe { font-size: 11px; fill: var(--graphe-encre); font-variant-numeric: tabular-nums; }
.graphe-titre-panneau { font-size: 11px; font-weight: 600; fill: var(--graphe-encre); }
.graphe-grille { stroke: var(--graphe-grille); stroke-width: 1; }
.graphe-zero { stroke: var(--graphe-zero); stroke-width: 1; }
.graphe-survol { stroke: var(--graphe-zero); stroke-width: 1; stroke-dasharray: 3 3; pointer-events: none; }
.graphe-bulle { position: absolute; top: 4px; z-index: 5; pointer-events: none; min-width: 11rem; padding: 8px 10px; border-radius: 10px;
  background: var(--graphe-fond); border: 1px solid var(--graphe-grille); box-shadow: 0 6px 18px rgba(15, 23, 42, .12); font-size: 12px; color: var(--graphe-encre); }
.graphe-bulle-titre { font-weight: 700; margin-bottom: 4px; color: inherit; }
.graphe-bulle-ligne { display: grid; grid-template-columns: 10px 1fr auto; align-items: center; gap: 6px; }
.graphe-bulle-ligne i { width: 10px; height: 10px; border-radius: 2px; }
.graphe-bulle-ligne b { font-variant-numeric: tabular-nums; font-weight: 600; }

/* La synthèse ouvre le dossier, les caractéristiques restent consultables. */
.dossier-facts { margin-top:14px; border-top:1px solid var(--hero-trait); }
.dossier-facts > summary { padding:12px 0 0; cursor:pointer; font-size:13px; color:var(--hero-ink-2); }
.dossier-facts[open] > summary { margin-bottom:8px; }
.management-section-picker { display:none; }
.management-section-nav { flex-wrap:wrap; overflow:visible; padding-top:8px; gap:10px; }
.management-section-btn { min-height:40px; }
.dossier-overview { padding:24px; border:1px solid var(--hairline); border-radius:16px; background:var(--surface); color:var(--ink); }
.dossier-overview-heading { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:8px; }
.dossier-overview h2 { margin:0; font-size:20px; font-weight:600; }
.dossier-overview-heading > span { font-size:12px; color:var(--ink-3); }
.dossier-overview-metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; margin-top:24px; padding-bottom:24px; border-bottom:1px solid var(--hairline); }
.dossier-overview-metrics > div { display:grid; align-content:start; gap:7px; }
.dossier-overview-metrics span { font-size:13px; color:var(--ink-2); }
.dossier-overview-metrics strong { font-size:27px; font-weight:600; font-variant-numeric:tabular-nums; }
.dossier-overview-metrics small { font-size:12px; color:var(--ink-3); }
.dossier-overview-followup { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:20px; }
.dossier-overview h3 { font-size:14px; font-weight:600; margin-bottom:10px; }
.dossier-overview p,.dossier-overview li { font-size:14px; line-height:1.5; }
.dossier-overview ul { display:flex; flex-wrap:wrap; gap:8px; padding:0; list-style:none; }
.dossier-overview li button { padding:8px 12px; background:var(--surface-2); border:1px solid var(--hairline); border-radius:8px; color:var(--ink-2); }
.dossier-overview-followup .btn { margin-top:12px; min-height:40px; }
.dossier-stage { display:inline-block; color:var(--ink-2); font-size:12px; }
.management-panel .field-empty { border-color:var(--hairline) !important; box-shadow:none; }
.management-panel .empty-mark { color:var(--ink-3); background:var(--surface-2); border:1px solid var(--hairline); }
.tab-badge { background:var(--surface-2); color:var(--ink-2); border-color:var(--surface); box-shadow:none; }
@media(max-width:760px) {
  .management-section-nav { display:none; }
  .management-section-picker { display:grid; gap:6px; font-size:12px; color:var(--ink-2); }
  .management-section-picker select { width:100%; min-height:44px; border:1px solid var(--hairline); background:var(--surface); color:var(--ink); border-radius:10px; font-size:15px; padding:8px 12px; }
  .dossier-overview { padding:18px; }
  .dossier-overview-metrics { grid-template-columns:1fr 1fr; gap:18px; margin-top:18px; padding-bottom:18px; }
  .dossier-overview-metrics > div:last-child { grid-column:1 / -1; }
  .dossier-overview-metrics strong { font-size:24px; }
  .dossier-overview-followup { grid-template-columns:1fr; gap:20px; }
  .hero-dossier { padding:16px; }
  .bp-surface-del { opacity:1; min-height:36px; min-width:36px; }
}