/* WCAG AA (LOT 5, couche 1) : --concrete porte ~40 etiquettes de texte et --amber les
   badges/valeurs ambre. Aux anciennes valeurs (#8A857A, #A87B1E) leur contraste tombait
   a 3.4:1 et 3.1:1, sous le seuil de 4.5:1 pour du texte. Assombris dans la meme famille
   chromatique : la palette ne bouge pas a l'oeil, le texte devient lisible. Les ratios
   sont verifies par calcul dans tests/test_a11y_contraste.py, pas a l'estime. */
:root {
  --ink: #1C1B19; --paper: #F7F5F0; --panel: #FFF; --line: #E4E0D6;
  --soft: #EDEAE2; --concrete: #6E6A60; --concs: #B5B0A4;
  --brick: #B5481F; --bricks: #F1DDD0; --sage: #5B7556; --sages: #E2E9DD;
  --amber: #805C08; --ambers: #F2E6CB; --rouge: #A4342A; --rouges: #F2DCD8;
  --r: 14px; --r-sm: 9px;
}
* { box-sizing: border-box; }
/* garantit que l'attribut hidden cache reellement (sinon .login-view{display:grid} l'ecrase) */
[hidden] { display: none !important; }
body { margin: 0; font: 15px/1.5 "Segoe UI", system-ui, sans-serif; color: var(--ink); background: var(--paper); }
button { font: inherit; cursor: pointer; border: 0; border-radius: var(--r-sm); }
input { font: inherit; }

/* login */
.login-view { min-height: 100vh; display: grid; place-items: center; padding: 24px;
  background: radial-gradient(1200px 600px at 20% -10%, var(--bricks), transparent), var(--paper); }
.login-card { width: 340px; background: var(--panel); border: 1px solid var(--line);
  border-radius: var(--r); padding: 26px; box-shadow: 0 20px 50px -30px rgba(28,27,25,.5);
  display: flex; flex-direction: column; gap: 12px; }
.brand { font-weight: 800; letter-spacing: .3px; display: flex; align-items: center; gap: 8px; }
.dot { width: 11px; height: 11px; border-radius: 50%; background: var(--brick); display: inline-block; }
.sub { margin: 0 0 6px; color: var(--concrete); font-size: 13px; }
.login-card label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; color: var(--concrete); }
.login-card input { padding: 9px 11px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper); }
.login-card input:focus { outline: 2px solid var(--brick); border-color: transparent; }
#login-submit { padding: 10px; background: var(--brick); color: #fff; font-weight: 700; margin-top: 4px; }
.err { color: var(--rouge); font-size: 13px; margin: 2px 0 0; }
.quick { border-top: 1px solid var(--line); padding-top: 10px; margin-top: 4px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.quick span { font-size: 12px; color: var(--concs); width: 100%; }
.qb { padding: 6px 10px; background: var(--soft); color: var(--ink); border: 1px solid var(--line); font-size: 12px; }
.qb:hover { background: var(--bricks); }

/* app shell */
.app-view { display: grid; grid-template-columns: 250px 1fr; min-height: 100vh; }
.sidebar { background: linear-gradient(180deg, #23201C, #171512); color: #efeae2;
  display: flex; flex-direction: column; padding: 18px 14px; gap: 14px; }
.sidebar .brand { color: #fff; }
#nav { display: flex; flex-direction: column; gap: 2px; flex: 1; }
.navitem { text-align: left; background: transparent; color: #D8D2C7; padding: 9px 12px; border-radius: var(--r-sm); display: flex; justify-content: space-between; gap: 8px; }
.navitem:hover { background: rgba(255,255,255,.07); }
.navitem.on { background: var(--brick); color: #fff; }
.navitem .brq { font-size: 10px; opacity: .55; text-transform: uppercase; letter-spacing: .5px; align-self: center; }
.nav-section { font-size: 10px; text-transform: uppercase; letter-spacing: 1px; color: rgba(239,234,226,.42); font-weight: 700; padding: 12px 12px 4px; }
.nav-section:first-child { padding-top: 4px; }
/* La grille = espace principal : item mis en avant (barre laterale + fond + gras). */
.navitem.primary { font-weight: 700; color: #fff; background: rgba(168,123,30,.14); box-shadow: inset 3px 0 0 var(--ambers); }
.navitem.primary:hover { background: rgba(168,123,30,.24); }
.navitem.primary.on { background: var(--brick); box-shadow: inset 3px 0 0 #fff; }
.sb-foot { border-top: 1px solid rgba(255,255,255,.12); padding-top: 12px; display: flex; flex-direction: column; gap: 6px; }
.user-nom { font-weight: 700; color: #fff; font-size: 14px; }
.role-badge { font-size: 11px; letter-spacing: .5px; color: var(--ambers); background: rgba(168,123,30,.25); padding: 2px 8px; border-radius: 999px; width: fit-content; }
#logout-btn { background: rgba(255,255,255,.09); color: #EDEAE2; padding: 8px; margin-top: 4px; }
#logout-btn:hover { background: rgba(255,255,255,.16); }

.main { display: flex; flex-direction: column; min-width: 0; }
.topbar { display: flex; justify-content: space-between; align-items: center; gap: 14px; padding: 14px 22px; border-bottom: 1px solid var(--line); background: rgba(255,255,255,.7); backdrop-filter: blur(6px); }
.crumb { font-weight: 700; margin-right: auto; }
.chantier-select { padding: 7px 12px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--panel); font: inherit; font-weight: 600; color: var(--ink); }
.chantier-select:focus { outline: 2px solid var(--brick); border-color: transparent; }
.env { font-size: 11px; text-transform: uppercase; letter-spacing: 1px; color: var(--amber); background: var(--ambers); padding: 3px 10px; border-radius: 999px; }
.content { padding: 22px; display: grid; gap: 16px; align-content: start; }

.card { background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); padding: 18px 20px; box-shadow: 0 12px 30px -26px rgba(28,27,25,.6); }
.card h2 { margin: 0 0 4px; font-size: 16px; }
.card .muted { color: var(--concrete); font-size: 13px; margin: 0 0 10px; }
.kv { display: flex; justify-content: space-between; padding: 7px 0; border-top: 1px dashed var(--line); }
.kv:first-of-type { border-top: 0; }
.kv .k { color: var(--concrete); }
.kv .v { font-weight: 700; }
.conf-tag { font-size: 11px; color: var(--brick); background: var(--bricks); padding: 1px 7px; border-radius: 999px; margin-left: 6px; }
.grid3 { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 12px; }
.tile { background: var(--soft); border: 1px solid var(--line); border-radius: var(--r-sm); padding: 14px; }
.tile .t { font-size: 12px; color: var(--concrete); }
.tile .b { font-weight: 800; font-size: 18px; margin-top: 4px; }
.tile.clickable { cursor: pointer; transition: background .12s ease, transform .12s ease; }
.tile.clickable:hover { background: var(--bricks); transform: translateY(-1px); }

/* Phase B : ecrans CRUD (charges, acteurs, avancement, honoraires) — saisie
   toujours visible, edition en place ligne par ligne */
.card-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; gap: 10px; }
.charge-row, .avancement-row, .honoraire-row {
  display: flex; justify-content: space-between; align-items: center; gap: 10px;
  padding: 8px 0; border-top: 1px dashed var(--line); flex-wrap: wrap;
}
.charge-row:first-child,
.avancement-row:first-child, .honoraire-row:first-child { border-top: 0; }
.charge-row input, .avancement-row input, .honoraire-row input {
  padding: 6px 9px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper);
}
.charge-row .f-libelle, .honoraire-row .f-libelle { flex: 1 1 180px; min-width: 140px; }
.charge-row .f-ht, .charge-row .f-tva, .honoraire-row .f-ht, .honoraire-row .f-tva { width: 90px; }
.charge-montant { font-weight: 700; }
.row-del, .row-save { padding: 5px 10px; font-size: 12px; }
.row-del { background: var(--rouges); color: var(--rouge); }
.row-save { background: var(--sages); color: var(--sage); }
/* Avancement : colonnes fixes alignees (libelle | champ | bouton), au lieu du flex space-between */
.avancement-row { display: grid; grid-template-columns: minmax(0, 1fr) 110px 120px; align-items: center; gap: 16px; flex-wrap: nowrap; }
.avancement-row > span { min-width: 0; }
.avancement-row .f-pct { width: 100%; text-align: right; }
.avancement-row .row-save { width: 100%; }
.add-form { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); }
.add-form input, .add-form select { padding: 7px 9px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper); }
.add-form button { padding: 7px 12px; background: var(--brick); color: #fff; font-weight: 700; }
.ttc-preview { font-size: 13px; color: var(--concrete); }
.ttc-preview output { font-weight: 700; color: var(--ink); }

/* Chiffrage : visualiseur du bordereau DPGF (DQE), lots depliables */
.dqe-list { display: flex; flex-direction: column; gap: 8px; margin-top: 8px; }
.dqe-lot { border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper); overflow: hidden; }
.dqe-lot[open] { box-shadow: 0 10px 26px -22px rgba(28,27,25,.7); }
.dqe-lot-head { display: grid; grid-template-columns: 54px 1fr auto auto; align-items: center;
  gap: 12px; padding: 10px 14px; cursor: pointer; list-style: none; font-weight: 600; }
.dqe-lot-head::-webkit-details-marker { display: none; }
.dqe-lot-head:hover { background: var(--soft); }
.dqe-lot-code { font-size: 11px; font-weight: 800; color: #fff; background: var(--brick);
  padding: 3px 0; border-radius: 999px; text-align: center; letter-spacing: .3px; }
.dqe-lot-lib { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dqe-lot-nb { font-size: 12px; color: var(--concrete); }
.dqe-lot-total { font-weight: 800; font-variant-numeric: tabular-nums; }
.dqe-lignes { border-top: 1px solid var(--line); }
.dqe-ligne { display: grid; grid-template-columns: 68px 1fr 46px 64px 84px 92px; gap: 10px;
  padding: 6px 14px; font-size: 13px; border-top: 1px dashed var(--line); align-items: center; }
.dqe-ligne:first-child { border-top: 0; }
.dqe-ligne-head { font-size: 11px; text-transform: uppercase; letter-spacing: .4px;
  color: var(--concs); font-weight: 700; background: var(--soft); }
.dqe-poste { color: var(--concrete); font-variant-numeric: tabular-nums; }
.dqe-design { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dqe-num { text-align: right; font-variant-numeric: tabular-nums; }
.dqe-conf { color: var(--brick); font-weight: 700; }
.dqe-qte-in { width: 62px; padding: 3px 6px; border: 1px solid var(--line); border-radius: 6px;
  text-align: right; font: inherit; font-size: 13px; background: var(--paper);
  font-variant-numeric: tabular-nums; }
.dqe-qte-in:focus { outline: 2px solid var(--brick); border-color: transparent; }

/* ============ Grille tableur 2 niveaux (synthese 1 ligne/lot + grille complete depliable) ============ */
.g-toolbar { display: flex; align-items: center; gap: 10px; }
.g-search { position: relative; flex: 1; max-width: 360px; }
.g-search input { width: 100%; padding: 7px 10px 7px 30px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); font: inherit; }
.g-search input:focus { outline: 2px solid var(--brick); border-color: transparent; }
.g-search .mag { position: absolute; left: 9px; top: 50%; transform: translateY(-50%); color: var(--concs); }
.g-tbtn { padding: 7px 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); color: var(--ink); font: inherit; font-weight: 600; font-size: 13px; }
.g-tbtn:hover { background: var(--soft); }
.g-count { margin-left: auto; font-size: 12px; color: var(--concrete); }

.kpis { display: flex; background: var(--panel); border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; }
.kpis .kpi { flex: 1; padding: 10px 16px; border-right: 1px solid var(--line); display: flex; flex-direction: column; gap: 2px; }
.kpis .kpi:last-child { border-right: 0; }
.kpis .kpi .t { font-size: 11px; color: var(--concrete); text-transform: uppercase; letter-spacing: .4px; }
.kpis .kpi .b { font-size: 18px; font-weight: 800; font-variant-numeric: tabular-nums; }
.kpis .kpi .b.brick { color: var(--brick); } .kpis .kpi .b.sage { color: var(--sage); } .kpis .kpi .b.amber { color: var(--amber); }

.g-scroll { border: 1px solid var(--line); border-radius: var(--r); overflow: auto; background: var(--panel); max-height: calc(100vh - 250px); }
.g-table { min-width: 1120px; --gcols: 152px minmax(200px, 1fr) 40px 84px 94px 118px 106px 106px 106px 132px 160px; }
.grow { display: grid; grid-template-columns: var(--gcols); align-items: stretch; }
.g-head { position: sticky; top: 0; z-index: 5; background: #2B2823; color: #F1EDE4; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px; }
.g-head .gc { padding: 8px 10px; border-right: 1px solid rgba(255,255,255,.08); border-bottom: 0; }
.gc { padding: 6px 10px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); display: flex; align-items: center; min-width: 0; overflow: hidden; }
.gc.num { justify-content: flex-end; font-variant-numeric: tabular-nums; }
.gc.desg { white-space: nowrap; text-overflow: ellipsis; }
.gc.u { justify-content: center; color: var(--concrete); }
.gc.poste { color: var(--concrete); font-size: 12px; }
.g-na { color: var(--concs); }
.g-mut { background: #FAF9F5; }

/* niveau 1 : ligne lot (synthese) */
.g-lot { background: var(--soft); cursor: pointer; }
.g-lot:hover { background: #E7E3D9; }
.g-lot .gc { font-weight: 700; border-bottom-color: #DAD5C9; }
.g-lot .lotid { gap: 8px; }
.g-lot .tog { color: var(--concrete); font-size: 11px; width: 12px; display: inline-block; }
.g-lot .lot-code { background: #2B2823; color: #fff; font-size: 10px; font-weight: 800; padding: 2px 7px; border-radius: 5px; letter-spacing: .5px; }
.g-lot .lotlib { font-weight: 800; white-space: nowrap; text-overflow: ellipsis; }
.g-lot.open { background: var(--ambers); }
.g-lot.open .gc { border-bottom-color: var(--amber); }
.avctcell { gap: 6px; }
.g-avc { width: 36px; border: 1px solid transparent; background: transparent; font: inherit; font-weight: 800; text-align: right; color: var(--ink); border-radius: 4px; }
.g-avc:hover { border-color: var(--concs); background: #fff; }
.g-avc:focus { outline: 2px solid var(--brick); background: #fff; }
.pctsign { color: var(--concrete); font-size: 12px; }
.g-bar { flex: 1; height: 6px; background: #D9D4C8; border-radius: 99px; overflow: hidden; min-width: 40px; }
.g-fill { display: block; height: 100%; background: var(--sage); }
.artcell { font-size: 12px; }
.g-art { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }

/* niveau 2 : lignes DPGF (grille complete) */
.g-line { background: var(--panel); font-size: 13px; }
.g-line:nth-child(even) { background: #FCFBF8; }
.g-line:hover { background: var(--bricks); }
.qtecell { padding: 0; }
.g-cell-edit { display: block; width: 100%; height: 100%; background: #FBF7EE; }
.g-qte { width: 100%; height: 100%; padding: 6px 10px; border: 0; background: transparent; font: inherit; text-align: right; font-variant-numeric: tabular-nums; color: var(--ink); }
.g-qte:focus { outline: 2px solid var(--brick); outline-offset: -2px; background: #fff; }
.g-ro { padding: 0; }
.gc.calc { background: #FAF9F5; }

/* pied : totaux figes */
.g-foot { position: sticky; bottom: 0; z-index: 5; background: #2B2823; color: #fff; font-weight: 800; }
.g-foot .gc { border-right: 1px solid rgba(255,255,255,.08); border-bottom: 0; padding: 9px 10px; }
.g-foot .gc.num { font-size: 14px; }
.g-foot .sage { color: #BFE3B0; }

.g-saved { animation: gsave .9s ease; }
@keyframes gsave { 0% { box-shadow: inset 0 0 0 2px var(--sage); } 100% { box-shadow: inset 0 0 0 2px transparent; } }
.g-error { animation: gerr .9s ease; }
@keyframes gerr { 0% { box-shadow: inset 0 0 0 2px var(--rouge); } 100% { box-shadow: inset 0 0 0 2px transparent; } }

/* Toast d'erreur transitoire : echec auto-save Grille / filet reseau global (Lot D). */
#toast {
  position: fixed; left: 50%; bottom: 22px; transform: translateX(-50%) translateY(12px);
  max-width: min(92vw, 520px); padding: 12px 16px; border-radius: 10px;
  font-size: 13px; font-weight: 700; line-height: 1.35;
  background: var(--ink); color: #fff; box-shadow: 0 8px 30px rgba(0,0,0,.28);
  z-index: 9999; opacity: 0; pointer-events: none;
  transition: opacity .18s ease, transform .18s ease;
}
#toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
#toast.err { background: var(--rouge); color: #fff; }
.g-hint { margin-top: 4px; }

/* ============ CRM Pilotage cabinet (ecran Previsionnel) : reutilise la grille, colonnes propres ============ */
.crm-title h2 { margin: 0; font-size: 16px; }
.crm-sub { font-weight: 500; font-size: 12px; color: var(--concrete); }
.p-crm { min-width: 1180px; --gcols: 150px minmax(140px, 1fr) 122px 66px 118px 74px 116px 106px 116px 108px 120px 44px; }
.p-mission .lot-code { background: var(--brick); }
.p-cli { color: var(--concrete); font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.p-cellin { padding: 0; }
.p-in { width: 100%; height: 100%; padding: 5px 8px; border: 0; background: #FBF7EE; font: inherit; color: var(--ink); }
.p-in.num { text-align: right; font-variant-numeric: tabular-nums; }
.p-in:focus { outline: 2px solid var(--brick); outline-offset: -2px; background: #fff; }
.p-sel { width: 100%; height: 100%; border: 0; background: #FBF7EE; font: inherit; font-size: 12px; padding: 4px; color: var(--ink); }
.p-sel:focus { outline: 2px solid var(--brick); outline-offset: -2px; background: #fff; }
.p-del { justify-content: center; }
.p-del button { background: transparent; color: var(--concs); font-size: 16px; line-height: 1; padding: 2px 6px; border-radius: 4px; }
.p-del button:hover { color: var(--rouge); background: var(--rouges); }
.p-add { grid-column: 1 / -1; padding: 6px 10px; background: var(--panel); }
.p-add button { background: var(--sages); color: var(--sage); border: 1px dashed var(--sage); padding: 5px 12px; border-radius: 6px; font: inherit; font-weight: 700; font-size: 12px; }
.p-add button:hover { background: #D6E6CF; }

/* ---- Previsionnel cabinet : exercice, objectif, jauge, charges, tresorerie mensuelle ---- */
.g-toolbar.sub { margin-top: 16px; }
.g-toolbar.sub h3 { margin: 0; font-size: 14px; }
.p-exwrap { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--concrete); }
.p-ex { width: 84px; padding: 5px 8px; border: 1px solid var(--line); border-radius: 6px; font: inherit; background: #fff; color: var(--ink); font-variant-numeric: tabular-nums; }

.p-grid2 { display: grid; grid-template-columns: 380px 1fr; gap: 12px; margin: 12px 0; }
@media (max-width: 900px) { .p-grid2 { grid-template-columns: 1fr; } }
.p-objectif h3, .p-treso h3 { margin: 0 0 8px; font-size: 14px; }
.p-objectif label { display: grid; grid-template-columns: 1fr 150px; align-items: center; gap: 8px; margin-bottom: 8px; font-size: 13px; color: var(--concrete); }
.p-in2 { padding: 6px 8px; border: 1px solid var(--line); border-radius: 6px; font: inherit; background: #fff; color: var(--ink); }
.p-in2.num { text-align: right; font-variant-numeric: tabular-nums; }
.p-in2:focus { outline: 2px solid var(--brick); outline-offset: -1px; }
.p-gauge { margin-top: 10px; }
.p-gauge-bar { height: 10px; background: var(--line); border-radius: 99px; overflow: hidden; }
.p-gauge-bar span { display: block; height: 100%; background: var(--sage); border-radius: 99px; }

.p-charges { min-width: 940px; --gcols: minmax(180px, 1fr) 140px 132px 116px 62px 124px 84px 60px 44px; }
.gc.center { justify-content: center; }

.ech-svg { width: 100%; height: auto; display: block; margin-top: 6px; }
.ech-pos { fill: var(--sage); opacity: .55; }
.ech-neg { fill: var(--brick); opacity: .5; }
.ech-lbl { fill: var(--concrete); font-size: 10px; }
.p-mission .chip { font-size: 11px; }

/* Accueil : tableau de bord */
.acc-hero { background: linear-gradient(120deg, var(--panel), var(--bricks)); }
.acc-hero #accueil-kpis { margin-top: 12px; }
.acc-ch { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: var(--r-sm);
  cursor: pointer; border: 1px solid transparent; }
.acc-ch:hover { background: var(--soft); border-color: var(--line); }
.acc-ch-ref { font-size: 11px; font-weight: 800; color: var(--brick); min-width: 100px; }
.acc-ch-lib { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; }

/* ---- S1 : honoraires derives du DQE — colonnes fixes alignees (pas de flex space-between) ---- */
.honoraire-head, .honoraire-row {
  display: grid;
  grid-template-columns: minmax(140px, 1fr) 92px 76px 118px 108px 62px 106px 46px 28px;
  align-items: center; gap: 8px; flex-wrap: nowrap;
}
.honoraire-head { padding: 2px 0 6px; border-bottom: 1px solid var(--line); font-size: 11px;
  font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--concrete); }
.honoraire-row > * { min-width: 0; }
.honoraire-row input, .honoraire-row select { width: 100%; }
.honoraire-row .f-taux, .honoraire-row .f-assiette, .honoraire-row .f-ht, .honoraire-row .f-tva { text-align: right; }
.honoraire-row .charge-montant { text-align: right; font-size: 13px; }

/* ---- Decompte mensuel honoraires MOE (cascade §6.1 appliquee aux honoraires) ---- */
.decompte-head, .decompte-row {
  display: grid;
  grid-template-columns: 46px 90px 110px 96px 96px 96px 84px 106px;
  align-items: center; gap: 8px; flex-wrap: nowrap;
}
.decompte-head { padding: 2px 0 6px; border-bottom: 1px solid var(--line); font-size: 11px;
  font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--concrete); }
.decompte-row { padding: 6px 0; border-top: 1px dashed var(--line); }
.decompte-row:first-child { border-top: 0; }
.decompte-row > * { min-width: 0; }
.decompte-row .d-avancement { width: 100%; text-align: right; }
.decompte-row .charge-montant { text-align: right; font-size: 13px; }

/* Badge provenance : avancement derive (auto) / honoraire venant du DQE */
.g-src { font-size: 10px; font-weight: 700; padding: 1px 5px; border-radius: 999px; text-align: center; white-space: nowrap; }
.g-src.derive { background: var(--sages); color: var(--sage); }
.g-src.manuel { color: transparent; background: transparent; }
.g-src.corrige { background: var(--line); color: var(--concrete); }
.g-src.avalider { background: var(--ambers); color: var(--amber); }
.g-src.abstention, .g-src.erreur { background: var(--rouges); color: var(--rouge); }
.avctcell .g-src { margin-left: 4px; }

/* Flash apres auto-save en place (charges, honoraires) */
.charge-row.saved, .honoraire-row.saved { background: var(--sages); transition: background .3s ease; }

/* Previsionnel chantier : provenance + tresorerie */
.prov-list { margin: 6px 0 0; padding: 0; list-style: none; font-size: 13px; }
.prov-list li { padding: 3px 0; border-bottom: 1px dashed var(--line); }
.small { font-size: 12px; }
.grille .num { text-align: right; font-variant-numeric: tabular-nums; }

/* ---- S2 : documents Drive — grille alignee + viewer contenu ---- */
.document-head, .document-row {
  display: grid;
  grid-template-columns: minmax(150px, 1fr) 82px 84px 84px 128px minmax(140px, 1fr) 58px;
  align-items: center; gap: 8px;
}
.document-head { padding: 2px 0 6px; border-bottom: 1px solid var(--line); font-size: 11px;
  font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--concrete); }
.document-row { padding: 6px 0; border-bottom: 1px solid var(--line); }
.document-row > * { min-width: 0; }
.document-row .doc-nom { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.document-row select { width: 100%; }
.document-row .doc-voir { padding: 4px 8px; }
.doc-viewer { margin-top: 12px; padding: 12px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper); }
.doc-viewer-head { margin-bottom: 8px; }
.doc-apercu { white-space: pre-wrap; font-family: ui-monospace, monospace; font-size: 12px; margin: 0;
  max-height: 320px; overflow: auto; }

/* Hub chantier : 1 page = 1 chantier */
.hub-hero { background: linear-gradient(120deg, var(--panel), var(--soft)); }
.hub-hero.hub-sin { border-left: 4px solid var(--brick); }
.hub-ref { font-size: 12px; font-weight: 800; letter-spacing: .5px; color: var(--brick); }
.hub-title { margin: 4px 0 8px; }
.hub-meta { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; font-size: 13px; color: var(--concrete); }
.chip { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .4px;
  padding: 3px 9px; border-radius: 999px; background: var(--soft); color: var(--ink); }
.chip-sin { background: var(--bricks); color: var(--brick); }
.hub-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
@media (max-width: 860px) { .hub-cols { grid-template-columns: 1fr; } }
.hub-open { margin-top: 10px; padding: 7px 12px; background: var(--soft); border: 1px solid var(--line);
  border-radius: var(--r-sm); font-weight: 600; font-size: 13px; }
.hub-open:hover { background: var(--bricks); }
.hub-av { display: grid; grid-template-columns: 1fr 90px 46px; align-items: center; gap: 8px; padding: 4px 0; font-size: 13px; }
.hub-av-lbl { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--concrete); }
.hub-av-bar { height: 8px; background: var(--soft); border-radius: 999px; overflow: hidden; }
.hub-av-fill { height: 100%; background: var(--sage); border-radius: 999px; }
.hub-av-pct { text-align: right; font-variant-numeric: tabular-nums; font-weight: 600; }

/* Finances : jauges d'ecarts + courbe de tresorerie */
.gauges { display: flex; flex-direction: column; gap: 12px; margin-top: 10px; }
.gauge-top { display: flex; justify-content: space-between; font-size: 13px; margin-bottom: 4px; }
.gauge-lbl { color: var(--concrete); }
.gauge-val { font-weight: 700; font-variant-numeric: tabular-nums; }
.gauge-track { height: 12px; background: var(--soft); border-radius: 999px; overflow: hidden; }
.gauge-fill { height: 100%; border-radius: 999px; transition: width .5s cubic-bezier(.2,.7,.2,1); }

/* --- Hub : dossier / echeancier / artisans par lot (P1) --- */
.hub-dossier .kv span:last-child { font-weight: 600; text-align: right; max-width: 62%; }
.hub-echs { display: flex; flex-direction: column; gap: 8px; margin-top: 6px; }
.hub-ech { display: flex; align-items: center; gap: 12px; padding: 8px 10px; background: var(--paper);
  border: 1px solid var(--line); border-radius: var(--r-sm); }
.hub-ech-pct { flex: 0 0 auto; min-width: 52px; text-align: center; font-weight: 800;
  font-variant-numeric: tabular-nums; color: #fff; background: var(--sage); padding: 4px 8px; border-radius: 999px; }
.hub-ech-lbl { color: var(--ink); font-size: 13px; }
.af-wrap { overflow-x: auto; margin-top: 4px; }
.af-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.af-table th { text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: .4px;
  color: var(--concrete); padding: 6px 8px; border-bottom: 1px solid var(--line); }
.af-table td { padding: 7px 8px; border-top: 1px solid var(--line); vertical-align: top; }
.af-lot { font-weight: 600; }
.af-ent { color: var(--brick); font-weight: 700; white-space: nowrap; }
.af-c { color: var(--concrete); }
.ac-wide { grid-column: 1 / -1; }
.os-list { display: flex; flex-direction: column; gap: 10px; margin-top: 6px; }
.os-card { border: 1px solid var(--line); border-left: 3px solid var(--brick); border-radius: var(--r-sm);
  padding: 10px 12px; background: var(--paper); }
.os-top { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.os-tit { font-weight: 700; color: var(--brick); }
.os-mt { font-weight: 800; font-variant-numeric: tabular-nums; }
.os-conf { color: var(--concrete); font-weight: 600; }
.os-lot { font-size: 13px; margin-top: 2px; }
.os-meta { font-size: 12px; color: var(--concrete); margin-top: 4px; }
.g-devise { background: linear-gradient(90deg, var(--sage), #6f8c68); }
.g-engage { background: linear-gradient(90deg, var(--amber), #d99a2b); }
.g-facture { background: linear-gradient(90deg, var(--brick), #cf6a3f); }
.g-encaisse { background: linear-gradient(90deg, #4a6b45, var(--sage)); }
.treso-svg { width: 100%; height: auto; margin: 8px 0; display: block; }
.treso-line { fill: none; stroke: var(--brick); stroke-width: 2.2; stroke-linejoin: round; stroke-linecap: round; }
.treso-area { fill: var(--bricks); opacity: .5; }
.treso-zero { stroke: var(--concs); stroke-width: 1; stroke-dasharray: 4 4; }
.treso-bas { fill: var(--brick); stroke: #fff; stroke-width: 2; }
.treso-bas-lbl { fill: var(--brick); font-size: 11px; font-weight: 700; }

/* Acteurs : annuaire en fiches (contacts editables selon le role) */
.acteur-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(270px, 1fr)); gap: 10px; margin-top: 8px; }
.acteur-card { border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper);
  padding: 12px; display: flex; flex-direction: column; gap: 8px; }
.ac-name { font-weight: 700; }
.ac-name input.f-raison { font-weight: 700; width: 100%; }
.ac-grid { display: flex; flex-direction: column; gap: 5px; }
.ac-grid label { display: grid; grid-template-columns: 76px 1fr; align-items: center; gap: 8px;
  font-size: 12px; color: var(--concrete); }
.ac-f { padding: 4px 7px; border: 1px solid var(--line); border-radius: 6px; background: var(--panel);
  font: inherit; font-size: 13px; color: var(--ink); min-width: 0; }
.ac-f:focus { outline: 2px solid var(--brick); border-color: transparent; }
.ac-v { font-size: 13px; color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ac-actions { display: flex; gap: 8px; margin-top: 2px; }
.ac-actions button { padding: 5px 10px; border: 1px solid var(--line); background: var(--soft);
  border-radius: 6px; font-size: 13px; }
.ac-actions .row-save { background: var(--brick); color: #fff; border-color: transparent; font-weight: 600; }

/* import de documents sources (ingestion deterministe+OCR) */
.import-form { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 10px; }
.import-form select, .import-form input[type="file"] { padding: 5px 8px; border: 1px solid var(--line);
  border-radius: 6px; background: var(--panel); font: inherit; font-size: 13px; }
.import-form button { padding: 6px 14px; border: 1px solid transparent; border-radius: 6px;
  background: var(--brick); color: #fff; font-weight: 600; }
.import-review { border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper);
  padding: 12px; display: flex; flex-direction: column; gap: 8px; }
.import-champ { display: grid; grid-template-columns: 140px 1fr; align-items: center; gap: 8px; }
.import-champ label { font-size: 12px; color: var(--concrete); }
.import-champ input { padding: 4px 7px; border: 1px solid var(--line); border-radius: 6px;
  background: var(--panel); font: inherit; font-size: 13px; }
.import-champ-objet { grid-template-columns: 1fr; }
.import-json { max-height: 220px; overflow: auto; font-size: 11px; background: var(--panel);
  border: 1px solid var(--line); border-radius: 6px; padding: 8px; white-space: pre-wrap; }
.import-review .import-confirmer { align-self: flex-start; padding: 6px 14px; border: 1px solid transparent;
  border-radius: 6px; background: var(--brick); color: #fff; font-weight: 600; margin-top: 4px; }

/* Phase C : situations a valider (cascade §6.1) */
.statut-badge {
  display: inline-block; font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .4px; padding: 3px 10px; border-radius: 999px; margin: 4px 0;
}
.statut-badge[data-statut="VERTE"], .statut-badge[data-statut="EMISE"] { background: var(--sages); color: var(--sage); }
.statut-badge[data-statut="PENDING"] { background: var(--ambers); color: var(--amber); }
.statut-badge[data-statut="ABSTENTION"], .statut-badge[data-statut="REJETEE"] { background: var(--rouges); color: var(--rouge); }
.situation-row {
  display: flex; justify-content: space-between; align-items: center; gap: 10px;
  padding: 8px 0; border-top: 1px dashed var(--line); cursor: pointer;
}
.situation-row:first-child { border-top: 0; }
.situation-row:hover { background: var(--soft); }
.verdict { display: flex; justify-content: space-between; gap: 10px; padding: 6px 0; border-top: 1px dashed var(--line); font-size: 13px; }
.verdict:first-child { border-top: 0; }
.verdict[data-ok="true"] { color: var(--sage); }
.verdict[data-ok="false"] { color: var(--rouge); font-weight: 700; }
.abstention-note { color: var(--amber); background: var(--ambers); padding: 8px 12px; border-radius: var(--r-sm); font-size: 13px; margin-top: 10px; }
#situation-validate { margin-top: 12px; padding: 9px 16px; background: var(--brick); color: #fff; font-weight: 700; }

/* Phase D : connexion Google (documents, mails/triage, brouillons, agenda, §6.4) */
/* NB: .document-row a sa propre grille alignee (bloc S2 plus haut), pas le flex ici. */
.mail-row, .agenda-row {
  display: flex; justify-content: space-between; align-items: center; gap: 10px;
  padding: 8px 0; border-top: 1px dashed var(--line); flex-wrap: wrap;
}
.mail-row:first-child, .agenda-row:first-child { border-top: 0; }
.doc-type { font-size: 11px; text-transform: uppercase; color: var(--concrete); }
.mail-statut {
  display: inline-block; font-size: 11px; font-weight: 700; text-transform: uppercase;
  letter-spacing: .4px; padding: 3px 10px; border-radius: 999px;
}
.mail-statut[data-statut="RATTACHE"] { background: var(--sages); color: var(--sage); }
.mail-statut[data-statut="TRIAGE"] { background: var(--ambers); color: var(--amber); }
.mail-statut[data-statut="ECARTE"], .mail-statut[data-statut="BROUILLON"] { background: var(--soft); color: var(--concrete); }
.mail-rattacher { padding: 5px 10px; font-size: 12px; background: var(--sages); color: var(--sage); }
.brouillon-row { padding: 10px 0; border-top: 1px dashed var(--line); display: flex; flex-direction: column; gap: 8px; }
.brouillon-row:first-child { border-top: 0; }
.brouillon-head { display: flex; justify-content: space-between; gap: 10px; font-size: 13px; color: var(--concrete); }
.brouillon-corps { width: 100%; min-height: 90px; padding: 9px 11px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper); font: inherit; resize: vertical; }
.brouillon-save { align-self: flex-start; padding: 6px 12px; font-size: 12px; background: var(--brick); color: #fff; font-weight: 700; }

/* Phase E : previsionnel / ecarts / rapports (chiffres calcules + sources) */
.provenance-row {
  display: flex; justify-content: space-between; gap: 10px; padding: 5px 0;
  border-top: 1px dashed var(--line); font-size: 12px; color: var(--concrete);
}
.provenance-row:first-child { border-top: 0; }
.jalon-row { display: flex; justify-content: space-between; gap: 10px; padding: 7px 0; border-top: 1px dashed var(--line); }
.jalon-row:first-child { border-top: 0; }
.citation {
  display: flex; justify-content: space-between; gap: 10px; padding: 6px 0;
  border-top: 1px dashed var(--line); font-size: 13px;
}
.citation:first-child { border-top: 0; }
.citation .src { color: var(--concrete); font-size: 12px; }
#rapport-generer { padding: 9px 16px; background: var(--brick); color: #fff; font-weight: 700; }
#rapport-pdf { display: inline-block; margin-top: 10px; font-weight: 700; }

/* ---- LOT 3 : actions admin (chantier CRUD, mot de passe) ---- */
#toast.ok { background: var(--sage); color: #fff; }
.chantier-controls { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.btn-ghost {
  padding: 7px 12px; border: 1px solid var(--line); background: var(--panel); color: var(--ink);
  border-radius: var(--r-sm); font-size: 12px; font-weight: 700; cursor: pointer;
}
.btn-ghost:hover { background: var(--soft); }
.btn-primary {
  padding: 8px 16px; border: 1px solid var(--brick); background: var(--brick); color: #fff;
  border-radius: var(--r-sm); font-size: 13px; font-weight: 700; cursor: pointer;
}
.btn-primary:hover { filter: brightness(1.05); }
.modal-overlay {
  position: fixed; inset: 0; z-index: 10000; display: flex; align-items: center; justify-content: center;
  background: rgba(28,27,25,.45); padding: 20px;
}
.modal-card {
  width: min(94vw, 420px); background: var(--panel); border: 1px solid var(--line);
  border-radius: var(--r); padding: 22px; box-shadow: 0 18px 50px rgba(0,0,0,.3);
  display: flex; flex-direction: column; gap: 14px;
}
.modal-card h3 { margin: 0; font-size: 17px; }
.modal-field { display: flex; flex-direction: column; gap: 4px; font-size: 13px; font-weight: 700; color: var(--concrete); }
.modal-field input { padding: 9px 11px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper); font-size: 14px; color: var(--ink); }
.modal-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 4px; }

/* LOT 4.b : liens de telechargement PDF (situation / decompte honoraires). */
.detail-actions { display: flex; align-items: center; gap: 12px; margin-top: 10px; flex-wrap: wrap; }
.pdf-link { display: inline-flex; align-items: center; gap: 4px; padding: 5px 11px; font-size: 13px;
  font-weight: 700; color: var(--brick); background: var(--bricks); border: 1px solid var(--line);
  border-radius: var(--r-sm); text-decoration: none; }
.pdf-link:hover { background: var(--brick); color: #fff; }
.charge-montant .pdf-link { margin-left: 8px; padding: 2px 8px; font-size: 12px; }

/* LOT 1 : rappel des montants avant ecriture d'une situation. Volontairement visible :
   c'est le dernier filtre avant qu'un chiffre parte dans un dossier de paiement. */
.import-rappel { margin: 4px 0 0; padding: 8px 10px; border-left: 3px solid var(--brick);
  background: var(--bricks); border-radius: 0 6px 6px 0; font-size: 13px; }

/* LOT 2 : registre des envois. Meme grille que les autres tableaux de l'application
   (reutilise les tokens existants, aucune nouvelle couleur). */
.envoi-row { display: grid; grid-template-columns: 130px 1fr 1fr 1.4fr 1fr 90px 1fr;
  gap: 8px; align-items: center; padding: 6px 0; border-top: 1px dashed var(--line);
  font-size: 13px; }
.envoi-row > * { min-width: 0; overflow-wrap: anywhere; }
.envoi-head { font-weight: 600; color: var(--concrete); border-top: 0; }
.brouillon-row .brouillon-envoyer { padding: 6px 14px; border: 1px solid transparent;
  border-radius: 6px; background: var(--brick); color: #fff; font-weight: 600; }
.decompte-row .decompte-envoyer { margin-left: 6px; padding: 2px 8px; font-size: 12px;
  border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--panel); }
.decompte-row .decompte-envoyer:hover { background: var(--brick); color: #fff; }

/* LOT 6 : correction d'un montant mal lu, depuis le detail d'une situation. Discret
   par choix : c'est une action rare, et sa mise en avant inviterait a retoucher des
   chiffres au lieu de corriger la lecture du document. */
.situation-corriger { margin-left: 8px; padding: 1px 7px; font-size: 11px;
  border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--panel);
  color: var(--concrete); }
.situation-corriger:hover { background: var(--brick); color: #fff; border-color: var(--brick); }