/* ── POLICES VENDORISÉES ────────────────────────────────────────────────────
   LOT 1 (CDC-DESIGN-MOUVEMENTS §1.2, écarts a1/a2). Avant, l'app chargeait CINQ
   familles depuis Google Fonts, sur DEUX points d'entrée distincts (le <link> de
   index.html et une injection de js/app/supabase-entry.js). C'était la dernière
   violation de la règle projet « aucun CDN au runtime » — js/vendor/ héberge déjà
   Supabase et XLSX pour cette raison.

   Inventaire mesuré avant décision : Manrope 86 références, Inter 65, JetBrains Mono 24,
   IBM Plex Sans 19, Schibsted Grotesk 3 (chargée pour rien), IBM Plex Mono 1 (déjà
   inopérante). Il reste DEUX fichiers variables, sous-ensemble latin, ≈ 95 ko au total :
     · Inter             400→800, texte courant de la charte
     · Schibsted Grotesk 400→900, display de la charte (titres, chiffres clés isolés)
   Le mono est une pile système (0 ko) : il ne porte l'identité nulle part et la charte
   ne le nomme pas.

   Licence : SIL Open Font License 1.1 pour les deux — css/fonts/OFL-Inter.txt et
   css/fonts/OFL-SchibstedGrotesk.txt. Fichiers issus de fonts.gstatic.com.
   ────────────────────────────────────────────────────────────────────────── */
@font-face {
  font-family:'Inter';
  font-style:normal;
  font-weight:400 800;
  font-display:swap;
  src:url(fonts/inter-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
    U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
    U+FEFF, U+FFFD;
}
@font-face {
  font-family:'Schibsted Grotesk';
  font-style:normal;
  font-weight:400 900;
  font-display:swap;
  src:url(fonts/schibsted-grotesk-latin.woff2) format('woff2');
  unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
    U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215,
    U+FEFF, U+FFFD;
}
/* I6 — latin-ext et vietnamien. Le <link> Google supprimé les servait ; sans eux, un nom
   de locataire « Kowalczyk », « Řehák », « Şahin » ou « Nguyễn » bascule sur la police
   système AU MILIEU DU MOT. Coût nul dans le cas nominal : le navigateur ne télécharge un
   sous-ensemble que si un caractère de sa plage apparaît réellement.
   Schibsted Grotesk n'est publiée qu'en latin et latin-ext : un titre vietnamien retombe
   sur Inter, 2e famille de --display, qui le couvre. Repli voulu, pas un trou. */
@font-face {
  font-family:'Inter';
  font-style:normal;
  font-weight:400 800;
  font-display:swap;
  src:url(fonts/inter-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304,
    U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0,
    U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family:'Inter';
  font-style:normal;
  font-weight:400 800;
  font-display:swap;
  src:url(fonts/inter-vietnamese.woff2) format('woff2');
  unicode-range:U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0,
    U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
@font-face {
  font-family:'Schibsted Grotesk';
  font-style:normal;
  font-weight:400 900;
  font-display:swap;
  src:url(fonts/schibsted-grotesk-latin-ext.woff2) format('woff2');
  unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304,
    U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0,
    U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* ── DESIGN TOKENS ────────────────────────────────────────── */
:root {
  /* ══ Mode CLAIR — palette de référence de la charte ══
     LOT 0 (CDC-DESIGN-MOUVEMENTS écart d3) : les 12 tokens qui n'existaient QUE dans
     [data-theme="sobre"|"colore"|"dark"] (--cta, --cta-h, --cta-text, --pos, --pos-soft,
     --neg, --neg-soft, --warn, --warn-soft, --info, --info-soft, --acc2) descendent ici.
     Sans ça, index.html démarre sur data-theme="light" — pour lequel AUCUN bloc n'existe —
     et les couleurs sémantiques sont vides le temps du boot (flash). */
  --bg:#f4f5f8;
  --sur:#ffffff;
  --sur2:#f7f8fb;
  --sur3:#eef1f6;
  --bor:#e4e7ee;
  --bor2:#eef0f5;
  --tbl-edge:rgba(0,0,0,.16); /* v15.144 ombre de scroll tables (clair) */
  --t1:#101521;
  --t2:#3c4658;
  /* v15.688 CHARTE M-17 : gris clair foncé #6e7888 → #5f6f86 = contraste ≥ 4,5:1 sur
     tous les fonds clairs (sur 5,12 · sur2 4,82 · bg 4,69 · sur3 4,52). */
  --t3:#5f6f86;
  /* Alias historiques de la palette sémantique (badges, pastilles). --blu a été renommé
     --acc en lot 0 (écart c2) : il contenait du corail, pas du bleu. */
  --grn:#16795e;
  --red:#c92f2f;
  --ora:#8f620e;
  --pur:#7b6bb0;
  --acc:#ff5a3c;
  --acc2:#e8431f;
  --acc-soft:#ffe7e0;
  --neutral-soft:#eef1f6;
  --neutral-ink:#42506a;
  /* ══ Couleurs sémantiques — 5 couleurs, paires couleur/fond (écart d2) ══
     Le fond est dérivé de la couleur, à la même opacité, et redéfini dans LES DEUX thèmes.
     Valeurs du mode clair calibrées le 18/08 (CDC-DESIGN-FINANCES §1.2, option 1 :
     teinte et saturation conservées, seule la luminosité descend) — la grammaire
     « texte coloré sur fond teinté » tombait à 3,15:1, elle remonte à 4,54:1. */
  --pos:#16795e;   --pos-soft:rgba(22,121,94,.10);
  --neg:#c92f2f;   --neg-soft:rgba(201,47,47,.10);
  --warn:#8f620e;  --warn-soft:rgba(143,98,14,.10);
  --info:#42506a;  --info-soft:rgba(66,80,106,.10);
  /* 5ᵉ couleur sémantique, ajoutée le 18/08 (CDC-DESIGN-FINANCES §1.1) : le BLEU dit
     l'avance. La charte n'avait pas de bleu ; --info est un gris bleuté et le gris porte
     déjà « informatif, pas un flux ». La règle « corail = accent uniquement » n'est pas
     touchée : une couleur de donnée n'est pas un accent. */
  --adv:#2e6db1;   --adv-bg:rgba(46,109,177,.12);
  /* Fonds des badges legacy — dérivés du token de couleur, plus de rgba() figé (écart d2) */
  --grn-bg:rgba(22,121,94,.10);
  --red-bg:rgba(201,47,47,.10);
  --ora-bg:rgba(143,98,14,.10);
  --acc-bg:rgba(255,90,60,.10);
  --pur-bg:rgba(123,107,176,.10);
  --gry-bg:rgba(60,70,88,.10);
  /* CTA — descendus des thèmes (écart d3) */
  --cta:#ff5a3c;
  --cta-h:#e8431f;
  --cta-text:#FFFFFF;
  --shadow:0 1px 3px rgba(0,0,0,.07),0 4px 18px rgba(0,0,0,.07);
  --shadow-lg:0 8px 40px rgba(0,0,0,.13),0 2px 8px rgba(0,0,0,.07);
  --shadow-hover:0 4px 20px rgba(255,90,60,.16),0 1px 4px rgba(0,0,0,.07);
  /* ══ Échelle de RAYONS — 3 crans (écart e1 / F-d1) ══
     --r contrôles · --rl cartes · --rp pastilles. Aucun rayon en dur ailleurs. */
  --r:8px;--rl:14px;--rp:999px;
  --sb:260px;
  --font-base:17px;
  --lh:1.56;
  /* ══ Échelle TYPOGRAPHIQUE — 7 crans (écart a3, amendée le 18/08 par --fs-hero) ══
     La charte ne définissait aucune taille : l'app en posait 9, une par une.
     --fs-hero  36px Schibsted 800  l'UNIQUE grand chiffre d'une page, au plus un par écran
     --fs-h1    20px Schibsted 800  titre d'écran ET chiffre de carte (KPI, ratio, récap)
     --fs-num   16px Schibsted 800  chiffre clé, totaux
     --fs-md    14px Inter 600      texte fort, libellé de ligne
     --fs-base  13px Inter 400      corps de tableau
     --fs-sm    12px Inter 400      méta, secondaire
     --fs-xs  10.5px Inter 800 caps letter-spacing:.07em — étiquettes, en-têtes de colonne
     Mobile : mêmes crans, on monte d'un cran le libellé et le montant de la ligne. */
  --fs-hero:36px;
  --fs-h1:20px;
  --fs-num:16px;
  --fs-md:14px;
  --fs-base:13px;
  --fs-sm:12px;
  --fs-xs:10.5px;
  /* ══ FOCUS — une seule convention (écart g2 / F-f2) ══
     La charte réserve explicitement le corail au focus. L'app en avait deux conventions
     (--fg-info gris bleuté, et un rgba(126,177,255) bleu dans la sidebar), aucune conforme.
     Le halo se lit avec outline:2px solid var(--acc) ; --acc-soft suit le thème. */
  --focus-ring:0 0 0 3px var(--acc-soft);
  /* ── v2 Dashboard — semantic colors (light) ── */
  --bg-success:rgba(22,121,94,.10);
  --bg-danger:rgba(201,47,47,.10);
  --bg-warning:rgba(143,98,14,.10);
  --bg-info:rgba(66,80,106,.10);
  --fg-success:#16795e;
  --fg-danger:#c92f2f;
  --fg-warning:#8f620e;
  --fg-info:#42506a;
  /* ── v2 Dashboard — card shadows ── */
  --shadow-card:0 1px 2px rgba(0,0,0,.04);
  --shadow-card-hover:0 4px 16px rgba(255,90,60,.10),0 1px 3px rgba(0,0,0,.05);
  /* ── v2 Dashboard — timings ── */
  --t-fast:120ms cubic-bezier(.4,0,.2,1);
  --t-normal:200ms cubic-bezier(.4,0,.2,1);
  --t-slow:350ms cubic-bezier(.4,0,.2,1);
  /* ── Re-skin Propryo — typographie ── */
  --font:'Inter',system-ui,-apple-system,sans-serif;
  --display:'Schibsted Grotesk','Inter',system-ui,sans-serif;
  /* Mono = pile SYSTÈME (écart a2). JetBrains Mono (24 références) et IBM Plex Mono
     (1, déjà inopérante) sont supprimées : le mono ne porte l'identité nulle part
     — références, IBAN, extraits — et la charte ne le nomme pas. 0 ko. */
  --mono:ui-monospace,'SF Mono',Menlo,Consolas,monospace;
}
/* ────────────────────────────────────────────────────────────────────────
   v15.30 — 3 thèmes alignés exactement sur le mockup
   docs/strategie/dashboard-mockups/v2-refonte-2026-05-15.html
   (palettes Sobre / Coloré / Dark Boursorama validées par l'utilisateur)
   ──────────────────────────────────────────────────────────────────────── */

/* ── Thème SOBRE (mockup galerie-finale-sans-surcharge.html) ──
   v15.37 — Aligné EXACTEMENT sur le mockup référence (couleurs vives sobres) */
[data-theme="sobre"] {
  --bg:#f4f5f8;
  --sur:#ffffff;
  --sur2:#f7f8fb;
  --sur3:#eef1f6;
  --bor:#e4e7ee;
  --bor2:#eef0f5;
  --t1:#101521;
  --t2:#3c4658;
  --t3:#5f6f86; /* v15.688 CHARTE M-17 : ≥ 4,5:1 sur tous les fonds clairs */
  --acc:#ff5a3c;
  --acc2:#e8431f;
  --acc-soft:#ffe7e0;
  --cta:#ff5a3c;
  --cta-h:#e8431f;
  --cta-text:#FFFFFF;
  /* Palette sémantique calibrée le 18/08 (CDC-DESIGN-FINANCES §1.2, option 1) */
  --pos:#16795e;
  --pos-soft:rgba(22,121,94,.10);
  --neg:#c92f2f;
  --neg-soft:rgba(201,47,47,.10);
  --warn:#8f620e;
  --warn-soft:rgba(143,98,14,.10);
  --info:#42506a;
  --info-soft:rgba(66,80,106,.10);
  /* 5ᵉ couleur sémantique : le bleu dit l'avance (CDC-DESIGN-FINANCES §1.1) */
  --adv:#2e6db1;
  --adv-bg:rgba(46,109,177,.12);
  /* Compat variables historiques de l'app (--blu renommé --acc en lot 0, écart c2) */
  --grn:#16795e;
  --red:#c92f2f;
  --ora:#8f620e;
  --pur:#7b6bb0;
  --grn-bg:rgba(22,121,94,.10);
  --red-bg:rgba(201,47,47,.10);
  --ora-bg:rgba(143,98,14,.10);
  --acc-bg:rgba(255,90,60,.10);
  --pur-bg:rgba(123,107,176,.10);
  --gry-bg:rgba(60,70,88,.10);
  --neutral-soft:#eef1f6;
  --neutral-ink:#42506a;
  --bg-success:rgba(22,121,94,.10);
  --bg-danger:rgba(201,47,47,.10);
  --bg-warning:rgba(143,98,14,.10);
  --bg-info:rgba(66,80,106,.10);
  --fg-success:#16795e;
  --fg-danger:#c92f2f;
  --fg-warning:#8f620e;
  --fg-info:#42506a;
  --shadow:0 4px 20px rgba(16,21,33,.06);
  --shadow-lg:0 12px 40px rgba(16,21,33,.12);
  --shadow-hover:0 4px 18px rgba(255,90,60,.14);
  --shadow-card:0 1px 3px rgba(16,21,33,.05);
  --shadow-card-hover:0 4px 18px rgba(255,90,60,.14);
}

/* ── Thème COLORÉ (mockup galerie-finale-sans-surcharge.html — Deliveroo) ──
   v15.37 — Aligné EXACTEMENT sur le mockup référence */
[data-theme="colore"] {
  --bg:#f4f5f8;
  --sur:#ffffff;
  --sur2:#f7f8fb;
  --sur3:#eef1f6;
  --bor:#e4e7ee;
  --bor2:#eef0f5;
  --t1:#101521;
  --t2:#3c4658;
  --t3:#6e7888;
  --acc:#ff5a3c;
  --acc2:#e8431f;
  --acc-soft:#ffe7e0;
  --cta:#ff5a3c;
  --cta-h:#e8431f;
  --cta-text:#FFFFFF;
  /* Palette sémantique calibrée le 18/08 (CDC-DESIGN-FINANCES §1.2, option 1) */
  --pos:#16795e;
  --pos-soft:rgba(22,121,94,.10);
  --neg:#c92f2f;
  --neg-soft:rgba(201,47,47,.10);
  --warn:#8f620e;
  --warn-soft:rgba(143,98,14,.10);
  --info:#42506a;
  --info-soft:rgba(66,80,106,.10);
  /* 5ᵉ couleur sémantique : le bleu dit l'avance (CDC-DESIGN-FINANCES §1.1) */
  --adv:#2e6db1;
  --adv-bg:rgba(46,109,177,.12);
  /* Compat variables historiques de l'app (--blu renommé --acc en lot 0, écart c2) */
  --grn:#16795e;
  --red:#c92f2f;
  --ora:#8f620e;
  --pur:#7b6bb0;
  --grn-bg:rgba(22,121,94,.10);
  --red-bg:rgba(201,47,47,.10);
  --ora-bg:rgba(143,98,14,.10);
  --acc-bg:rgba(255,90,60,.10);
  --pur-bg:rgba(123,107,176,.10);
  --gry-bg:rgba(60,70,88,.10);
  --neutral-soft:#eef1f6;
  --neutral-ink:#42506a;
  --bg-success:rgba(22,121,94,.10);
  --bg-danger:rgba(201,47,47,.10);
  --bg-warning:rgba(143,98,14,.10);
  --bg-info:rgba(66,80,106,.10);
  --fg-success:#16795e;
  --fg-danger:#c92f2f;
  --fg-warning:#8f620e;
  --fg-info:#42506a;
  --shadow:0 4px 20px rgba(16,21,33,.06);
  --shadow-lg:0 12px 40px rgba(16,21,33,.12);
  --shadow-hover:0 4px 18px rgba(255,90,60,.14);
  --shadow-card:0 1px 3px rgba(16,21,33,.05);
  --shadow-card-hover:0 4px 18px rgba(255,90,60,.14);
}

/* ── Thème SOMBRE Propryo (fond #14161d, accent corail, surfaces détachées + bordures visibles, ombres→halos) ── */
[data-theme="dark"] {
  color-scheme:dark;
  --bg:#14161d;
  --sur:#1e222c;
  --sur2:#262b37;
  --sur3:#2e3442;
  --bor:rgba(255,255,255,.12);
  --bor2:rgba(255,255,255,.08);
  --tbl-edge:rgba(0,0,0,.55); /* v15.144 ombre de scroll tables (sombre, visible sur --sur foncé) */
  --t1:#f2f5fa;
  --t2:#cdd6e3;
  --t3:#9aa6b8;
  --acc:#ff6a4a;
  --acc2:#ff8163;
  --acc-soft:rgba(255,106,74,.18);
  --cta:#ff6a4a;
  --cta-h:#ff8163;
  --cta-text:#14161d;
  --pos:#3fd6a3;
  --pos-soft:rgba(63,214,163,.12);
  /* #ff7a7a → #ff7f7f : le rouge sur fond de retard était à 4,41, il passe à 4,56
     (CDC-DESIGN-FINANCES §1.2, seul ajustement du mode sombre) */
  --neg:#ff7f7f;
  --neg-soft:rgba(255,127,127,.12);
  --warn:#f1bd55;
  --warn-soft:rgba(241,189,85,.12);
  --info:#aeb9cb;
  --info-soft:rgba(174,185,203,.12);
  /* 5ᵉ couleur sémantique : le bleu dit l'avance (CDC-DESIGN-FINANCES §1.1) */
  --adv:#7ab6ea;
  --adv-bg:rgba(122,182,234,.16);
  /* Compat variables historiques de l'app (--blu renommé --acc en lot 0, écart c2) */
  --grn:#3fd6a3;
  --red:#ff7f7f;
  --ora:#f1bd55;
  --pur:#8f7fc4;
  /* Fonds des badges — enfin définis en sombre (écart d2) : les rgba() figés du clair
     étaient repeints tels quels sur fond noir. */
  --grn-bg:rgba(63,214,163,.12);
  --red-bg:rgba(255,127,127,.12);
  --ora-bg:rgba(241,189,85,.12);
  --acc-bg:rgba(255,106,74,.12);
  --pur-bg:rgba(143,127,196,.12);
  --gry-bg:rgba(205,214,227,.14);
  --neutral-soft:rgba(255,255,255,.07);
  --neutral-ink:#aeb9cb;
  --bg-success:rgba(63,214,163,.12);
  --bg-danger:rgba(255,127,127,.12);
  --bg-warning:rgba(241,189,85,.12);
  --bg-info:rgba(174,185,203,.12);
  --fg-success:#3fd6a3;
  --fg-danger:#ff7f7f;
  --fg-warning:#f1bd55;
  --fg-info:#aeb9cb;
  --shadow:0 0 0 1px rgba(255,255,255,.05);
  --shadow-lg:0 0 0 1px rgba(255,255,255,.11), 0 40px 90px -40px rgba(0,0,0,.7);
  --shadow-hover:0 0 0 1px rgba(255,255,255,.09);
  --shadow-card:0 0 0 1px rgba(255,255,255,.06);
  --shadow-card-hover:0 0 0 1px rgba(255,255,255,.12);
}

/* ── v2 audit dark mode : fix <select>/<option> illisibles (bug pré-existant)
   Avant : dropdown rendu par le navigateur avec bg blanc → texte invisible en dark.
   Fix : color-scheme:dark (ci-dessus) + override explicite des options. ── */
[data-theme="dark"] select.inp,
[data-theme="dark"] select{
  background-color:#1a2332;
  color:var(--t1);
}
[data-theme="dark"] option{
  background-color:#1a2332;
  color:#e4ecf5;
}
[data-fontsize="lg"] { --font-base:19px; }
/* v2 Phase 7 — Bouton "A" étendu : scaling appliqué aussi aux éléments
   v2 qui utilisent des px fixes (hero value, KPI values, labels).
   Amélioration accessibilité malvoyants (~+15% typographie). */
[data-fontsize="lg"] .dw-kpi-label    { font-size: 16px }
[data-fontsize="lg"] .dw-kpi-value    { font-size: 30px }
[data-fontsize="lg"] .dw-hero-label   { font-size: 17px }
[data-fontsize="lg"] .dw-hero-value   { font-size: 56px }
[data-fontsize="lg"] .dw-flux-sublabel{ font-size: 15px }
[data-fontsize="lg"] .dw-flux-value   { font-size: 30px }
[data-fontsize="lg"] .dw-flux-net     { font-size: 15px }
[data-fontsize="lg"] .dw-context-date { font-size: 13px }
[data-fontsize="lg"] .dw-context-greet{ font-size: 19px; line-height:1.1 }  /* row 1 = 60px, ne pas déborder */
[data-fontsize="lg"] .dw-sep-label    { font-size: 13px }
[data-fontsize="lg"] .dw-todo-title   { font-size: 16px }
[data-fontsize="lg"] .dw-todo-count   { font-size: 13px }
[data-fontsize="lg"] .dw-todo-quad-label { font-size: 13px }
[data-fontsize="lg"] .dw-todo-quad-count { font-size: 30px }
[data-fontsize="lg"] .dw-todo-quad-sub   { font-size: 12px }
[data-fontsize="lg"] .dw-pill         { font-size: 13px }
[data-fontsize="lg"] .dw-cat-row      { font-size: 15px }
[data-fontsize="lg"] .dw-cat-pct      { font-size: 13px }
[data-fontsize="lg"] .dw-sub          { font-size: 13px }
/* Étape 2 fondations — A+ étendu aux classes legacy (px fixes hors --font-base) */
[data-fontsize="lg"] .tab             { font-size: 15px }
[data-fontsize="lg"] .tbl             { font-size: 15px }
[data-fontsize="lg"] .badge           { font-size: 13px }
[data-fontsize="lg"] .alert           { font-size: 15px }
[data-fontsize="lg"] .ct              { font-size: 12px }
[data-fontsize="lg"] .fg label        { font-size: 13px }
[data-fontsize="lg"] .m-head h3       { font-size: 18px }
[data-fontsize="lg"] .btn             { font-size: 15px }
[data-fontsize="lg"] .btn.bb          { font-size: 13px }
[data-fontsize="lg"] .inp             { font-size: 15px }
[data-fontsize="lg"] .kpi .kv         { font-size: 28px }
[data-fontsize="lg"] .kpi .kl         { font-size: 12px }
[data-fontsize="lg"] .kpi .kt         { font-size: 12px }
@media (max-width: 480px) {
  /* Sur petit mobile, le "A+" doit rester dans les limites de place */
  [data-fontsize="lg"] .dw-hero-value { font-size: 34px }
  [data-fontsize="lg"] .dw-kpi-value,
  [data-fontsize="lg"] .dw-flux-value,
  [data-fontsize="lg"] .dw-todo-quad-count { font-size: 24px }
  [data-fontsize="lg"] .kpi .kv       { font-size: 22px }
}

/* v2 Phase 7 — Support prefers-contrast: more (cahier §7 a11y) :
   utilisateurs avec préférence système "contraste élevé" obtiennent
   des bordures plus épaisses et des séparateurs plus opaques.
   Étape 2 fondations : étendu aux classes legacy. */
@media (prefers-contrast: more) {
  :root {
    --bor: rgba(0,0,0,.25);
    --bor2: rgba(0,0,0,.15);
  }
  [data-theme="dark"] {
    --bor: rgba(255,255,255,.4);
    --bor2: rgba(255,255,255,.25);
  }
  .dw { border-width: 2px }
  .dw-pill { border-width: 2px }
  .dw-sep-line { height: 2px }
  .dw-cat-bar { height: 8px }
  .dw-kpi-bar { height: 6px }
  /* Classes legacy partagées par les onglets non-dashboard */
  .card { border-width: 2px }
  .modal { border-width: 2px }
  .alert { border-width: 2px }
  .tbl-wrap { border-width: 2px }
  .bs, .br, .bg { border-width: 2px }
  .inp { border-width: 2.5px }
  .badge { box-shadow: inset 0 0 0 1px currentColor }
}

/* LOT 0 — écart g2 / F-f2 : UNE seule convention de focus, sans liste d'exceptions.
   Avant, la règle ci-dessous énumérait 9 sélecteurs : tout ce qui n'y figurait pas
   (les commandes de Finances, entre autres) se tabulait à l'aveugle. La règle est
   désormais globale, en corail — usage que la charte réserve explicitement au focus. */
:focus-visible {
  outline: 2px solid var(--acc);
  outline-offset: 2px;
  box-shadow: var(--focus-ring);
}
/* Les classes legacy gardent leur rayon d'arrondi de contour. */
.btn:focus-visible,
.ni:focus-visible,
.m-close:focus-visible,
.sb-icon-btn:focus-visible,
.sb-collapse-btn:focus-visible,
.tbl tr[onclick]:focus-visible,
.tb-menu:focus-visible {
  border-radius: var(--r);
}
/* Onglets et entêtes de tableau cliquables : contour intégré pour
   ne pas casser le layout (offset négatif) */
.tab:focus-visible,
.tbl th[onclick]:focus-visible {
  outline-offset: -2px;
  border-radius: var(--r);
}

/* ── BASE ─────────────────────────────────────────────────── */
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;background:var(--bg);color:var(--t1);
  font-family:var(--font);
  font-size:var(--font-base);line-height:var(--lh);
  /* EDL TERRAIN lot 0 (CDC docs/CDC-EDL.md §3bis) — BUG DE PRODUCTION.
     Sans ça le pull-to-refresh du navigateur est actif : un défilement du haut
     vers le bas dans la modale EDL rechargeait la page. Ça a coûté un état des
     lieux réel le 20/08, et Didier s'est encore fait éjecter le 26/08 : `contain`
     bloque le CHAÎNAGE mais PAS le pull-to-refresh iOS (geste sur l'en-tête de la
     modale, hors conteneur de défilement). `none` le désactive vraiment. */
  overscroll-behavior-y:none}
  /* Ceinture + bretelles : sur iOS le pull-to-refresh peut viser documentElement. */
  html{overscroll-behavior:none}
a{color:var(--acc);text-decoration:none}

/* ── LAYOUT ───────────────────────────────────────────────── */
.layout{display:flex;height:100vh;overflow:hidden}

/* ── SIDEBAR ──────────────────────────────────────────────── */
.sb-nav{
  width:var(--sb);
  background:linear-gradient(170deg,rgba(11,21,45,.97) 0%,rgba(6,13,30,.99) 100%);
  border-right:none;
  display:flex;flex-direction:column;flex-shrink:0;
  overflow-y:auto;overflow-x:hidden;
  z-index:100;
  transition:width 230ms cubic-bezier(.4,0,.2,1);
  box-shadow:4px 0 24px rgba(0,0,0,.18);
  position:relative;
}
.sb-nav.sb-collapsed{width:64px}

/* Logo */
.sb-logo{
  padding:20px 18px 16px;
  border-bottom:1px solid rgba(255,255,255,.07);
  display:flex;align-items:center;gap:10px;
  min-height:64px;
  flex-shrink:0;
}
/* v15.26 — Boutons utilitaires (thème + font size) en haut sidebar à côté du logo */
.sb-logo-utils{
  display:flex;gap:5px;margin-left:auto;flex-shrink:0;
  transition:opacity 180ms;
}
.sb.sb-collapsed .sb-logo-utils{opacity:0;pointer-events:none;width:0;overflow:hidden}
.sb-logo-icon{font-size:22px;flex-shrink:0;line-height:1;display:flex;align-items:center;justify-content:center;color:#fff}
.sb-logo-text{display:flex;flex-direction:column;gap:1px;overflow:hidden;white-space:nowrap;transition:opacity 180ms,width 180ms}
.sb-logo-text strong{font-family:var(--display);font-weight:700;font-size:16px;color:#fff;letter-spacing:-.02em}
.sb-logo-text em{
  font-size:10px;color:rgba(255,255,255,.45);font-style:normal;letter-spacing:.4px;
  font-weight:600;text-transform:uppercase;
  display:inline-block;padding:1px 6px;margin-top:2px;
  background:rgba(255,90,60,.15);border-radius:4px;
}
.sb-collapse-btn{
  position:absolute;top:18px;right:-12px;
  width:24px;height:24px;border-radius:50%;
  background:rgba(11,21,45,.97);border:1.5px solid rgba(255,255,255,.15);
  color:rgba(255,255,255,.6);font-size:11px;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:transform 230ms,background .15s;z-index:10;
  box-shadow:0 2px 8px rgba(0,0,0,.3);
}
.sb-collapse-btn:hover{background:rgba(255,90,60,.8);color:#fff;border-color:var(--acc)}
.sb-nav.sb-collapsed .sb-collapse-btn{transform:rotate(180deg)}

/* Sections */
.sb-section{padding:6px 0}
.sb-section-title{
  font-size:11px;font-weight:700;color:rgba(255,255,255,.35);
  text-transform:uppercase;letter-spacing:1.4px;
  padding:12px 20px 5px;
  white-space:nowrap;overflow:hidden;
  transition:opacity 180ms,color .15s;
  /* v15.36 DASH-REFONTE-GLOBALE-V4 CP1 : titres cliquables (plier/déplier) */
  display:flex;align-items:center;justify-content:space-between;
  cursor:pointer;user-select:none;
}
.sb-section-title:hover{color:rgba(255,255,255,.6)}
.sb-section-title:focus-visible{outline:2px solid var(--acc);outline-offset:-2px;border-radius:4px}
.sb-chev{
  font-size:9px;opacity:.55;transition:transform .2s;
  flex-shrink:0;margin-left:6px;
}
.sb-section.sb-section-collapsed .sb-chev{transform:rotate(-90deg)}
.sb-section.sb-section-collapsed .ni{
  max-height:0;overflow:hidden;padding-top:0;padding-bottom:0;opacity:0;
  pointer-events:none;
}
.sb-nav.sb-collapsed .sb-section-title{opacity:0;padding-left:0;padding-right:0;cursor:default}
.sb-nav.sb-collapsed .sb-chev{display:none}

/* v15.36 DASH-REFONTE-GLOBALE-V4 CP1 — Entités épinglées top 3 par revenus (mode v2) */
.sb-pinned{
  padding:4px 0 8px;
  border-top:1px solid rgba(255,255,255,.07);
  margin-top:4px;
}
.sb-pinned:empty{display:none}
.sb-pinned .sb-pinned-title{
  font-size:11px;font-weight:700;color:rgba(255,255,255,.35);
  text-transform:uppercase;letter-spacing:1.4px;
  padding:12px 20px 5px;
  cursor:default;
}
.sb-pinned-ent{
  display:flex;align-items:center;gap:10px;
  padding:7px 18px;margin:1px 8px;border-radius:7px;
  color:rgba(255,255,255,.7);font-size:12.5px;font-weight:500;
  cursor:pointer;transition:background var(--t-fast),color var(--t-fast);
  white-space:nowrap;overflow:hidden;
}
.sb-pinned-ent:hover{background:rgba(255,255,255,.06);color:#fff}
.sb-pinned-ent:focus-visible{outline:2px solid var(--acc);outline-offset:-2px}
.sb-pinned-ic{font-size:14px;flex-shrink:0;line-height:1;opacity:.85}
.sb-pinned-name{flex:1;overflow:hidden;text-overflow:ellipsis}
.sb-pinned-rev{
  font-family:var(--mono);
  font-size:11px;font-weight:600;color:rgba(126,177,255,.85);
  flex-shrink:0;letter-spacing:.02em;
}
.sb-nav.sb-collapsed .sb-pinned{padding:4px 0}
.sb-nav.sb-collapsed .sb-pinned-title{display:none}
.sb-nav.sb-collapsed .sb-pinned-name,
.sb-nav.sb-collapsed .sb-pinned-rev{opacity:0;width:0;overflow:hidden}
.sb-nav.sb-collapsed .sb-pinned-ent{justify-content:center;padding:7px 0;margin:1px 4px}

/* v15.36 DASH-REFONTE-GLOBALE-V4 CP1 — Footer utilisateur sidebar (avatar + nom + lien Paramètres) */
.sb-user-footer{
  margin-top:auto;padding:12px 14px;
  border-top:1px solid rgba(255,255,255,.07);
  display:flex;align-items:center;gap:10px;
  flex-shrink:0;overflow:hidden;
}
.sb-user-footer:empty{display:none}
.sb-user-avatar{
  width:34px;height:34px;border-radius:50%;
  background:#5566aa;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--display);font-weight:700;font-size:12px;
  color:#fff;flex-shrink:0;letter-spacing:.02em;
}
.sb-user-info{
  display:flex;flex-direction:column;gap:1px;
  overflow:hidden;flex:1;min-width:0;
  transition:opacity 180ms,width 180ms;
}
.sb-user-name{
  font-size:13px;color:rgba(255,255,255,.92);font-weight:600;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.sb-user-link{
  background:transparent;border:none;cursor:pointer;
  color:rgba(255,255,255,.5);font-size:11px;font-weight:500;
  text-align:left;padding:0;font-family:inherit;
  transition:color .15s;
}
.sb-user-link:hover{color:rgba(126,177,255,1)}
.sb-user-link:focus-visible{outline:2px solid var(--acc);outline-offset:2px;border-radius:3px}
.sb-nav.sb-collapsed .sb-user-info{opacity:0;width:0}
.sb-nav.sb-collapsed .sb-user-footer{justify-content:center;padding:12px 0}

/* Nav items (v2 Phase 7 polish : typo plus large + hover plus doux) */
.ni{
  display:flex;align-items:center;gap:12px;
  padding:10px 18px;
  color:rgba(255,255,255,.65);
  cursor:pointer;font-size:14px;font-weight:500;
  transition:color var(--t-fast), background var(--t-fast);
  position:relative;white-space:nowrap;overflow:hidden;
  border-radius:0;
}
.ni:hover{color:#fff;background:rgba(255,255,255,.08)}
.ni.act{
  color:#fff;
  background:rgba(255,255,255,.08);
  font-weight:600;
  box-shadow:inset 3px 0 0 var(--acc);
}
.ni.act::before{
  content:'';position:absolute;left:0;top:18%;bottom:18%;
  width:3px;border-radius:0 2px 2px 0;
  background:var(--acc);
  box-shadow:0 0 8px color-mix(in srgb,var(--acc) 40%,transparent);
}
.ni .ico{width:22px;text-align:center;font-size:16px;flex-shrink:0;line-height:1;display:flex;align-items:center;justify-content:center;color:inherit}
.ni-label{transition:opacity 180ms,width 180ms;overflow:hidden}
.sb-nav.sb-collapsed .ni-label{opacity:0;width:0}
.sb-nav.sb-collapsed .ni{padding:10px 0;justify-content:center}

/* Tooltip for collapsed state */
.sb-nav.sb-collapsed .ni{position:relative}
.sb-nav.sb-collapsed .ni:hover::after{
  content:attr(data-tip);
  position:absolute;left:68px;top:50%;transform:translateY(-50%);
  background:rgba(11,21,45,.97);color:#fff;
  font-size:12px;font-weight:500;
  padding:5px 10px;border-radius:6px;
  border:1px solid rgba(255,255,255,.1);
  white-space:nowrap;pointer-events:none;z-index:200;
  box-shadow:0 4px 12px rgba(0,0,0,.3);
}

/* Sidebar footer */
.sb-footer{
  margin-top:auto;padding:12px 14px;
  border-top:1px solid rgba(255,255,255,.07);
  display:flex;align-items:center;gap:8px;
  flex-shrink:0;overflow:hidden;
}
.sb-footer-btns{display:flex;gap:6px;overflow:hidden;transition:opacity 180ms}
.sb-nav.sb-collapsed .sb-footer-btns{opacity:0;width:0;gap:0}
.sb-icon-btn{
  width:30px;height:30px;border-radius:8px;border:none;
  background:rgba(255,255,255,.08);color:rgba(255,255,255,.6);
  cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;
  transition:all .15s;flex-shrink:0;
}
.sb-icon-btn:hover{background:rgba(255,90,60,.4);color:#fff}
.sb-icon-btn.act{background:rgba(255,90,60,.5);color:#fff}

/* ── MAIN AREA ────────────────────────────────────────────── */
.main-area{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}

/* Toolbar */
.tb{
  background:var(--sur);
  border-bottom:1px solid var(--bor);
  padding:0 24px;
  height:54px;
  display:flex;align-items:center;gap:14px;flex-shrink:0;
  box-shadow:0 1px 0 var(--bor2);
}
.tb-menu{display:none;background:none;border:none;color:var(--t1);cursor:pointer;font-size:20px;padding:4px;line-height:1}
/* MOBILE-REFONTE — chip périmètre topbar : caché sur PC (le select dash-ent existe), affiché téléphone à droite. */
.tb-perim{display:none}
/* Sélecteur de périmètre — bottom-sheet plein écran (M-16). */
.pp-ov{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:2200}
.pp-ov.open{display:block}
.pp-sheet{position:absolute;left:0;right:0;bottom:0;background:var(--sur);border-radius:18px 18px 0 0;box-shadow:0 -8px 32px rgba(0,0,0,.28);max-height:80vh;overflow-y:auto;padding:8px 14px calc(env(safe-area-inset-bottom,12px) + 14px)}
.pp-grip{width:40px;height:4px;border-radius:4px;background:var(--bor);margin:8px auto 6px}
.pp-head{display:flex;align-items:center;justify-content:space-between;padding:4px 2px 10px}
.pp-head strong{font-size:16px;color:var(--t1);font-family:var(--display,inherit)}
.pp-x{background:none;border:0;color:var(--t3);cursor:pointer;padding:4px}
.pp-x svg{width:18px;height:18px}
.pp-row{display:flex;align-items:center;gap:11px;width:100%;background:none;border:0;border-radius:11px;padding:12px 10px;cursor:pointer;color:var(--t1);font:600 14px/1.2 'Inter',sans-serif;text-align:left}
.pp-row:active{background:var(--sur2)}
.pp-row.on{background:var(--acc-soft)}
.pp-row>svg:first-child{width:18px;height:18px;stroke:var(--t3);fill:none;flex:0 0 auto}
.pp-row.on>svg:first-child{stroke:var(--acc)}
.pp-nm{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pp-ck{width:17px;height:17px;stroke:var(--acc);fill:none;flex:0 0 auto}
/* MOBILE-REFONTE — lockup marque Propryo dans la topbar : caché sur PC/tablette, affiché sur téléphone. */
.tb-brand{display:none}
.tb-brand svg{display:block}
.tb-brand-word{font-family:var(--display,inherit);font-weight:800;font-size:15px;letter-spacing:-.02em;color:var(--t1);margin-left:7px;white-space:nowrap;display:none}
/* LINE-ICONS — alignement des icônes de chrome (_uiIcon). Hérite la couleur du parent. */
.uic{vertical-align:-.15em;flex:0 0 auto}
button .uic, a .uic, .btn .uic{margin-right:5px}
button .uic:only-child, .btn .uic:only-child{margin-right:0}
.tb-breadcrumb{flex:1;display:flex;align-items:center;gap:6px;font-size:13px;color:var(--t2);overflow:hidden}
.tb-breadcrumb strong{font-family:var(--display);font-weight:800;color:var(--t1);font-size:14.5px;white-space:nowrap;letter-spacing:-.02em}
.tb-sep{color:var(--t3);font-size:11px}
.tb-actions{display:flex;align-items:center;gap:8px}

/* Page content */
/* overscroll-behavior-y : EDL TERRAIN lot 0 — le défilement de la page ne se
   chaîne pas au document (pull-to-refresh), cf. §3bis du CDC EDL. */
.pc{flex:1;overflow-y:auto;overscroll-behavior-y:contain;padding:24px}

/* Page transitions */
.page{display:none;animation:pageIn .2s ease}
.page.act{display:block}
@keyframes pageIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}

/* ── CARDS & KPI ──────────────────────────────────────────── */
.card{
  background:var(--sur);border:1px solid var(--bor);
  border-radius:var(--rl);padding:20px;
  box-shadow:var(--shadow);
}
.kpi{
  background:var(--sur);border:1px solid var(--bor);
  border-radius:var(--rl);padding:18px;text-align:center;
  box-shadow:var(--shadow);
  transition:box-shadow .15s,transform .15s;
}
.kpi:hover{box-shadow:var(--shadow-hover);transform:translateY(-1px)}
.kpi .kv{font-size:24px;font-weight:800;color:var(--t1);font-family:var(--display);letter-spacing:-.02em}
.kpi .kl{font-size:11px;color:var(--t2);margin-top:3px;text-transform:uppercase;letter-spacing:.6px;font-weight:600}
.kpi .kt{font-size:11px;color:var(--t3);margin-top:5px}

/* Grids */
.g2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.g3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px}
.g4{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.ct{font-size:11px;font-weight:700;color:var(--t3);text-transform:uppercase;letter-spacing:1px;margin-bottom:14px;margin-top:24px}
.ct:first-child{margin-top:0}

/* ── BUTTONS ──────────────────────────────────────────────── */
.btn{
  display:inline-flex;align-items:center;gap:6px;
  padding:8px 16px;border-radius:var(--r);border:none;
  cursor:pointer;font-size:13.5px;font-weight:500;
  transition:all .15s;white-space:nowrap;
  font-family:var(--font);
}
.btn:disabled{opacity:.38;cursor:not-allowed}
.bp{background:var(--acc);color:#fff;box-shadow:0 2px 8px rgba(255,90,60,.3)}
.bp:hover:not(:disabled){background:var(--acc);box-shadow:0 4px 14px rgba(255,90,60,.4)}
.bs{background:var(--sur2);color:var(--t1);border:1px solid var(--bor)}
.bs:hover:not(:disabled){background:var(--sur3);border-color:var(--acc)}
.br{background:rgba(220,38,38,.1);color:var(--red);border:1px solid rgba(220,38,38,.2)}
.br:hover:not(:disabled){background:rgba(220,38,38,.18)}
.bg{background:rgba(22,163,74,.1);color:var(--grn);border:1px solid rgba(22,163,74,.2)}
.bg:hover:not(:disabled){background:rgba(22,163,74,.18)}
.bb{padding:5px 11px;font-size:12px}

/* ── v14.2 LOG-LISTE-CARDS Phase 1 — vue cartes pour #p-biens ───────────────
   Grid responsive 4/3/2/1 cols, cartes immeuble (ou logement à plat) avec
   ratio occupation, image placeholder, période de bail et loyer total mensuel. */
.biens-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:18px}
.biens-toolbar-left{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.biens-toolbar-right{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.biens-view-toggle{display:inline-flex;background:var(--sur2);border:1px solid var(--bor);border-radius:var(--r);padding:3px;gap:2px}
.biens-view-toggle .bvt{background:transparent;border:none;padding:7px 14px;font-size:12.5px;font-weight:600;color:var(--t2);cursor:pointer;border-radius:5px;transition:all var(--t-fast);font-family:var(--font)}
.biens-view-toggle .bvt.act{background:var(--sur);color:var(--acc);box-shadow:0 1px 3px rgba(0,0,0,.06)}
.biens-view-toggle .bvt:not(.act):hover{color:var(--t1)}
/* MOBILE-REFONTE lot 3c — line-icons currentColor (bascule + barre d'outils Biens), remplace les emoji. */
.biens-view-toggle .bvt{display:inline-flex;align-items:center;justify-content:center;gap:6px}
.tbico{fill:none;stroke:currentColor;flex:0 0 auto;vertical-align:middle}
.biens-view-toggle .bvt .tbico{width:15px;height:15px;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.biens-filter-btn .tbico,.biens-toolbar-right .btn .tbico{width:14px;height:14px;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.biens-search-icon .tbico{width:15px;height:15px;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.biens-count{font-size:12px;color:var(--t3);font-weight:500}
.biens-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.bien-card{background:var(--sur);border:1px solid var(--bor);border-radius:var(--rl);overflow:hidden;display:flex;flex-direction:column;cursor:pointer;transition:transform var(--t-fast),box-shadow var(--t-fast),border-color var(--t-fast);box-shadow:var(--shadow);position:relative}
.bien-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-card-hover);border-color:rgba(255,90,60,.4)}
.bien-card:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.bien-card-header{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 14px;border-bottom:1px solid var(--bor2);font-size:11.5px;font-weight:600;color:var(--t2);min-height:38px}
.bien-card-header .bch-bailleur{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1}
.bien-card-menu{background:transparent;border:none;color:var(--t3);cursor:pointer;padding:2px 8px;border-radius:4px;font-size:18px;line-height:1;flex-shrink:0}
.bien-card-menu:hover{background:var(--sur2);color:var(--t1)}
/* v14.34 : aspect-ratio resserré 21/9 (était 16/10) → cards plus courtes, body remonte au-dessus du pli */
.bien-card-img{width:100%;aspect-ratio:21/9;background:linear-gradient(135deg,var(--sur2),var(--sur3));display:flex;align-items:center;justify-content:center;font-size:36px;color:var(--t3);position:relative}
[data-theme="dark"] .bien-card-img{background:linear-gradient(135deg,rgba(255,255,255,.06),rgba(255,255,255,.02))}
.bien-card-occup{position:absolute;left:10px;bottom:10px;right:10px;background:rgba(255,255,255,.93);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border-radius:6px;padding:6px 10px;font-size:11.5px;font-weight:600;display:flex;align-items:center;gap:8px;color:#1a2332}
[data-theme="dark"] .bien-card-occup{background:rgba(20,30,45,.88);color:var(--t1)}
.bien-card-occup-label{white-space:nowrap;font-size:11px;font-weight:700}
.bien-card-occup-bar{flex:1;height:4px;background:rgba(0,0,0,.12);border-radius:2px;overflow:hidden;min-width:30px}
[data-theme="dark"] .bien-card-occup-bar{background:rgba(255,255,255,.18)}
.bien-card-occup-fill{height:100%;background:#16a34a;border-radius:2px;transition:width .3s ease-out}
.bien-card-occup-fill.partial{background:var(--ora)}
.bien-card-occup-fill.empty{background:var(--red)}
.bien-card-body{padding:14px;display:flex;flex-direction:column;gap:7px;flex:1}
.bien-card-title{font-size:15px;font-weight:700;color:var(--t1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--display);line-height:1.25}
.bien-card-subtitle{font-size:11.5px;color:var(--t3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bien-card-meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:11.5px;color:var(--t2)}
.bien-card-badge{display:inline-flex;align-items:center;padding:2px 8px;background:rgba(255,90,60,.12);color:var(--acc);border-radius:10px;font-size:10.5px;font-weight:700;letter-spacing:.2px}
.bien-card-badge.b-ok{background:rgba(22,163,74,.14);color:#16a34a}
.bien-card-badge.b-warn{background:rgba(234,88,12,.14);color:var(--ora)}
.bien-card-badge.b-mute{background:var(--sur2);color:var(--t3);border:1px solid var(--bor)}
.bien-card-period{font-size:11.5px;color:var(--t3);margin-top:auto}
.bien-card-rent{font-size:14.5px;font-weight:700;color:var(--t1);border-top:1px solid var(--bor2);padding-top:9px;margin-top:4px;display:flex;align-items:baseline;justify-content:space-between;gap:6px}
.bien-card-rent small{font-size:11px;font-weight:500;color:var(--t3)}
.biens-empty{text-align:center;padding:48px 16px;color:var(--t3);border:2px dashed var(--bor);border-radius:var(--rl);background:var(--sur2)}
.biens-empty-icon{font-size:48px;margin-bottom:12px;opacity:.55}
.biens-empty-title{font-size:15px;font-weight:600;color:var(--t2);margin-bottom:6px}
.biens-empty-msg{font-size:12.5px;margin-bottom:16px}
/* v14.2 LOG-ARCHIVE — tabs Actifs/Archivés + visuel cartes archivées + menu dropdown */
.biens-tabs{display:flex;gap:0;border-bottom:1px solid var(--bor);margin-bottom:14px;flex-wrap:wrap}
.biens-tab{
  background:transparent;border:none;padding:11px 18px;
  font-size:13px;font-weight:600;color:var(--t2);cursor:pointer;
  border-bottom:2px solid transparent;margin-bottom:-1px;
  transition:color var(--t-fast),border-color var(--t-fast);
  font-family:var(--font);
  display:inline-flex;align-items:center;gap:7px;
}
.biens-tab:hover{color:var(--t1)}
.biens-tab.act{color:var(--acc);border-bottom-color:var(--acc)}
.biens-tab-count{
  background:var(--sur2);color:var(--t2);font-size:11px;font-weight:700;
  padding:1px 7px;border-radius:9px;line-height:1.4;min-width:14px;text-align:center;
}
.biens-tab.act .biens-tab-count{background:rgba(255,90,60,.14);color:var(--acc)}

.bien-card.is-archived{opacity:.72;filter:grayscale(.25)}
.bien-card.is-archived:hover{opacity:1;filter:grayscale(0)}
.bien-card-archived-badge{
  display:inline-flex;align-items:center;flex-shrink:0;
  background:rgba(120,113,108,.92);color:#fff;
  padding:2px 8px;border-radius:10px;font-size:9.5px;font-weight:700;
  letter-spacing:.5px;text-transform:uppercase;line-height:1.4;
}
[data-theme="dark"] .bien-card-archived-badge{background:rgba(168,162,158,.78);color:#1a2332}

.bien-menu-popover{
  position:absolute;top:38px;right:8px;
  background:var(--sur);border:1px solid var(--bor);border-radius:var(--r);
  box-shadow:var(--shadow-card-hover);padding:5px;min-width:180px;z-index:50;
  animation:biensPopIn .15s ease-out;
}
.bmp-item{
  display:flex;align-items:center;gap:9px;
  padding:8px 11px;background:transparent;border:none;width:100%;
  font-size:13px;color:var(--t1);cursor:pointer;border-radius:5px;
  font-family:var(--font);text-align:left;line-height:1.2;
}
.bmp-item:hover{background:var(--sur2)}
.bmp-item.bmp-danger{color:var(--red)}
.bmp-item.bmp-danger:hover{background:rgba(220,38,38,.08)}
.bmp-divider{height:1px;background:var(--bor2);margin:4px 0}
/* v15.407 BUG-LOCATAIRE-UX-PACK — variante flottante : popover ancré au viewport (position:fixed),
   posé sur <body> par _openMenuPopover. Neutralise le top/right de la classe de base (pensée pour
   un parent .bien-card) : sans ça, right:8px + left inline étirait le menu sur toute la largeur. */
.bien-menu-popover.bmp-float{position:fixed;top:auto;right:auto;left:auto;min-width:220px;z-index:1000}

/* v14.2 LOG-LISTE-CARDS Phase 2 — toolbar : recherche, filtres, tri, export */
.biens-search-wrap{position:relative;display:flex;align-items:center}
.biens-search{
  width:240px;padding:8px 30px 8px 34px;
  background:var(--sur);border:1px solid var(--bor);border-radius:var(--r);
  font-size:13px;color:var(--t1);font-family:var(--font);
  transition:border-color var(--t-fast),box-shadow var(--t-fast);
}
.biens-search:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 3px rgba(255,90,60,.14)}
.biens-search::placeholder{color:var(--t3)}
.biens-search-icon{position:absolute;left:11px;color:var(--t3);font-size:14px;pointer-events:none}
.biens-search-clear{
  position:absolute;right:6px;background:transparent;border:none;
  color:var(--t3);cursor:pointer;font-size:14px;padding:3px 7px;
  border-radius:4px;display:none;line-height:1;
}
.biens-search-clear.show{display:inline-flex;align-items:center}
.biens-search-clear:hover{background:var(--sur2);color:var(--t1)}
/* v14.8.1 — indicateur visuel du raccourci clavier (caché si search a le focus ou contient du texte) */
.biens-search-kbd{
  position:absolute;right:8px;display:inline-flex;align-items:center;gap:3px;
  background:var(--sur2);border:1px solid var(--bor);border-radius:4px;
  padding:1px 5px;font-size:10px;color:var(--t3);font-family:var(--mono);
  pointer-events:none;line-height:1.3;letter-spacing:.3px;
  transition:opacity var(--t-fast);
}
.biens-search-wrap:focus-within .biens-search-kbd{opacity:0}
.biens-search-clear.show ~ .biens-search-kbd{opacity:0}
.biens-filter-wrap{position:relative}
.biens-filter-btn{
  display:inline-flex;align-items:center;gap:6px;
  padding:8px 12px;background:var(--sur);border:1px solid var(--bor);
  border-radius:var(--r);cursor:pointer;font-size:13px;color:var(--t1);
  font-family:var(--font);transition:all var(--t-fast);white-space:nowrap;
}
.biens-filter-btn:hover{border-color:var(--acc);color:var(--acc)}
.biens-filter-btn.has-active{border-color:var(--acc);color:var(--acc);background:rgba(255,90,60,.06)}
.biens-filter-btn-badge{
  background:var(--acc);color:#fff;font-size:10px;font-weight:700;
  padding:1px 6px;border-radius:9px;line-height:1.4;min-width:14px;text-align:center;
}
.biens-popover{
  position:absolute;top:calc(100% + 6px);right:0;
  background:var(--sur);border:1px solid var(--bor);border-radius:var(--rl);
  box-shadow:var(--shadow-card-hover);padding:14px;min-width:240px;z-index:100;
  display:none;
}
.biens-popover.open{display:block;animation:biensPopIn .15s ease-out}
@keyframes biensPopIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}
.biens-popover-row{margin-bottom:12px}
.biens-popover-row:last-of-type{margin-bottom:0}
.biens-popover-label{
  font-size:10.5px;font-weight:700;color:var(--t3);
  text-transform:uppercase;letter-spacing:.6px;margin-bottom:6px;
}
.biens-popover-row select,.biens-popover-row input[type=text]{
  width:100%;padding:7px 10px;background:var(--sur2);
  border:1px solid var(--bor);border-radius:var(--r);font-size:13px;
  color:var(--t1);font-family:var(--font);
}
.biens-popover-row select:focus,.biens-popover-row input[type=text]:focus{
  outline:none;border-color:var(--acc);box-shadow:0 0 0 2px rgba(255,90,60,.14);
}
.biens-popover-row label.cb{
  display:flex;align-items:center;gap:8px;font-size:13px;color:var(--t1);cursor:pointer;
  padding:5px 0;line-height:1.3;
}
.biens-popover-row label.cb:hover{color:var(--acc)}
.biens-popover-row label.cb input{margin:0}
.biens-popover-actions{
  display:flex;justify-content:space-between;gap:8px;align-items:center;
  border-top:1px solid var(--bor2);padding-top:10px;margin-top:10px;
}
.biens-popover-clear{
  background:transparent;border:none;color:var(--t3);cursor:pointer;
  font-size:12px;padding:4px 8px;border-radius:4px;font-family:var(--font);
}
.biens-popover-clear:hover{color:var(--red);background:rgba(220,38,38,.07)}
/* v14.2 LOG-FICHE-360 Phase 1 — vue dédiée full-page d'un bien */
.logf-back{
  background:transparent;border:none;color:var(--t2);cursor:pointer;
  font-size:13px;font-weight:600;padding:6px 10px;border-radius:5px;
  margin-bottom:8px;transition:all var(--t-fast);
  font-family:var(--font);
  display:inline-flex;align-items:center;gap:6px;
}
.logf-back:hover{background:var(--sur2);color:var(--t1)}
.logf-breadcrumb{
  font-size:11.5px;color:var(--t3);margin-bottom:14px;
  display:flex;align-items:center;gap:6px;flex-wrap:wrap;
}
.logf-breadcrumb .sep{color:var(--bor);font-weight:400}
.logf-breadcrumb a{color:var(--t2);text-decoration:none;cursor:pointer}
.logf-breadcrumb a:hover{color:var(--acc);text-decoration:underline}
.logf-hero{
  display:grid;grid-template-columns:340px 1fr;gap:20px;
  background:var(--sur);border:1px solid var(--bor);border-radius:var(--rl);
  padding:18px;box-shadow:var(--shadow);margin-bottom:18px;
}
.logf-photos{
  aspect-ratio:4/3;background:linear-gradient(135deg,var(--sur2),var(--sur3));
  border-radius:var(--r);display:flex;align-items:center;justify-content:center;
  color:var(--t3);font-size:60px;
}
[data-theme="dark"] .logf-photos{background:linear-gradient(135deg,rgba(255,255,255,.06),rgba(255,255,255,.02))}
.logf-info{display:flex;flex-direction:column;gap:10px;min-width:0}
.logf-title{
  font-size:24px;font-weight:800;color:var(--t1);margin:0;
  font-family:var(--display);line-height:1.2;letter-spacing:-.02em;
}
.logf-title-suffix{font-size:14px;font-weight:500;color:var(--t3);margin-left:6px}
.logf-adr{font-size:14px;color:var(--t2);line-height:1.4}
.logf-badges{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.logf-badge{
  display:inline-flex;align-items:center;gap:5px;
  padding:4px 10px;border-radius:14px;font-size:11px;font-weight:700;
  background:rgba(255,90,60,.12);color:var(--acc);
}
.logf-badge.b-ok{background:rgba(22,163,74,.14);color:#16a34a}
.logf-badge.b-warn{background:rgba(234,88,12,.14);color:var(--ora)}
.logf-badge.b-mute{background:var(--sur2);color:var(--t2);border:1px solid var(--bor)}
.logf-actions{margin-top:auto;display:flex;gap:8px;flex-wrap:wrap;padding-top:8px}

/* ── VACANCE-VIZ v14.33 — Hero compact : pulse 8px + scoreboard 4 KPIs ─── */
/* Hero compact : grille resserrée, image réduite à 96px, KPIs intégrés dans la colonne info */
.logf-hero-compact{grid-template-columns:120px 1fr;padding:14px 18px;gap:16px}
.logf-hero-compact .logf-photos-mini{
  width:96px;height:96px;font-size:38px;border-radius:var(--r);
  align-self:flex-start;aspect-ratio:auto;
}

/* ── v14.34 — Hero compact ent-fiche / imm-fiche : 3 colonnes (image | info | donut) ── */
.entf-hero-compact{
  grid-template-columns:96px 1fr 130px;padding:14px 18px;gap:16px;align-items:start;
}
.entf-photos-mini{
  width:96px;height:96px;font-size:38px;border-radius:var(--r);
  align-self:flex-start;aspect-ratio:auto;
  background:linear-gradient(135deg,var(--sur2),var(--sur3));
  display:flex;align-items:center;justify-content:center;color:var(--t3);
}
[data-theme="dark"] .entf-photos-mini{background:linear-gradient(135deg,rgba(255,255,255,.06),rgba(255,255,255,.02))}
/* BIENS (P1-15) — photo de couverture dans la vignette du hero : l'image doit remplir le carré
   sans deformer, et le bloc doit rogner (les vignettes sont carrees, les photos non). */
.logf-photos-mini, .entf-photos-mini{overflow:hidden}
.logf-photos-mini > img, .entf-photos-mini > img{width:100%;height:100%;object-fit:cover;border-radius:inherit}
.bien-card-img > img{width:100%;height:100%;object-fit:cover}
/* Repli de la vignette : tant que le binaire n'est pas chargé — ou s'il est introuvable —
   c'est l'icône qui occupe la place, jamais un carré vide. */
.cover-wrap{display:flex;align-items:center;justify-content:center;width:100%;height:100%}
.entf-donut-compact{
  display:flex;flex-direction:column;align-items:center;gap:4px;
  padding:6px 4px 0;align-self:flex-start;
}
.entf-donut-cap{font-size:10.5px;color:var(--t3);font-weight:600;letter-spacing:.2px;text-transform:uppercase}
/* Le donut SVG (96×96) hérite des styles _renderOccupationDonut existant */

/* Scoreboard 4 KPIs en grid 4 colonnes (par défaut). Réutilisé par logement/ent/imm. */
.logf-hero-stats-4{grid-template-columns:repeat(4,1fr)}
/* Variante 3 colonnes pour stats footer Gantt */
.logf-hero-stats-3{grid-template-columns:repeat(3,1fr)}

/* v14.74 REPORTING-BAILLEUR — 2 tableaux côte à côte sur desktop, empilés mobile */
.entf-compta-tables{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:900px){.entf-compta-tables{grid-template-columns:1fr}}

/* ══════════════════════════════════════════════════════════════════════
   GANTT IMMEUBLE v14.38 — Plan d'occupation 36 mois (24 passés + 12 futurs)
   Layout : grid 2 colonnes (label + track), track positionné en absolute
   ══════════════════════════════════════════════════════════════════════ */
.immf-gantt-wrap{
  background:var(--sur);border:1px solid var(--bor);border-radius:var(--rl);
  padding:18px 18px 14px;box-shadow:var(--shadow);
  overflow:hidden; /* contient les barres absolues */
}
.immf-gantt-head{
  display:flex;justify-content:space-between;align-items:flex-start;
  flex-wrap:wrap;gap:10px;margin-bottom:14px;
  padding-bottom:12px;border-bottom:1px solid var(--bor2);
}
.immf-gantt-head-title{font-size:14px;font-weight:700;color:var(--t1);font-family:var(--display)}
.immf-gantt-head-sub{font-size:11.5px;color:var(--t3);margin-top:2px}
.immf-gantt-head-r{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.immf-gantt-legend{font-size:10.5px;color:var(--t3);display:inline-flex;align-items:center;gap:5px}
.ig-dot{display:inline-block;width:10px;height:10px;border-radius:2px;vertical-align:middle}
.ig-dot.ig-real{background:hsl(220,62%,52%)}
.ig-dot.ig-proj{background:hsl(220,62%,52%);background-image:repeating-linear-gradient(45deg,transparent 0 3px,rgba(255,255,255,.4) 3px 6px)}
.ig-dot.ig-vac{background:rgba(220,38,38,.2);border:1px dashed rgba(220,38,38,.5)}

/* Une ligne du Gantt = grid [label fixe | track scrollable interne] */
.immf-gantt-row{
  display:grid;grid-template-columns:160px 1fr;gap:10px;
  align-items:stretch;
  border-radius:6px;
  transition:background var(--t-fast);
}
.immf-gantt-row:not(.immf-gantt-row-strip):not(.immf-gantt-row-header){
  cursor:pointer;
  border-bottom:1px solid var(--bor2);
}
.immf-gantt-row:not(.immf-gantt-row-strip):not(.immf-gantt-row-header):hover{background:var(--sur2)}
.immf-gantt-row:focus-visible{outline:2px solid var(--acc);outline-offset:-2px}
.immf-gantt-row-strip{margin-bottom:6px}
.immf-gantt-row-header{margin-bottom:8px}
.immf-gantt-body{display:flex;flex-direction:column}

.immf-gantt-rowlabel{
  display:flex;flex-direction:column;justify-content:center;
  padding:8px 10px 8px 0;min-width:0;
}
.immf-gantt-rowlabel-ref{
  font-size:13px;font-weight:700;color:var(--t1);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  font-family:var(--display);line-height:1.2;
}
.immf-gantt-rowlabel-sub{
  font-size:11px;color:var(--t3);font-weight:500;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  margin-top:2px;
}

/* La piste où vivent les barres positionnées en % */
.immf-gantt-track{
  position:relative;height:44px;
  background:var(--sur2);border-radius:5px;
  /* Hachures rouges très douces = vacance par défaut (les barres bail recouvrent) */
  background-image:repeating-linear-gradient(135deg,transparent 0 6px,rgba(220,38,38,.06) 6px 8px);
  overflow:hidden;
}
[data-theme="dark"] .immf-gantt-track{
  background:rgba(255,255,255,.04);
  background-image:repeating-linear-gradient(135deg,transparent 0 6px,rgba(220,38,38,.10) 6px 8px);
}
/* Strip (header taux occupation) plus fine */
.immf-gantt-strip{height:18px;display:flex;gap:0;background:transparent;background-image:none;overflow:hidden}
.immf-strip-cell{flex:1 1 0;height:100%;transition:opacity .15s}
.immf-strip-cell:hover{opacity:1!important;outline:1px solid var(--t1)}
.immf-strip-cell.immf-strip-now{outline:1.5px solid var(--acc);z-index:2}
/* Track header (mois) */
.immf-gantt-track-headers{
  height:34px;background:transparent;background-image:none;
  display:flex;
}
.immf-gantt-mh{
  flex:1 1 0;text-align:center;
  display:flex;flex-direction:column;justify-content:center;
  font-size:10px;color:var(--t3);font-weight:500;
  border-right:1px solid var(--bor2);
}
.immf-gantt-mh:last-child{border-right:none}
.immf-gantt-mh-now{color:var(--acc);font-weight:700;background:rgba(255,90,60,.06)}
.immf-gantt-mh-fut{opacity:.6}
.immf-gantt-mh-month{font-size:10px;line-height:1.1}
.immf-gantt-mh-year{font-size:9px;font-weight:700;color:var(--t2);margin-top:1px;letter-spacing:.3px}

/* La barre bail */
.immf-gantt-bar{
  position:absolute;top:6px;bottom:6px;
  border-radius:5px;
  border:1px solid transparent;
  display:flex;align-items:center;justify-content:flex-start;
  padding:0 8px;min-width:6px;
  cursor:pointer;
  transition:transform .15s,box-shadow .15s,filter .15s,opacity .15s;
  box-shadow:inset 0 -2px 0 0 rgba(0,0,0,.12);
  overflow:hidden;
}
.immf-gantt-bar-real{}
.immf-gantt-bar-proj{
  /* Projection : rayures subtiles qui rendent visuel "non encore réalisé" */
  background-image:repeating-linear-gradient(45deg,transparent 0 4px,rgba(255,255,255,.35) 4px 8px) !important;
  opacity:.78;
}
.immf-gantt-bar:hover{
  transform:scale(1.03);
  filter:brightness(1.08);
  box-shadow:0 4px 14px rgba(0,0,0,.18),inset 0 -2px 0 0 rgba(0,0,0,.18);
  z-index:5;
}
.immf-gantt-bar-hl{
  z-index:6;
  filter:brightness(1.12) saturate(1.15);
  box-shadow:0 0 0 2px rgba(255,255,255,.6),0 4px 14px rgba(0,0,0,.25);
  animation:igb-pulse 1.4s ease-in-out infinite;
}
[data-theme="dark"] .immf-gantt-bar-hl{
  box-shadow:0 0 0 2px rgba(255,255,255,.4),0 4px 14px rgba(0,0,0,.5);
}
.immf-gantt-bar-dim{filter:saturate(.4) brightness(.85);opacity:.55}
@keyframes igb-pulse{
  0%,100%{filter:brightness(1.12) saturate(1.15)}
  50%   {filter:brightness(1.25) saturate(1.3)}
}
.immf-gantt-bar-lbl{
  font-size:11px;font-weight:700;color:#fff;
  text-shadow:0 1px 2px rgba(0,0,0,.35);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  letter-spacing:.1px;
  pointer-events:none;
}

/* v14.46 — Bail clôturé (terminé sans projection) : pictogramme ✓ à la fin */
.immf-gantt-bar-ended::after{
  content:'✓';
  position:absolute;right:-1px;top:50%;transform:translateY(-50%);
  width:14px;height:14px;border-radius:50%;
  background:rgba(255,255,255,.92);color:var(--t1);
  display:flex;align-items:center;justify-content:center;
  font-size:9px;font-weight:900;
  box-shadow:0 1px 3px rgba(0,0,0,.25);
  pointer-events:none;
}
[data-theme="dark"] .immf-gantt-bar-ended::after{
  background:rgba(255,255,255,.85);
}

/* v14.46 — Zones de vacance labellisées (≥ 3 mois) */
.immf-gantt-vac{
  position:absolute;top:6px;bottom:6px;
  display:flex;align-items:center;justify-content:center;
  pointer-events:auto;cursor:help;
  border-radius:4px;
  background:repeating-linear-gradient(135deg,
    rgba(220,38,38,.08) 0 6px,
    rgba(220,38,38,.16) 6px 8px);
  border:1px dashed rgba(220,38,38,.28);
  z-index:1; /* sous les barres bail (z-index implicite plus haut sur hover) */
  overflow:hidden;
}
.immf-gantt-vac:hover{
  background:repeating-linear-gradient(135deg,
    rgba(220,38,38,.12) 0 6px,
    rgba(220,38,38,.22) 6px 8px);
  border-color:rgba(220,38,38,.45);
}
.immf-gantt-vac-lbl{
  font-size:10.5px;font-weight:700;color:#b91c1c;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  letter-spacing:.1px;padding:0 6px;
  pointer-events:none;
}
[data-theme="dark"] .immf-gantt-vac-lbl{color:#fca5a5}

/* Marker AUJOURD'HUI : ligne verticale 2px avec pulse subtil */
.immf-gantt-today{
  position:absolute;top:-2px;bottom:-2px;width:2px;
  background:var(--acc);
  z-index:4;
  pointer-events:none;
  animation:igt-pulse 2.2s ease-in-out infinite;
}
.immf-gantt-today::before{
  content:'';position:absolute;top:-3px;left:-3px;
  width:8px;height:8px;border-radius:50%;background:var(--acc);
  box-shadow:0 0 8px rgba(255,90,60,.6);
}
@keyframes igt-pulse{
  0%,100%{opacity:.85}
  50%   {opacity:1;box-shadow:0 0 6px rgba(255,90,60,.4)}
}

/* Stats footer */
.immf-gantt-footer{margin-top:14px;padding-top:14px;border-top:1px solid var(--bor2)}

/* v14.48 GANTT-PREAVIS — overlay zone préavis bailleur (orange) sur la projection */
.immf-gantt-preavis{
  position:absolute;top:6px;bottom:6px;
  display:flex;align-items:center;justify-content:center;
  pointer-events:auto;cursor:help;
  border-radius:5px;
  background:repeating-linear-gradient(135deg,
    rgba(249,115,22,.18) 0 6px,
    rgba(249,115,22,.32) 6px 8px);
  border:1.5px dashed rgba(249,115,22,.65);
  z-index:3; /* au-dessus des barres bail (z-index 0/normal), sous le marker today (4) */
  overflow:hidden;
  box-shadow:0 0 0 1px rgba(249,115,22,.15);
}
.immf-gantt-preavis-urgent{
  /* Aujourd'hui dans la zone préavis : pulse subtil pour attirer l'œil */
  border-color:rgba(220,38,38,.7);
  background:repeating-linear-gradient(135deg,
    rgba(220,38,38,.20) 0 6px,
    rgba(220,38,38,.36) 6px 8px);
  animation:igp-pulse 2s ease-in-out infinite;
}
@keyframes igp-pulse{
  0%,100%{box-shadow:0 0 0 1px rgba(220,38,38,.25)}
  50%   {box-shadow:0 0 0 3px rgba(220,38,38,.45)}
}
.immf-gantt-preavis-lbl{
  font-size:10.5px;font-weight:700;color:#9a3412;
  text-shadow:0 1px 2px rgba(255,255,255,.5);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  letter-spacing:.1px;padding:0 6px;
  pointer-events:none;
}
[data-theme="dark"] .immf-gantt-preavis-lbl{color:#fdba74;text-shadow:0 1px 2px rgba(0,0,0,.5)}
.immf-gantt-preavis-urgent .immf-gantt-preavis-lbl{color:#7f1d1d}
[data-theme="dark"] .immf-gantt-preavis-urgent .immf-gantt-preavis-lbl{color:#fca5a5}

/* Badge ⚠️ sur le label du logement quand bail en zone préavis */
.immf-gantt-rowlabel-warn{
  display:inline-block;margin-left:5px;
  font-size:11px;
  animation:igp-blink 1.6s ease-in-out infinite;
}
@keyframes igp-blink{
  0%,100%{opacity:.7;transform:scale(1)}
  50%   {opacity:1;transform:scale(1.15)}
}
.immf-gantt-row-preavis .immf-gantt-rowlabel-ref{color:#b91c1c;font-weight:800}
[data-theme="dark"] .immf-gantt-row-preavis .immf-gantt-rowlabel-ref{color:#fca5a5}

/* Stat warning (pour préavis count) */
.logf-stat-warn{border-color:rgba(220,38,38,.45);background:rgba(220,38,38,.06)}
[data-theme="dark"] .logf-stat-warn{background:rgba(220,38,38,.12)}

/* Responsive Gantt — 3 breakpoints
   PC ≥ 1280px : 36 mois lisibles, ligne 44px, label 160px
   Tablette 768-1279px : 36 mois compactés, ligne 38px, label 110px
   Mobile ≤ 767px : 24 mois (zoom out via overflow), ligne 32px, label 70px */
@media (max-width:1279px){
  .immf-gantt-row{grid-template-columns:130px 1fr;gap:8px}
  .immf-gantt-track{height:38px}
  .immf-gantt-rowlabel-ref{font-size:12px}
  .immf-gantt-rowlabel-sub{font-size:10px}
  .immf-gantt-bar-lbl{font-size:10.5px}
  .immf-gantt-mh-year{font-size:8.5px}
}
@media (max-width:900px){
  .immf-gantt-row{grid-template-columns:90px 1fr;gap:6px}
  .immf-gantt-track{height:34px}
  .immf-gantt-bar{padding:0 6px;border-radius:4px}
  .immf-gantt-rowlabel{padding:6px 6px 6px 0}
  .immf-gantt-rowlabel-ref{font-size:11.5px}
  .immf-gantt-rowlabel-sub{font-size:9.5px}
  .immf-gantt-bar-lbl{font-size:10px}
  .immf-gantt-strip{height:14px}
  .immf-gantt-track-headers{height:28px}
  .immf-gantt-mh-year{font-size:8px}
  .immf-gantt-head-r{display:none} /* légende cachée tablette pour gagner ligne */
}
@media (max-width:600px){
  .immf-gantt-wrap{padding:12px}
  .immf-gantt-row{grid-template-columns:64px 1fr;gap:5px}
  .immf-gantt-track{height:30px}
  .immf-gantt-bar{padding:0 4px;border-radius:3px;top:4px;bottom:4px}
  .immf-gantt-bar-lbl{display:none} /* trop étroit, tooltip suffit */
  .immf-gantt-rowlabel{padding:5px 4px 5px 0}
  .immf-gantt-rowlabel-ref{font-size:11px}
  .immf-gantt-rowlabel-sub{font-size:9px}
  .immf-gantt-strip{height:12px}
  .immf-gantt-track-headers{height:24px}
  .immf-gantt-mh-month{font-size:9px}
  .immf-gantt-mh-year{font-size:8px;letter-spacing:.2px}
  .immf-gantt-head{flex-direction:column;gap:6px;margin-bottom:10px}
  /* En mobile, le footer stats passe en 1 colonne pour lisibilité */
  .logf-hero-stats-3{grid-template-columns:1fr;gap:6px}
}
/* Pulse fine en séparateur entre badges et scoreboard.
   v14.35 : refonte flexbox DIV (était SVG, problèmes iOS Safari mobile).
   Hauteur 8px barre + 2px ombre marker + 10px marge totale = ~20px ajouté. */
.logf-hero-pulse{
  margin:10px 0 8px;width:100%;
  display:block;
}
.logf-hero-pulse-bar{
  display:flex;
  gap:1px;
  width:100%;max-width:340px;height:8px;
  border-radius:2px;
  overflow:visible; /* laisser dépasser la box-shadow du marker mois courant */
  padding-bottom:3px; /* place pour la marker bleue sous la dernière cellule */
  margin:0;
}
.lhp-cell{
  flex:1 1 0;
  min-width:4px; /* fallback si flex:1 ne s'applique pas */
  height:8px;
  border-radius:1.5px;
  cursor:default;
  transition:opacity .15s;
}
.lhp-cell:hover{opacity:1!important;outline:1px solid var(--t1);outline-offset:1px}
.lhp-loue{background:#16a34a}
.lhp-vacant{background:#dc2626}
.lhp-avant{background:var(--bor);opacity:.5}
.lhp-now{box-shadow:0 3px 0 0 var(--acc)} /* trait bleu 3px sous le mois courant */
.logf-hero-pulse-empty{
  font-size:10.5px;color:var(--t3);font-style:italic;padding:6px 0;
  border-top:1px dashed var(--bor);
}
/* Scoreboard : 4 mini-KPIs en ligne, fond très léger pour les détacher */
.logf-hero-stats{
  display:grid;grid-template-columns:repeat(4,1fr);gap:8px;
  margin:6px 0 10px;
}
.logf-stat{
  background:var(--sur2);border:1px solid var(--bor);border-radius:var(--r);
  padding:8px 10px;min-width:0;
}
.logf-stat-v{
  font-family:var(--display);font-size:16px;font-weight:700;
  color:var(--t1);line-height:1.15;letter-spacing:-.2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.logf-stat-v small{font-size:10.5px;color:var(--t3);font-weight:500;margin-left:1px}
.logf-stat-l{
  font-size:10.5px;color:var(--t3);font-weight:500;
  margin-top:2px;line-height:1.2;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.logf-stat-v.k-money{font-variant-numeric:tabular-nums}
.logf-stat-v.k-ok{color:#16a34a}
.logf-stat-v.k-warn{color:#dc2626}
.logf-stat-v.k-mute{color:var(--t3)}
@media (max-width:768px){
  .logf-hero-stats{grid-template-columns:repeat(2,1fr)}
  .logf-hero-stats-4{grid-template-columns:repeat(2,1fr)}
  /* v14.35 : pulse prend toute la largeur dispo sur tablette/mobile */
  .logf-hero-pulse-bar{max-width:none}
  /* Tablette : le donut passe sous l'info pour libérer la largeur */
  .entf-hero-compact{grid-template-columns:84px 1fr;gap:12px}
  .entf-photos-mini{width:84px;height:84px;font-size:32px}
  .entf-donut-compact{grid-column:1/-1;flex-direction:row;justify-content:center;gap:14px;padding-top:10px;border-top:1px solid var(--bor2)}
}
@media (max-width:600px){
  .logf-hero-compact{grid-template-columns:64px 1fr;gap:10px;padding:12px}
  .logf-hero-compact .logf-photos-mini{width:64px;height:64px;font-size:28px}
  .entf-photos-mini{width:64px;height:64px;font-size:28px}
  .entf-hero-compact{grid-template-columns:64px 1fr;gap:10px;padding:12px}
  .logf-stat{padding:6px 8px}
  .logf-stat-v{font-size:14px}
  /* v14.35 : pulse plus haute sur mobile (10px) pour rester touchable et lisible */
  .logf-hero-pulse-bar{height:10px;gap:1px;padding-bottom:3px}
  .lhp-cell{height:10px;min-width:3px}
  .lhp-now{box-shadow:0 3px 0 0 var(--acc)}
}
.logf-subtabs{
  display:flex;gap:0;border-bottom:1px solid var(--bor);margin-bottom:18px;
  overflow-x:auto;-webkit-overflow-scrolling:touch;
}
.logf-subtab{
  background:transparent;border:none;padding:11px 16px;
  font-size:13px;font-weight:600;color:var(--t2);cursor:pointer;
  border-bottom:2px solid transparent;margin-bottom:-1px;
  transition:color var(--t-fast),border-color var(--t-fast);
  font-family:var(--font);white-space:nowrap;
  display:inline-flex;align-items:center;gap:6px;
}
.logf-subtab:hover:not(.disabled){color:var(--t1)}
/* BIENS étape 8 (arbitrage « Nommer l'onglet Conformité », 13/08) — sur téléphone la barre
   d'onglets de fiche devient une GRILLE 2×2 au lieu d'une barre qui défile : 4 onglets, tous
   visibles, aucun geste caché. Zéro scroll horizontal à 390 px. */
@media (max-width: 560px){
  /* `auto-fit` plutôt que `1fr 1fr` : 4 onglets (fiche logement) → grille 2×2 ; 2 onglets
     (fiche immeuble) → 2 colonnes ; 1 onglet (fiche bailleur) → pleine largeur au lieu d'un
     bouton coincé sur la moitié gauche avec un vide à droite. */
  .logf-subtabs[role="tablist"]{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:2px;overflow-x:visible}
  .logf-subtabs[role="tablist"] .logf-subtab{
    white-space:normal;justify-content:center;text-align:center;padding:10px 8px;
    font-size:12px;line-height:1.25;min-width:0;
  }
}
.logf-subtab.act{color:var(--acc);border-bottom-color:var(--acc)}
.logf-subtab.disabled{opacity:.5;cursor:not-allowed}
.logf-subtab .soon{
  background:var(--sur2);color:var(--t3);font-size:9.5px;font-weight:700;
  padding:1px 6px;border-radius:8px;letter-spacing:.4px;text-transform:uppercase;
}
/* BIENS étapes 9 et 10 — PASTILLES D'ENTÊTE (fiches bailleur et immeuble).
   Rangée FIGÉE : `flex:1 1 0` + `min-width:0` → une pastille ne change ni de largeur ni de
   place quand on l'ouvre. UNE SEULE montre son contenu, sous la rangée ENTIÈRE. Identique en
   PC / tablette / téléphone (la rangée passe en grille 2 colonnes sous 560 px, sans scroll). */
.fiche-pastilles{display:flex;gap:6px;margin:0 0 4px}
.fiche-pastille{
  flex:1 1 0;min-width:0;display:flex;align-items:center;gap:6px;
  background:var(--sur);border:1px solid var(--bor);border-radius:var(--r);
  padding:7px 10px;height:34px;cursor:pointer;font-size:12.5px;font-weight:600;color:var(--t2);
  font-family:var(--font);transition:color var(--t-fast),border-color var(--t-fast);
}
.fiche-pastille:hover{color:var(--t1)}
.fiche-pastille.act{color:var(--acc);border-color:var(--acc)}
.fiche-pastille-lbl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;text-align:left}
.fiche-pastille-n{background:var(--sur2);color:var(--t3);border-radius:8px;padding:0 6px;font-size:11px;flex:0 0 auto}
.fiche-pastille-cx{flex:0 0 auto;font-size:11px;color:var(--t3)}
.fiche-pastille-body{
  background:var(--sur);border:1px solid var(--bor);border-radius:var(--rl);
  padding:14px 16px;margin:0 0 14px;
}
@media (max-width: 560px){
  .fiche-pastilles{display:grid;grid-template-columns:1fr 1fr}
}
/* Toggle Liste ⇄ Frise de l'onglet Logements (non mémorisé — geste ponctuel). */
.immf-vue-toggle{display:inline-flex;border:1px solid var(--bor);border-radius:var(--r);overflow:hidden}
.immf-vue-btn{
  background:var(--sur);border:none;padding:5px 14px;font-size:12.5px;font-weight:600;
  color:var(--t2);cursor:pointer;font-family:var(--font);
}
.immf-vue-btn.act{background:var(--acc);color:#fff}
.logf-panels{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.logf-panel{
  background:var(--sur);border:1px solid var(--bor);border-radius:var(--rl);
  padding:18px;box-shadow:var(--shadow);
}
.logf-panel-title{
  font-size:13px;font-weight:700;color:var(--t1);
  margin:0 0 14px;display:flex;align-items:center;gap:8px;
}
.logf-panel-empty{
  font-size:13px;color:var(--t3);font-style:italic;text-align:center;
  padding:18px 0;margin-bottom:8px;
}
/* #3 DEPART-VISIBILITE : bandeau « départ en cours » sur la fiche 360 */
.logf-depart{display:flex;align-items:center;gap:12px;padding:11px 13px;margin:0 0 14px;border:1px solid var(--acc,#ff5a3c);border-radius:var(--r,8px);background:linear-gradient(90deg,rgba(255,90,60,.08),transparent 70%);cursor:pointer}
.logf-depart:hover{background:linear-gradient(90deg,rgba(255,90,60,.13),var(--sur2,#f7f8fb) 70%)}
.logf-depart-ic{font-size:20px;flex:0 0 auto}
.logf-depart-tx{flex:1;min-width:0}
.logf-depart-tx .t{font-weight:700;font-size:13.5px;color:var(--t1)}
.logf-depart-tx .s{font-size:12px;color:var(--t2);margin-top:1px}
.logf-row{
  display:grid;grid-template-columns:140px 1fr;gap:10px;
  padding:8px 0;border-bottom:1px solid var(--bor2);font-size:13px;
  align-items:baseline;
}
.logf-row:last-child{border-bottom:none}
.logf-label{color:var(--t3);font-weight:500}
.logf-value{color:var(--t1);font-weight:600;text-align:right;word-break:break-word}
.logf-value-num{font-family:var(--display);font-weight:700}
.logf-value-strong{color:var(--acc);font-weight:700}
.logf-value-strong small{font-size:11px;color:var(--t3);font-weight:500;margin-left:2px}
@media (max-width:900px){
  .logf-hero{grid-template-columns:1fr;gap:14px}
  .logf-photos{aspect-ratio:16/9;font-size:48px}
  .logf-title{font-size:20px}
  .logf-panels{grid-template-columns:1fr;gap:12px}
  /* v14.33 : en mode compact, on garde l'image inline (pas full-width) sur tablette */
  .logf-hero-compact{grid-template-columns:84px 1fr;gap:12px}
  .logf-hero-compact .logf-photos-mini{width:84px;height:84px;font-size:32px}
}
/* Téléphone : une piste 1fr vaut minmax(auto,1fr) — le min-content d'UN descendant insécable (puce,
 * bouton nowrap) élargissait la colonne, donc TOUS les panneaux, au-delà de la page (overflow-x:hidden
 * → côté droit coupé). min-width:0 borne la piste à la page ; un élément trop large ne déborde plus que
 * de son propre panneau (et se corrige à la source). PC / tablette inchangés. */
@media (max-width:767px){
  .logf-panels>*{min-width:0}
}
@media (max-width:600px){
  .logf-hero{padding:14px}
  .logf-row{grid-template-columns:1fr;gap:2px;padding:7px 0}
  .logf-row .logf-value{text-align:left;font-size:14px}
  .logf-actions .btn{flex:1;justify-content:center}
}

/* v14.13 A3 — onglet Bail dans LOG-FICHE-360 (panneau, timeline historique, liste) */
.logf-bail-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:0 24px;
  margin-bottom:14px;
}
.logf-bail-actions{
  display:flex;flex-wrap:wrap;gap:8px;
  border-top:1px solid var(--bor2);padding-top:14px;margin-top:6px;
}
/* HISTORIQUE-BAIL-ONGLET (17/07) : styles .logf-bail-hist-* et .bail-tl-* retires
   (liste historique + timeline horizontale remplacees par les accordeons .hbc). */
@media (max-width:600px){
  .logf-bail-grid{grid-template-columns:1fr;gap:0}
  .logf-bail-actions .btn{flex:1;justify-content:center}
}

/* v14.15 ARCHI-DB-DOUBLONS Phase 3a — modale logement avec tabs internes
   Décisions Q2=B (tabs) + Q2bis (mobilier) cf docs/subjects/ARCHI-DB-DOUBLONS.md */
.logmod-tabs{
  display:flex;gap:0;border-bottom:1px solid var(--bor);
  padding:0 18px;background:var(--sur2);
  overflow-x:auto;-webkit-overflow-scrolling:touch;
}
.logmod-tab{
  background:transparent;border:none;padding:11px 14px;
  font-size:13px;font-weight:600;color:var(--t2);cursor:pointer;
  border-bottom:2px solid transparent;margin-bottom:-1px;
  transition:color var(--t-fast),border-color var(--t-fast);
  font-family:var(--font);white-space:nowrap;
  display:inline-flex;align-items:center;gap:5px;flex-shrink:0;
}
.logmod-tab:hover{color:var(--t1)}
.logmod-tab.act{color:var(--acc);border-bottom-color:var(--acc)}
.logmod-pane{display:none}
.logmod-pane.act{display:block;animation:logmodFade .2s ease-out}
@keyframes logmodFade{from{opacity:0;transform:translateY(2px)}to{opacity:1;transform:translateY(0)}}
.logmod-section-title{
  font-size:11px;font-weight:700;color:var(--t3);
  text-transform:uppercase;letter-spacing:.6px;
  margin:18px 0 10px;padding-top:14px;border-top:1px solid var(--bor2);
}
.logmod-section-title:first-child{margin-top:6px;padding-top:0;border-top:none}
.logmod-info-banner{
  background:rgba(255,90,60,.08);border-left:3px solid var(--acc);
  padding:10px 13px;font-size:11.5px;color:var(--t2);line-height:1.5;
  border-radius:4px;margin:0 0 14px;
}
.logmod-checkbox-group{display:flex;flex-wrap:wrap;gap:8px 18px}
.logmod-checkbox-group label{
  display:flex;align-items:center;gap:6px;font-size:13px;cursor:pointer;
  padding:5px 0;
}
.logmod-mobilier-row{
  display:grid;grid-template-columns:1fr 2fr 70px 100px auto;gap:6px;
  align-items:center;background:var(--sur2);border:1px solid var(--bor);
  border-radius:var(--r);padding:7px 9px;
}

/* v14.18 FICHES-PARITE-360 Session 1 — sous-onglet Compta de la fiche logement
   Toolbar année + KPIs + cash-flow SVG + listes mvt/quittances/IRL/régul */
.compta-toolbar{
  display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;
  margin-bottom:14px;padding-bottom:14px;border-bottom:1px solid var(--bor2);
}
.compta-toolbar-left{display:flex;align-items:center;gap:8px}
.compta-toolbar-right{display:flex;flex-wrap:wrap;gap:6px}
.compta-cashflow{
  background:var(--sur);border:1px solid var(--bor);border-radius:var(--rl);
  padding:14px 16px;margin:14px 0;box-shadow:var(--shadow);
}
.compta-cashflow-title{
  font-size:11px;font-weight:700;color:var(--t3);
  text-transform:uppercase;letter-spacing:.6px;margin-bottom:8px;
}
.compta-cashflow-svg{display:block;width:100%;height:auto;max-height:160px}
.compta-list{
  display:flex;flex-direction:column;gap:4px;margin-top:6px;
  background:var(--sur2);border-radius:var(--r);padding:6px;
}
.compta-row{
  display:grid;grid-template-columns:80px 1fr 130px 100px 30px;
  gap:10px;align-items:center;padding:7px 10px;
  background:var(--sur);border-radius:5px;font-size:12.5px;
  transition:background var(--t-fast);
}
.compta-row:hover{background:var(--sur3)}
.compta-row-date{font-weight:600;color:var(--t2);font-size:11.5px}
.compta-row-lib{
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  color:var(--t1);font-weight:500;
}
.compta-row-cat{font-size:11px;color:var(--t3)}
.compta-row-amt{font-weight:700;text-align:right;font-family:var(--display)}
.compta-row-amt.pos{color:#16a34a}
.compta-row-amt.neg{color:var(--red)}
.compta-row-act{text-align:center;color:var(--t3)}
.compta-row-fac{
  display:inline-block;color:var(--t3);font-size:11px;
  margin-right:2px;cursor:help;opacity:.75;
  transition:opacity var(--t-fast),transform var(--t-fast);
  background:none;border:none;padding:0;
}
.compta-row-fac:hover{opacity:1}
.compta-row-fac-active{
  cursor:pointer;color:var(--acc);
}
.compta-row-fac-active:hover{
  transform:scale(1.15);opacity:1;
}
/* ══ V13 (CDC-LOYERS-DESIGN) — L'ÉTAT DU QUITTANCEMENT, DOUZE CASES PAR ANNÉE ═══
   Ce qui remplace la LISTE des quittances de la fiche du bien. Contrainte dure du CDC :
   compact, très compréhensible, et NE GROSSIT PAS avec l'historique — une bande de taille
   fixe quel que soit le nombre d'années. Calque de l'écran EDL du logement. */
.e12{background:var(--sur);border:1px solid var(--bor);border-radius:var(--rl);overflow:hidden}
.e12-h{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;padding:7px 11px;border-bottom:1px solid var(--bor)}
.e12-h .t{font-weight:800;font-size:12.5px;color:var(--t1)}
.e12-h .s{font-size:10.5px;color:var(--t3);margin-left:auto;text-align:right}
.e12-g{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:3px;padding:9px 11px 6px}
.e12-c{border:1px solid var(--bor);border-radius:8px;background:var(--sur2);padding:5px 2px 6px;
  text-align:center;cursor:pointer;min-width:0;font-family:var(--font);transition:all .12s}
.e12-c:hover{border-color:var(--acc)}
.e12-c:focus-visible{outline:2px solid var(--acc);outline-offset:1px}
.e12-c .m{display:block;font:800 11px var(--font);color:var(--t2);line-height:1.1}
.e12-c .b{display:block;font-size:9px;color:var(--t3);line-height:1.25;margin-top:2px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-variant-numeric:tabular-nums}
.e12-done{background:var(--pos-soft);border-color:color-mix(in srgb,var(--pos) 45%,transparent)}
.e12-done .m,.e12-done .b{color:var(--pos)}
.e12-ok{background:var(--acc-bg);border-color:color-mix(in srgb,var(--acc) 45%,transparent)}
.e12-ok .m,.e12-ok .b{color:var(--acc)}
.e12-no{background:var(--neg-soft);border-color:color-mix(in srgb,var(--neg) 40%,transparent)}
.e12-no .m,.e12-no .b{color:var(--neg)}
.e12-fut{opacity:.65}
.e12-off{opacity:.4;cursor:default}
/* V9 — le geste forcé se voit : liseré, et le survol dit qui a confirmé et quand. */
.e12-forcee{box-shadow:inset 0 -3px 0 var(--warn)}
.e12-l{display:flex;flex-wrap:wrap;gap:9px;padding:0 12px 9px;font-size:10px;color:var(--t3)}
.e12-l i{display:inline-block;width:12px;height:9px;border-radius:2px;margin-right:4px;vertical-align:-1px;
  background:var(--sur2);border:1px solid var(--bor)}
.e12-l i.done{background:var(--pos);border-color:var(--pos)}
.e12-l i.ok{background:var(--acc);border-color:var(--acc)}
.e12-l i.no{background:var(--neg);border-color:var(--neg)}
.e12-l i.fut{opacity:.5}
@media (max-width:820px){ .e12-g{grid-template-columns:repeat(6,minmax(0,1fr));row-gap:4px} }
@media (max-width:520px){ .e12-g{grid-template-columns:repeat(4,minmax(0,1fr));row-gap:4px} }

.compta-empty{
  text-align:center;color:var(--t3);font-style:italic;
  padding:14px;background:var(--sur2);border-radius:var(--r);
  font-size:13px;
}
@media (max-width:768px){
  .compta-toolbar{flex-direction:column;align-items:stretch}
  .compta-toolbar-right{width:100%;justify-content:flex-end}
  .compta-row{grid-template-columns:60px 1fr 100px 30px;gap:6px;font-size:12px}
  .compta-row-cat{display:none}
}

/* ════════════════════════════════════════════════════════════════════════
   FICHES-PARITE-360 v14.50 — Sous-onglets Entretien + Documents fiche logement
   ════════════════════════════════════════════════════════════════════════ */

/* Section header (réutilisé Entretien + Documents) */
.logf-section-head{
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;
  gap:10px;margin-bottom:10px;
  padding-bottom:8px;border-bottom:1px solid var(--bor2);
}
.logf-section-title{
  font-size:14px;font-weight:700;color:var(--t1);margin:0;
  font-family:var(--display);letter-spacing:-.1px;
}

/* ── ENTRETIEN : grille de cards équipements/assurances ──────────────── */
.logf-equip-grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:12px;
}
.logf-equip-card{
  background:var(--sur);border:1px solid var(--bor);border-radius:var(--rl);
  padding:14px;display:flex;flex-direction:column;gap:10px;
  box-shadow:var(--shadow);transition:border-color .15s,transform .15s;
}
.logf-equip-card:hover{border-color:var(--acc);transform:translateY(-1px)}
.logf-equip-card.logf-equip-late{border-color:rgba(220,38,38,.5);background:linear-gradient(135deg,rgba(220,38,38,.04),transparent)}
.logf-equip-card.logf-equip-soon{border-color:rgba(245,158,11,.45);background:linear-gradient(135deg,rgba(245,158,11,.04),transparent)}
.logf-equip-card.logf-equip-ok{border-color:rgba(22,163,74,.35)}
.logf-equip-head{
  display:flex;align-items:flex-start;gap:10px;
}
.logf-equip-icon{font-size:24px;flex-shrink:0;line-height:1}
.logf-equip-icon svg{width:24px;height:24px}
.logf-equip-title{flex:1;min-width:0}
.logf-equip-name{
  font-size:13.5px;font-weight:700;color:var(--t1);
  font-family:var(--display);line-height:1.25;
}
.logf-equip-base{
  font-size:11px;color:var(--t3);margin-top:3px;line-height:1.35;
}
.logf-equip-badge{
  display:inline-flex;align-items:center;gap:4px;
  padding:3px 9px;border-radius:10px;font-size:10.5px;font-weight:700;
  white-space:nowrap;flex-shrink:0;
}
.logf-equip-badge.logf-equip-ok{background:rgba(22,163,74,.14);color:#16a34a}
.logf-equip-badge.logf-equip-soon{background:rgba(245,158,11,.18);color:#b45309}
.logf-equip-badge.logf-equip-late{background:rgba(220,38,38,.16);color:#b91c1c;animation:igp-blink 1.6s ease-in-out infinite}
.logf-equip-badge.logf-equip-mute{background:var(--sur2);color:var(--t3);border:1px solid var(--bor)}
[data-theme="dark"] .logf-equip-badge.logf-equip-soon{color:#fbbf24}
[data-theme="dark"] .logf-equip-badge.logf-equip-late{color:#fca5a5}
.logf-equip-body{display:flex;flex-direction:column;gap:5px;font-size:12.5px}
.logf-equip-row{display:flex;justify-content:space-between;gap:10px;padding:3px 0;border-bottom:1px dashed var(--bor2)}
.logf-equip-row:last-child{border-bottom:none}
.logf-equip-l{color:var(--t3)}
.logf-equip-v{color:var(--t1);font-weight:600;text-align:right}
.logf-equip-notes{
  font-size:11.5px;color:var(--t2);font-style:italic;
  padding:6px 8px;background:var(--sur2);border-radius:5px;border-left:2px solid var(--bor);
}
.logf-equip-actions{display:flex;gap:6px;flex-wrap:wrap;margin-top:auto;padding-top:6px;border-top:1px solid var(--bor2)}

/* ── ENTRETIEN : agenda lié (liste compacte) ─────────────────────────── */
.logf-agenda-list{display:flex;flex-direction:column;gap:6px}
.logf-agenda-row{
  display:grid;grid-template-columns:140px 1fr 110px 110px;
  gap:10px;align-items:center;
  padding:9px 12px;background:var(--sur);border:1px solid var(--bor);border-radius:6px;
  font-size:12.5px;cursor:pointer;transition:background .15s;
}
.logf-agenda-row:hover{background:var(--sur2)}
.logf-agenda-cat{
  display:inline-flex;align-items:center;gap:5px;
  padding:3px 9px;border-radius:10px;font-size:10.5px;font-weight:700;
  white-space:nowrap;
}
.logf-agenda-cat svg{width:13px;height:13px}
.logf-agenda-title{
  color:var(--t1);font-weight:600;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.logf-agenda-date{color:var(--t2);font-size:11.5px}

/* ── DOCUMENTS : cards (uniformes pour bail / EDL / IRL / quittance / drive) ── */
.logf-doc-card{
  display:grid;grid-template-columns:40px 1fr auto;gap:12px;align-items:center;
  background:var(--sur);border:1px solid var(--bor);border-radius:var(--r);
  padding:11px 14px;margin-bottom:8px;
  transition:border-color .15s;
}
.logf-doc-card:hover{border-color:var(--acc)}
.logf-doc-icon{font-size:24px;text-align:center;line-height:1}
.logf-doc-info{min-width:0}
.logf-doc-name{
  font-size:13.5px;font-weight:700;color:var(--t1);
  font-family:var(--display);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.logf-doc-meta{
  font-size:11.5px;color:var(--t3);margin-top:2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.logf-doc-meta .logf-equip-badge{vertical-align:middle;margin-right:4px}
.logf-doc-actions{display:flex;gap:6px;flex-shrink:0}
/* AVENANT-REFONTE lot 2 — cartes d'avenant (onglet Bail) : le titre nomme les personnes et les montants,
 * il se replie au lieu d'être coupé ; les gestes passent sous le texte quand la place manque. */
.logf-av-card .logf-doc-name,.logf-av-card .logf-doc-meta{white-space:normal;overflow:visible}
.logf-av-card .logf-doc-name.annule{text-decoration:line-through;color:var(--t3)}
.logf-av-card .logf-doc-actions{flex-wrap:wrap;justify-content:flex-end}
@media (max-width:1180px){
  .logf-av-card{grid-template-columns:40px 1fr}
  .logf-av-card .logf-doc-actions{grid-column:2/-1;justify-content:flex-start}
}
@media (max-width:767px){
  .logf-av-card .logf-doc-actions .btn,.logf-av-head .btn.bs{min-height:44px}
}
.logf-doc-empty{
  text-align:center;color:var(--t3);font-style:italic;
  padding:18px 14px;background:var(--sur2);border-radius:var(--r);
  font-size:13px;
}

/* ── DOCUMENTS : galerie photos (LOG-PHOTOS) ─────────────────────────── */
.logf-doc-photos{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px;
}
.logf-doc-photo{
  aspect-ratio:4/3;border-radius:var(--r);overflow:hidden;cursor:pointer;
  background:var(--sur2);
}
.logf-doc-photo img{width:100%;height:100%;object-fit:cover;display:block}

/* ── COMPTEURS v14.56 (sous-onglet Compteurs fiche logement) ───────────── */
.logf-cpt-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:14px;margin-top:8px;
}
.logf-cpt-card{
  background:var(--sur2);border:1px solid var(--bor);border-radius:var(--rl);
  padding:14px;display:flex;flex-direction:column;gap:10px;
}
.logf-cpt-card-empty{opacity:.7}
.logf-cpt-card-head{display:flex;align-items:center;gap:10px}
.logf-cpt-icon{
  width:34px;height:34px;border-radius:var(--r);
  display:flex;align-items:center;justify-content:center;
  font-size:18px;flex-shrink:0;
}
.logf-cpt-icon svg{width:19px;height:19px}
.logf-cpt-card-title{flex:1;font-weight:700;font-size:13.5px;color:var(--t1)}
.logf-cpt-empty{padding:12px;text-align:center;color:var(--t3);font-style:italic}
.logf-cpt-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.logf-cpt-kpi{
  background:var(--sur);border:1px solid var(--bor2);border-radius:var(--r);
  padding:6px 8px;min-width:0;
}
.logf-cpt-kpi-v{
  font-family:var(--display);font-weight:700;font-size:14px;color:var(--t1);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.logf-cpt-kpi-v small{font-size:10px;font-weight:500;color:var(--t3);margin-left:2px}
.logf-cpt-kpi-v.k-ok{color:var(--grn)} .logf-cpt-kpi-v.k-warn{color:var(--red)}
.logf-cpt-kpi-v.k-mute{color:var(--t3)}
.logf-cpt-kpi-l{font-size:10px;color:var(--t3);margin-top:2px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.logf-cpt-kpi-l small{font-size:9px;color:var(--t3);margin-left:2px}
.logf-cpt-chart-svg{width:100%;height:auto;display:block;max-width:100%}
.logf-cpt-chart-empty{padding:30px 12px;text-align:center;background:var(--sur);border-radius:var(--r);border:1px dashed var(--bor2)}
.logf-cpt-list{display:flex;flex-direction:column;gap:4px;font-size:11.5px}
.logf-cpt-row{
  display:grid;grid-template-columns:80px 90px 1fr auto;gap:6px;align-items:center;
  padding:5px 8px;background:var(--sur);border-radius:var(--r);
}
.logf-cpt-row-date{color:var(--t2);font-weight:600}
.logf-cpt-row-val{font-weight:700;color:var(--t1);text-align:right}
.logf-cpt-row-val small{font-size:10px;color:var(--t3);font-weight:500;margin-left:2px}
.logf-cpt-conso{font-size:10.5px;color:var(--t3);font-style:italic}
.logf-cpt-src{font-size:10px;flex-shrink:0;cursor:help}
.logf-cpt-src-edl{opacity:.7}
.logf-cpt-src-manuel{opacity:.85}

/* ── CHARGES COMMUNES v14.59 (compteurs collectifs immeuble) ─────────── */
.cc-grid{
  display:flex;flex-direction:column;gap:14px;margin-top:8px;
}
.cc-card{
  /* Réutilise .logf-cpt-card mais largeur full pour le tableau quote-part */
}
.cc-table-wrap{
  background:var(--sur);border:1px solid var(--bor);border-radius:var(--r);
  padding:8px 10px;overflow-x:auto;
}
.cc-table{
  width:100%;border-collapse:collapse;font-size:12px;
}
.cc-table th{
  text-align:left;padding:6px 8px;border-bottom:1px solid var(--bor2);
  font-size:11px;color:var(--t3);font-weight:700;letter-spacing:.2px;
}
.cc-table td{
  padding:7px 8px;border-bottom:1px solid var(--bor2);vertical-align:top;
}
.cc-table tbody tr:last-child td{border-bottom:none}
.cc-table tbody tr:hover{background:var(--sur2)}
.cc-table .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.cc-table th.num{text-align:right}
.cc-row-exclu{opacity:.5;font-style:italic}

@media (max-width:768px){
  .cc-table{font-size:11px}
  .cc-table th,.cc-table td{padding:5px 6px}
}

/* ── ÉTATS DES LIEUX v14.57 (sous-onglet EDL fiche logement) ──────────── */
.logf-edl-grid{
  display:flex;flex-direction:column;gap:10px;margin-top:8px;
}
.logf-edl-card{
  background:var(--sur);border:1px solid var(--bor);border-radius:var(--rl);
  padding:12px 14px;display:flex;flex-direction:column;gap:8px;
  transition:border-color var(--t-fast),transform var(--t-fast);
}
.logf-edl-card:hover{border-color:var(--acc)}
.logf-edl-card-head{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
  font-size:13px;
}
.logf-edl-type{
  display:inline-flex;align-items:center;gap:4px;
  padding:3px 9px;border-radius:12px;font-size:11.5px;font-weight:700;
  flex-shrink:0;
}
.logf-edl-date{color:var(--t2);font-weight:600;font-family:var(--display)}
.logf-edl-loc{
  flex:1;min-width:0;font-weight:600;color:var(--t1);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.logf-edl-card-meta{
  display:flex;gap:14px;flex-wrap:wrap;
  font-size:11.5px;color:var(--t3);
}
.logf-edl-card-actions{
  display:flex;gap:6px;flex-wrap:wrap;
  padding-top:6px;border-top:1px dashed var(--bor2);
}

/* Bandeau template */
.logf-edl-tpl-banner{
  display:flex;gap:12px;align-items:center;
  padding:12px 14px;margin:8px 0 12px;
  border-radius:var(--rl);
}
.logf-edl-tpl-active{
  background:linear-gradient(135deg,rgba(255,90,60,.06),rgba(255,90,60,.02));
  border:1px solid rgba(255,90,60,.32);
}
.logf-edl-tpl-inactive{
  background:var(--sur2);border:1px dashed var(--bor);
}
.logf-edl-tpl-icon{font-size:24px;flex-shrink:0}
.logf-edl-tpl-info{flex:1;min-width:0}
.logf-edl-tpl-title{font-weight:700;font-size:13px;color:var(--t1)}
.logf-edl-tpl-meta{font-size:11.5px;color:var(--t3);margin-top:2px;line-height:1.4}
.logf-edl-tpl-actions{display:flex;gap:6px;flex-wrap:wrap;flex-shrink:0}

/* Responsive EDL */
@media (max-width:768px){
  .logf-edl-tpl-banner{flex-direction:column;align-items:flex-start}
  .logf-edl-tpl-actions{align-self:stretch;justify-content:flex-end}
  .logf-edl-card-actions{flex-direction:column}
  .logf-edl-card-actions .btn{width:100%;justify-content:center}
}
@media (max-width:600px){
  .logf-edl-card-head{flex-wrap:wrap}
  .logf-edl-loc{flex-basis:100%}
}

/* Responsive : 1024px → grille équipements 1 col, agenda compact */
@media (max-width:1024px){
  .logf-equip-grid{grid-template-columns:1fr}
}
@media (max-width:768px){
  .logf-section-head{flex-direction:column;align-items:flex-start;gap:6px}
  .logf-agenda-row{grid-template-columns:1fr;gap:5px;padding:10px}
  .logf-agenda-cat,.logf-agenda-date,.logf-equip-badge{align-self:flex-start}
  .logf-doc-card{grid-template-columns:32px 1fr;gap:8px}
  .logf-doc-actions{grid-column:1/-1;justify-content:flex-end}
  .logf-equip-card{padding:11px}
  .logf-equip-icon{font-size:20px}
  /* Compteurs : passer en 1 colonne, KPIs en 2 colonnes (1 sur petite ligne) */
  .logf-cpt-grid{grid-template-columns:1fr}
  .logf-cpt-row{grid-template-columns:70px 1fr auto auto;gap:5px}
  .logf-cpt-conso{display:none}
}
@media (max-width:600px){
  .logf-equip-head{flex-direction:column;align-items:flex-start}
  .logf-equip-badge{align-self:flex-start}
  .logf-doc-photos{grid-template-columns:repeat(2,1fr)}
  /* Compteurs : KPIs en 1 colonne pour lisibilité */
  .logf-cpt-kpis{grid-template-columns:1fr}
}

/* v14.17 ARCHI-DB-DOUBLONS Phase 4a — inputs lecture seule dans le tab "Le bien" du wizard bail */
.tab-panel#bp-bien input.readonly-bien,
.tab-panel#bp-bien select.readonly-bien,
.tab-panel#bp-bien textarea.readonly-bien{
  background:var(--sur2)!important;
  color:var(--t2)!important;
  cursor:not-allowed!important;
  opacity:.88;
  border-style:dashed!important;
}
.tab-panel#bp-bien input.readonly-bien:focus,
.tab-panel#bp-bien select.readonly-bien:focus,
.tab-panel#bp-bien textarea.readonly-bien:focus{
  outline:none!important;
  box-shadow:none!important;
}
/* checkboxes en lecture seule : opacity réduite + cursor */
.tab-panel#bp-bien input[type="checkbox"].readonly-bien{
  opacity:.55;
  cursor:not-allowed!important;
}
.logmod-mobilier-row .inp{font-size:12px;padding:5px 8px}
.logmod-mobilier-row .btn{padding:4px 8px}
@media (max-width:600px){
  .logmod-tabs{padding:0 8px}
  .logmod-tab{padding:10px 9px;font-size:11.5px}
  .logmod-mobilier-row{grid-template-columns:1fr 1fr;gap:5px}
}

/* v14.3 IMM-FICHE-360 Phase 1 — fiche immeuble dédiée (réutilise .logf-* pour cohérence) */
.logf-hero.immf-hero{grid-template-columns:340px 1fr 200px;align-items:center}
@media (max-width:1100px){.logf-hero.immf-hero{grid-template-columns:1fr 200px}}
@media (max-width:900px){.logf-hero.immf-hero{grid-template-columns:1fr;gap:14px}.logf-hero.immf-hero .immf-donut{margin:0 auto}}
.logf-badge[onclick]{cursor:pointer;transition:background var(--t-fast)}
.logf-badge[onclick]:hover{background:rgba(255,90,60,.22)}
.immf-donut{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px}
.immf-donut-svg{display:block}
/* v14.8.1 fix donut : variable dédiée plus contrastée que --bor (qui est rgba .09 trop transparent) */
:root{--donut-track:rgba(0,0,0,.13)}
/* M2 — l'ancien second sélecteur `[data-theme="dark"] :root` était mort : :root EST
   <html>, il ne peut pas en être le descendant. Seul le premier peignait. */
[data-theme="dark"] .immf-donut-svg{--donut-track:rgba(255,255,255,.22)}
.immf-donut-cap{font-size:11px;color:var(--t3);text-transform:uppercase;letter-spacing:.6px;font-weight:700}
.immf-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}
.immf-kpi{
  background:var(--sur);border:1px solid var(--bor);border-radius:var(--rl);
  padding:14px 16px;box-shadow:var(--shadow);text-align:center;
  transition:box-shadow var(--t-fast),transform var(--t-fast);
}
.immf-kpi:hover{box-shadow:var(--shadow-card-hover);transform:translateY(-1px)}
.immf-kpi-v{font-size:22px;font-weight:700;color:var(--t1);font-family:var(--display);line-height:1.1}
.immf-kpi-v.k-num{font-size:24px}
.immf-kpi-v.k-money{font-size:20px}
.immf-kpi-v.k-warn{color:var(--ora)}
.immf-kpi-v.k-ok{color:#16a34a}
.immf-kpi-l{font-size:11px;color:var(--t3);text-transform:uppercase;letter-spacing:.6px;font-weight:600;margin-top:6px}
@media (max-width:900px){.immf-kpis{grid-template-columns:repeat(2,1fr);gap:10px}}
@media (max-width:480px){.immf-kpi-v{font-size:18px}.immf-kpi-v.k-money{font-size:17px}.immf-kpi-l{font-size:10px}}

@media (max-width:1280px){.biens-grid{grid-template-columns:repeat(3,1fr);gap:16px}}
@media (max-width:1023px){.biens-grid{grid-template-columns:repeat(2,1fr);gap:14px}}
@media (max-width:600px){
  .biens-grid{grid-template-columns:1fr;gap:12px}
  .biens-toolbar{flex-direction:column;align-items:stretch}
  .biens-toolbar-left,.biens-toolbar-right{width:100%;flex-wrap:wrap}
  .biens-view-toggle{width:100%}
  .biens-view-toggle .bvt{flex:1;text-align:center}
  .biens-search-wrap{flex:1 1 100%;min-width:0}
  .biens-search{width:100%}
  .biens-toolbar-right .btn,.biens-filter-btn{flex:1;justify-content:center}
  .biens-toolbar-right > .btn.bp{flex:1 1 100%;height:42px;margin-top:4px}
  .biens-popover{position:fixed;top:auto;bottom:0;left:0;right:0;border-radius:14px 14px 0 0;max-height:75vh;overflow-y:auto;padding:18px 16px 22px}
  .bien-card-img{aspect-ratio:16/9}
}

/* v14.1 REFONTE-DRIVE Phase 2 : mode lecture seule (Drive non connecté) ───────
   Bandeau orange en haut + désactivation des actions d'écriture. */
#readonly-banner{
  position:sticky; top:0; z-index:50;
  display:flex; align-items:center; gap:12px;
  background:linear-gradient(90deg, #ea580c 0%, #f59e0b 100%);
  color:#fff; padding:10px 18px; font-size:13px; font-weight:500;
  cursor:pointer; box-shadow:0 2px 8px rgba(0,0,0,.15);
  border-bottom:2px solid rgba(0,0,0,.1);
}
#readonly-banner.hidden{display:none}
#readonly-banner .ro-icon{font-size:18px}
#readonly-banner .ro-text{flex:1}
#readonly-banner .ro-cta{
  background:#fff; color:#ea580c; border:none; padding:6px 14px;
  border-radius:6px; font-weight:600; font-size:12.5px; cursor:pointer;
  white-space:nowrap;
}
#readonly-banner .ro-cta:hover{background:#fff7ed}
@media(max-width:600px){
  #readonly-banner{padding:8px 12px;gap:8px;font-size:12px}
  #readonly-banner .ro-text{font-size:12px;line-height:1.3}
  #readonly-banner .ro-cta{padding:5px 10px;font-size:11.5px}
}

/* v14.1.1 REFONTE-DRIVE : blacklist PRÉCISE des actions d'écriture (au lieu de
   "tout sauf whitelist" qui désactivait les boutons d'aperçu, garants, etc.).
   On cible UNIQUEMENT les patterns onclick qui modifient/suppriment/créent.
   Tous les autres boutons (preview, gen, print, navigation, filtres) restent
   actifs en mode lecture seule. */
body.app-readonly button[onclick*="saveBail"],
body.app-readonly button[onclick*="saveLog"],
body.app-readonly button[onclick*="saveMv"],
body.app-readonly button[onclick*="saveAss"],
body.app-readonly button[onclick*="saveQuit"],
body.app-readonly button[onclick*="saveEnt"],
body.app-readonly button[onclick*="saveEDL"],
body.app-readonly button[onclick*="saveMrh"],
body.app-readonly button[onclick*="saveAgenda"],
body.app-readonly button[onclick*="saveBailClore"],
body.app-readonly button[onclick*="saveBailTemplate"],
body.app-readonly button[onclick*="saveDoc"],
body.app-readonly button[onclick*="saveTrav"],
body.app-readonly button[onclick*="saveImport"],
body.app-readonly button[onclick*="delBail"],
body.app-readonly button[onclick*="delLog"],
body.app-readonly button[onclick*="delMv"],
body.app-readonly button[onclick*="delAss"],
body.app-readonly button[onclick*="delQuit"],
body.app-readonly button[onclick*="delEnt"],
body.app-readonly button[onclick*="delEDL"],
body.app-readonly button[onclick*="delMrh"],
body.app-readonly button[onclick*="delAgenda"],
body.app-readonly button[onclick*="delBailHist"],
body.app-readonly button[onclick*="delDoc"],
body.app-readonly button[onclick*="delTrav"],
body.app-readonly button[onclick*="delPiece"],
body.app-readonly button[onclick*="delElem"],
body.app-readonly button[onclick*="delImm"],
body.app-readonly button[onclick*="openNewBail"],
body.app-readonly button[onclick*="openNewMv"],
body.app-readonly button[onclick*="openNewQuit"],
body.app-readonly button[onclick*="openNewEnt"],
body.app-readonly button[onclick*="openNewLog"],
body.app-readonly button[onclick*="openNewMrh"],
body.app-readonly button[onclick*="openNewAss"],
body.app-readonly button[onclick*="openNewAgenda"],
body.app-readonly button[onclick*="openNewEDL"],
body.app-readonly button[onclick*="openNewDoc"],
body.app-readonly button[onclick*="openNewTrav"],
body.app-readonly button[onclick*="openBail("],
body.app-readonly button[onclick*="openMv("],
body.app-readonly button[onclick*="openQuit("],
body.app-readonly button[onclick*="openEnt("],
body.app-readonly button[onclick*="openLog("],
body.app-readonly button[onclick*="openMrh("],
body.app-readonly button[onclick*="openAss("],
body.app-readonly button[onclick*="openAgenda("],
body.app-readonly button[onclick*="openEDL("],
body.app-readonly button[onclick*="openDoc("],
body.app-readonly button[onclick*="openTrav("],
body.app-readonly button[onclick*="openBailClore"],
body.app-readonly button[onclick*="openBailHist"],
body.app-readonly button[onclick*="openBailTemplate"],
body.app-readonly button[onclick*="addLoc"],
body.app-readonly button[onclick*="addGar"],
body.app-readonly button[onclick*="addImm"],
body.app-readonly button[onclick*="addPiece"],
body.app-readonly button[onclick*="addElem"],
body.app-readonly button[onclick*="addSpMv"],
body.app-readonly button[onclick*="addIRLRow"],
body.app-readonly button[onclick*="addEnt"],
body.app-readonly button[onclick*="addImmForm"],
body.app-readonly button[onclick*="removeLoc"],
body.app-readonly button[onclick*="removeGar"],
body.app-readonly button[onclick*="removeImm"],
body.app-readonly button[onclick*="applyIRL"],
body.app-readonly button[onclick*="skipIRL"],
body.app-readonly button[onclick*="markIRLLetterSent"],
body.app-readonly button[onclick*="unmarkIRL"],
body.app-readonly button[onclick*="quickAddIRL"],
body.app-readonly button[onclick*="resetIRL"],
body.app-readonly button[onclick*="resetBailSig"],
body.app-readonly button[onclick*="resetBailTemplate"],
body.app-readonly button[onclick*="terminerBail"],
body.app-readonly button[onclick*="archiverBail"],
body.app-readonly button[onclick*="restoreBail"],
body.app-readonly button[onclick*="splitMv"],
body.app-readonly button[onclick*="confirmSplit"],
body.app-readonly button[onclick*="confirmCloreBail"],
body.app-readonly button[onclick*="resetIRLToDefault"],
body.app-readonly button[onclick*="syncINSEE"],
body.app-readonly button[onclick*="cancelImmForm"],
body.app-readonly button[onclick*="confirmImport"]{
  opacity:0.45 !important;
  pointer-events:none !important;
  cursor:not-allowed !important;
  filter:grayscale(60%);
}
/* Inputs dans modales d'édition uniquement : disabled visuellement (sauf modales Drive et lecture) */
body.app-readonly .ov:not(#ov-drive-connect):not(#ov-irl-rappel):not(#ov-irl-lettre):not(.hidden) input:not([type=button]):not([type=submit]):not([type=checkbox]):not([type=radio]),
body.app-readonly .ov:not(#ov-drive-connect):not(#ov-irl-rappel):not(#ov-irl-lettre):not(.hidden) textarea,
body.app-readonly .ov:not(#ov-drive-connect):not(#ov-irl-rappel):not(#ov-irl-lettre):not(.hidden) select{
  pointer-events:none;
  background:var(--sur2) !important;
  color:var(--t3) !important;
  cursor:not-allowed;
}
/* Indicateur visuel "lecture seule" sur les modales d'édition (en haut du modal) */
body.app-readonly .ov:not(#ov-drive-connect):not(#ov-irl-rappel):not(#ov-irl-lettre):not(.hidden) .modal::before{
  content:"🔒 Lecture seule — Drive non connecté";
  display:block;
  background:rgba(234,88,12,.10);
  color:#ea580c;
  padding:8px 14px;
  font-size:12px; font-weight:600;
  border-bottom:1px solid rgba(234,88,12,.25);
  text-align:center;
  border-radius:8px 8px 0 0;
}

/* v13.41 BUG-DRIVE-DISCONNECT : FAB rouge clignotant si token expiré */
@keyframes drive-fab-pulse {
  0%,100% { background:rgba(220,38,38,.10); border-color:rgba(220,38,38,.30); box-shadow:0 0 0 0 rgba(220,38,38,.4) }
  50%     { background:rgba(220,38,38,.20); border-color:rgba(220,38,38,.65); box-shadow:0 0 0 6px rgba(220,38,38,0) }
}
#drive-fab.drive-fab-expired{
  animation: drive-fab-pulse 1.6s ease-in-out infinite;
  border-color:rgba(220,38,38,.5);
}

/* v14.22 UNDO-OP Phase 2 : FAB d'annulation (bottom-left, complémentaire #drive-fab topbar) */
#fab-undo {
  position: fixed;
  bottom: 18px;
  left: 18px;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--sur);
  border: 1px solid var(--bor);
  color: var(--t1);
  font-size: 22px;
  cursor: pointer;
  display: none;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 8px rgba(0,0,0,.15);
  z-index: 9000;
  transition: transform .15s ease, box-shadow .15s ease;
  font-family: var(--font);
  line-height: 1;
}
#fab-undo:hover {
  transform: scale(1.08);
  box-shadow: 0 4px 14px rgba(0,0,0,.22);
  border-color: var(--acc);
  color: var(--acc);
}
#fab-undo:active { transform: scale(0.96); }
#fab-undo:focus-visible { outline: 2px solid var(--acc); outline-offset: 2px; }
@media (max-width: 768px) {
  #fab-undo { width: 52px; height: 52px; bottom: 14px; left: 14px; font-size: 24px; }
}

/* v14.42 EDL-AUDIT-CRITIQUE Phase 4b : verrouillage UI EDL signé.
   Quand le modal #ov-edl a la class .edl-signed-locked, tous les inputs,
   textareas, select et boutons d'édition sont désactivés visuellement et
   non cliquables. Seul le bouton de réinitialisation signature reste actif
   (.edl-unlock-btn) ainsi que les boutons de visualisation (sans la class
   .edl-edit-btn). Le bandeau jaune en haut #edl-locked-banner indique
   visuellement le verrouillage. */
.edl-signed-locked input:not([type="hidden"]):not([readonly]),
.edl-signed-locked textarea,
.edl-signed-locked select {
  pointer-events: none !important;
  background: var(--sur2) !important;
  opacity: 0.7 !important;
  cursor: not-allowed !important;
}
.edl-signed-locked button:not(.edl-unlock-btn):not(.m-close):not(.edl-readonly-btn) {
  pointer-events: none !important;
  opacity: 0.5 !important;
  cursor: not-allowed !important;
}
.edl-signed-locked canvas {
  pointer-events: none !important;
}

/* ── FORMS ────────────────────────────────────────────────── */
.fg{margin-bottom:14px}
.fg label{display:block;font-size:12px;color:var(--t2);margin-bottom:5px;font-weight:600;letter-spacing:.2px}
.fg2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.fg3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px}
.inp{
  width:100%;background:var(--sur2);
  border:1.5px solid var(--bor);border-radius:var(--r);
  color:var(--t1);padding:9px 12px;
  font-size:13.5px;font-family:var(--font);
  transition:border .15s,box-shadow .15s;
}
.inp:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 3px var(--acc-soft,rgba(255,90,60,.14))}
.inp::placeholder{color:var(--t3)}
select.inp{cursor:pointer}
textarea.inp{resize:vertical;min-height:70px}

/* ── v14.11 PHASE 1 — Anti-zoom iOS Safari sur mobile ───────────────────────
   iOS Safari (et Chrome iOS) zoome automatiquement à chaque focus sur un
   champ de saisie dont la taille de texte est < 16px. C'est un comportement
   natif non désactivable sans casser l'accessibilité (maximum-scale=1 = NON,
   bloque le pinch-to-zoom volontaire de l'utilisateur).
   Solution : forcer 16px minimum sur tous les inputs/select/textarea en
   <768px (téléphones + tablettes portrait). Sur desktop on garde la typo
   compacte (13.5px) pour densité d'affichage.
   !important nécessaire pour battre :
     - [data-fontsize="lg"] .inp (15px)
     - .biens-popover-row (13px)
     - styles inline éventuels                                                */
@media (max-width:767px){
  input, select, textarea,
  .inp,
  .biens-popover-row select,
  .biens-popover-row input[type=text]{
    font-size:16px !important;
  }
}
/* v13.11 — highlight des champs modifiés depuis la signature dans Modifier bail */
.field-modified-since-sig,
input.field-modified-since-sig,
select.field-modified-since-sig,
textarea.field-modified-since-sig{
  background:#fef3c7 !important;
  border-color:#f59e0b !important;
  border-width:2px !important;
  box-shadow:0 0 0 2px rgba(245,158,11,.15);
}
.field-modified-badge{
  display:inline-block;background:#fef3c7;color:#92400e;border:1px solid #f59e0b;
  padding:1px 6px;border-radius:8px;font-size:9px;font-weight:bold;margin-left:6px;
  cursor:help;vertical-align:middle;white-space:nowrap;
}
.field-modified-badge:hover{background:#fde68a}
#bail-form-diff-banner{
  background:#fef3c7;border:2px solid #f59e0b;border-radius:6px;
  padding:8px 12px;margin:0 0 12px;font-size:12px;color:#92400e;font-weight:bold;
}
#bail-form-diff-banner b{color:#7a3a05}

/* ── TABLES ───────────────────────────────────────────────── */
.tbl-wrap{overflow-x:auto;border-radius:var(--rl);border:1px solid var(--bor);box-shadow:var(--shadow)}
.tbl{width:100%;border-collapse:collapse;font-size:13.5px}
.tbl th{
  background:var(--sur2);color:var(--t2);
  font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.7px;
  padding:10px 14px;text-align:left;
  border-bottom:1px solid var(--bor);white-space:nowrap;
}
.tbl td{padding:10px 14px;border-bottom:1px solid var(--bor2);color:var(--t1);vertical-align:middle}
.tbl tr:last-child td{border-bottom:none}
.tbl tr:hover td{background:rgba(255,90,60,.04)}
.tbl .num{text-align:right;font-variant-numeric:tabular-nums;font-family:var(--font)}
.tbl .act-cell{text-align:right;white-space:nowrap}

/* v13.33 IRL-VALIDATION : cohérence visuelle des boutons d'actions IRL */
.irl-actions .btn{height:28px;padding:4px 10px;font-size:11.5px;line-height:1;border-radius:6px;display:inline-flex;align-items:center;gap:4px;white-space:nowrap}
.irl-actions .irl-env-btn{transition:transform .12s ease, box-shadow .12s ease}
.irl-actions .irl-env-btn:hover{transform:translateY(-1px);box-shadow:0 2px 6px rgba(0,0,0,.12)}

/* v13.34 IRL : badges de statut unifiés (utilisés col IRL contrat/vigueur quand donnée non calculable) */
.irl-badge{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border-radius:999px;font-size:11.5px;font-weight:500;line-height:1.3;white-space:nowrap}
.irl-badge.warn   {background:rgba(234,88,12,.10);color:#ea580c;border:1px solid rgba(234,88,12,.25)}
.irl-badge.frozen {background:rgba(220,38,38,.10);color:#dc2626;border:1px solid rgba(220,38,38,.30)}
.irl-badge.wait   {background:rgba(85,102,170,.08);color:#5566aa;border:1px solid rgba(85,102,170,.22)}
.irl-badge.success{background:rgba(22,163,74,.10);color:#16a34a;border:1px solid rgba(22,163,74,.22)}
.irl-badge.info   {background:rgba(107,114,128,.08);color:#6b7280;border:1px solid rgba(107,114,128,.20)}

/* v13.34 IRL : barre d'état colorée à gauche pour repérage visuel rapide */
#irl-tbody tr td:first-child{position:relative;padding-left:14px}
#irl-tbody tr td:first-child::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;border-radius:2px;background:transparent}
#irl-tbody tr.irl-row-applicable td:first-child::before{background:#16a34a}
#irl-tbody tr.irl-row-acted     td:first-child::before{background:#16a34a;opacity:.5}
#irl-tbody tr.irl-row-frozen    td:first-child::before{background:#dc2626}
#irl-tbody tr.irl-row-warn      td:first-child::before{background:#ea580c}
#irl-tbody tr.irl-row-wait      td:first-child::before{background:#5566aa}
#irl-tbody tr.irl-row-future    td:first-child::before{background:#9ca3af}

/* v13.34 IRL : alignement vertical propre + densité des cellules */
#irl-tbody td{vertical-align:middle}
#irl-tbody td.irl-status-cell{padding-top:10px;padding-bottom:10px}
#irl-tbody .irl-anniv{font-size:12px;color:var(--t1);font-weight:500}
#irl-tbody .irl-anniv-sub{display:block;font-size:10.5px;font-weight:400;margin-top:2px}

/* v13.34 IRL : layout panneau Révision & Lettres responsive */
.irl-calc-grid{display:grid;grid-template-columns:1fr 380px;gap:16px;align-items:start}
.irl-letter-pane{position:sticky;top:0}
@media (max-width:1024px){
  .irl-calc-grid{grid-template-columns:1fr 320px}
}
@media (max-width:900px){
  /* Tablette portrait : la lettre passe sous le tableau */
  .irl-calc-grid{grid-template-columns:1fr;gap:14px}
  .irl-letter-pane{position:static}
  .irl-letter-pane #pdf-irl-content{max-height:60vh}
}

/* v13.34 IRL : mode carte sur mobile (≤600px) — la table devient une liste de cards */
@media (max-width:600px){
  /* Cache l'en-tête du tableau (les data-label prennent le relais) */
  #irl-table thead{display:none}
  #irl-table,#irl-table tbody,#irl-tbody tr{display:block;width:100%}
  #irl-table .tbl-wrap{border:none;box-shadow:none;background:transparent}
  /* Chaque ligne devient une card */
  #irl-tbody tr{
    background:var(--sur);
    margin-bottom:10px;
    border-radius:10px;
    border:1px solid var(--bor);
    border-left:4px solid #9ca3af;
    padding:10px 12px;
    box-shadow:0 1px 3px rgba(0,0,0,.04);
  }
  #irl-tbody tr.irl-row-applicable{border-left-color:#16a34a}
  #irl-tbody tr.irl-row-acted     {border-left-color:rgba(22,163,74,.5)}
  #irl-tbody tr.irl-row-frozen    {border-left-color:#dc2626}
  #irl-tbody tr.irl-row-warn      {border-left-color:#ea580c}
  #irl-tbody tr.irl-row-wait      {border-left-color:#5566aa}
  #irl-tbody tr.irl-row-future    {border-left-color:#9ca3af}
  /* Reset la barre interne (la border-left de la card la remplace) */
  #irl-tbody tr td:first-child{padding-left:0}
  #irl-tbody tr td:first-child::before{display:none}
  /* Cellules en grille 2 colonnes : label / valeur — uniquement celles AVEC data-label */
  #irl-tbody td[data-label]{
    display:grid;grid-template-columns:115px 1fr;gap:8px;
    border:none;padding:5px 0;text-align:left !important;
    font-size:13px;align-items:center;
  }
  #irl-tbody td[data-label]::before{
    content:attr(data-label);
    font-size:10.5px;font-weight:500;color:var(--t2);
    text-transform:uppercase;letter-spacing:.04em;
  }
  /* Cellules sans data-label = mise en page block simple (1re/2e cellule, empty state) */
  #irl-tbody td:not([data-label]){
    display:block;border:none;padding:5px 0;text-align:left !important;
  }
  /* La 1ère cellule (logement) sert de header de card */
  #irl-tbody td:first-child{
    font-size:15px;font-weight:700;
    border-bottom:1px solid var(--bor);
    padding-bottom:6px;margin-bottom:4px;
  }
  /* Locataire (2e cellule) : pas de label, juste le nom en plus gros */
  #irl-tbody td:nth-child(2){
    color:var(--t2);font-size:13px;
    margin-bottom:6px;padding-top:0;
  }
  /* Loyer actuel/Nouveau/Variation : valeur cohérente, pas alignée à droite */
  #irl-tbody td.num{justify-content:flex-start;font-variant-numeric:tabular-nums}
  /* Empty state row */
  #irl-tbody tr td[colspan="9"]{text-align:center !important;padding:20px 12px;color:var(--t2)}
  /* Cellule actions : full width avec boutons stretch */
  #irl-tbody td.act-cell{
    display:block;margin-top:8px;padding:0;
    border-top:1px solid var(--bor);padding-top:8px;
  }
  #irl-tbody .irl-actions{
    flex-direction:row;flex-wrap:wrap;
    justify-content:stretch !important;align-items:stretch !important;
    gap:6px;
  }
  #irl-tbody .irl-actions .btn{
    flex:1 1 calc(50% - 3px);
    justify-content:center;
    height:38px;font-size:13px;padding:0 12px;
  }
  /* Boutons enveloppe + valider IRL (priorité visuelle) en pleine ligne */
  #irl-tbody .irl-actions .irl-env-btn,
  #irl-tbody .irl-actions .btn.bg{flex:1 1 100%}
}

/* v13.34 IRL : popup rappel mois anniversaire — boutons stack sur mobile */
@media (max-width:600px){
  #ov-irl-rappel .irl-actions{flex-direction:row;flex-wrap:wrap;gap:6px}
  #ov-irl-rappel .irl-actions .btn{flex:1 1 calc(50% - 3px);justify-content:center;height:36px}
  #ov-irl-rappel .irl-actions .irl-env-btn,
  #ov-irl-rappel .irl-actions .btn.bg{flex:1 1 100%}
  #ov-irl-rappel .irl-rappel-card > div:first-child{flex-direction:column;align-items:flex-start !important;gap:6px}
}

/* ── MODALS ───────────────────────────────────────────────── */
.ov{
  position:fixed;inset:0;
  background:rgba(0,0,0,.55);
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
  z-index:200;display:flex;align-items:flex-start;
  justify-content:center;padding:40px 16px;overflow-y:auto;
  /* EDL TERRAIN lot 0 — cf. §3bis : le défilement d'une modale ne remonte
     jamais au document, donc ne déclenche jamais le rechargement de page. */
  overscroll-behavior-y:contain;
}
.ov.hidden{display:none}
/* Le défilement interne des modales (la modale EDL a un `overflow-y:auto` sur
   son corps, imbriqué dans `.ov` qui défile aussi) — EDL TERRAIN lot 0. */
.m-body,
#ov-edl > .modal > div[style*="overflow-y:auto"]{overscroll-behavior-y:contain}
.modal{
  background:var(--sur);border:1px solid var(--bor);
  border-radius:var(--rl);width:100%;max-width:640px;
  box-shadow:var(--shadow-lg);
}
.modal.lg{max-width:820px}
.modal.xl{max-width:980px}
.m-head{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--bor)}
.m-head h3{font-size:16px;font-weight:800;font-family:var(--display);letter-spacing:-.02em}
.m-close{background:none;border:none;color:var(--t2);cursor:pointer;font-size:19px;padding:4px;border-radius:6px;transition:all .15s}
.m-close:hover{color:var(--t1);background:var(--sur3)}
.m-body{padding:22px;max-height:70vh;overflow-y:auto}
.m-foot{padding:14px 22px;border-top:1px solid var(--bor);display:flex;justify-content:flex-end;gap:8px;background:var(--sur2);border-radius:0 0 var(--rl) var(--rl)}

/* ── TABS ─────────────────────────────────────────────────── */
.tabs{display:flex;gap:2px;border-bottom:1px solid var(--bor);margin-bottom:18px}
.tab{padding:9px 18px;cursor:pointer;color:var(--t2);font-size:13.5px;border-bottom:2px solid transparent;margin-bottom:-1px;transition:all .15s;font-weight:500}
.tabs .tab svg{width:15px;height:15px;vertical-align:-3px;margin-right:5px}
/* RE-SKIN — pastille d'icône de catégorie comptable (SVG monochrome ; verte = recette, neutre = charge) */
.catic{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:8px;background:var(--neutral-soft);color:var(--neutral-ink);flex-shrink:0;vertical-align:middle}
.catic.rec{background:var(--bg-success);color:var(--fg-success)}
/* v15.150 MOBILE-AUDIT — Barres d'onglets : sur mobile/tablette elles débordaient et étaient
   coupées (IRL/Pilotage/Paramètres).
   v15.153 : retour à la ligne (flex-wrap) plutôt que défilement horizontal — un onglet coupé
   ressemblait à un bug (« Histori… »). Avec wrap, TOUS les onglets restent visibles (sur 2 lignes
   si besoin). Padding réduit sur mobile pour limiter le nombre de retours à la ligne. */
@media (max-width:1024px){
  .tabs{flex-wrap:wrap;row-gap:2px}
  .tabs .tab{white-space:nowrap}
}
@media (max-width:560px){
  .tabs .tab{padding:8px 12px;font-size:13px}
}
.tab:hover{color:var(--t1)}
.tab.act{color:var(--acc);border-bottom-color:var(--acc);font-weight:600}
/* REFONTE-NAV (fix mobile P1/P2) — la barre de sous-onglets de GROUPE (Locataires→Baux/Candidatures, etc.,
   rendue dans #nav-subtabs-host) est un SEGMENTED-CONTROL distinct : sans ça elle héritait 100% de .tabs et
   se confondait avec les onglets propres de la page (loyers/baux/candidats/irl/pilotage = « double barre »). */
.tabs.nav-subtabs{border-bottom:none;display:inline-flex;gap:3px;width:auto;background:var(--sur2);border:1px solid var(--bor);padding:3px;border-radius:11px;margin-bottom:16px}
.tabs.nav-subtabs .tab{border-bottom:none;margin-bottom:0;border-radius:8px;padding:7px 15px;color:var(--t2)}
.tabs.nav-subtabs .tab:hover{color:var(--t1)}
.tabs.nav-subtabs .tab.act{background:var(--sur);color:var(--acc);border-bottom:none;box-shadow:0 1px 2px rgba(0,0,0,.08)}
.tab-panel{display:none}
.tab-panel.act{display:block}

/* ── BADGES ───────────────────────────────────────────────── */
/* LOT 0 — écart d2 : les fonds étaient des rgba() figés, jamais redéfinis en sombre
   (des pastilles peintes pour du blanc, posées sur du noir). Chaque couleur a désormais
   sa paire --X / --X-bg dans LES DEUX thèmes. La bordure est ce qui rend le badge lisible
   en sombre ; le padding descend de 1px pour que la boîte garde exactement sa taille. */
.badge{display:inline-flex;align-items:center;padding:2px 8px;border:1px solid transparent;border-radius:var(--rp);font-size:11.5px;font-weight:600}
.badge.grn{background:var(--grn-bg);color:var(--grn);border-color:var(--grn)}
.badge.red{background:var(--red-bg);color:var(--red);border-color:var(--red)}
.badge.ora{background:var(--ora-bg);color:var(--ora);border-color:var(--ora)}
.badge.blu{background:var(--acc-bg);color:var(--t1);border-color:var(--acc)}
.badge.pur{background:var(--pur-bg);color:var(--pur);border-color:var(--pur)}
.badge.gry{background:var(--gry-bg);color:var(--t2);border-color:var(--t2)}
/* PC-REFONTE — badge neutre gris-bleuté (info) : catégorie factuelle sans alarme.
   Ex. type EDL « Sortie » (Entrée = vert positif ; Sortie = neutre, pas d'ambre). */
.badge.info{background:var(--info-soft);color:var(--info);border-color:var(--info)}
/* PC-REFONTE — badge corail « outline » : états qui demandent une action (à classer / non affecté).
   Doctrine : corail = ce qui presse. Remplace l'ambre (--ora) sur ces deux états. */
.badge.acc{background:transparent;color:var(--acc);border-color:var(--acc)}
/* PC-REFONTE lot Mouvements — montant : même taille que la ligne (13,5px), juste
   semi-gras + insécable + chiffres tabulaires (.num). La couleur vert/rouge suffit
   à le faire ressortir — pas de gros chiffre dans une liste dense.
   Gaté ≥769 : le rendu ≤768 (téléphone) reste strictement inchangé. */
@media(min-width:769px){
  #p-mouvements .tbl td.mv-montant{font-weight:600;white-space:nowrap}
  /* Catégorie : badge long borné à 2 lignes max (le nom complet reste en tooltip).
     Sans ça « Frais de gestion / honoraires / comptabilité » débordait sur 3 lignes
     et gonflait la hauteur de ligne — retour Didier v15.598. */
  #p-mouvements .tbl td:nth-child(3){max-width:210px}
  #p-mouvements .tbl td:nth-child(3) .badge.gry{
    display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;
    overflow:hidden;white-space:normal;line-height:1.25;text-align:left;
  }
  /* Libellé + affectation bornés à 2 lignes max (« 2 lignes maxi » — Didier v15.599).
     Le libellé complet reste au survol (title). Gaté ≥769 → téléphone inchangé. */
  #p-mouvements .mv-clamp2{
    display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;
    overflow:hidden;line-height:1.3;
  }
}

/* ── MISC ─────────────────────────────────────────────────── */
.hidden{display:none!important}
.flex-b{display:flex;align-items:center;justify-content:space-between;gap:8px}
.flex-c{display:flex;align-items:center;gap:8px}
/* v15.150 MOBILE-AUDIT — Barres d'outils (groupes de boutons/selects en .flex-b/.flex-c) :
   autoriser le retour à la ligne sur mobile ET tablette. Sinon les boutons dépassent du
   conteneur et sont coupés (ex : Quittances « Vue · Cartes · Tableau · Générer · + Mouvement »).
   flex-wrap:wrap ne se déclenche QUE si le contenu déborde → aucun effet quand ça tient déjà. */
@media (max-width:1024px){
  .flex-b,.flex-c{flex-wrap:wrap}
}
.sm{font-size:12.5px}
.mu{color:var(--t2)}
.mb8{margin-bottom:8px}.mb9{margin-bottom:9px}.mb12{margin-bottom:12px}.mb14{margin-bottom:14px}.mb16{margin-bottom:16px}.mb18{margin-bottom:18px}.mb20{margin-bottom:20px}
.mt4{margin-top:4px}.mt8{margin-top:8px}.mt12{margin-top:12px}.mt16{margin-top:16px}
.pos{color:var(--grn)}.neg{color:var(--red)}.ora{color:var(--ora)}

/* ── PROGRESS BAR ─────────────────────────────────────────── */
.prog-bar{background:var(--bor);border-radius:4px;height:7px;overflow:hidden;margin-top:5px}
.prog-fill{height:100%;border-radius:4px;background:var(--acc);transition:width .4s cubic-bezier(.4,0,.2,1)}

/* ── ALERTS ───────────────────────────────────────────────── */
.alert{padding:11px 16px;border-radius:var(--r);font-size:13.5px;margin-bottom:9px;border-width:1px;border-style:solid}
.alert.info{background:rgba(255,90,60,.08);border-color:rgba(255,90,60,.2);color:var(--acc)}
.alert.warn{background:rgba(234,88,12,.08);border-color:rgba(234,88,12,.2);color:var(--ora)}
.alert.err{background:rgba(220,38,38,.08);border-color:rgba(220,38,38,.2);color:var(--red)}
.alert.ok{background:rgba(22,163,74,.08);border-color:rgba(22,163,74,.2);color:var(--grn)}

/* ── FILTERS ──────────────────────────────────────────────── */
.filters{display:flex;flex-wrap:wrap;gap:9px;margin-bottom:18px;align-items:center}
.filters .inp{width:auto;min-width:130px}

/* ── INLINE EDIT ──────────────────────────────────────────── */
.edit-inp{background:var(--sur2);border:1.5px solid var(--acc);border-radius:6px;color:var(--t1);padding:5px 8px;font-size:13.5px;width:100%;font-family:var(--font)}

/* ── CHARTS ───────────────────────────────────────────────── */
.chart-wrap{position:relative;height:200px}

/* ── DRIVE ────────────────────────────────────────────────── */
.drive-file-item{padding:11px 16px;border-bottom:1px solid var(--bor);cursor:pointer;display:flex;justify-content:space-between;align-items:center;transition:background .15s}
.drive-file-item:hover{background:rgba(255,90,60,.06)}
.drive-file-item:last-child{border-bottom:none}

/* ── TOAST ────────────────────────────────────────────────── */
#toast{
  position:fixed;bottom:28px;right:28px;
  background:var(--sur);border:1px solid var(--bor);
  border-radius:10px;padding:12px 18px;
  font-size:13.5px;z-index:999;display:none;
  box-shadow:var(--shadow-lg);
  animation:toastIn .25s cubic-bezier(.4,0,.2,1);
}
@keyframes toastIn{from{opacity:0;transform:translateY(10px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes fadeIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}

/* ── BAIL CARD ────────────────────────────────────────────── */
.bail-card{background:var(--sur);border:1px solid var(--bor);border-radius:var(--rl);padding:18px;display:flex;flex-direction:column;gap:9px;box-shadow:var(--shadow);transition:box-shadow .15s,transform .15s,border-color .15s}
.bail-card:hover{box-shadow:var(--shadow-hover);transform:translateY(-1px);border-color:var(--fg-info)}
.bail-card .bc-top{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}
.bail-card .bc-ref{font-weight:700;font-size:15px;color:var(--fg-info);font-family:var(--display)}
.bail-card .bc-loc{font-size:14px;font-weight:600}
.bail-card .bc-info{font-size:12.5px;color:var(--t2);display:flex;flex-wrap:wrap;gap:4px 14px}
.bail-card .bc-foot{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.bail-card .bc-actions{display:flex;gap:6px;flex-wrap:wrap}

/* v13.40 : bail card mobile — layout hybride choisi par utilisateur.
   - Modifier bail (1er bouton, action principale) : pleine largeur
   - Aperçu + Aperçu garant : 2 colonnes côte à côte
   - Clôturer + 🗑 : 2 colonnes côte à côte
   - Boutons optionnels (signature, drive PDF…) s'insèrent dans la grille naturellement */
@media (max-width:768px){
  .bail-card{padding:14px 12px;gap:8px;border-top:3px solid var(--acc)}
  .bail-card .bc-foot{flex-direction:column;align-items:stretch;gap:8px}
  .bail-card .bc-actions{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:6px;width:100%;
  }
  /* Modifier bail (1er bouton) prend les 2 colonnes — priorité visuelle */
  .bail-card .bc-actions .btn:first-child{grid-column:1 / -1}
  .bail-card .bc-actions .btn{
    justify-content:center;
    padding:0 8px;
    font-size:12.5px;
    font-weight:500;
    height:40px;
    width:100% !important;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    min-width:0;
  }
  /* Trash : icône seule, distinguée par bordure pointillée */
  .bail-card .bc-actions .btn.br{font-size:14px;padding:0;border-style:dashed}
  /* Entité affichée en bas à droite, discrète */
  .bail-card .bc-foot > .mu.sm{font-size:11px;text-align:right;width:100%;order:99;color:var(--t3)}
}

/* v13.40 : headers de page — éviter que les boutons en haut se fassent tronquer.
   Pages concernées : Bail (filtre+search+nouveau bail), IRL (tabs+select immeuble).
   Mobile : empile en 2 lignes au lieu d'une seule ligne tronquée. */
@media (max-width:768px){
  /* Bail : filtres en row 1 (50/50), bouton "+ Nouveau bail" full width row 2 */
  #p-baux > .flex-b.mb16{flex-direction:column;align-items:stretch;gap:10px}
  #p-baux > .flex-b.mb16 > .flex-c{width:100%;flex-wrap:wrap;gap:6px}
  #p-baux > .flex-b.mb16 > .flex-c > .inp{flex:1 1 calc(50% - 3px);min-width:0;width:auto !important}
  #p-baux > .flex-b.mb16 > .btn{width:100%;justify-content:center;height:42px}
  /* IRL : tabs compactes qui reviennent à la ligne (tous visibles, aucun coupé), select full width */
  /* v15.153 : flex-wrap (était overflow-x:auto/nowrap → « Histori… » coupé, ressemblait à un bug) */
  #p-irl > .flex-b.mb12{flex-direction:column;align-items:stretch;gap:10px}
  #p-irl > .flex-b.mb12 > .tabs{
    flex-wrap:wrap;row-gap:2px;
    margin-bottom:0;border-bottom:none;
  }
  #p-irl > .flex-b.mb12 > .tabs > .tab{
    white-space:nowrap;
    padding:8px 11px;          /* compact pour limiter les retours à la ligne */
    font-size:12.5px;
  }
  #p-irl > .flex-b.mb12 > .inp{width:100% !important}
}

/* ═══════════════════════════════════════════════════════════════════
   v14.12 PHASE 2 — Refonte mobile EDL (vue liste + formulaire + header)
   ═══════════════════════════════════════════════════════════════════
   Stratégie : breakpoints standardisés
   - <768px : déjà traité par la règle globale (modal full width, grids 1col,
     anti-zoom Phase 1 16px)
   - <600px : refonte EDL (vue liste en cards, modal plein écran, compteurs/
     clés en cards verticales, signatures empilées, footer sticky)
   - <480px : compaction ultime (boutons icônes-only sur certains cas)         */

/* ── A) VUE LISTE EDL — mode carte mobile ─────────────────────────────────── */
@media (max-width:768px){
  /* Header : filtre + bouton "+ Nouvel EDL" empilés en 2 lignes */
  #p-edl > .flex-b.mb16{flex-direction:column;align-items:stretch;gap:10px}
  #p-edl #edl-f-log{width:100% !important;min-height:42px}
  #p-edl > .flex-b.mb16 > .btn{width:100%;justify-content:center;height:44px;font-size:14px}
}

@media (max-width:600px){
  /* Table EDL → liste de cards */
  #p-edl .tbl-wrap{border:none;box-shadow:none;background:transparent;overflow:visible}
  #p-edl .tbl{font-size:13px}
  #p-edl .tbl thead{display:none}
  #p-edl .tbl, #p-edl .tbl tbody, #p-edl .tbl tr, #p-edl .tbl td{display:block;width:auto}
  #p-edl .tbl tr{
    background:var(--sur);border:1px solid var(--bor);border-radius:var(--rl);
    padding:12px 14px;margin-bottom:10px;box-shadow:var(--shadow);
    border-left:3px solid var(--acc);
  }
  #p-edl .tbl tr:hover td,
  #p-edl .tbl tr:hover{background:transparent}
  #p-edl .tbl td{border:none !important;padding:0 !important;white-space:normal}
  /* Logement (col 1) : titre */
  #p-edl .tbl tr td:nth-child(1){
    font-size:15px;font-weight:700;color:var(--t1);
    line-height:1.3;margin-bottom:4px;
  }
  /* Locataire (col 2) : sous-titre, ellipsis */
  #p-edl .tbl tr td:nth-child(2){
    font-size:13px;color:var(--t2);
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
    margin-bottom:8px;
  }
  /* Type (col 3) + Date (col 4) : inline côte-à-côte */
  #p-edl .tbl tr td:nth-child(3){display:inline-block !important;margin-right:10px;vertical-align:middle}
  #p-edl .tbl tr td:nth-child(4){display:inline-block !important;font-size:12px;color:var(--t2);vertical-align:middle}
  /* Pièces / Éléments (col 5) : ligne discrète sous date */
  #p-edl .tbl tr td:nth-child(5){
    font-size:11.5px;color:var(--t3);margin-top:6px;
    padding-top:6px !important;border-top:1px dashed var(--bor2) !important;
  }
  /* Actions (col 6) : grille 2x */
  #p-edl .tbl tr td.act-cell{
    display:grid !important;grid-template-columns:1fr 1fr;gap:6px;
    margin-top:10px;padding-top:10px !important;
    border-top:1px solid var(--bor2) !important;
    text-align:left !important;
  }
  #p-edl .tbl tr td.act-cell .btn{
    margin:0 !important;width:100%;justify-content:center;
    min-height:38px;padding:6px 8px;font-size:12px;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  }
  /* Bouton ✏️ Modifier en pleine largeur (action principale) */
  #p-edl .tbl tr td.act-cell .btn:nth-child(1){grid-column:1 / -1;background:var(--acc);color:#fff}
  /* Bouton 🗑 supprimer dernier en bordure pointillée */
  #p-edl .tbl tr td.act-cell .btn.br{border-style:dashed}
  /* État vide : recentrer */
  #p-edl .tbl tr td[colspan]{display:block !important;text-align:center;padding:20px !important}
}

/* ════════════════════════════════════════════════════════════════════════
   MOBILE — Loyers / Mouvements : la table devient des cartes empilées (la table dense
   scrollait horizontalement = mauvaise UX mobile). Pur CSS, aucun rendu dupliqué.

   ⚠️ REPRIS EN MÊME TEMPS QUE LA FUSION DES COLONNES (⑨.1 / bug 9 du CDC-IMPORT) :
   ce CSS positionne chaque cellule PAR NUMÉRO DE COLONNE (nth-child). Passer de 9 à 7
   colonnes le cassait — il ne pouvait pas être traité séparément.
   Colonnes désormais : 1 Date · 2 Libellé · 3 Catégorie · 4 Affectation · 5 Montant ·
   6 Facture · 7 Actions.

   Adaptations validées sur mockup (mobile-mouvements.html) :
   · la méta passe sur DEUX lignes (catégorie, puis affectation en gras) — plus aucune
     troncature de deux informations mises bout à bout ;
   · le nom de catégorie est coupé avant la parenthèse (« Charges récupérables (eau,
     énergie…) » → « Charges récupérables ») : le complément est une aide à la saisie,
     inutile dans une liste — géré par .badge (max-width + ellipsis) ;
   · le libellé reste tronqué sur une ligne (60 à 200 caractères, illisible en entier
     sur 390 px), complet au clic.
   ════════════════════════════════════════════════════════════════════════ */
@media (max-width:768px){
  #p-loyers .tbl-wrap{border:none;box-shadow:none;background:transparent;overflow:visible}
  #p-loyers .tbl thead{display:none}
  #p-loyers .tbl,#p-loyers .tbl tbody{display:block;width:auto}
  #p-loyers .tbl tr{
    position:relative;display:block;width:auto;
    background:var(--sur);border:1px solid var(--bor);border-radius:var(--rl);
    padding:9px 12px;margin-bottom:7px;box-shadow:var(--shadow);border-left:3px solid var(--acc);
  }
  #p-loyers .tbl tr:hover,#p-loyers .tbl tr:hover td{background:transparent}
  #p-loyers .tbl td{display:block;border:none !important;padding:0 !important;white-space:normal}
  /* Date (col 1) : petite, en haut à gauche */
  #p-loyers .tbl td:nth-child(1){font-size:11.5px;color:var(--t3)}
  /* Libellé (col 2) : titre 1 ligne ellipsis, place réservée pour le montant à droite */
  #p-loyers .tbl td:nth-child(2){font-size:14.5px;font-weight:700;color:var(--t1);line-height:1.25;padding-right:96px !important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  /* Catégorie (col 3) : 1re ligne de méta */
  #p-loyers .tbl td:nth-child(3){
    font-size:12px;color:var(--t2);line-height:1.5;margin-top:2px;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-right:96px !important;
  }
  /* Le nom long des catégories est coupé avant la parenthèse explicative */
  #p-loyers .tbl td:nth-child(3) .badge{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom}
  /* Affectation (col 4) : 2e ligne de méta, en gras — c'est l'info qu'on cherche */
  #p-loyers .tbl td:nth-child(4){
    font-size:12px;color:var(--t1);font-weight:600;line-height:1.5;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-right:96px !important;
  }
  /* Montant signé (col 5) : à droite, centré verticalement */
  #p-loyers .tbl td:nth-child(5){
    position:absolute;top:50%;transform:translateY(-50%);right:12px;
    font-size:15px;font-weight:700;text-align:right;white-space:nowrap;
  }
  /* Facture (col 6) : masquée en vue compacte (souvent vide, accessible sur la fiche) */
  #p-loyers .tbl td:nth-child(6){display:none}
  /* Actions (col 7) : rangée serrée alignée à droite */
  #p-loyers .tbl td.act-cell{
    display:flex !important;justify-content:flex-end;gap:6px;margin-top:6px;
  }
  #p-loyers .tbl td.act-cell .btn{margin:0 !important;min-width:42px;min-height:34px;font-size:13px}
  /* État vide (colspan) */
  #p-loyers .tbl tr td[colspan]{display:block !important;text-align:center;padding:18px !important}
  /* Ligne des filtres actifs (⑨.4) : les pastilles passent à la ligne, jamais de scroll */
  #mv-active-filters{gap:5px !important}
  #mv-active-filters .badge{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}

/* ════════════════════════════════════════════════════════════════════════
   ⑩.2 MOBILE — VENTILATION (✂️ découper un mouvement). Les grilles de chaque part
   passent EN COLONNE sous 768 px : sens + croix, libellé, montant, catégorie,
   affectation, date + facture. Le bandeau d'équilibre reste collé en bas — c'est lui
   qui débloque le bouton de confirmation, il ne doit jamais sortir de l'écran.
   ════════════════════════════════════════════════════════════════════════ */
@media (max-width:768px){
  /* Chaque rangée passe en UNE colonne : sur 390 px, mettre le libellé à côté des deux
     boutons de sens le réduisait à ~95 px, illisible. Ordre vertical : sens + croix,
     libellé, montant, catégorie, affectation, date + facture. */
  #ov-sp-mv #sp-mv-rows > div > div{grid-template-columns:1fr !important;gap:7px !important}
  /* La croix « supprimer cette part » reste alignée à droite de la ligne du sens. */
  #ov-sp-mv #sp-mv-rows > div > div:first-child > button[title]{justify-self:end}
  #ov-sp-mv .inp{width:100%}
  /* Le contrôle d'équilibre colle en bas : c'est lui qui débloque « Confirmer » */
  #ov-sp-mv #sp-mv-reste{
    position:sticky;bottom:0;z-index:2;
    background:var(--sur);border-top:1px solid var(--bor);
    margin:0 -14px;padding:9px 14px;
  }
}

/* ════════════════════════════════════════════════════════════════════════
   v15.147 MOBILE-AUDIT — Pilotage (onglet Comptabilité) : matrice lot×mois → cartes.
   Matrice = on garde les statuts mensuels en CHIPS étiquetés (data-mo) pour ne pas perdre
   le contexte du mois (l'en-tête est masqué). 4 mois fixes (M-3..M) → positions stables.
   ════════════════════════════════════════════════════════════════════════ */
@media (max-width:768px){
  #tp-pil-compta .tbl-wrap{border:none;box-shadow:none;background:transparent;overflow:visible}
  #pil-compta-tbl thead{display:none}
  #pil-compta-tbl,#pil-compta-tbl tbody{display:block;width:auto}
  #pil-compta-tbl tr{
    position:relative;display:block;width:auto;
    background:var(--sur);border:1px solid var(--bor);border-radius:var(--rl);
    padding:10px 12px;margin-bottom:8px;box-shadow:var(--shadow);border-left:3px solid var(--acc);
  }
  #pil-compta-tbl tr:hover,#pil-compta-tbl tr:hover td{background:transparent}
  #pil-compta-tbl td{display:block;border:none !important;padding:0 !important;white-space:normal;text-align:left !important}
  /* Checkbox (col1) + Locataire·Bien (col2) sur la 1re ligne */
  #pil-compta-tbl td:nth-child(1){display:inline-block !important;margin-right:8px;vertical-align:top}
  #pil-compta-tbl td:nth-child(2){display:inline-block !important;font-size:14px;padding-right:46px !important;vertical-align:top}
  /* DG (col3) + Solde (col4) : ligne méta inline avec libellés */
  #pil-compta-tbl td:nth-child(3),#pil-compta-tbl td:nth-child(4){display:inline !important;font-size:12px;color:var(--t2);text-align:left !important}
  #pil-compta-tbl td:nth-child(3){margin-top:6px}
  #pil-compta-tbl td:nth-child(3)::before{content:"DG "}
  #pil-compta-tbl td:nth-child(3)::after{content:"   ·   ";color:var(--t3)}
  #pil-compta-tbl td:nth-child(4)::before{content:"Solde "}
  /* Mois (cells [data-mo]) : chips étiquetés, wrap. Fond pastel inline conservé (heatmap). */
  #pil-compta-tbl td[data-mo]{
    display:inline-block !important;margin:7px 6px 0 0;padding:3px 9px !important;
    border-radius:8px;font-size:11.5px;color:#1a2332;text-align:left !important;
  }
  #pil-compta-tbl td[data-mo]::before{content:attr(data-mo)" ";font-weight:700;opacity:.65}
  #pil-compta-tbl td[data-mo] span{font-weight:600}
  /* Action ↗ (dernière colonne) : en haut à droite */
  #pil-compta-tbl td:last-child{position:absolute;top:8px;right:10px}
  #pil-compta-tbl td:last-child .btn{min-width:40px;min-height:34px}
  /* État vide (colspan) */
  #pil-compta-tbl tr td[colspan]{display:block !important;text-align:center;padding:20px !important}
}

/* v15.148 MOBILE-AUDIT — Pilotage Documents (conformité) : matrice → cartes, chips data-doc */
@media (max-width:768px){
  #tp-pil-documents .tbl-wrap{border:none;box-shadow:none;background:transparent;overflow:visible}
  #pil-docs-tbl thead{display:none}
  #pil-docs-tbl,#pil-docs-tbl tbody{display:block;width:auto}
  #pil-docs-tbl tr{position:relative;display:block;background:var(--sur);border:1px solid var(--bor);border-radius:var(--rl);padding:10px 12px;margin-bottom:8px;box-shadow:var(--shadow);border-left:3px solid var(--acc)}
  #pil-docs-tbl tr:hover,#pil-docs-tbl tr:hover td{background:transparent}
  #pil-docs-tbl td{display:block;border:none !important;padding:0 !important;white-space:normal;text-align:left !important}
  #pil-docs-tbl td:first-child{font-size:14px;padding-right:46px !important}
  #pil-docs-tbl td[data-doc]{display:inline-flex !important;align-items:center;gap:5px;margin:7px 8px 0 0;background:transparent !important;font-size:11px;text-align:left !important}
  #pil-docs-tbl td[data-doc]::before{content:attr(data-doc)" :";color:var(--t2);font-weight:600}
  #pil-docs-tbl td:last-child{position:absolute;top:8px;right:10px}
  #pil-docs-tbl td:last-child .btn{min-width:40px;min-height:34px}
  #pil-docs-tbl tr td[colspan]{display:block !important;text-align:center;padding:20px !important}
}

/* v15.148 MOBILE-AUDIT — Pilotage Automatisations : matrice de cases → cartes, toggles data-autom */
@media (max-width:768px){
  #tp-pil-automatisations .tbl-wrap{border:none;box-shadow:none;background:transparent;overflow:visible}
  #pil-autom-tbl thead{display:none}
  #pil-autom-tbl,#pil-autom-tbl tbody{display:block;width:auto}
  #pil-autom-tbl tr{position:relative;display:block;background:var(--sur);border:1px solid var(--bor);border-radius:var(--rl);padding:10px 12px;margin-bottom:8px;box-shadow:var(--shadow);border-left:3px solid var(--acc)}
  #pil-autom-tbl tr:hover,#pil-autom-tbl tr:hover td{background:transparent}
  #pil-autom-tbl td{display:block;border:none !important;padding:0 !important;white-space:normal;text-align:left !important}
  #pil-autom-tbl td:first-child{font-size:14px;padding-right:64px !important}
  #pil-autom-tbl td[data-autom]{display:inline-flex !important;align-items:center;gap:5px;margin:9px 14px 0 0;font-size:12px;color:var(--t2);text-align:left !important}
  #pil-autom-tbl td[data-autom]::after{content:attr(data-autom)}
  #pil-autom-tbl td[data-autom] input{width:20px;height:20px;margin:0}
  #pil-autom-tbl td:last-child{position:absolute;top:8px;right:10px}
  #pil-autom-tbl tr td[colspan]{display:block !important;text-align:center;padding:20px !important}
}

/* v15.148 MOBILE-AUDIT — Assurances PNO + MRH : tables → cartes (champs labellisés car en-tête masqué) */
@media (max-width:768px){
  #tp-pno .tbl-wrap,#tp-mrh .tbl-wrap{border:none;box-shadow:none;background:transparent;overflow:visible}
  #tp-pno .tbl thead,#tp-mrh .tbl thead{display:none}
  #tp-pno .tbl,#tp-pno .tbl tbody,#tp-mrh .tbl,#tp-mrh .tbl tbody{display:block;width:auto}
  #tp-pno .tbl tr,#tp-mrh .tbl tr{position:relative;display:block;background:var(--sur);border:1px solid var(--bor);border-radius:var(--rl);padding:10px 12px;margin-bottom:8px;box-shadow:var(--shadow);border-left:3px solid var(--acc)}
  #tp-pno .tbl tr:hover,#tp-pno .tbl tr:hover td,#tp-mrh .tbl tr:hover,#tp-mrh .tbl tr:hover td{background:transparent}
  #tp-pno .tbl td,#tp-mrh .tbl td{display:block;border:none !important;padding:0 !important;white-space:normal;text-align:left !important}
  #tp-pno .tbl td:nth-child(1),#tp-mrh .tbl td:nth-child(1){font-size:14px;font-weight:700;color:var(--t1);padding-right:80px !important}
  /* PNO : Type(2) · Compagnie(3) ; Contrat(4) / Prime(5) / Échéance(6) labellisés ; Notes(7) ; actions(8) */
  #tp-pno .tbl td:nth-child(2),#tp-pno .tbl td:nth-child(3){display:inline !important;font-size:12.5px;color:var(--t2)}
  #tp-pno .tbl td:nth-child(2){margin-top:4px}
  #tp-pno .tbl td:nth-child(2)::after{content:"  ·  ";color:var(--t3)}
  #tp-pno .tbl td:nth-child(4),#tp-pno .tbl td:nth-child(5),#tp-pno .tbl td:nth-child(6){font-size:12px;color:var(--t2);margin-top:3px}
  #tp-pno .tbl td:nth-child(4)::before{content:"Contrat : ";color:var(--t3)}
  #tp-pno .tbl td:nth-child(5)::before{content:"Prime : ";color:var(--t3)}
  #tp-pno .tbl td:nth-child(6)::before{content:"Échéance : ";color:var(--t3)}
  #tp-pno .tbl td:nth-child(7){font-size:11.5px;color:var(--t3);margin-top:4px}
  #tp-pno .tbl td:nth-child(8){position:absolute;top:8px;right:10px}
  #tp-pno .tbl td:nth-child(8) .btn{min-width:36px;min-height:34px}
  /* MRH : Locataire(2) ; Compagnie(3)/Contrat(4)/Prime(5)/Échéance(6) labellisés ; actions(7) */
  #tp-mrh .tbl td:nth-child(2){font-size:13px;color:var(--t2);margin-top:3px}
  #tp-mrh .tbl td:nth-child(3),#tp-mrh .tbl td:nth-child(4),#tp-mrh .tbl td:nth-child(5),#tp-mrh .tbl td:nth-child(6){font-size:12px;color:var(--t2);margin-top:3px}
  #tp-mrh .tbl td:nth-child(3)::before{content:"Compagnie : ";color:var(--t3)}
  #tp-mrh .tbl td:nth-child(4)::before{content:"Contrat : ";color:var(--t3)}
  #tp-mrh .tbl td:nth-child(5)::before{content:"Prime : ";color:var(--t3)}
  #tp-mrh .tbl td:nth-child(6)::before{content:"Échéance : ";color:var(--t3)}
  #tp-mrh .tbl td:nth-child(7){position:absolute;top:8px;right:10px}
  #tp-mrh .tbl td:nth-child(7) .btn{min-width:36px;min-height:34px}
  /* État vide */
  #tp-pno .tbl tr td[colspan],#tp-mrh .tbl tr td[colspan]{display:block !important;text-align:center;padding:20px !important}
}

/* v15.149 MOBILE-AUDIT — Quittances : table 9 col → cartes (Total en montant, HC/Charges/Statut/Date en méta) */
@media (max-width:768px){
  /* Barre de filtres : selects fluides (au lieu de width:170px fixe) */
  #p-quittances .flex-c .inp{width:auto !important;flex:1 1 44%;min-width:130px}
  #p-quittances .tbl-wrap{border:none;box-shadow:none;background:transparent;overflow:visible}
  #p-quittances .tbl thead{display:none}
  #p-quittances .tbl,#p-quittances .tbl tbody{display:block;width:auto}
  #p-quittances .tbl tr{position:relative;display:block;background:var(--sur);border:1px solid var(--bor);border-radius:var(--rl);padding:10px 12px;margin-bottom:8px;box-shadow:var(--shadow);border-left:3px solid var(--acc)}
  #p-quittances .tbl tr:hover,#p-quittances .tbl tr:hover td{background:transparent}
  #p-quittances .tbl td{display:block;border:none !important;padding:0 !important;white-space:normal;text-align:left !important}
  /* Logement (1) titre ; Locataire (2) sous-titre */
  #p-quittances .tbl td:nth-child(1){font-size:14.5px;font-weight:700;color:var(--t1);padding-right:88px !important}
  #p-quittances .tbl td:nth-child(2){font-size:12.5px;color:var(--t2);margin-bottom:5px}
  /* Mois (3) · HC (4) · Charges (5) · Statut (7) : ligne méta inline */
  #p-quittances .tbl td:nth-child(3){display:inline !important;font-size:12px;color:var(--t2);text-transform:capitalize}
  #p-quittances .tbl td:nth-child(3)::after{content:"  ·  ";color:var(--t3)}
  #p-quittances .tbl td:nth-child(4),#p-quittances .tbl td:nth-child(5){display:inline !important;font-size:12px;color:var(--t2)}
  #p-quittances .tbl td:nth-child(4)::before{content:"HC "}
  #p-quittances .tbl td:nth-child(4)::after{content:"  ·  ";color:var(--t3)}
  #p-quittances .tbl td:nth-child(5)::before{content:"Charges "}
  #p-quittances .tbl td:nth-child(5)::after{content:"  ·  ";color:var(--t3)}
  #p-quittances .tbl td:nth-child(7){display:inline-block !important;vertical-align:middle}
  /* Date émission (8) : ligne discrète */
  #p-quittances .tbl td:nth-child(8){display:block !important;font-size:11px;color:var(--t3);margin-top:4px}
  #p-quittances .tbl td:nth-child(8)::before{content:"Émise le "}
  /* Total (6) : montant en haut à droite */
  #p-quittances .tbl td:nth-child(6){position:absolute;top:10px;right:12px;font-size:15px;font-weight:700;text-align:right !important}
  /* Actions (9) */
  #p-quittances .tbl td.act-cell{display:flex !important;justify-content:flex-end;gap:6px;margin-top:8px}
  #p-quittances .tbl td.act-cell .btn{margin:0 !important;min-width:42px;min-height:34px;font-size:13px}
  /* État vide */
  #p-quittances .tbl tr td[colspan]{display:block !important;text-align:center;padding:20px !important}
}

/* v15.152 MOBILE-AUDIT — Révision IRL : vue Tableau (le défaut est déjà en cartes groupées) +
   Historique (table large sans alternative cartes) → cartes. Champs labellisés (en-tête masqué).
   La « Table IRL INSEE » (4 colonnes) reste une table : elle tient déjà à l'écran. */
@media (max-width:768px){
  /* — Révision, vue Tableau (#irl-table) : 9 col — */
  #irl-table .tbl-wrap{border:none;box-shadow:none;background:transparent;overflow:visible}
  #irl-table .tbl thead{display:none}
  #irl-table .tbl,#irl-table .tbl tbody{display:block;width:auto}
  #irl-table .tbl tr{position:relative;display:block;background:var(--sur);border:1px solid var(--bor);border-radius:var(--rl);padding:10px 12px;margin-bottom:8px;box-shadow:var(--shadow);border-left:3px solid var(--acc)}
  #irl-table .tbl tr:hover,#irl-table .tbl tr:hover td{background:transparent}
  #irl-table .tbl td{display:block;border:none !important;padding:0 !important;white-space:normal;text-align:left !important}
  #irl-table .tbl td:nth-child(1){font-size:14px;font-weight:700;color:var(--t1);padding-right:96px !important}
  #irl-table .tbl td:nth-child(2){font-size:12.5px;color:var(--t2);margin-bottom:4px}
  #irl-table .tbl td:nth-child(3),#irl-table .tbl td:nth-child(4),#irl-table .tbl td:nth-child(5),#irl-table .tbl td:nth-child(6){font-size:12px;color:var(--t2);margin-top:2px}
  #irl-table .tbl td:nth-child(3)::before{content:"IRL contrat : ";color:var(--t3)}
  #irl-table .tbl td:nth-child(4)::before{content:"IRL vigueur : ";color:var(--t3)}
  #irl-table .tbl td:nth-child(5)::before{content:"Anniversaire : ";color:var(--t3)}
  #irl-table .tbl td:nth-child(6)::before{content:"Loyer actuel : ";color:var(--t3)}
  #irl-table .tbl td:nth-child(7){position:absolute;top:10px;right:12px;font-size:15px;font-weight:700;text-align:right !important;color:var(--grn)}
  #irl-table .tbl td:nth-child(8){position:absolute;top:31px;right:12px;font-size:11.5px;text-align:right !important}
  #irl-table .tbl td.act-cell{display:flex !important;justify-content:flex-end;gap:6px;margin-top:8px}
  #irl-table .tbl td.act-cell .btn{margin:0 !important;min-width:40px;min-height:34px}
  #irl-table .tbl tr td[colspan]{display:block !important;text-align:center;padding:20px !important}
  /* — Historique (#tp-irl-histo) : 8 col — */
  #tp-irl-histo .tbl-wrap{border:none;box-shadow:none;background:transparent;overflow:visible}
  #tp-irl-histo .tbl thead{display:none}
  #tp-irl-histo .tbl,#tp-irl-histo .tbl tbody{display:block;width:auto}
  #tp-irl-histo .tbl tr{position:relative;display:block;background:var(--sur);border:1px solid var(--bor);border-radius:var(--rl);padding:10px 12px;margin-bottom:8px;box-shadow:var(--shadow);border-left:3px solid var(--acc)}
  #tp-irl-histo .tbl tr:hover,#tp-irl-histo .tbl tr:hover td{background:transparent}
  #tp-irl-histo .tbl td{display:block;border:none !important;padding:0 !important;white-space:normal;text-align:left !important}
  #tp-irl-histo .tbl td:nth-child(2){font-size:14px;font-weight:700;color:var(--t1);padding-right:84px !important}
  #tp-irl-histo .tbl td:nth-child(3){font-size:12.5px;color:var(--t2)}
  #tp-irl-histo .tbl td:nth-child(1){font-size:11.5px;color:var(--t3);margin-top:2px}
  #tp-irl-histo .tbl td:nth-child(1)::before{content:"Appliqué le ";color:var(--t3)}
  #tp-irl-histo .tbl td:nth-child(4),#tp-irl-histo .tbl td:nth-child(5),#tp-irl-histo .tbl td:nth-child(6),#tp-irl-histo .tbl td:nth-child(7){font-size:12px;color:var(--t2);margin-top:2px}
  #tp-irl-histo .tbl td:nth-child(4)::before{content:"IRL réf : ";color:var(--t3)}
  #tp-irl-histo .tbl td:nth-child(5)::before{content:"IRL vigueur : ";color:var(--t3)}
  #tp-irl-histo .tbl td:nth-child(6)::before{content:"Ancien loyer : ";color:var(--t3)}
  #tp-irl-histo .tbl td:nth-child(7)::before{content:"Nouveau loyer : ";color:var(--t3)}
  #tp-irl-histo .tbl td:nth-child(8){position:absolute;top:10px;right:12px;font-size:15px;font-weight:700;text-align:right !important}
  #tp-irl-histo .tbl tr td[colspan]{display:block !important;text-align:center;padding:20px !important}
}

/* ── B) FORMULAIRE EDL — modal mobile plein écran + cards verticales ──────────
   §A.4 (Didier) : la TABLETTE va AVEC le téléphone (cartes, une pièce à la fois).
   Point de rupture porté de 600 à 1023 px : téléphone (375) ET tablette (768) →
   cartes + parcours ; PC (≥ 1024) garde le tableau dense. */
@media (max-width:1023px){
  /* Modal plein écran (override des inline styles max-width:980px;width:96vw) */
  #ov-edl{padding:0 !important;align-items:stretch}
  #ov-edl > .modal{
    max-width:100vw !important;width:100vw !important;
    max-height:100dvh !important;height:100dvh !important;
    border-radius:0 !important;margin:0 !important;border:none;
  }
  #ov-edl .m-head{padding:10px 12px !important}
  #ov-edl .m-head h3{font-size:14px}
  #ov-edl .m-head .mu.sm{font-size:10.5px;display:block;margin-top:2px}
  /* Zone scroll : padding compact */
  #ov-edl > .modal > div[style*="overflow-y:auto"]{padding:10px !important}
  /* Sections (border boxes) : padding réduit */
  #ov-edl > .modal > div[style*="overflow-y"] > div[style*="border:1px solid"]{
    padding:10px !important;margin-bottom:10px !important;
  }
  /* Type Entrée/Sortie : empilé */
  #ov-edl > .modal div[style*="background:var(--sur2)"][style*="border-radius:var(--r)"]{flex-direction:column;align-items:stretch !important;gap:8px !important}
  #ov-edl input[type="date"]{width:100% !important}
  /* Récup EDL E/S : 2 colonnes */
  #ov-edl > .modal div[style*="margin-left:auto"]{margin-left:0 !important;width:100%;display:grid !important;grid-template-columns:1fr 1fr;gap:6px}
  #ov-edl > .modal div[style*="margin-left:auto"] > .btn{width:100% !important;justify-content:center;min-height:40px}
  /* Inputs avec largeurs fixes → 100% */
  #ov-edl .inp[style*="width:60px"],
  #ov-edl .inp[style*="width:62px"],
  #ov-edl .inp[style*="width:80px"],
  #ov-edl .inp[style*="width:86px"],
  #ov-edl .inp[style*="width:90px"],
  #ov-edl .inp[style*="width:110px"],
  #ov-edl .inp[style*="width:140px"],
  #ov-edl .inp[style*="width:180px"]{width:100% !important;min-width:0}
  /* Dénomination/Adresse champs en ligne fluides */
  #ov-edl .fg.mb4{margin-bottom:8px}
  /* Compteurs : table → cards verticales */
  .edl-cpt-tbl thead{display:none}
  .edl-cpt-tbl, .edl-cpt-tbl tbody, .edl-cpt-tbl tr, .edl-cpt-tbl td{display:block;width:auto}
  .edl-cpt-tbl tr{
    background:var(--sur2);border:1px solid var(--bor);border-radius:8px;
    padding:10px;margin-bottom:8px;
  }
  .edl-cpt-tbl tr:hover td,
  .edl-cpt-tbl tr:hover{background:transparent}
  .edl-cpt-tbl td{border:none !important;padding:5px 0 !important;background:transparent !important}
  /* 1ère cellule = titre du compteur (⚡ Élec, 🔥 Gaz...) */
  .edl-cpt-tbl tr td:first-child{
    font-size:15px;font-weight:700;color:var(--t1);
    padding-bottom:8px !important;margin-bottom:4px;
    border-bottom:1px solid var(--bor2) !important;
  }
  /* Cellules avec data-label : préfixer par le label */
  .edl-cpt-tbl td[data-label]::before{
    content:attr(data-label);display:block;
    font-size:10.5px;color:var(--t3);font-weight:600;
    text-transform:uppercase;letter-spacing:.4px;margin-bottom:3px;
  }
  /* Boutons photo dans tableau : mieux dimensionnés */
  .edl-cpt-tbl td button[onclick*="edlCptAddPhoto"]{
    min-height:36px !important;min-width:60px;
    font-size:13px !important;padding:6px 10px !important;
  }
  /* Inputs HP/HC sur même ligne avec leur label */
  .edl-cpt-tbl td > span[style*="font-size:11px"]{
    display:inline-block;margin-right:4px;font-size:12px !important;color:var(--t2);
  }
  .edl-cpt-tbl td > .inp{
    margin-bottom:4px;
  }
  /* Clés : table → cards verticales — même principe */
  .edl-cles-tbl thead{display:none}
  .edl-cles-tbl, .edl-cles-tbl tbody, .edl-cles-tbl tr, .edl-cles-tbl td{display:block;width:auto}
  .edl-cles-tbl tr{
    background:var(--sur2);border:1px solid var(--bor);border-radius:8px;
    padding:10px;margin-bottom:8px;position:relative;
  }
  .edl-cles-tbl tr:hover td,
  .edl-cles-tbl tr:hover{background:transparent}
  .edl-cles-tbl td{border:none !important;padding:4px 0 !important;background:transparent !important;text-align:left !important}
  .edl-cles-tbl td[data-label]::before{
    content:attr(data-label);display:block;
    font-size:10.5px;color:var(--t3);font-weight:600;
    text-transform:uppercase;letter-spacing:.4px;margin-bottom:3px;
  }
  .edl-cles-tbl td > .inp[type="number"]{width:100% !important;text-align:left !important}
  /* Bouton ✕ supprimer (dernière cellule) en absolute en haut à droite */
  .edl-cles-tbl tr td:last-child{
    position:absolute;top:6px;right:6px;padding:0 !important;
  }
  .edl-cles-tbl tr td:last-child > button{
    width:32px;height:32px;font-size:18px !important;
    background:var(--sur) !important;border:1px solid var(--bor) !important;
    border-radius:6px;
  }
  /* Chauffage / Technologies : checkboxes en colonne */
  #ov-edl > .modal div[style*="border-top:1px solid var(--bor)"] > .flex-c.mb4{
    flex-direction:column;align-items:flex-start !important;gap:6px !important;
  }
  #ov-edl > .modal div[style*="border-top:1px solid var(--bor)"] > .flex-c.mb4 > label{
    width:100%;padding:6px 0;min-height:32px;
  }
  /* Inputs "autre" pleine largeur */
  #ov-edl > .modal div[style*="border-top:1px solid var(--bor)"] > .flex-c.mb4 > .inp{
    width:100% !important;
  }
  /* Tableau chaudière/ballon : aussi en cards */
  #ov-edl table[style*="font-size:12px"] thead{display:none}
  #ov-edl table[style*="font-size:12px"]:not(.edl-cpt-tbl):not(.edl-cles-tbl) tr{
    display:block;border:1px solid var(--bor);border-radius:6px;padding:8px;margin-bottom:6px;background:var(--sur2);
  }
  #ov-edl table[style*="font-size:12px"]:not(.edl-cpt-tbl):not(.edl-cles-tbl) td{
    display:block;padding:4px 0 !important;
  }
  /* Photos clés : padding à 0 sur td concerné */
  /* Signatures : empilées en 1 colonne (g2 déjà géré globalement)
     + canvas plus haut pour confort doigt */
  #ov-edl canvas[id^="edl-sig"]{
    height:140px !important;max-width:100% !important;width:100% !important;
  }
  /* Drive path + bouton sync : empilés */
  #ov-edl > .modal div[style*="background:var(--sur2)"][style*="border-radius:var(--r)"] + .g2,
  #ov-edl input#edl-drive-path{width:100% !important}
  /* Footer : sticky avec wrap */
  /* Pied de modale sur petit écran — UN seul motif, deux modales.
     ⚠️ Pour #ov-edl ces règles ne rendent RIEN : plus bas dans ce même media query,
     `#ov-edl .m-foot{display:none !important}` masque son pied (le rail EDL le remplace).
     Elles ne sont donc validées que par #ov-quit-preview — à vérifier au smoke téléphone. */
  #ov-edl .m-foot,
  #ov-quit-preview .m-foot{
    flex-wrap:wrap;gap:6px;padding:10px 12px;
    background:var(--sur);border-top:1px solid var(--bor);
    position:sticky;bottom:0;
  }
  #ov-edl .m-foot .btn,
  #ov-quit-preview .m-foot .btn{
    flex:1 1 calc(50% - 4px);min-height:44px;font-size:13px;
    justify-content:center;padding:0 8px;
  }
  /* Le bouton principal prend toute la largeur, en haut : « Enregistrer » (EDL), « Partager » (quittance) */
  #ov-edl .m-foot .btn.bp,
  #ov-quit-preview .m-foot .btn.bp{flex:1 1 100%;order:-1;background:var(--acc);font-weight:600}
  /* Banner référence chargée : lisibilité */
  #ov-edl #edl-ref-banner{font-size:11.5px !important;line-height:1.4}
  /* Barre actions Pièces : empilée */
  #ov-edl > .modal div[style*="background:var(--sur2)"][style*="margin-bottom:10px"]{
    flex-direction:column;align-items:stretch !important;gap:8px !important;
  }
  #ov-edl #edl-add-piece-sel{width:100% !important}

  /* ── PIÈCES : éléments en cards verticales (fix boutons État empilés) ──
     Avant : table compacte → 5 boutons N/B/U/M/− s'empilent verticalement
     car le td est trop étroit. Après : chaque élément = une card avec
     les boutons État en ligne horizontale (flex-wrap). */
  #edl-pieces-section .tbl-wrap{overflow:visible;border:none;box-shadow:none;border-radius:0}
  #edl-pieces-section .tbl-wrap table.tbl{margin:0;font-size:12px}
  #edl-pieces-section .tbl-wrap table.tbl thead{display:none}
  #edl-pieces-section .tbl-wrap table.tbl,
  #edl-pieces-section .tbl-wrap table.tbl tbody,
  #edl-pieces-section .tbl-wrap table.tbl tr,
  #edl-pieces-section .tbl-wrap table.tbl td{display:block;width:auto}
  /* Chaque élément = card */
  #edl-pieces-section .tbl-wrap table.tbl tr{
    background:var(--sur2);border-top:1px solid var(--bor);
    padding:10px 12px;position:relative;
  }
  #edl-pieces-section .tbl-wrap table.tbl tr:hover td,
  #edl-pieces-section .tbl-wrap table.tbl tr:hover{background:transparent}
  #edl-pieces-section .tbl-wrap table.tbl td{
    padding:5px 0 !important;border:none !important;
    text-align:left !important;background:transparent !important;
    min-width:0 !important;
  }
  /* col 1 : nom élément en titre */
  #edl-pieces-section .tbl-wrap table.tbl td:nth-child(1){
    font-weight:600;padding-right:36px !important;
    border-bottom:1px solid var(--bor2) !important;
    padding-bottom:7px !important;margin-bottom:3px;
  }
  #edl-pieces-section .tbl-wrap table.tbl td:nth-child(1) input{
    font-size:16px !important;font-weight:600 !important;   /* §2.4 : 16 px À LA SOURCE (iOS ne zoome plus) */
    color:var(--t1) !important;width:100% !important;
  }
  /* col 2 : État (5 boutons N/B/U/M/−) en ligne horizontale */
  #edl-pieces-section .tbl-wrap table.tbl td:nth-child(2){
    display:flex !important;flex-wrap:wrap;gap:5px;
    align-items:center;padding:6px 0 !important;
  }
  #edl-pieces-section .tbl-wrap table.tbl td:nth-child(2)::before{
    content:'État :';display:inline-block;
    font-size:11px;color:var(--t3);font-weight:600;
    text-transform:uppercase;letter-spacing:.4px;margin-right:4px;
  }
  #edl-pieces-section .tbl-wrap table.tbl td:nth-child(2) button{
    margin:0 !important;min-width:44px !important;min-height:44px !important;
    font-size:14px !important;padding:7px 12px !important;
    flex:0 0 auto;
  }
  /* col 3 : Observations entrée */
  #edl-pieces-section .tbl-wrap table.tbl td:nth-child(3){width:100%}
  #edl-pieces-section .tbl-wrap table.tbl td:nth-child(3)::before{
    content:'Observations';display:block;
    font-size:11px;color:var(--t3);font-weight:600;
    text-transform:uppercase;letter-spacing:.4px;margin-bottom:3px;
  }
  #edl-pieces-section .tbl-wrap table.tbl td:nth-child(3) textarea{
    background:var(--sur) !important;
    border:1px solid var(--bor) !important;border-radius:6px !important;
    padding:6px 8px !important;font-size:16px !important;   /* §2.4 : 16 px À LA SOURCE (obs entrée) */
    min-height:42px;width:100% !important;
  }
  /* col 4 : Photos entrée */
  #edl-pieces-section .tbl-wrap table.tbl td[style*="vertical-align:top"]{
    text-align:left !important;
  }
  #edl-pieces-section .tbl-wrap table.tbl td[style*="vertical-align:top"]::before{
    content:'📷 Photos';display:block;
    font-size:11px;color:var(--t3);font-weight:600;
    text-transform:uppercase;letter-spacing:.4px;margin-bottom:4px;
  }
  /* ══ EDL-TÉLÉPHONE (§2.6) — MODE SORTIE : DEUX BANDES NETTES (maquette ecran-05-piece) ═══
     Par élément, empilement vertical en 2 REGISTRES CONTINUS (fini la zébrure entrée/sortie
     interlignée) : d'abord la bande GRISE « 🔒 Entrée — référence signée » (état d'entrée en
     pastille LECTURE SEULE, obs d'entrée en italique verrouillée, miniatures verrouillées),
     PUIS la bande CORAIL « ✍️ Sortie — à remplir » (5 boutons d'état ≥ 44 px, obs de sortie,
     ajout de photo), le VERDICT déduit dessous (verdictDe(), jamais stocké). Le tableau PC
     (≥ 1024) n'est PAS concerné (§2.9). Données réutilisées telles quelles (_edlElemRow) —
     seule la disposition change, en CSS. Saisie ≥ 16 px (§2.4). */
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl tbody tr{
    display:grid !important;grid-template-columns:1fr;
    grid-template-areas:'nom' 'etatE' 'obsE' 'photoE' 'etatS' 'obsS' 'photoS' 'verdict';
    row-gap:0;column-gap:0;align-items:stretch;padding:10px 12px !important;position:relative;
  }
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td{border:none !important;margin-top:0 !important}
  /* nom de l'élément en titre de la carte */
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(1){
    grid-area:nom;padding:0 36px 8px 0 !important;border-bottom:1px solid var(--bor) !important;margin-bottom:10px !important;
  }
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(2){grid-area:etatE}
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td.edl-cell-obsE{grid-area:obsE}
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(4){grid-area:photoE}
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(5){grid-area:etatS}
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(6){grid-area:obsS}
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(7){grid-area:photoS}
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td.edl-verdict-cell{grid-area:verdict}

  /* ── BANDE ENTRÉE (grise, signée) : 3 cellules SOUDÉES en un bloc gris continu ── */
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(2),
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td.edl-cell-obsE,
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(4){
    background:var(--sur2) !important;
    border-left:1px solid var(--bor) !important;border-right:1px solid var(--bor) !important;
    padding:6px 10px !important;
  }
  /* haut de bande = état d'entrée : PASTILLE lecture seule (PAS les 5 boutons), 1 seul en-tête */
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(2){
    display:block !important;text-align:left !important;
    border-top:1px solid var(--bor) !important;border-radius:8px 8px 0 0;padding-top:8px !important;
  }
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(2)::before{
    content:'🔒 Entrée — référence signée';display:block;font:700 10px var(--font);color:var(--t3);
    text-transform:uppercase;letter-spacing:.4px;margin-bottom:6px;
  }
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(2) button{display:none !important}
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(2) .edl-etatE-view{display:inline-flex !important}
  /* obs d'entrée : italique, lecture seule (≥ 16 px, §2.4) */
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td.edl-cell-obsE::before{
    content:'Obs. entrée';display:block;font:600 10px var(--font);color:var(--t3);
    text-transform:uppercase;letter-spacing:.4px;margin:2px 0 3px;
  }
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td.edl-cell-obsE textarea{
    pointer-events:none;background:var(--sur) !important;color:var(--t2) !important;font-style:italic;
    border:1px solid var(--bor) !important;border-radius:6px;padding:5px 7px !important;
    font-size:16px !important;width:100% !important;opacity:.9;   /* §2.4 : 16 px À LA SOURCE (obs entrée, lecture seule) */
  }
  /* bas de bande = photos d'entrée : miniatures verrouillées (ajout masqué), coin arrondi bas */
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(4){
    border-bottom:1px solid var(--bor) !important;border-radius:0 0 8px 8px;padding-bottom:8px !important;
  }
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(4)::before{
    content:'🔒 📷 Entrée';display:block;font:600 10px var(--font);color:var(--t3);
    text-transform:uppercase;letter-spacing:.4px;margin:2px 0 4px;
  }
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(4) button[onclick*="edlAddPhoto"]{display:none !important}

  /* ── BANDE SORTIE (corail, à remplir) : liseré orange à gauche, 3 cellules SOUDÉES ── */
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(5),
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(6),
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(7){
    background:color-mix(in srgb,var(--ora) 8%,transparent) !important;
    border-left:4px solid var(--ora) !important;
    border-right:1px solid color-mix(in srgb,var(--ora) 35%,transparent) !important;
    padding:6px 10px !important;
  }
  /* haut de bande = état de SORTIE : 5 boutons ≥ 44 px, 1 seul en-tête ; l'écart avec la
     bande entrée (margin-top) forme la coupure NETTE entre les 2 registres */
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(5){
    display:flex !important;flex-wrap:wrap;gap:6px;align-content:flex-start;
    margin-top:10px !important;
    border-top:1px solid color-mix(in srgb,var(--ora) 35%,transparent) !important;
    border-radius:8px 8px 0 0;padding-top:8px !important;
  }
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(5)::before{
    content:'✍️ Sortie — à remplir';display:block;width:100%;font:700 10px var(--font);color:var(--ora);
    text-transform:uppercase;letter-spacing:.4px;margin:0 0 5px;
  }
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(5) button{
    flex:1 1 calc(20% - 6px);min-width:44px !important;min-height:44px !important;
    margin:0 !important;font-size:15px !important;padding:0 !important;
  }
  /* obs de sortie : éditable (≥ 16 px, §2.4) */
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(6){display:block !important;width:auto !important}
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(6)::before{
    content:'✍️ Obs. sortie';display:block;font:600 10px var(--font);color:var(--ora);
    text-transform:uppercase;letter-spacing:.4px;margin:2px 0 3px;
  }
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(6) textarea{
    background:var(--sur) !important;border:1px solid var(--bor) !important;border-radius:6px;
    padding:5px 7px !important;font-size:16px !important;width:100% !important;min-height:42px;   /* §2.4 : 16 px À LA SOURCE (obs sortie) */
  }
  /* bas de bande = photos de sortie : ajout permis, coin arrondi bas */
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(7){
    border-bottom:1px solid color-mix(in srgb,var(--ora) 35%,transparent) !important;
    border-radius:0 0 8px 8px;padding-bottom:8px !important;
  }
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(7)::before{
    content:'📷 Sortie';display:block;font:600 10px var(--font);color:var(--ora);
    text-transform:uppercase;letter-spacing:.4px;margin:2px 0 4px;
  }
  /* verdict déduit : pleine largeur, séparé, sous les 2 bandes */
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td.edl-verdict-cell{
    text-align:left !important;white-space:normal !important;
    border-top:1px dashed var(--bor) !important;margin-top:10px !important;padding:8px 0 0 !important;
  }
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td.edl-verdict-cell::before{
    content:'Verdict';display:block;font:600 10px var(--font);color:var(--t3);
    text-transform:uppercase;letter-spacing:.4px;margin-bottom:4px;
  }
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td.edl-verdict-cell .edl-vwarn{max-width:none}
  /* Bouton ✕ supprimer élément (dernière cellule, width:20px) en absolute */
  #edl-pieces-section .tbl-wrap table.tbl td[style*="width:20px"]{
    position:absolute !important;top:8px;right:8px;
    padding:0 !important;width:auto !important;
  }
  #edl-pieces-section .tbl-wrap table.tbl td[style*="width:20px"] button{
    width:32px;height:32px;font-size:16px !important;
    background:var(--sur) !important;
    border:1px solid var(--bor) !important;border-radius:6px;
    display:flex;align-items:center;justify-content:center;
  }
  /* Header pièce (titre + pilules Renommer/Supprimer) : empilé sur mobile (§2.6) */
  #edl-pieces-section .edl-piece-head{
    flex-direction:column !important;align-items:stretch !important;gap:8px !important;
    padding:10px !important;
  }
  #edl-pieces-section .edl-piece-name{
    width:100% !important;font-size:16px !important;padding:6px 8px !important;   /* §2.4 : 16 px À LA SOURCE (nom de pièce) */
    background:var(--sur) !important;border:1px solid var(--bor) !important;
    border-radius:6px !important;
  }
  #edl-pieces-section .edl-piece-acts{
    width:100%;justify-content:flex-start;gap:6px;
  }
  #edl-pieces-section .edl-piece-acts > .btn{
    min-height:44px;padding:0 12px;font-size:14px !important;
  }
  /* Le 🗑 dense (PC) est remplacé sur téléphone par la pilule « ✕ Supprimer la pièce ». */
  #edl-pieces-section .edl-piece-del-pc{display:none !important}
  /* Les 2 pilules d'action de pièce : maquette §2.6, sous le titre, pleine largeur, ≥44 px. */
  #edl-pieces-section .edl-piece-pills{
    display:flex !important;gap:8px;width:100%;
  }
  #edl-pieces-section .edl-piece-pills .edl-pill{
    flex:1 1 0;min-height:44px;display:inline-flex;align-items:center;justify-content:center;gap:6px;
    font:600 13px var(--font);border:1px solid var(--bor);border-radius:999px;
    background:var(--sur);color:var(--t1);cursor:pointer;padding:0 12px;
  }
  #edl-pieces-section .edl-piece-pills .edl-pill:active{background:var(--sur2)}
  #edl-pieces-section .edl-piece-pills .edl-pill-del{
    color:var(--neg);border-color:color-mix(in srgb,var(--neg) 45%,transparent);
    background:color-mix(in srgb,var(--neg) 8%,transparent);
  }
  /* Légende des états : la .edl-legend gère son propre padding (repliable, voir plus bas) */
  #edl-pieces-section > .edl-legend{padding:0 !important}
}

/* ══ EDL-TÉLÉPHONE — la légende des états, REPLIABLE (fin des 424 px par pièce) ══════════ */
.edl-legend{background:var(--sur2);border:1px solid var(--bor);border-radius:var(--r);margin-bottom:10px;font-size:11px;overflow:hidden}
.edl-legend-sum{display:flex;flex-wrap:wrap;align-items:center;gap:6px;width:100%;background:none;border:none;
  padding:9px 12px;cursor:pointer;font-family:inherit;font-size:11px;color:var(--t1);text-align:left}
.edl-legend-sum b{color:var(--t1)}
.edl-leg-pill{padding:2px 8px;border-radius:10px;border:1px solid;font-weight:700;white-space:nowrap}
.edl-leg-hint{color:var(--t3);margin-left:auto;font-weight:600;white-space:nowrap}
.edl-legend.open .edl-leg-hint::after{content:'▴';display:inline}
.edl-leg-hint::after{content:'▾'}
.edl-legend-body{display:none;padding:0 12px 10px;color:var(--t2)}
.edl-legend.open .edl-legend-body{display:flex;flex-wrap:wrap;gap:5px 14px}
.edl-leg-row{display:inline-flex;align-items:center;gap:5px}
/* PC (≥1024) : toujours dépliée, sans bouton — les descriptions restent visibles (PC inchangé). */
@media (min-width:1024px){
  .edl-legend-body{display:flex !important;flex-wrap:wrap;gap:5px 14px}
  .edl-leg-hint{display:none}
  .edl-legend-sum{cursor:default}
  .edl-legend-sum .edl-leg-pill{display:none}   /* pastilles portées par les lignes du corps */
}

/* Bouton de finalisation sur l'étape « fin » — MOBILE only (le pied de page « Enregistrer »
   est masqué sur téléphone). Termine l'état des lieux (saveEDL). */
/* #3 (26/08) — sur relecture / fin, le CENTRE DU RAIL devient le bouton d'ACTION (place
   cohérente, plus de bouton flottant dans le corps). Rempli, texte blanc. */
.edl-rail-mid.rail-act-sign{background:var(--acc);border-color:var(--acc)}
.edl-rail-mid.rail-act-save{background:var(--pos);border-color:var(--pos)}
.edl-rail-mid.rail-act-sign .edl-rail-label,
.edl-rail-mid.rail-act-save .edl-rail-label,
.edl-rail-mid.rail-act-sign .edl-rail-jump,
.edl-rail-mid.rail-act-save .edl-rail-jump{color:#fff}

/* Bouton « ✕ » de suppression d'une photo : un ROND propre. La cible tactile mobile
   (min-height:44px) l'étirait en ellipse verticale (15×44). Dimensions forcées + centrage. */
.edl-delphoto{position:absolute;top:-6px;right:-6px;width:22px !important;height:22px !important;
  min-width:0 !important;min-height:0 !important;border:none;border-radius:50%;background:var(--red);
  color:#fff;font-size:11px;line-height:1;padding:0 !important;cursor:pointer;
  display:flex;align-items:center;justify-content:center;box-shadow:0 1px 3px rgba(0,0,0,.35);z-index:2}

/* ── C) Header EDL : compaction ultime sous 480px ─────────────────────────── */
@media (max-width:480px){
  /* Modal head : titre encore plus serré */
  #ov-edl .m-head h3{font-size:13px;line-height:1.2}
  #ov-edl .m-head .mu.sm{font-size:10px}
  /* Footer : si on a vraiment 4-5 boutons, passer à 1 colonne pour lisibilité */
  /* Sous 480 px : un bouton par rangée. Même motif, deux modales. */
  #ov-edl .m-foot .btn,
  #ov-quit-preview .m-foot .btn{flex:1 1 100%;font-size:13px;min-height:42px}
  #ov-edl .m-foot .btn.bp,
  #ov-quit-preview .m-foot .btn.bp{order:-1}
  /* Boutons header EDL list : sans icône texte */
  #p-edl .tbl tr td.act-cell .btn[onclick*="downloadEDLPdfNative"]::after,
  #p-edl .tbl tr td.act-cell .btn[onclick*="uploadEDLPDFToDrive"]::after{
    display:none;
  }
}

/* EDL TERRAIN lot 5 — les 5 couleurs d'état prennent les tokens SÉMANTIQUES de la
   charte (§7ter, §9 inv. 34j/34k). Chaque état garde SA couleur (règle « on garde la
   couleur pour ce qui différencie ») ; seules les valeurs changent — la palette GitHub
   (contrastes 2,5:1) est remplacée par les tokens recalibrés à 4,5:1, qui SUIVENT le
   thème (late-binding via var()). Une seule définition : var(--pos) etc. se résolvent
   par thème tout seuls. */
:root{
  --e-neuf:var(--pos);       /* Neuf         → vert   #16795e clair / #3fd6a3 sombre */
  --e-bon:var(--adv);        /* Bon état     → bleu   #2e6db1 / #7ab6ea */
  --e-usage:var(--warn);     /* État d'usage → ambre  #8f620e / #f1bd55 */
  --e-mauvais:var(--neg);    /* Mauvais état → rouge  #c92f2f / #ff7f7f */
  --e-absent:var(--info);    /* Absent       → ardoise#42506a / #aeb9cb */
}

/* ════════════════════════════════════════════════════════════════════════
   EDL TERRAIN lot 5 — le parcours (CDC docs/CDC-EDL.md §4, §A.1).
   Deux morceaux : les pastilles d'avancement (tous formats) et, sous 768 px,
   une pièce à l'écran + le rail du pouce. PC/tablette : rien ne change ici.
   ════════════════════════════════════════════════════════════════════════ */

/* Pastille d'avancement d'une pièce — visible sur tous les formats (sommaire). */
.edl-pbadge{display:inline-flex;align-items:center;gap:5px;flex:none}
.edl-pcount{font:700 11px var(--font);color:var(--t2);background:var(--sur);
  border:1px solid var(--bor);border-radius:999px;padding:1px 8px;font-variant-numeric:tabular-nums;white-space:nowrap}
.edl-pbadge.ok .edl-pcount{color:var(--pos);border-color:color-mix(in srgb,var(--pos) 45%,transparent);
  background:color-mix(in srgb,var(--pos) 10%,transparent)}
.edl-pecart{font:700 11px var(--font);color:var(--neg);background:color-mix(in srgb,var(--neg) 12%,transparent);
  border:1px solid color-mix(in srgb,var(--neg) 45%,transparent);border-radius:999px;padding:1px 8px;white-space:nowrap}

/* Lot 7 (§A.6, §6) — le VERDICT déduit d'un élément de sortie : à constater (ambre) /
   conforme (atténué) / écart (rouge). Jamais saisi ; recalculé par verdictDe(). */
.edl-vbadge{display:inline-block;font:700 10.5px var(--font);border-radius:999px;padding:2px 9px;
  white-space:nowrap;border:1px solid transparent}
.edl-vbadge.vc-att{color:var(--warn);background:color-mix(in srgb,var(--warn) 12%,transparent);
  border-color:color-mix(in srgb,var(--warn) 40%,transparent)}
.edl-vbadge.vc-ok{color:var(--t2);background:var(--sur);border-color:var(--bor)}
.edl-vbadge.vc-ko{color:var(--neg);background:color-mix(in srgb,var(--neg) 14%,transparent);
  border-color:color-mix(in srgb,var(--neg) 50%,transparent);font-weight:800}
.edl-vwarn{display:block;margin-top:4px;font:600 9.5px var(--font);color:var(--warn);white-space:normal;max-width:96px;line-height:1.25}

/* Lot 7 (§A.6) — l'état d'ENTRÉE en sortie : PASTILLE lecture seule (signé).
   Masquée par défaut → le tableau PC garde ses 5 boutons ; la carte (< 1024) la
   montre et masque les boutons (voir bloc .edl-sortie-mode plus bas). */
.edl-etatE-view{display:none}
/* Les pilules Renommer/Supprimer de pièce sont MOBILE only (§2.6) : masquées sur PC, qui
   garde le header dense (titre éditable + 🗑). Le bloc @media <1024 les rallume. */
.edl-piece-pills{display:none}
.edl-pastille{display:inline-flex;align-items:center;gap:5px;font:700 12px var(--font);
  border:1px solid var(--bor);border-radius:999px;padding:4px 11px;white-space:nowrap;line-height:1.1}
.edl-pastille-vide{color:var(--t3);background:var(--sur);border-style:dashed}

/* Le rail du pouce : enfant direct de la modale, masqué par défaut, montré
   sous 768 px par _edlSyncParcours(). JAMAIS un conteneur de défilement. */
.edl-rail{align-items:stretch;gap:8px;padding:8px 10px;flex:none;
  background:var(--sur);border-top:1px solid var(--bor);
  /* P5 : suit le visual viewport (clavier ouvert) via --edl-vv-offset posé en JS. */
  transform:translateY(calc(-1 * var(--edl-vv-offset,0px)));
  transition:transform .12s ease-out}
.edl-rail-arrow{flex:0 0 52px;min-height:48px;border:1px solid var(--bor);background:var(--sur2);
  color:var(--t1);font-size:22px;line-height:1;border-radius:var(--r);cursor:pointer;font-weight:700}
.edl-rail-arrow:disabled{opacity:.35;cursor:default}
.edl-rail-arrow:active:not(:disabled){background:var(--acc-bg)}
.edl-rail-mid{flex:1;min-height:48px;display:flex;align-items:center;justify-content:center;gap:8px;
  border:1px solid var(--acc);background:var(--acc-bg);color:var(--acc);border-radius:var(--r);
  cursor:pointer;padding:0 10px;min-width:0}
.edl-rail-mid .edl-rail-jump{font-size:17px;flex:none}
.edl-rail-txt{display:flex;flex-direction:column;align-items:flex-start;min-width:0;line-height:1.15}
.edl-rail-label{font:800 14px var(--font);color:var(--acc);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.edl-rail-global{font:600 10.5px var(--font);color:var(--t3);white-space:nowrap;font-variant-numeric:tabular-nums}

/* La feuille des pièces — monte du bas, se pose par-dessus la modale. */
.edl-piece-sheet{position:fixed;inset:0;z-index:60;background:rgba(0,0,0,.42);
  align-items:flex-end;justify-content:center}
.edl-sheet-panel{width:100%;max-width:560px;max-height:72vh;display:flex;flex-direction:column;
  background:var(--sur);border-radius:14px 14px 0 0;border:1px solid var(--bor);border-bottom:none;
  box-shadow:0 -8px 40px rgba(0,0,0,.3);overflow:hidden}
.edl-sheet-head{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;
  border-bottom:1px solid var(--bor);flex:none;font-size:14px;color:var(--t1)}
.edl-sheet-close{background:none;border:none;color:var(--t3);font-size:18px;cursor:pointer;line-height:1;padding:2px 6px}
/* Défilement borné (overscroll-behavior:contain, lot 0) — jamais chaîné au body. */
.edl-sheet-list{overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:6px}
.edl-sheet-row{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;
  min-height:56px;padding:8px 12px;border:1px solid transparent;border-radius:var(--r);
  background:none;cursor:pointer;text-align:left;font-family:var(--font)}
.edl-sheet-row:active{background:var(--sur2)}
.edl-sheet-row.cur{border-color:var(--acc);background:var(--acc-bg)}
.edl-sheet-row.done .edl-sheet-nom::before{content:'✓ ';color:var(--pos);font-weight:800}
.edl-sheet-nom{font:700 14px var(--font);color:var(--t1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1}
.edl-sheet-meta{display:flex;align-items:center;gap:6px;flex:none}
/* EDL-TÉLÉPHONE — la feuille liste TOUTES les étapes (admin + pièces) ; le tag les distingue. */
.edl-sheet-tag{flex:none;font:700 10px var(--font);text-transform:uppercase;letter-spacing:.4px;
  padding:2px 7px;border-radius:999px;background:var(--sur2);color:var(--t3)}
.edl-sheet-tag.adm{color:var(--warn);background:color-mix(in srgb,var(--warn) 12%,transparent)}
.edl-sheet-tag.pce{color:var(--pos);background:color-mix(in srgb,var(--pos) 12%,transparent)}
/* §2.5 — pied de la feuille : ajout de pièce (kit standard + libre), place unique sur téléphone. */
.edl-sheet-add{flex:none;border-top:1px solid var(--bor);padding:10px 12px;background:var(--sur)}
.edl-sheet-add-lbl{display:block;font:700 11px var(--font);text-transform:uppercase;letter-spacing:.4px;color:var(--t3);margin-bottom:6px}
.edl-sheet-add-row{display:flex;gap:8px;align-items:stretch}
.edl-sheet-add-row .inp{flex:1;min-width:0;font-size:16px;min-height:44px}
.edl-sheet-add-row .btn{flex:none;min-height:44px;padding:0 16px;font-size:14px}

/* ══ EDL-TÉLÉPHONE (§2.7) — LA RELECTURE AVANT SIGNATURE (écran mobile < 1024) ══ */
.edl-rl{padding:2px}
.edl-rl-title{font:800 17px var(--font);color:var(--t1);margin:0 0 2px}
.edl-rl-hint{font-size:12px;color:var(--t3);margin:0 0 12px;line-height:1.4}
.edl-rl-chips{display:flex;gap:7px;margin-bottom:12px}
.edl-rl-chip{flex:1;text-align:center;border:1px solid var(--bor);border-radius:10px;padding:8px 4px;background:var(--sur2)}
.edl-rl-chip .n{display:block;font:800 18px var(--font)}
.edl-rl-chip .l{font-size:10px;color:var(--t3);text-transform:uppercase;letter-spacing:.4px}
.edl-rl-chip.ko .n{color:var(--neg)} .edl-rl-chip.ok .n{color:var(--pos)} .edl-rl-chip.att .n{color:var(--warn)}
.edl-rl-banner{display:flex;gap:8px;align-items:flex-start;border-radius:10px;padding:11px 12px;margin-bottom:12px;
  font-size:12.5px;line-height:1.45;background:color-mix(in srgb,var(--warn) 12%,transparent);border:1px solid var(--warn);color:var(--t1)}
.edl-rl-banner .ic{font-size:16px;flex:none}
.edl-rl-banner b{color:var(--warn)}
/* Récap des sections admin (détecteur / compteurs / clés) dans la relecture (AUDIT 26/08) */
.edl-rl-admin{background:var(--sur2);border:1px solid var(--bor);border-radius:10px;padding:4px 12px;margin-bottom:12px}
.edl-rl-arow{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 0;font-size:13px;
  color:var(--t2);border-bottom:1px solid var(--bor)}
.edl-rl-arow:last-child{border-bottom:none}
.edl-rl-arow b{color:var(--t1);font-weight:700;white-space:nowrap}
.edl-rl-sec{border:1px solid var(--bor);border-radius:10px;margin-bottom:9px;overflow:hidden;background:var(--sur)}
.edl-rl-sech{display:flex;justify-content:space-between;align-items:center;padding:11px 12px;cursor:pointer;
  font-weight:700;font-size:14px;background:var(--sur2);gap:8px}
.edl-rl-secnom{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.edl-rl-secmeta{display:flex;align-items:center;gap:8px;flex:none}
.edl-rl-badge{font:800 11px var(--font);border-radius:999px;padding:2px 9px;border:1px solid}
.edl-rl-badge.ko{color:var(--neg);border-color:var(--neg);background:color-mix(in srgb,var(--neg) 12%,transparent)}
.edl-rl-badge.ok{color:var(--t3);border-color:var(--bor);background:var(--sur)}
.edl-rl-caret{color:var(--t3);font-size:12px;transition:transform .15s}
.edl-rl-sec.open .edl-rl-caret{transform:rotate(90deg)}
.edl-rl-secb{padding:4px 12px 10px;display:none}
.edl-rl-sec.open .edl-rl-secb{display:block}
.edl-rl-li{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;padding:7px 0;border-top:1px solid var(--bor);font-size:13px}
.edl-rl-li:first-child{border-top:none}
.edl-rl-li.flag{cursor:pointer;margin:0 -12px;padding:8px 12px}
.edl-rl-li.flag:active{background:var(--sur2)}
.edl-rl-li .nm{color:var(--t1);flex:1;min-width:0}
.edl-rl-li .obs{display:block;font-size:11.5px;color:var(--t3);font-style:italic;margin-top:2px;line-height:1.35}
.edl-rl-li .obs.s{color:var(--ora);font-style:normal}
.edl-rl-li .obs b{font-style:normal}
.edl-rl-li .fix{display:inline-block;font:800 10px var(--font);color:var(--acc);margin-top:3px}
.edl-rl-li .trans{font-size:12px;font-weight:700;white-space:nowrap;color:var(--t2);display:flex;align-items:center;gap:6px;flex:none}
.edl-rl-li .trans .att{color:var(--warn);font-weight:600}
.edl-rl-li .vb{font:800 9.5px var(--font);border-radius:999px;padding:2px 7px;border:1px solid}
.edl-rl-li .vb.ko{color:var(--neg);border-color:var(--neg);background:color-mix(in srgb,var(--neg) 12%,transparent)}
.edl-rl-li .vb.att{color:var(--warn);border-color:var(--warn);background:color-mix(in srgb,var(--warn) 12%,transparent)}
.edl-rl-after{border:1px dashed var(--bor);border-radius:10px;padding:11px 12px;margin:8px 0 12px;color:var(--t3);font-size:12px;line-height:1.5}
.edl-rl-cta{width:100%;border:none;background:var(--ora);color:#fff;border-radius:var(--r);font:800 15px var(--font);
  padding:14px;cursor:pointer;font-family:var(--font)}

/* le pop-up « en connaissance de cause » (§2.7) — au-dessus du rail et de la feuille */
.edl-signmodal{position:fixed;inset:0;z-index:70;background:rgba(0,0,0,.5);align-items:center;justify-content:center;padding:18px}
.edl-sm-box{background:var(--sur);border:1px solid var(--bor);border-radius:16px;padding:18px;width:100%;max-width:340px}
.edl-sm-title{font:800 16px var(--font);color:var(--t1);margin-bottom:10px}
.edl-sm-body{font-size:13px;color:var(--t2);line-height:1.5}
.edl-sm-body ul{margin:8px 0;padding-left:18px}
.edl-sm-body li{margin:5px 0;color:var(--t1)}
.edl-sm-body b{color:var(--t1)}
.edl-sm-actions{display:flex;flex-direction:column;gap:8px;margin-top:16px}
.edl-sm-btn{border:none;border-radius:10px;padding:13px;font:800 14px var(--font);cursor:pointer;font-family:var(--font)}
.edl-sm-btn.go{background:var(--ora);color:#fff}
.edl-sm-btn.back{background:var(--sur2);color:var(--t2);border:1px solid var(--bor)}

/* ══ Lot 7 (§A.6) — LA VISIONNEUSE PHOTO entrée/sortie ════════════════════════
   Grande image EN ENTIER (contain, fond neutre, jamais rognée), portrait comme
   paysage. PC/tablette : 2 colonnes entrée|sortie ; téléphone : grande image +
   pellicule des 2 séries. Vignettes carrées (cover). Aucun rideau avant/après. */
#edl-photo-viewer{position:fixed;inset:0;z-index:10001;display:none;flex-direction:column;
  background:rgba(10,11,14,.96);padding:14px 14px 16px;gap:10px}
.epv-x{position:absolute;top:12px;right:12px;width:40px;height:40px;border-radius:50%;
  background:#fff;color:#000;border:none;font-size:24px;line-height:1;cursor:pointer;z-index:3;
  display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(0,0,0,.35)}
.epv-title{color:#fff;font:700 15px var(--font);text-align:center;padding:2px 52px;flex:none;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.epv-2col{flex:1;display:grid;grid-template-columns:1fr 1fr;gap:12px;min-height:0}
.epv-col{display:flex;flex-direction:column;min-height:0;gap:8px}
.epv-col-head{color:#cdd3e0;font:700 12px var(--font);text-transform:uppercase;letter-spacing:.5px;text-align:center;flex:none}
.epv-big{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;
  background:#22252c;border-radius:10px;overflow:hidden}
/* EN ENTIER : contain garde portrait ET paysage entièrement visibles (jamais rognés). */
.epv-big-img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;display:block}
.epv-big-empty{color:#8a90a0;font:500 13px var(--font)}
.epv-strip,.epv-pell-thumbs{display:flex;gap:6px;overflow-x:auto;overscroll-behavior:contain;padding:2px;flex:none}
.epv-strip{justify-content:center}
.epv-thumb{flex:0 0 auto;width:54px;height:54px;border-radius:8px;overflow:hidden;
  border:2px solid transparent;background:#22252c;cursor:pointer;padding:0}
/* Vignette de liste CARRÉE (cover) — le clic ouvre l'entier (grande image contain). */
.epv-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.epv-thumb-act{border-color:var(--acc)}
.epv-more{display:flex;align-items:center;justify-content:center;color:#cdd3e0;font:700 14px var(--font)}
.epv-empty{color:#8a90a0;font:500 12px var(--font);padding:8px}
/* Téléphone : pellicule des 2 séries au-dessus, grande image au centre, légende dessous. */
.epv-pellicule{display:flex;gap:14px;flex:none;overflow-x:auto;overscroll-behavior:contain;padding-bottom:2px;justify-content:center}
.epv-pell-group{display:flex;flex-direction:column;gap:4px;flex:none}
.epv-pell-lbl{color:#cdd3e0;font:700 10px var(--font);text-transform:uppercase;letter-spacing:.4px}
.epv-caption{color:#cdd3e0;font:600 12px var(--font);text-align:center;flex:none}

@media (max-width:1023px){
  /* Téléphone ET tablette (< 1024, §A.4) — parcours cartes une-pièce-à-la-fois + rail.
     Le modal EDL est plein écran : il doit passer AU-DESSUS de la barre de navigation
     du bas (nav.v4-bnav, z-index 999), sinon le rail du pouce se retrouve caché
     derrière elle. Plein écran = la nav n'a pas à rester visible. */
  #ov-edl{z-index:1001}
  /* Une pièce à l'écran à la fois (§4, §9 inv. 23) : les autres blocs sont retirés
     du flux, seul .edl-cur reste. La légende des états (1er enfant) reste visible. */
  #edl-pieces-section .edl-piece-block{display:none}
  #edl-pieces-section .edl-piece-block.edl-cur{display:block}
  /* Le rail REMPLACE le pied de page de bureau : autosave = plus de « Enregistrer »,
     et les deux boutons PDF vivent déjà sur chaque ligne de la liste des EDL (§4). */
  #ov-edl .m-foot{display:none !important}
  /* De la place sous la pièce pour que le rail ne masque jamais le dernier élément. */
  #ov-edl > .modal > div[style*="overflow-y"]{padding-bottom:80px !important}
  /* §2.4 (ex-P3 §7bis) : tout champ saisissable ≥ 16 px → iOS ne zoome plus à chaque
     focus. Sans maximum-scale (le pincement reste possible pour tous). Depuis le
     chantier EDL-TÉLÉPHONE, les règles de CARTE (nom d'élément, obs entrée/sortie,
     nom de pièce) sont elles-mêmes portées à 16 px À LA SOURCE — elles ne battent
     donc plus ce garde à 15/14 px. Ce garde reste la SOURCE UNIQUE pour les champs
     ADMINISTRATIFS (compteurs, clés, infos, thermique) qui n'ont pas de règle par
     champ : les retirer les ferait retomber sous 16 px (invariant §2.10 nº1). */
  #ov-edl input:not([type=checkbox]):not([type=radio]),
  #ov-edl textarea,
  #ov-edl select,
  #ov-edl .inp{font-size:16px !important}
}

/* Modale Bail (wizard) : zone de défilement plus haute pour limiter le
   scroll caché (étape 1 avec 2 garants + mandataire est dense). */
#ov-bail .m-body{max-height:78vh}
/* REFONTE PC/TABLETTE — reflow tablette ÉTROITE du formulaire bail : les paires de champs
   (.fg2) passent en 1 colonne sous 860px (évite des champs trop serrés) ; PC/tablette large
   ≥860 gardent 2 colonnes. Scopé au bail, disjoint du téléphone (≤767 a ses propres règles). */
@media (min-width:768px) and (max-width:859px){ #ov-bail .m-body .fg2{grid-template-columns:1fr} }

/* ── BAIL WIZARD BAR (étape 3 phase 2 — wizard 4 étapes) ──────────
   Remplace l'ancienne barre d'onglets par une barre de progression
   avec puces cliquables, séparateurs visuels, états visited / current /
   pending. Cohérent avec tokens v2 (var(--fg-info), var(--bor), --r).
   Compactée sur mobile (chiffres uniquement, libellés masqués). */
.bail-wizard-bar{
  display:flex;align-items:center;gap:6px;flex-wrap:wrap;
  padding:14px 4px 18px;border-bottom:1px solid var(--bor);
  margin-bottom:18px;
}
.ws-step{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 14px;border-radius:var(--r);
  background:transparent;border:1px solid transparent;
  color:var(--t2);font-size:13px;font-weight:500;
  cursor:pointer;transition:all .15s;font-family:inherit;
}
.ws-step:hover{background:var(--sur2);color:var(--t1)}
.ws-step.act{
  background:var(--bg-info);color:var(--fg-info);
  border-color:var(--fg-info);font-weight:600;
}
.ws-step.done .ws-num{color:var(--fg-success)}
.ws-step.done .ws-num::before{content:'✓ ';font-weight:700}
.ws-num{font-size:15px;font-weight:700;font-family:var(--display)}
.ws-label{white-space:nowrap}
.ws-sep{
  flex:1;max-width:24px;height:1.5px;
  background:var(--bor);border-radius:1px;
}
@media(max-width:767px){
  .bail-wizard-bar{padding:10px 0 14px;gap:2px}
  .ws-step{padding:6px 8px;gap:4px}
  /* Téléphone (conforme mockup BOOK-BAIL) : on ne masque plus tout — les étapes inactives
     restent des pastilles ①③, mais l'étape COURANTE affiche « Étape X/3 · <libellé> »
     (Personnes / Conditions / Récapitulatif). data-step porte le numéro (1..3). */
  .ws-label{display:none}
  .ws-step.act .ws-label{display:inline}
  .ws-step.act .ws-num{display:none}
  .ws-step.act::before{content:"Étape " attr(data-step) "/3 · ";font-weight:700}
  .ws-sep{max-width:12px}
}

/* ── EDL ──────────────────────────────────────────────────── */
.piece-card{background:var(--sur2);border:1px solid var(--bor);border-radius:var(--r);padding:14px;margin-bottom:9px}
.piece-card h4{font-size:13.5px;font-weight:700;margin-bottom:9px;color:var(--t1)}
.elem-row{display:flex;align-items:center;gap:9px;margin-bottom:7px;flex-wrap:wrap}

/* ── REGUL CARD ───────────────────────────────────────────── */
.regul-card{background:var(--sur);border:1px solid var(--bor);border-radius:var(--rl);padding:16px;position:relative;box-shadow:var(--shadow)}
.regul-card .rc-ref{font-weight:700;font-size:14px;color:var(--acc)}
.regul-card .rc-loc{font-size:12.5px;color:var(--t2)}
.regul-card .rc-amt{font-size:20px;font-weight:800;font-family:var(--display)}
.regul-card .rc-cb{position:absolute;top:14px;right:14px;width:17px;height:17px;cursor:pointer}

/* ── REGUL — tableau récap replié par immeuble (v15.x REFONTE-REGUL Phase A) ── */
.rg-wrap{overflow-x:auto}
.rg-table{width:100%}
.rg-table th,.rg-table td{vertical-align:middle}
.rg-table tr.rg-imm{cursor:pointer;background:var(--sur2)}
.rg-table tr.rg-imm:hover{background:var(--acc-bg)}
.rg-table tr.rg-imm td{font-weight:700;border-top:1px solid var(--bor)}
.rg-chev{display:inline-block;width:13px;color:var(--t3);transition:transform .15s;font-size:11px}
.rg-table tr.rg-imm.rg-open .rg-chev{transform:rotate(90deg)}
.rg-table tr.rg-log td:first-child{padding-left:30px}
.rg-logref{font-weight:600;color:var(--acc);cursor:pointer}
.rg-logref:hover{text-decoration:underline}
.rg-tag{display:inline-block;font-size:11px;padding:2px 8px;border-radius:6px;font-weight:700;white-space:nowrap}
/* Couleur du solde = son signe, comme sur téléphone (.rgph-tag) et dans les KPI : à demander (négatif) /
   à restituer (positif). Tokens charte uniquement. */
.rg-tag.dem{background:var(--neg-soft);color:var(--neg)}
.rg-tag.rest{background:var(--pos-soft);color:var(--pos)}
.rg-badge{font-size:10px;padding:1px 6px;border-radius:8px;background:var(--bor);color:var(--t2);vertical-align:middle}
/* Les actions (Détail · Clôturer · Envoyer · Décompte) et les en-têtes PEUVENT passer à la ligne : le
   tableau (largeur 100 %) ne les replie que si la place manque (tablette, PC étroit avec barre latérale)
   au lieu de déborder — sinon les montants du détail sortaient à droite (826 px pour 718 utiles à 768
   avant même l'ajout de « Détail »). Sur un écran large, tout reste sur une ligne. */
.rg-acts{white-space:normal;text-align:right}
.rg-acts .btn{margin:2px 0 2px 4px}
.rg-table>thead th{white-space:normal}
/* Ligne TOTAL : surface neutre de la charte (plus d'aplat bleu nuit codé en dur, illisible en sombre). */
.rg-table tr.rg-total td{background:var(--sur3);color:var(--t1);font-weight:800;font-size:14px;border:0;border-top:2px solid var(--bor)}
.rg-table tr.rg-total td.num{font-size:15px}
.rg-table tr.rg-total td.pos{color:var(--pos)}
.rg-table tr.rg-total td.neg{color:var(--neg)}
.rg-table tr.rg-det td{background:var(--sur2);padding:0}
.rg-det-in{padding:8px 14px 14px 30px}
.rg-det-h{font-size:11px;font-weight:700;color:var(--t2);text-transform:uppercase;letter-spacing:.4px;margin:8px 0 6px}
.rg-det-tbl{font-size:12.5px;background:var(--sur);border:1px solid var(--bor);border-radius:8px;overflow:hidden}
.rg-det-tbl tr.rg-det-sum td{font-weight:700;border-top:1px solid var(--bor)}
.rg-det-tbl tr.rg-det-solde td{font-weight:800}
/* bandeau « charges non réparties » (Phase B) */
.rg-trou-banner{background:var(--neg-soft);border:1px solid var(--neg);border-radius:10px;padding:11px 14px;margin-bottom:12px}
.rg-trou-h{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--neg)}
.rg-trou-banner summary{cursor:pointer;font-size:12px;color:var(--t2);margin-top:6px;font-weight:600}
.rg-trou-body{margin-top:4px}
.rg-trou-im{font-size:12px;margin-top:8px;font-weight:700;color:var(--t1)}
.rg-trou-l{font-size:11.5px;color:var(--t2);padding:2px 0 2px 14px}
/* badges validation (Phase C) */
.rg-badge-ok{font-size:10px;padding:2px 8px;border-radius:20px;font-weight:700;background:var(--pos-soft);color:var(--pos);vertical-align:middle;margin-left:6px;white-space:nowrap}
/* « À émettre / à valider » = une action attend → corail outline (doctrine .badge.acc), comme sur téléphone. */
.rg-badge-todo{font-size:10px;padding:2px 8px;border-radius:20px;font-weight:700;background:transparent;color:var(--acc);border:1px solid var(--acc);vertical-align:middle;margin-left:6px;white-space:nowrap}
/* vue globale immeuble (matrice) */
.rg-glob-h{display:flex;align-items:center;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.rg-glob-h b{font-size:15px}
.rg-back{background:none;border:0;color:var(--acc);font:inherit;font-weight:600;cursor:pointer;font-size:13px;padding:0}
.rg-mtx{border-collapse:separate;border-spacing:0;width:100%;font-size:12.5px}
.rg-mtx th,.rg-mtx td{text-align:right;white-space:nowrap;padding:9px 10px;border-bottom:1px solid var(--bor2)}
/* 1re colonne figée + libellé sur 2 lignes (v2 : libellés bancaires longs) */
.rg-mtx th.c0,.rg-mtx td.c0{position:sticky;left:0;z-index:2;text-align:left;background:var(--sur);border-right:1px solid var(--bor);min-width:184px;max-width:184px;white-space:normal}
.rg-mtx thead th{position:sticky;top:0;z-index:1;background:var(--sur2)}
.rg-mtx thead th.c0{z-index:3;background:var(--sur2)}
.rg-mtx thead th small{display:block;font-weight:400;color:var(--t3);font-size:10px;max-width:82px;overflow:hidden;text-overflow:ellipsis}
.rg-mtx-lib{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-weight:600;color:var(--t1);line-height:1.25;font-size:11.5px}
.rg-mtx td.c0 small{display:block;color:var(--t3);font-size:10px;font-weight:400;margin-top:2px}
.rg-mtx td.z,.rg-mtx .z{color:var(--t3)}
.rg-mtx td.col-tot,.rg-mtx th.col-tot{background:var(--sur2);font-weight:700}
.rg-mtx tbody tr.clk{cursor:pointer}
.rg-mtx tbody tr.rg-mv.clk:hover td{background:var(--acc-bg)}
.rg-mtx tbody tr.rg-mv.clk:hover td.c0{background:var(--acc-bg)}
.rg-mtx tr.trou td{background:var(--neg-soft)}
.rg-mtx tr.trou td.c0{background:var(--neg-soft)}
.rg-mtx tr.trou td.c0 .rg-mtx-lib{color:var(--neg)}
.rg-mtx tr.sumc td{font-weight:700;border-top:2px solid var(--bor);background:var(--sur2)}
.rg-mtx tr.sumc td.c0{background:var(--sur2)}
.rg-mtx tr.prov td{color:var(--t2)}
.rg-mtx tr.solde td{font-weight:800;border-top:2px solid var(--bor);background:var(--sur3);color:var(--t1)}
.rg-mtx tr.solde td.c0{background:var(--sur3);color:var(--t1)}
/* colonne « Bailleur (225) » — reste à charge = attente (--warn, charte) ; était un style inline. */
.rg-mtx .col-bail{color:var(--warn)}
/* en-tête de colonne-locataire = bouton → détail de ses factures (régression 25/09) */
.rg-colbtn{display:inline-flex;flex-direction:column;align-items:flex-end;justify-content:center;gap:1px;min-height:44px;font:inherit;font-weight:700;color:var(--t1);background:none;border:0;padding:0;cursor:pointer;text-align:right}
.rg-colbtn small{font-weight:400}
.rg-colbtn-l{display:inline-flex;align-items:center;gap:3px;font-size:10px;font-weight:700;color:var(--acc);margin-top:2px}
.rg-colbtn-l .uic{width:11px;height:11px}
.rg-colbtn:hover .rg-colbtn-l,.rg-colbtn:focus-visible .rg-colbtn-l{text-decoration:underline}
.rg-colbtn:focus-visible{outline:2px solid var(--acc);outline-offset:2px;border-radius:4px}
/* arrivée depuis la vue globale : la ligne de détail ciblée se signale un instant — barre d'accent,
   pas d'aplat corail (charte : corail = accent seulement) */
.rg-table tr.rg-flash>td{box-shadow:inset 3px 0 0 var(--acc)}
/* mobile : masquer les colonnes logements → liste (charge + total réparti) */
@media(max-width:560px){
  .rg-mtx th:not(.c0):not(.col-tot),.rg-mtx td:not(.c0):not(.col-tot){display:none}
  .rg-mtx th.c0,.rg-mtx td.c0{position:static;min-width:0;max-width:none}
}
.rg-glob-bail{margin:12px 0;padding:10px 14px;background:var(--warn-soft);border:1px solid var(--warn);border-radius:10px;font-size:12.5px;color:var(--warn)}
.rg-glob-foot{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:14px;padding-top:12px;border-top:1px solid var(--bor)}
/* panneau clôture locataire (REGUL-CLOTURE : estimation N-1 + règle 20%) */
.rgc-blk{margin-bottom:16px}
.rgc-t{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--t2);font-weight:700;margin-bottom:9px}
.rgc-est{display:flex;gap:8px;background:var(--info-soft);border:1px solid var(--bor2);border-radius:9px;padding:9px 12px;margin-bottom:10px;font-size:12px}
.rgc-l{display:flex;justify-content:space-between;align-items:baseline;padding:6px 0;font-size:13px;border-bottom:1px solid var(--bor2)}
.rgc-l span:first-child{color:var(--t2)}
.rgc-l.sub span:first-child{padding-left:14px;color:var(--t3);font-size:12px}
.rgc-l.tot{border-top:2px solid var(--bor);border-bottom:0;margin-top:4px;padding-top:9px}
.rgc-l.tot span:first-child{font-weight:700;color:var(--t1)}
.rgc-tag{display:inline-block;font-size:11px;padding:2px 9px;border-radius:6px;font-weight:700}
/* même convention que la liste (.rg-tag) et le téléphone : couleur du solde = son signe */
.rgc-tag.dem{background:var(--neg-soft);color:var(--neg)}
.rgc-tag.rest{background:var(--pos-soft);color:var(--pos)}
.rgc-dg{background:var(--warn-soft);border:1px solid var(--warn);border-radius:11px;padding:13px 15px}
.rgc-dgh{display:flex;align-items:center;gap:8px;font-weight:700;font-size:12.5px;color:var(--warn);margin-bottom:8px}
.rgc-dgr{display:flex;justify-content:space-between;padding:4px 0;font-size:12.5px}
.rgc-hi{background:var(--sur);border:1px dashed var(--warn);border-radius:8px;padding:9px 11px;margin-top:8px;font-size:12px;color:var(--t1)}
.rgc-hi b{color:var(--warn)}
.rgc-restit{border-top:1px dashed var(--bor);margin-top:8px;padding-top:8px;font-weight:600}
.rgc-legal{font-size:10.5px;color:var(--t3);margin-top:8px;font-style:italic}
.rgc-blk .mono,.rgc-dg .mono{font-family:var(--font);font-variant-numeric:tabular-nums}
/* DEPART-ESTIM : comparaison multi-années + liste décochable */
.rgc-chart{position:relative;display:flex;align-items:flex-end;gap:16px;height:96px;padding:0 4px;margin:4px 0 8px}
.rgc-bcol{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%}
.rgc-bar{width:100%;max-width:58px;border-radius:5px 5px 0 0;background:var(--bor2)}
.rgc-bar.hot{background:var(--acc)}
.rgc-bv{font-size:11px;font-weight:700;font-variant-numeric:tabular-nums;margin-bottom:4px}
.rgc-bl{font-size:10.5px;color:var(--t3);margin-top:5px}
.rgc-avg{position:absolute;left:4px;right:4px;border-top:1.5px dashed var(--t2);z-index:2}
.rgc-avgl{position:absolute;right:6px;font-size:10px;color:var(--t2);background:var(--sur);padding:0 4px;transform:translateY(-50%);z-index:3}
.rgc-spike{font-size:11.5px;color:var(--warn);background:var(--warn-soft);border-radius:8px;padding:7px 10px;margin-bottom:10px;line-height:1.4}
.rgc-mvh{font-size:11px;text-transform:uppercase;letter-spacing:.4px;color:var(--t3);margin:8px 0 4px}
.rgc-mv{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:6px 0;border-bottom:1px solid var(--bor2);font-size:12.5px}
.rgc-mvck{display:flex;align-items:center;gap:8px;min-width:0;cursor:pointer}
.rgc-mvck input{width:16px;height:16px;accent-color:var(--pos);flex:0 0 auto;cursor:pointer}
.rgc-mvl{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rgc-mvd{color:var(--t3);font-size:11px}
.rgc-mv.off .rgc-mvl,.rgc-mv.off .mono{color:var(--t3);text-decoration:line-through}
@media(max-width:560px){
  /* tableau → cartes sur téléphone (pattern data-label) */
  .rg-wrap{overflow-x:visible}
  .rg-table thead{display:none}
  .rg-table tbody{display:block}
  /* immeuble = barre repliable (nom + solde) */
  .rg-table tr.rg-imm{display:grid;grid-template-columns:1fr auto;align-items:center;gap:0 8px;padding:9px 10px;border-top:2px solid var(--bor)}
  .rg-table tr.rg-imm td{display:block;padding:0;border:0}
  .rg-table tr.rg-imm td:nth-child(2),.rg-table tr.rg-imm td:nth-child(3),.rg-table tr.rg-imm td:last-child{display:none}
  .rg-table tr.rg-imm td:nth-child(4){text-align:right;font-size:14px}
  /* logement = carte */
  .rg-table tr.rg-log{display:block;border:1px solid var(--bor);border-radius:10px;margin:8px 4px;padding:6px 11px;background:var(--sur)}
  .rg-table tr.rg-log td{display:flex;justify-content:space-between;align-items:center;padding:5px 0;border:0;text-align:right}
  .rg-table tr.rg-log td:first-child{display:block;text-align:left;padding:2px 0 7px;margin-bottom:3px;border-bottom:1px solid var(--bor)}
  .rg-table tr.rg-log td[data-l]::before{content:attr(data-l);color:var(--t3);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.3px}
  .rg-table tr.rg-log td.rg-acts{justify-content:flex-end;gap:6px}
  /* total = barre */
  .rg-table tr.rg-total{display:grid;grid-template-columns:1fr auto}
  .rg-table tr.rg-total td{display:block;border:0}
  .rg-table tr.rg-total td:nth-child(2),.rg-table tr.rg-total td:nth-child(3),.rg-table tr.rg-total td:last-child{display:none}
  .rg-table tr.rg-total td:nth-child(4){text-align:right}
  /* détail : table scrollable */
  .rg-table tr.rg-det td{display:block;padding:0}
  .rg-det-in{padding:8px 8px 12px 12px;overflow-x:auto}
}

/* ── SCROLLBAR ────────────────────────────────────────────── */
::-webkit-scrollbar{width:6px;height:6px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:var(--bor);border-radius:4px}
::-webkit-scrollbar-thumb:hover{background:var(--t3)}

/* ══════════════════════════════════════════════════════════════
   DASHBOARD — grille + widgets
   Grille : grid-auto-rows:72px · gap:12px
   Hauteur réelle d'un widget dw-rN = N×72 + (N-1)×12 px
   Flex interne : label | body (clip) | foot (toujours visible)
   ══════════════════════════════════════════════════════════════ */
#dash-kpi-grid{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  grid-auto-rows:60px;  /* v2 Phase 3 polish : compressé de 72 à 60 pour fit 1 écran */
  gap:10px;             /* v2 : gap 12 → 10 pour respirer sans gâcher l'espace */
}

/* Colonnes 1→12 */
.dw-c1{grid-column:span 1}.dw-c2{grid-column:span 2}.dw-c3{grid-column:span 3}
.dw-c4{grid-column:span 4}.dw-c5{grid-column:span 5}.dw-c6{grid-column:span 6}
.dw-c7{grid-column:span 7}.dw-c8{grid-column:span 8}.dw-c9{grid-column:span 9}
.dw-c10{grid-column:span 10}.dw-c11{grid-column:span 11}.dw-c12{grid-column:span 12}

/* Rangées — hauteur strictement définie par grid-row:span N
   v2 Phase 3 polish : grid-auto-rows passé de 72 à 60px + gap de 12 à 10 */
.dw-r1{grid-row:span 1}   /* 60px  */
.dw-r2{grid-row:span 2}   /* 130px */
.dw-r3{grid-row:span 3}   /* 200px */
.dw-r4{grid-row:span 4}   /* 270px */
.dw-r5{grid-row:span 5}   /* 340px */
.dw-r6{grid-row:span 6}   /* 410px */

/* ── Carte de base ── */
/* v2 : shadow-card plus discret. Accent statut via pseudo-élément ::before
   (plus fiable que border-left 3px + border-radius + overflow hidden qui
   pouvait clipper/masquer le liseré selon le navigateur/zoom).
   Retiré totalement en phase 6 (remplacé par la hiérarchie typo + donut). */
.dw{
  background:var(--sur);
  border:1px solid var(--bor);
  border-radius:var(--rl);
  padding:0;                            /* padding géré par .dw-body/.dw-foot */
  box-shadow:var(--shadow-card);
  overflow:hidden;
  position:relative;
  display:flex;
  flex-direction:column;
  transition:box-shadow var(--t-fast),transform var(--t-fast);
  box-sizing:border-box;
  --dw-accent:transparent;
}
.dw::before{
  content:'';
  position:absolute;left:0;top:0;bottom:0;
  width:3px;background:var(--dw-accent);
  pointer-events:none;z-index:1;
  transition:background var(--t-fast);
}
.dw:not(.dw-sep):hover{box-shadow:var(--shadow-hover)}

/* Zones internes */
.dw-body{
  flex:1;
  min-height:0;
  overflow:hidden;
  padding:14px 16px 8px;
}
.dw-foot{
  flex-shrink:0;
  padding:0 16px 10px;
  display:flex;
  justify-content:flex-end;
  align-items:center;
}

/* ── Signal statut — bordure gauche colorée ── */
.dw-s-red  { --dw-accent:var(--red) }
.dw-s-ora  { --dw-accent:var(--ora) }
.dw-s-grn  { --dw-accent:var(--grn) }
.dw-s-blu  { --dw-accent:var(--acc) }
/* En mode édition : on masque l'accent pour laisser la bordure dashed dominer */
[data-dash-edit="true"] .dw::before{display:none}

/* ── Typographie interne ── */
.dw-label{
  font-size:9.5px;font-weight:800;letter-spacing:.9px;
  text-transform:uppercase;color:var(--t3);margin-bottom:6px;
}
.dw-value{
  font-weight:800;line-height:1;letter-spacing:-.03em;
  font-family:var(--display);color:var(--t1);
  /* font-size injecté via style inline (_valSize) */
}
.dw-sub{font-size:11px;color:var(--t3);margin-top:4px;line-height:1.3}

/* ── Bouton "Voir tout" — lien discret, jamais coupé ── */
.dw-see-all{
  font-size:11px;font-weight:600;color:var(--acc);
  background:none;border:none;cursor:pointer;padding:0;
  font-family:inherit;letter-spacing:.2px;
  opacity:.75;transition:opacity .15s;
  display:inline-flex;align-items:center;gap:3px;
}
.dw-see-all:hover{opacity:1}
.dw-see-all::after{content:'›';font-size:13px;line-height:1;transition:transform .15s}
.dw-see-all:hover::after{transform:translateX(2px)}

/* ── Separator v2 — ligne horizontale propre + texte centré
   Occupe sa cellule grille normalement (pas de hack margin négatif).
   La compression du dashboard se fait via grid-auto-rows plus petit. ── */
.dw-sep{
  grid-column:1/-1;grid-row:span 1;
  background:transparent;box-shadow:none;
  border:none;border-radius:0;padding:0;
  display:flex;align-items:center;gap:0;
  overflow:visible;opacity:.75;
}
.dw-sep::before{display:none!important}  /* pas d'accent latéral sur un séparateur */
.dw-sep:hover{opacity:1}
.dw-sep-label{
  font-size:10px;font-weight:700;color:var(--t3);
  text-transform:uppercase;letter-spacing:2.5px;white-space:nowrap;
  padding:0 10px;
}
.dw-sep-line{flex:1;height:1px;background:var(--bor)}

/* ── Drag & resize ── */
.dw-dragging{opacity:.3;transform:scale(.97);transition:none!important}
.dw-drop-before{box-shadow:-4px 0 0 var(--acc),var(--shadow)!important;border-color:var(--acc)!important}
.dw-drop-after {box-shadow: 4px 0 0 var(--acc),var(--shadow)!important;border-color:var(--acc)!important}

.dw-edit{
  border:2px dashed rgba(255,90,60,.4)!important;border-left:2px dashed rgba(255,90,60,.4)!important;
  cursor:grab!important;
}
.dw-edit:active{cursor:grabbing!important}
.dw-edit:hover{border-color:rgba(255,90,60,.7)!important}
.dw-sep.dw-edit{border-top:2px dashed rgba(255,90,60,.35)!important;border-left:none!important;cursor:grab!important}

/* Poignée resize — coin bas-droit, hors du flux */
.dw-resize{
  position:absolute;bottom:4px;right:5px;
  width:18px;height:18px;
  display:flex;align-items:center;justify-content:center;
  font-size:11px;color:rgba(255,90,60,.4);
  cursor:se-resize;user-select:none;
  border-radius:4px;
  transition:color .15s,background .15s;z-index:10;
}
.dw-resize:hover{color:var(--acc);background:rgba(255,90,60,.1)}
.dw-drag-handle{
  position:absolute;top:8px;right:28px;
  font-size:13px;color:rgba(255,90,60,.35);
  cursor:grab;user-select:none;z-index:10;
  transition:color .15s;
}
.dw-drag-handle:hover{color:var(--acc)}

/* Edit mode overlay on dashboard */
[data-dash-edit="true"] #dash-kpi-grid{
  background-image:repeating-linear-gradient(
    90deg,transparent,transparent calc(8.333% - 10px),
    rgba(255,90,60,.05) calc(8.333% - 10px),rgba(255,90,60,.05) 8.333%
  );
  padding:8px;margin:-8px;border-radius:var(--rl);
}
/* Edit mode bar */
#dash-edit-bar{
  display:none;
  align-items:center;justify-content:space-between;
  padding:10px 16px;margin-bottom:14px;
  background:rgba(255,90,60,.07);
  border:1.5px dashed rgba(255,90,60,.28);
  border-radius:var(--r);gap:10px;flex-wrap:wrap;
}
[data-dash-edit="true"] #dash-edit-bar{display:flex}
[data-dash-edit="true"] #dash-btn-edit{
  background:rgba(255,90,60,.15);color:var(--acc);border-color:rgba(255,90,60,.35);
}
#dash-edit-badge{
  font-size:11px;font-weight:700;color:var(--acc);
  letter-spacing:.8px;text-transform:uppercase;
  background:rgba(255,90,60,.12);padding:3px 10px;border-radius:20px;
}

/* ══════════════════════════════════════════════════════════════
   DASHBOARD v2 — Context bar + Hero Pulse (cahier §3.1 & §3.2)
   ══════════════════════════════════════════════════════════════ */

/* ── Pill générique (entité active, période, delta) ── */
.dw-pill{
  display:inline-flex;align-items:center;gap:6px;
  padding:4px 11px;border-radius:20px;
  font-size:11px;font-weight:500;line-height:1;
  background:var(--sur2);border:1px solid var(--bor);color:var(--t2);
  white-space:nowrap;
}
.dw-pill-dot{
  width:6px;height:6px;border-radius:50%;background:var(--t3);display:inline-block;flex-shrink:0;
}
.dw-pill-dot.grn{background:var(--fg-success)}
.dw-pill-dot.red{background:var(--fg-danger)}
.dw-pill-dot.ora{background:var(--fg-warning)}
.dw-pill-dot.blu{background:var(--fg-info)}
.dw-pill.delta-up  {background:var(--bg-success);color:var(--fg-success);border-color:transparent}
.dw-pill.delta-down{background:var(--bg-danger); color:var(--fg-danger); border-color:transparent}

/* ── Context bar ── */
.dw-context-grid{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  width:100%;height:100%;flex-wrap:wrap;
}
.dw-context-left{display:flex;flex-direction:column;gap:2px;min-width:0}
.dw-context-date{font-size:12px;color:var(--t3);letter-spacing:.3px}
.dw-context-greet{font-size:18px;font-weight:500;color:var(--t1);line-height:1.15}
.dw-context-right{display:flex;align-items:center;gap:8px;flex-shrink:0;flex-wrap:wrap}

/* ── Hero Pulse ── */
.dw-hero-click{
  position:relative;display:block;
  cursor:pointer;border:none;background:none;padding:0;margin:0;width:100%;text-align:left;
  font:inherit;color:inherit;
}
.dw-hero-click:focus-visible{outline:2px solid var(--acc);outline-offset:2px;border-radius:var(--r)}
.dw-hero-grid{
  display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center;
  width:100%;
}
@media(max-width:768px){ .dw-hero-grid{grid-template-columns:1fr} .dw-hero-right{display:none} }
.dw-hero-left{display:flex;flex-direction:column;gap:6px;min-width:0}
.dw-hero-label{
  font-size:15px;color:var(--t3);letter-spacing:.4px;font-weight:500;
}
.dw-hero-value{
  font-family:var(--display);
  font-size:48px;font-weight:800;letter-spacing:-.02em;line-height:1;
  white-space:nowrap;
  /* P1 reskin : chiffre clé hero = corail accent (1 seul, cohérent avec le mockup Propryo) */
  color:var(--acc);
}
@media(max-width:900px){ .dw-hero-value{font-size:40px} }
@media(max-width:768px){ .dw-hero-value{font-size:34px} }
.dw-hero-delta{margin-top:2px}
.dw-hero-meta{
  font-size:12px;color:var(--t2);display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center;
  line-height:1.4;
}
.dw-hero-meta-sep{color:var(--t3);opacity:.6}
.dw-hero-meta strong{color:var(--t1);font-weight:600}
/* Ligne loyers impayés (Phase 4 polish) */
.dw-hero-impaye{
  flex-basis:100%;margin-top:6px;padding-top:6px;
  border-top:1px dashed var(--bor);
  display:flex;align-items:center;gap:8px;
  font-size:12px;color:var(--fg-danger);
}
.dw-hero-impaye strong{color:var(--fg-danger);font-weight:700}
.dw-hero-right{flex-shrink:0}
.dw-hero-spark{display:block;max-width:100%;height:auto}
/* Sparkline wrapper + axe tous-labels (cahier §3.2 — contexte temporel) */
.dw-spark-wrap{display:flex;flex-direction:column;gap:4px}
.dw-spark-axis{
  display:grid;grid-auto-flow:column;grid-auto-columns:1fr;
  font-size:10px;color:var(--t2);text-align:center;letter-spacing:.2px;
  line-height:1;padding:0 4px;
}
.dw-spark-axis span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dw-spark-label{fill:var(--t2)}
.dw-spark-pt:hover{opacity:1!important}
/* Flèche ↗ retirée — redondante avec curseur pointer + élévation hover.
   L'utilisateur n'y voyait pas de valeur ajoutée, la carte entière est
   cliquable et l'affordance visuelle est suffisante. */

/* ── Dark mode — overrides scopés v2 (contrast AA, cahier §7) ── */
[data-theme="dark"] .dw-hero-label,
[data-theme="dark"] .dw-context-date{
  color:#8ca3be;
}
[data-theme="dark"] .dw-hero-meta,
[data-theme="dark"] .dw-spark-axis,
[data-theme="dark"] .dw-spark-label{
  color:#b5c7de;
}
[data-theme="dark"] .dw-spark-label{fill:#b5c7de}
[data-theme="dark"] .dw-hero-meta strong{color:#eef4fb}
[data-theme="dark"] .dw-hero-meta-sep{color:#6b819a;opacity:.8}
[data-theme="dark"] .dw-context-greet{color:#eef4fb}
/* Pills : en dark, bg OPAQUE solide franchement plus clair que la carte */
[data-theme="dark"] .dw-pill{
  background:#3d547a;
  border:1.5px solid rgba(255,255,255,.3);
  color:#ffffff;
  font-weight:700;
}
/* Delta pills : bg sémantique opaque */
[data-theme="dark"] .dw-pill.delta-up{
  color:#bbf7d0;background:#166534;border-color:rgba(22,163,74,.5);
}
[data-theme="dark"] .dw-pill.delta-down{
  color:#fecaca;background:#991b1b;border-color:rgba(220,38,38,.5);
}

/* ── Sparkline — tooltip HTML instantané au survol d'un point ── */
.dw-spark-wrap{position:relative}
.dw-spark-tip{
  position:fixed;pointer-events:none;    /* fixed → échappe à tout overflow:hidden ancêtre */
  transform:translate(-50%,calc(-100% - 10px));
  background:#1a2332;color:#fff;
  font-size:12px;font-weight:600;line-height:1.3;
  padding:6px 11px;border-radius:6px;white-space:nowrap;
  opacity:0;transition:opacity var(--t-fast);
  z-index:9999;box-shadow:0 4px 14px rgba(0,0,0,.35);
}
.dw-spark-tip::after{
  content:'';position:absolute;left:50%;bottom:-4px;transform:translateX(-50%);
  width:0;height:0;border:4px solid transparent;border-top-color:#1a2332;border-bottom:0;
}
.dw-spark-tip.show{opacity:1}
[data-theme="dark"] .dw-spark-tip{background:#eef4fb;color:#0d1520}
[data-theme="dark"] .dw-spark-tip::after{border-top-color:#eef4fb}

/* ══════════════════════════════════════════════════════════════
   DASHBOARD v2 — KPI strip (cahier §3.3)
   4 cartes : Revenus · Charges · Occupation · Rendement — toutes cliquables
   ══════════════════════════════════════════════════════════════ */
.dw-kpi-click{
  position:relative;display:block;
  cursor:pointer;border:none;background:none;padding:0;margin:0;
  width:100%;height:100%;text-align:left;
  font:inherit;color:inherit;
}
.dw-kpi-click:focus-visible{outline:2px solid var(--acc);outline-offset:2px;border-radius:var(--r)}
.dw-kpi-label{
  font-size:14px;color:var(--t3);letter-spacing:.3px;font-weight:500;
  margin-bottom:5px;
}
.dw-kpi-value{
  font-family:var(--display);
  font-size:26px;font-weight:800;letter-spacing:-.02em;
  line-height:1.1;color:var(--t1);white-space:nowrap;
}
.dw-kpi-viz{margin-top:6px;min-height:22px}
.dw-kpi-delta{margin-top:4px}
.dw-kpi-arrow{
  position:absolute;top:-2px;right:-2px;
  font-size:13px;color:var(--t3);opacity:0;
  transition:opacity var(--t-fast),transform var(--t-fast);
  pointer-events:none;line-height:1;
}
.dw-kpi-click:hover .dw-kpi-arrow{opacity:1;transform:translate(2px,-2px)}
@media (hover:none){ .dw-kpi-arrow{opacity:.5} }
[data-dash-edit="true"] .dw-kpi-arrow{display:none}
/* Dark mode : labels plus lisibles */
[data-theme="dark"] .dw-kpi-label{color:#8ca3be}

/* Barre de progression (occupation) */
.dw-kpi-bar{
  height:5px;border-radius:3px;background:var(--bor);
  position:relative;overflow:hidden;
}
.dw-kpi-bar-fill{
  position:absolute;inset:0;width:var(--p,0%);border-radius:3px;
  background:var(--c,var(--acc));
  transition:width var(--t-normal);
}

/* ══════════════════════════════════════════════════════════════
   DASHBOARD v2 Phase 7 — Animations apparition + skeleton loading
   (cahier §4.6 animations, §5.5 loading states)
   ══════════════════════════════════════════════════════════════ */
@keyframes dw-fade-in-up{
  from{opacity:0;transform:translateY(8px)}
  to{opacity:1;transform:none}
}
.dw-animated{
  animation:dw-fade-in-up 260ms cubic-bezier(.4,0,.2,1) both;
  animation-delay:calc(var(--i,0) * 40ms);
}
/* Respect prefers-reduced-motion — accessibilité (cahier §7) */
@media (prefers-reduced-motion: reduce){
  .dw-animated{animation:none!important}
  .dw-skeleton-block::before{animation:none!important}
  *{transition-duration:.01ms!important;animation-duration:.01ms!important}
}

/* Skeleton shimmer — remplace "Chargement..." par des blocs animés */
@keyframes dw-shimmer{
  0%{background-position:200% 0}
  100%{background-position:-200% 0}
}
.dw-skeleton-block{
  position:relative;overflow:hidden;
  background:var(--sur2);border-radius:var(--r);
  min-height:40px;
}
.dw-skeleton-block::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(90deg,
    transparent 0%,
    rgba(255,255,255,.06) 30%,
    rgba(255,255,255,.14) 50%,
    rgba(255,255,255,.06) 70%,
    transparent 100%);
  background-size:200% 100%;
  animation:dw-shimmer 1.4s ease-in-out infinite;
}
[data-theme="light"] .dw-skeleton-block::before,
:root:not([data-theme="dark"]) .dw-skeleton-block::before{
  background:linear-gradient(90deg,
    transparent 0%,
    rgba(0,0,0,.04) 30%,
    rgba(0,0,0,.08) 50%,
    rgba(0,0,0,.04) 70%,
    transparent 100%);
  background-size:200% 100%;
}
.dw-skeleton-lines{display:flex;flex-direction:column;gap:8px;padding:14px 16px}
.dw-skeleton-line{
  height:10px;background:var(--sur3);border-radius:5px;
  position:relative;overflow:hidden;
}
.dw-skeleton-line::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.08),transparent);
  background-size:200% 100%;
  animation:dw-shimmer 1.4s ease-in-out infinite;
}
.dw-skeleton-line.w-60{width:60%}
.dw-skeleton-line.w-40{width:40%}
.dw-skeleton-line.w-80{width:80%}
.dw-skeleton-line.tall{height:40px}

/* ══════════════════════════════════════════════════════════════
   DASHBOARD v2 Phase 7 — Migration banner (cahier §8.4)
   ══════════════════════════════════════════════════════════════ */
.dash-migration-banner{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:14px 18px;margin-bottom:14px;flex-wrap:wrap;
  background:linear-gradient(90deg,var(--bg-info) 0%,var(--sur) 100%);
  border:1px solid var(--fg-info);border-radius:var(--rl);
  box-shadow:var(--shadow-card);
}
.dash-migration-body{display:flex;align-items:center;gap:14px;flex:1;min-width:240px}
.dash-migration-icon{font-size:26px;flex-shrink:0}
.dash-migration-title{font-size:14px;font-weight:600;color:var(--t1);margin-bottom:3px}
.dash-migration-sub{font-size:12px;color:var(--t2);line-height:1.4}
.dash-migration-actions{display:flex;gap:8px;flex-shrink:0}
@media(max-width:600px){
  .dash-migration-actions{width:100%}
  .dash-migration-actions .btn{flex:1}
}

/* ══════════════════════════════════════════════════════════════
   DASHBOARD v2 Phase 7 — Empty state / Onboarding
   ══════════════════════════════════════════════════════════════ */
.dash-onboarding{
  grid-column:1/-1;
  max-width:720px;margin:40px auto;
  padding:40px 32px;
  background:var(--sur);border:1px solid var(--bor);
  border-radius:var(--rl);box-shadow:var(--shadow-card);
  text-align:center;
}
.dash-onboarding-hero{margin-bottom:32px}
.dash-onboarding-icon{font-size:56px;line-height:1;margin-bottom:16px}
.dash-onboarding-title{
  font-family:var(--display);
  font-size:28px;font-weight:600;letter-spacing:-.02em;
  color:var(--t1);margin-bottom:10px;
}
.dash-onboarding-sub{
  font-size:14px;color:var(--t2);line-height:1.5;
  max-width:520px;margin:0 auto;
}
.dash-onboarding-steps{
  display:flex;flex-direction:column;gap:14px;
  max-width:560px;margin:0 auto;text-align:left;
}
.dash-onboarding-step{
  display:flex;align-items:flex-start;gap:16px;
  padding:16px 18px;
  background:var(--sur2);border:1px solid var(--bor);
  border-radius:var(--r);
  transition:all var(--t-fast);
}
.dash-onboarding-step:hover{
  border-color:var(--fg-info);
  box-shadow:var(--shadow-card-hover);
}
.dash-onboarding-step.done{opacity:.6}
.dash-onboarding-step.done .step-num{
  background:var(--bg-success);color:var(--fg-success);
}
.dash-onboarding-step .step-num{
  width:32px;height:32px;border-radius:50%;
  background:var(--bg-info);color:var(--fg-info);
  display:flex;align-items:center;justify-content:center;
  font-weight:700;font-size:14px;flex-shrink:0;
}
.dash-onboarding-step .step-body{flex:1;min-width:0}
.dash-onboarding-step .step-title{
  font-size:15px;font-weight:600;color:var(--t1);margin-bottom:3px;
}
.dash-onboarding-step .step-desc{
  font-size:12px;color:var(--t2);margin-bottom:10px;
}
.dash-onboarding-step .step-check{
  color:var(--fg-success);font-size:13px;font-weight:600;
}
.dash-onboarding-step .btn{margin:0}
@media(max-width:600px){
  .dash-onboarding{padding:24px 18px;margin:20px auto}
  .dash-onboarding-title{font-size:22px}
  .dash-onboarding-icon{font-size:44px}
  .dash-onboarding-step{flex-direction:column;gap:8px}
}

/* ══════════════════════════════════════════════════════════════
   DASHBOARD v2 Phase 6 — Cartes entité / immeuble / logement cliquables
   (cahier §3.8 : simple clic partout, progressive disclosure, drill 4 niveaux)
   ══════════════════════════════════════════════════════════════ */
.dw-ent-card{
  cursor:pointer;
  transition:transform var(--t-fast), box-shadow var(--t-fast), border-color var(--t-fast);
}
.dw-ent-card:hover{
  transform:translateY(-1px);
  box-shadow:var(--shadow-card-hover);
  border-color:rgba(255,90,60,.4);
}
.dw-ent-card:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.dw-imm-bulle{
  cursor:pointer;
  transition:transform var(--t-fast), box-shadow var(--t-fast), border-color var(--t-fast);
}
.dw-imm-bulle:hover{
  transform:translateY(-1px);
  box-shadow:0 3px 10px rgba(255,90,60,.15);
  border-color:rgba(255,90,60,.4)!important;
}
.dw-log-mini{
  cursor:pointer;
  transition:transform var(--t-fast), box-shadow var(--t-fast), border-color var(--t-fast);
}
.dw-log-mini:hover{
  transform:translateY(-1px);
  box-shadow:0 2px 6px rgba(255,90,60,.15);
  border-color:rgba(255,90,60,.4)!important;
}
.dw-ent-toggle{
  background:var(--sur2);border:1px solid var(--bor);border-radius:16px;
  padding:4px 12px;font-size:11px;font-weight:600;color:var(--t2);
  cursor:pointer;transition:all var(--t-fast);white-space:nowrap;
}
.dw-ent-toggle:hover{
  background:var(--sur3);color:var(--t1);border-color:var(--fg-info);
}
.dw-ent-collapsed-imms{display:flex;flex-direction:column;gap:5px;margin-top:8px}
.dw-ent-collapsed-imm{
  display:flex;justify-content:space-between;align-items:center;gap:10px;
  padding:8px 12px;background:var(--sur2);
  border:1px solid var(--bor);border-radius:var(--r);
  font-size:12px;cursor:pointer;transition:all var(--t-fast);
}
.dw-ent-collapsed-imm:hover{background:var(--sur3);border-color:rgba(255,90,60,.4)}
.dw-ent-collapsed-imm-name{
  font-weight:500;color:var(--t1);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
/* Modale ov-ent-detail — scope chip + bouton parent (cahier §3.8.7) */
.ov-ent-scope-wrap{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ov-ent-scope-chip{
  display:inline-flex;align-items:center;padding:3px 10px;border-radius:20px;
  font-size:11px;font-weight:700;letter-spacing:.3px;
  background:var(--bg-info);color:var(--fg-info);white-space:nowrap;
}
.ov-ent-scope-chip.scope-immeuble{background:var(--bg-warning);color:var(--fg-warning)}
.ov-ent-scope-chip.scope-logement{background:var(--bg-success);color:var(--fg-success)}
.ov-ent-parent-btn{
  background:transparent;border:1px solid var(--bor);border-radius:16px;
  padding:3px 10px;font-size:11px;color:var(--t2);cursor:pointer;
  transition:all var(--t-fast);font-weight:500;
  max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.ov-ent-parent-btn:hover{background:var(--sur2);color:var(--t1);border-color:var(--fg-info)}

/* ══════════════════════════════════════════════════════════════
   DASHBOARD v2 Phase 5 — Charts enrichis dans les drill-downs
   ══════════════════════════════════════════════════════════════ */
.drill-chart{
  padding:14px 16px;background:var(--sur2);border-radius:var(--r);
  border:1px solid var(--bor);margin-bottom:18px;
}
.drill-chart-title{
  font-size:12px;color:var(--t3);letter-spacing:.3px;text-transform:uppercase;
  margin-bottom:8px;font-weight:600;
}
.drill-chart-wrap{position:relative;margin:0 -4px}
.drill-chart-svg{display:block;overflow:visible;max-width:100%}
.drill-chart-meta{
  font-size:12px;color:var(--t2);margin-top:10px;padding-top:8px;
  border-top:1px dashed var(--bor);display:flex;gap:16px;flex-wrap:wrap;
}
.drill-chart-meta strong{color:var(--t1);font-weight:600}
.drill-chart-legend{
  display:flex;gap:14px;flex-wrap:wrap;margin-top:10px;
  font-size:12px;color:var(--t2);
}
.drill-chart-legend-item{display:inline-flex;align-items:center;gap:6px}
.drill-chart-legend-swatch{
  width:12px;height:3px;border-radius:2px;flex-shrink:0;
}

/* ══════════════════════════════════════════════════════════════
   DASHBOARD v2 Phase 4 polish — "À traiter" en 4 quadrants
   (refonte user : 4 catégories cliquables vers onglets métier)
   ══════════════════════════════════════════════════════════════ */
.dw-todo-head{
  display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;
}
.dw-todo-title{font-size:14px;font-weight:600;color:var(--t1);letter-spacing:-.01em}
.dw-todo-count{
  font-size:11px;font-weight:700;padding:3px 9px;border-radius:20px;
  background:var(--bg-success);color:var(--fg-success);white-space:nowrap;
}
.dw-todo-count.red{background:var(--bg-danger);color:var(--fg-danger)}
.dw-todo-count.ora{background:var(--bg-warning);color:var(--fg-warning)}
.dw-todo-count.info{background:var(--bg-info);color:var(--fg-info)}

/* Grille 2×2 des 4 catégories (MRH · IRL · Équipement · Régul) */
.dw-todo-quads{
  display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:1fr;gap:8px;
  min-height:0;flex:1;
}
.dw-todo-quad{
  display:flex;flex-direction:column;justify-content:space-between;
  padding:10px 12px;border-radius:var(--r);
  background:var(--sur2);border:1px solid var(--bor);
  cursor:pointer;min-width:0;min-height:0;
  transition:transform var(--t-fast),box-shadow var(--t-fast),border-color var(--t-fast);
}
.dw-todo-quad:hover{transform:translateY(-1px);box-shadow:var(--shadow-card-hover)}
.dw-todo-quad.red   {border-color:var(--fg-danger);  background:var(--bg-danger)}
.dw-todo-quad.ora   {border-color:var(--fg-warning); background:var(--bg-warning)}
.dw-todo-quad.info  {border-color:var(--fg-info);    background:var(--bg-info)}
.dw-todo-quad.grn   {border-color:var(--fg-success); background:var(--bg-success)}
.dw-todo-quad-top{display:flex;align-items:center;justify-content:space-between;gap:6px}
.dw-todo-quad-label{
  font-size:11px;color:var(--t2);font-weight:700;letter-spacing:.4px;text-transform:uppercase;
  display:flex;align-items:center;gap:5px;min-width:0;
}
.dw-todo-quad-label span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dw-todo-quad.red .dw-todo-quad-label{color:var(--fg-danger)}
.dw-todo-quad.ora .dw-todo-quad-label{color:var(--fg-warning)}
.dw-todo-quad.info .dw-todo-quad-label{color:var(--fg-info)}
.dw-todo-quad.grn .dw-todo-quad-label{color:var(--fg-success)}
.dw-todo-quad-count{
  font-family:var(--display);font-size:26px;font-weight:800;line-height:1;letter-spacing:-.02em;
  color:var(--t1);
}
.dw-todo-quad.red .dw-todo-quad-count{color:var(--fg-danger)}
.dw-todo-quad.ora .dw-todo-quad-count{color:var(--fg-warning)}
.dw-todo-quad.info .dw-todo-quad-count{color:var(--fg-info)}
.dw-todo-quad.grn .dw-todo-quad-count{color:var(--fg-success)}
.dw-todo-quad-sub{
  font-size:10px;color:var(--t3);line-height:1.25;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.dw-todo-empty-full{
  display:flex;align-items:center;justify-content:center;gap:10px;
  padding:16px;flex:1;
  background:var(--bg-success);border-radius:var(--r);
  color:var(--fg-success);font-size:13px;font-weight:500;text-align:center;
}
.dw-todo-empty-full::before{content:'\2713';font-size:22px;font-weight:700}

/* Legacy list styles (drill modal) */
.dw-todo-list{display:flex;flex-direction:column;gap:6px;min-width:0}
.dw-todo-item{
  display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:var(--r);
  background:transparent;border:1px solid transparent;
  cursor:pointer;transition:background var(--t-fast);
}
.dw-todo-item:hover{background:var(--sur2);border-color:var(--bor)}
.dw-todo-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;background:var(--fg-info)}
.dw-todo-dot.red{background:var(--fg-danger)}
.dw-todo-dot.ora{background:var(--fg-warning)}
.dw-todo-dot.info{background:var(--fg-info)}
.dw-todo-body{flex:1;min-width:0;overflow:hidden}
.dw-todo-itemtitle{font-size:13px;font-weight:500;color:var(--t1);line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dw-todo-sub{font-size:11px;color:var(--t2);line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dw-todo-arrow{color:var(--t3);font-size:13px;flex-shrink:0;opacity:0;transition:opacity var(--t-fast)}
.dw-todo-item:hover .dw-todo-arrow{opacity:1}

/* Liste à barres horizontales — charges par catégorie (layout col 3 row 2 ≤108px)
   Compact : grid [name | bar | %], on drop le montant (visible dans drill). */
.dw-cat-list{
  display:flex;flex-direction:column;gap:5px;margin-top:6px;
}
.dw-cat-row{
  display:grid;grid-template-columns:minmax(0,1.2fr) minmax(40px,1.5fr) auto;
  gap:8px;align-items:center;font-size:12px;color:var(--t1);line-height:1.2;
}
.dw-cat-name{
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  font-weight:500;
}
.dw-cat-bar{
  position:relative;height:6px;background:var(--bor);border-radius:3px;overflow:hidden;
}
.dw-cat-bar-fill{
  position:absolute;inset:0 auto 0 0;border-radius:3px;
  transition:width var(--t-normal);
}
.dw-cat-pct{font-size:11px;color:var(--t2);font-weight:600;min-width:28px;text-align:right}
/* Total affiché sous la liste, compact */
.dw-cat-total{
  font-size:11px;color:var(--t3);margin-top:6px;padding-top:5px;
  border-top:1px dashed var(--bor);display:flex;justify-content:space-between;
}
.dw-cat-total strong{color:var(--t1);font-weight:600}

/* Flux KPI (Revenus vs Charges fusionnés — cahier §3.3 modifié user)
   Layout horizontal : valeurs à gauche, sparkline à droite (gain vertical). */
.dw-flux-grid{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(140px,auto);
  gap:14px;align-items:center;margin-top:2px;
}
.dw-flux-left{display:flex;flex-direction:column;gap:4px;min-width:0}
.dw-flux-right{min-width:0;max-width:100%}
.dw-flux-values{
  display:flex;gap:20px;align-items:flex-end;flex-wrap:wrap;
}
.dw-flux-values > div{min-width:0}
@media(max-width:700px){
  .dw-flux-grid{grid-template-columns:1fr}
  .dw-flux-right{display:none}  /* sparkline cachée en petit viewport */
}
.dw-flux-sublabel{
  font-size:13px;color:var(--t3);letter-spacing:.3px;margin-bottom:2px;
  text-transform:none;
}
.dw-flux-value{
  font-family:var(--display);
  font-size:26px;font-weight:800;letter-spacing:-.02em;line-height:1;
  white-space:nowrap;
}
.dw-flux-net{
  font-size:13px;color:var(--t2);margin-top:4px;
}
.dw-flux-net strong{color:var(--t1);font-weight:600}
[data-theme="dark"] .dw-flux-sublabel{color:#8ca3be}
@media(max-width:480px){
  .dw-flux-value{font-size:18px}
  .dw-flux-values{gap:14px}
}

/* Responsive KPI strip (cahier §3.3)
   Les 4 cartes c3 occupent 3 de 12 cols = 4/row par défaut.
   Sur tablette (≤900 px) : 2 par ligne via span 6.
   Sur mobile (≤768) : la grille devient 4 cols, c3 = 75% → 1/row naturellement.
   Sur très petit (≤480) : pleine largeur. */
@media(max-width:900px) and (min-width:769px){
  .dw-c3{grid-column:span 6}
}
@media(max-width:480px){
  .dw-c3{grid-column:1/-1}
  .dw-kpi-value{font-size:20px}
}

/* ── AGENDA ───────────────────────────────────────────────── */
.agenda-list{display:flex;flex-direction:column;gap:8px}
.agenda-card{
  background:var(--sur);border:1px solid var(--bor);border-radius:var(--rl);
  padding:13px 16px;cursor:pointer;transition:box-shadow .15s,transform .15s;
  box-shadow:var(--shadow);
}
.agenda-card:hover{box-shadow:var(--shadow-hover);transform:translateY(-1px)}
.agenda-done{opacity:.55}
.agenda-card-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:6px}
/* v15.62x REFONTE-PC Agenda — type en encre neutre (plus de couleur par type) ; corail = action à réaliser */
.agenda-cat-badge{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;padding:2px 9px;border-radius:20px;white-space:nowrap;background:var(--sur2);color:var(--t2)}
.agenda-cat-badge svg{width:13px;height:13px}
.agenda-card.agenda-todo{border-left:3px solid var(--acc)}
.agenda-card-actions{margin-left:auto;display:flex;gap:6px;flex-shrink:0;flex-wrap:wrap;justify-content:flex-end}
.agenda-act{padding:6px 10px;border-radius:6px;font-size:11.5px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:5px;white-space:nowrap;border:1px solid var(--bor);background:var(--sur);color:var(--t1);min-height:34px}
.agenda-act svg{width:14px;height:14px}
.agenda-act-done{border-color:var(--acc);color:var(--acc)}
.agenda-act-done:hover{background:var(--acc);color:#fff}
.agenda-act-del:hover{background:var(--red);color:#fff;border-color:var(--red)}
.agenda-card-title{font-size:14px;font-weight:600;color:var(--t1);margin-bottom:5px}
.agenda-card-meta{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12px;color:var(--t2)}
/* Calendrier */
.agenda-cal-wrap{border-radius:var(--rl);border:1px solid var(--bor);overflow:hidden;box-shadow:var(--shadow)}
.agenda-cal-header{display:grid;grid-template-columns:repeat(7,1fr);background:var(--sur2);border-bottom:1px solid var(--bor)}
.agenda-cal-header div{text-align:center;padding:9px 4px;font-size:11.5px;font-weight:700;color:var(--t2);text-transform:uppercase;letter-spacing:.5px}
.agenda-cal-grid-days{display:grid;grid-template-columns:repeat(7,1fr)}
.agenda-cal-day{
  min-height:90px;padding:7px 5px;border-right:1px solid var(--bor2);border-bottom:1px solid var(--bor2);
  cursor:pointer;transition:background .15s;background:var(--sur);overflow:hidden;
}
.agenda-cal-day:hover{background:var(--sur2)}
.agenda-cal-empty{background:var(--sur2);opacity:.5}
.agenda-cal-today{background:var(--acc-bg)!important}
.agenda-cal-day-num{font-size:12.5px;font-weight:600;color:var(--t2);display:block;margin-bottom:4px}
.agenda-cal-day-num.today{
  width:22px;height:22px;border-radius:50%;background:var(--acc);color:#fff;
  display:inline-flex;align-items:center;justify-content:center;font-size:11.5px;
}
.agenda-cal-evt{
  display:flex;align-items:center;gap:3px;
  font-size:10px;font-weight:600;padding:1px 4px;border-radius:3px;
  margin-bottom:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  background:var(--sur2);color:var(--t1);border-left:2px solid var(--t3);
}
.agenda-cal-evt svg{width:11px;height:11px;flex-shrink:0}
/* v15.62x REFONTE-PC — pastille : charte uniquement. corail = à réaliser · rouge = en retard · atténué = fait */
.agenda-cal-evt.todo{border-left-color:var(--acc)}
.agenda-cal-evt.retard{border-left-color:var(--neg);color:var(--neg);background:var(--neg-soft,var(--sur2))}
.agenda-cal-evt.done{opacity:.5;border-left-color:var(--bor2)}
/* Tablette 768–1023 : le calendrier 7 colonnes est rigide → densité réduite pour tenir sans écraser */
@media (min-width:768px) and (max-width:1023px){
  .agenda-cal-day{min-height:66px;padding:5px 4px}
  .agenda-cal-evt{font-size:9px;padding:1px 3px}
  .agenda-cal-header div{font-size:10px;padding:6px 2px}
}

/* ══════════════════════════════════════════════════════════════
   RESPONSIVE — refactor v2 Phase 7 (mobile-first friendly)
   Cible : iPhone SE (375) → Pro Max (430), Android 360-428,
   iPad mini (768) → Pro (1024), desktop (>1280).
   Cahier §6 breakpoints : 1280 / 1024 / 768 / 480.
   Portrait et landscape géré via largeur uniquement.
   ══════════════════════════════════════════════════════════════ */

/* Laptop / tablet-landscape 1025-1280 : sidebar compacte */
@media(min-width:769px) and (max-width:1280px){
  :root{--sb:220px}
  .g4{grid-template-columns:1fr 1fr}
  /* Hero col 8 → col 12 (prend toute la largeur, todo passe dessous) */
  .dw-c8{grid-column:span 12}
  .dw-c4{grid-column:span 12}
}

/* Tablet portrait / phone landscape 769-1024 : widgets plus compacts */
@media(max-width:1024px) and (min-width:769px){
  .dw-c6{grid-column:span 12}   /* flux full width */
  .dw-c7{grid-column:span 12}
  .dw-c5{grid-column:span 6}
  .dw-c3{grid-column:span 6}    /* KPIs 2 par ligne (déjà fait avant mais renforcé) */
}

/* Phone ≤ 768 : tout en pleine largeur (1 colonne) */
@media(max-width:768px){
  .sb-nav{position:fixed;top:0;left:0;height:100%;transform:translateX(-100%);width:var(--sb)!important;transition:transform .25s;z-index:2000}
  /* v15.141 — !important + z-index élevé pour défaire toute règle/CSS cache concurrente
     (sidebar restait masquée derrière le backdrop sur certains devices). translate3d pour
     forcer une couche de compositing (évite les bugs de paint iOS Safari). */
  .sb-nav.open{transform:translate3d(0,0,0)!important;z-index:2000!important}
  .sb-collapse-btn{display:none}
  .tb-menu{display:block}
  /* MOBILE-REFONTE — marque Propryo visible à gauche du titre de page (toutes pages téléphone) */
  .tb-brand{display:inline-flex;align-items:center;flex:0 0 auto;margin-right:2px}
  /* MOBILE-REFONTE — logo par page : Accueil montre « Propryo » et masque le titre « Accueil » ;
     les autres pages montrent le titre de page (et pas le wordmark). */
  .tb.tb-home .tb-brand-word{display:inline}
  .tb.tb-home #tb-title{display:none}
  /* MOBILE-REFONTE — barre du haut plus basse (retour Didier : on gagne de la place).
     Surcharge la règle desktop `body[data-dash-v4="on"] .tb{min-height:54px}`. */
  body[data-dash-v4="on"] .tb{min-height:46px !important;padding-left:12px}
  .tb{padding-left:12px}
  #tb-title{font-size:15px}
  /* chip périmètre — à droite de la barre du haut, cliquable */
  .tb-perim{display:inline-flex;align-items:center;gap:5px;margin-left:auto;max-width:44%;
    background:var(--sur2);border:1px solid var(--bor);border-radius:999px;padding:5px 9px;
    font:600 12px/1 'Inter',sans-serif;color:var(--t2);cursor:pointer}
  .tb-perim svg{width:13px;height:13px;stroke:var(--t3);fill:none;flex:0 0 auto}
  .tb-perim #tb-perim-lbl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .tb-perim .tb-perim-chev{width:11px;height:11px;opacity:.6}
  /* v15.140 BUG-MOBILE-MENU-PLUS — Backdrop derrière la sidebar overlay (entre bottom nav 999 et sidebar 2000) */
  #sb-backdrop.open{display:block;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:1900;animation:sbbd-in .2s ease}
  @keyframes sbbd-in{from{opacity:0}to{opacity:1}}
  /* v15.144 MOBILE-AUDIT — Affordance de scroll horizontal sur les tables larges (Pilotage,
     Loyers…). Ombres aux bords G/D qui apparaissent/disparaissent selon la position de scroll
     (technique pure CSS background-attachment local+scroll). Signale qu'on peut faire défiler.
     EDL/IRL exclus automatiquement (leurs règles .tbl-wrap, + spécifiques, remettent background). */
  .tbl-wrap{
    background:
      linear-gradient(to right, var(--sur), rgba(0,0,0,0)) left center / 28px 100% no-repeat,
      linear-gradient(to left, var(--sur), rgba(0,0,0,0)) right center / 28px 100% no-repeat,
      radial-gradient(farthest-side at 0 50%, var(--tbl-edge), rgba(0,0,0,0)) left center / 14px 100% no-repeat,
      radial-gradient(farthest-side at 100% 50%, var(--tbl-edge), rgba(0,0,0,0)) right center / 14px 100% no-repeat,
      var(--sur);
    background-attachment: local, local, scroll, scroll, local;
  }
  /* v15.150 MOBILE-AUDIT — minmax(0,1fr) au lieu de 1fr : évite le « grid blowout » (1fr =
     minmax(auto,1fr) → un enfant non sécable, ex. bouton à long libellé, élargit la colonne
     au-delà du conteneur et la carte dépasse de l'écran). minmax(0,…) force la colonne à la
     largeur du conteneur, le contenu s'adapte/s'enroule à l'intérieur. */
  .g2,.g3,.g4{grid-template-columns:minmax(0,1fr)}
  .fg2,.fg3{grid-template-columns:minmax(0,1fr)}
  .pc{padding:14px 10px}
  .ov{padding:16px 8px}
  .modal,.modal.lg,.modal.xl{max-width:100%;width:100%}
  /* Dashboard grid : garde 12 cols mais force tous les widgets col>2 en pleine largeur */
  #dash-kpi-grid{grid-template-columns:repeat(12,1fr);gap:8px}
  .dw-c2,.dw-c3,.dw-c4,.dw-c5,.dw-c6,.dw-c7,.dw-c8,.dw-c9,.dw-c10,.dw-c11{
    grid-column:1 / -1 !important;
  }
  /* Context bar empilée verticalement (pills sous date+greeting) */
  .dw-context-grid{flex-direction:column;align-items:flex-start;gap:8px}
  .dw-context-right{flex-wrap:wrap}
  /* Drive FAB mobile : badge email caché, FAB compact */
  #drive-user-badge{display:none!important}
  #drive-fab{padding:4px 8px;font-size:10px}
  /* v13.41 : sur mobile, le FAB expiré garde sa visibilité (pas raccourci) */
  #drive-fab.drive-fab-expired{padding:5px 10px;font-size:10.5px}
  /* Barre top mobile : titre à gauche, espace pour FAB à droite */
  .tb{padding-right:100px;}
  /* Modale drill : plein écran, plus de scroll horizontal */
  #ov-dash-drill .modal{max-width:100%!important;width:100%}
  /* Tableaux drill : scroll horizontal si besoin */
  .m-body .tbl{font-size:12px}
  .drill-chart{padding:10px 8px}
}

/* Small phone ≤ 480 : tight spacing + reduced hero */
@media(max-width:480px){
  .dw-body{padding:12px 14px 6px}
  .dw-kpi-value{font-size:20px}
  .dw-flux-value{font-size:22px}
  .dw-hero-value{font-size:30px}
  .dw-kpi-label,.dw-hero-label{font-size:12px}
  /* À traiter 4 quadrants : compactés (label en 2 lignes max) */
  .dw-todo-quad{padding:8px 10px;min-height:0}
  .dw-todo-quad-label{font-size:10px;letter-spacing:.2px}
  .dw-todo-quad-count{font-size:22px}
  .dw-todo-quad-sub{font-size:9px}
  /* Context bar : un peu plus serrée */
  .dw-context-date{font-size:11px}
  .dw-context-greet{font-size:16px}
  /* Sélecteurs : plein largeur chacun */
  .filters .inp, #p-dashboard select.inp{flex:1 1 auto;min-width:130px}
}

/* ───────────────────────────────────────────────────────────
   v14.95 MOBILE-AUDIT-ONGLETS Phase 3+4 (Sprint 3H)
   Règles génériques mobile pour finaliser l'audit Phase 1+2 (anti-zoom iOS,
   refonte EDL livré v14.11/12). Cible : touch targets 44px partout, formes
   plein écran sur mobile, scroll-margin pour anchors, espacement vertical
   pouce. Source : BACKLOG MOBILE-AUDIT-ONGLETS Phase 3+4.
   ─────────────────────────────────────────────────────────── */
@media (max-width: 767px) {
  /* Touch targets 44×44 px minimum (WCAG 2.1 AAA + Apple HIG) */
  button, .btn, a.btn, input[type="button"], input[type="submit"],
  select.inp, .bien-card-menu, .agenda-list button {
    min-height: 44px;
  }
  .btn.bs, .btn.bb {
    min-height: 36px; /* "small button" reste 36 mais touch zone via padding */
    padding-top: 10px;
    padding-bottom: 10px;
  }

  /* Forms : inputs ≥ 16px pour empêcher zoom auto iOS Safari (renforce v14.11) */
  input[type="text"], input[type="number"], input[type="email"],
  input[type="tel"], input[type="date"], input[type="password"],
  input[type="search"], textarea, select {
    font-size: 16px;
    min-height: 44px;
  }
  /* Sauf les textarea multilignes qui peuvent rester plus serrés */
  textarea[rows] {
    min-height: auto;
  }

  /* Modales : plein écran mobile (100dvh pour s'adapter aux barres iOS dynamiques) */
  .modal, .ov, .overlay-content, [class*="overlay"] > .card {
    min-height: 100dvh;
    max-height: 100dvh;
    padding-bottom: env(safe-area-inset-bottom, 0);
  }
  /* m-foot sticky pour boutons toujours accessibles */
  .m-foot {
    position: sticky;
    bottom: 0;
    background: var(--sur);
    border-top: 1px solid var(--bor);
    padding: 12px;
    z-index: 10;
    box-shadow: 0 -2px 8px rgba(0,0,0,.08);
  }

  /* MOBILE-REFONTE M-16 : un overlay plein écran ouvert (.ov:not(.hidden)) masque la
     bottom-nav (#v4-bnav z:999) — sinon elle occulte le pied d'action collant (CTA). */
  body:has(.ov:not(.hidden)) #v4-bnav { display: none !important; }

  /* MOBILE-REFONTE Bail : pied à 2 boutons conforme mockup BOOK-BAIL — ghost « Précédent »
     + primaire « Suivant » (ou « Enregistrer »). Sur téléphone, « Annuler » est retiré :
     la fermeture reste possible via le ✕ de l'en-tête. Le pied desktop garde ses 4 boutons. */
  #ov-bail .m-foot #bail-cancel-btn { display: none; }
  #ov-bail .m-foot { justify-content: stretch; }
  #ov-bail .m-foot .btn { flex: 1 1 0; min-height: 44px; justify-content: center; }
  #ov-bail .m-foot .btn.bp { flex: 1.4 1 0; }

  /* MOBILE-REFONTE lot 7 (Quittance) : l'aperçu (iframe 72vh en dur) remplit la hauteur
     dispo — sinon bande sombre sous le document. TÉLÉPHONE UNIQUEMENT (≤767) : la
     tablette (768-1023) garde son rendu d'origine (invariant refonte). */
  #ov-quit-preview > .modal { display: flex; flex-direction: column; min-height: 100dvh; }
  #ov-quit-preview > .modal > .m-body { flex: 1 1 auto; display: flex; flex-direction: column; min-height: 0; max-height: none; padding: 0; }
  #ov-quit-preview-iframe { flex: 1 1 auto; height: auto !important; min-height: 0; }

  /* Scroll-margin pour anchors : évite que le header sticky masque la cible */
  .page > .card, .page > section, [id^="ov-"] {
    scroll-margin-top: 60px;
  }

  /* Espacement vertical pour zone de pouce confortable */
  .flex-c, .filters {
    gap: 10px;
  }
  .card + .card {
    margin-top: 12px;
  }

  /* Tableaux scrollables horizontalement (préserve la lecture sur mobile) */
  .tbl-wrap {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* Wizard Bail mobile : étapes empilées + boutons next/prev sticky */
  .bail-wizard-step, .wizard-content {
    padding: 12px;
  }
  .bail-wizard-nav, .wizard-nav {
    position: sticky;
    bottom: 0;
    background: var(--sur);
    padding: 10px;
    border-top: 1px solid var(--bor);
  }

  /* Form Logement / Immeuble / IRL : labels au-dessus inputs (pas en grid 2 cols) */
  form.form-grid, .form-2col {
    grid-template-columns: 1fr !important;
  }
  form label {
    display: block;
    margin-bottom: 4px;
    font-size: 13px;
  }

  /* Toast : largeur max + position centrée bas */
  #toast {
    left: 12px !important;
    right: 12px !important;
    bottom: 12px !important;
    width: auto !important;
    max-width: none !important;
  }
}

/* ──── Très petits écrans 320-480 px ──── */
@media (max-width: 480px) {
  .ct, h2, .page-title {
    font-size: 18px;
  }
  .kpi-tile, .dw-todo-quad {
    padding: 8px 10px;
  }
  /* Sidebar fermée par défaut : utiliser le burger menu */
  .sb {
    transform: translateX(-100%);
    transition: transform .25s ease;
  }
  .sb.open {
    transform: translateX(0);
  }
}

/* ──── Dark mode respect partout ──── */
@media (prefers-color-scheme: dark) {
  .m-foot { background: var(--sur); }
  #toast { background: var(--sur2); }
}

/* ═══════════════════════════════════════════════════════════════════════
   v15.22 Phase B — Refonte 3 modes dashboard + responsive 3 breakpoints
   ═══════════════════════════════════════════════════════════════════════ */

/* ── Mode Patrimoine : focus sur dash-ent-cards (vue parc temps réel) ── */
/* Tous les widgets KPI sont cachés via DASH_TAB_PRESETS preset 'patrimoine'.
   Le widget dash-ent-cards prend la place visuelle principale. */
#p-dashboard.dash-mode-patrimoine #dash-kpi-grid {
  margin-bottom: 4px;
}
#p-dashboard.dash-mode-patrimoine #dash-ent-cards {
  margin-top: 4px;
}
/* Section "Alertes & Actions" masquée en mode patrimoine (focus pur sur cards) */
#p-dashboard.dash-mode-patrimoine #dash-alerts,
#p-dashboard.dash-mode-patrimoine > .flex-b.mb9 {
  display: none;
}
/* Améliore les mini-cards logement pour scan visuel rapide (mode patrimoine) */
#p-dashboard.dash-mode-patrimoine .dw-log-mini {
  transition: transform 0.12s, box-shadow 0.12s, border-color 0.12s;
  cursor: pointer;
}
#p-dashboard.dash-mode-patrimoine .dw-log-mini:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-card-hover);
}

/* ── Tabs persona dashboard : style consolidé ── */
#p-dashboard > .tabs[role="tablist"] {
  gap: 4px;
}
#p-dashboard > .tabs[role="tablist"] .tab {
  transition: all var(--t-fast);
}

/* ═══════════════════════════════════════════════════════════════════════
   v15.28 Phase B — Widget HERO v2 (refonte mockup : 3 blocs côte-à-côte)
   Active quand DB.params.dashRenderV === 'v2'
   ═══════════════════════════════════════════════════════════════════════ */
.hero-v2 {
  display: block;
  width: 100%;
  text-align: left;
  background: none;
  border: none;
  padding: 0;
  margin: 0;
  cursor: pointer;
  position: relative;
  font: inherit;
  color: inherit;
}
.hero-v2:focus-visible {
  outline: 2px solid var(--acc);
  outline-offset: 2px;
  border-radius: var(--r);
}
.hero-v2-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 14px;
  width: 100%;
}
.hero-v2 .hero-blk {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 2px 4px 2px 14px;
  position: relative;
}
.hero-v2 .hero-blk:first-child {
  padding-left: 4px;
}
.hero-v2 .hero-blk + .hero-blk::before {
  content: '';
  position: absolute;
  left: 0;
  top: 6px;
  bottom: 6px;
  width: 1px;
  background: var(--bor);
}
.hero-v2 .hero-label {
  font-size: 11px;
  letter-spacing: 0.6px;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--t3);
  margin-bottom: 4px;
}
.hero-v2 .hero-value {
  font-family: var(--display);
  font-size: 28px;
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.05;
  color: var(--t1);
  white-space: nowrap;
}
.hero-v2 .hero-value.pos {
  color: var(--fg-success);
}
.hero-v2 .hero-value.neg {
  color: var(--fg-danger);
}
.hero-v2 .hero-sub {
  font-size: 12px;
  color: var(--t2);
  margin-top: 2px;
}
.hero-v2 .hero-spark-wrap {
  margin-top: 8px;
  max-width: 100%;
  overflow: hidden;
}
.hero-v2 .hero-impaye-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: var(--bg-danger);
  border: 1px solid rgba(220, 38, 38, 0.35);
  color: var(--fg-danger);
  padding: 5px 10px;
  border-radius: 6px;
  font-size: 11px;
  font-weight: 600;
  margin-top: 8px;
  cursor: pointer;
  width: fit-content;
  transition: all var(--t-fast);
}
.hero-v2 .hero-impaye-pill:hover {
  background: rgba(220, 38, 38, 0.18);
  transform: translateX(2px);
}
.hero-v2 .hero-impaye-pill strong {
  font-weight: 700;
}
.hero-v2 .hero-detail {
  display: flex;
  gap: 14px;
  margin-top: 8px;
  font-size: 11px;
  color: var(--t2);
}
.hero-v2 .hero-detail .hero-detail-l {
  text-transform: uppercase;
  font-size: 10px;
  letter-spacing: 0.4px;
  color: var(--t3);
  font-weight: 600;
}
.hero-v2 .hero-detail strong {
  font-weight: 700;
  font-size: 13px;
  margin-left: 4px;
}
.hero-v2 .hero-detail strong.pos {
  color: var(--fg-success);
}
.hero-v2 .hero-detail strong.neg {
  color: var(--fg-danger);
}
.hero-v2-drill-ind {
  position: absolute;
  top: 6px;
  right: 6px;
  width: 22px;
  height: 22px;
  border-radius: 5px;
  background: var(--sur2);
  color: var(--t3);
  font-size: 12px;
  font-weight: 700;
  display: grid;
  place-items: center;
  transition: all var(--t-fast);
}
.hero-v2:hover .hero-v2-drill-ind {
  background: var(--acc);
  color: #fff;
}

/* ═══════════════════════════════════════════════════════════════════════
   v15.31 Phase B — Widget TODO-UNIFIED v2 (liste priorisée)
   ═══════════════════════════════════════════════════════════════════════ */
.todo-v2 {
  display: flex;
  flex-direction: column;
  gap: 8px;
  height: 100%;
  cursor: pointer;
  outline: none;
  position: relative;
}
.todo-v2:focus-visible {
  outline: 2px solid var(--acc);
  outline-offset: 2px;
  border-radius: var(--r);
}
.todo-v2-head {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.todo-v2-title {
  font-size: 11px;
  letter-spacing: 0.6px;
  font-weight: 700;
  text-transform: uppercase;
  color: var(--t3);
}
.todo-v2-count {
  font-family: var(--display);
  font-size: 17px;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1;
  padding: 2px 9px;
  border-radius: 12px;
  min-width: 28px;
  text-align: center;
}
.todo-v2-count.red { background: var(--bg-danger); color: var(--fg-danger); }
.todo-v2-count.ora { background: var(--bg-warning); color: var(--fg-warning); }
.todo-v2-count.info { background: var(--bg-info); color: var(--fg-info); }
.todo-v2-count.grn { background: var(--bg-success); color: var(--fg-success); }
.todo-v2-drill-ind {
  margin-left: auto;
  width: 22px;
  height: 22px;
  border-radius: 5px;
  background: var(--sur2);
  color: var(--t3);
  font-size: 12px;
  font-weight: 700;
  display: grid;
  place-items: center;
  transition: all var(--t-fast);
}
.todo-v2:hover .todo-v2-drill-ind {
  background: var(--acc);
  color: #fff;
}
/* v15.34 — Vue lignes compactes par THÈME (utilisée par _todoV2 actuel) */
.todo-v2-rows {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
  overflow: hidden;
}
.todo-v2-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 8px;
  background: var(--sur2);
  border: 1px solid var(--bor);
  cursor: pointer;
  transition: all var(--t-fast);
  text-align: left;
  font: inherit;
  color: inherit;
  width: 100%;
}
.todo-v2-row:hover {
  background: var(--sur3, var(--sur2));
  border-color: var(--acc);
  transform: translateX(2px);
}
.todo-v2-row:focus-visible {
  outline: 2px solid var(--acc);
  outline-offset: 1px;
}
.todo-v2-row-icon {
  font-size: 18px;
  flex-shrink: 0;
  width: 24px;
  text-align: center;
}
.todo-v2-row-label {
  flex: 1;
  font-size: 13px;
  font-weight: 600;
  color: var(--t1);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.todo-v2-row-count {
  font-family: var(--display);
  font-size: 13px;
  font-weight: 800;
  padding: 2px 9px;
  border-radius: 12px;
  min-width: 28px;
  text-align: center;
  flex-shrink: 0;
}
.todo-v2-row-count.red { background: var(--bg-danger); color: var(--fg-danger); }
.todo-v2-row-count.ora { background: var(--bg-warning); color: var(--fg-warning); }
.todo-v2-row-count.info { background: var(--bg-info); color: var(--fg-info); }
.todo-v2-row-arrow {
  color: var(--t3);
  font-size: 16px;
  font-weight: 700;
  flex-shrink: 0;
  transition: all var(--t-fast);
}
.todo-v2-row:hover .todo-v2-row-arrow {
  color: var(--acc);
  transform: translateX(2px);
}
.todo-v2-hint {
  font-size: 10.5px;
  color: var(--t3);
  font-style: italic;
  text-align: center;
  padding: 6px 0 2px;
  border-top: 1px dashed var(--bor);
  margin-top: 6px;
}

/* v15.33 — Vue carrés (grille) par THÈME, style v1 amélioré (non utilisé actuellement) */
.todo-v2-cards {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: 8px;
  flex: 1;
  align-content: start;
}
.todo-v2-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 12px 8px 10px;
  border-radius: 10px;
  background: var(--sur2);
  border: 1.5px solid var(--bor);
  cursor: pointer;
  transition: all var(--t-fast);
  text-align: center;
  font: inherit;
  color: inherit;
  min-height: 110px;
  position: relative;
}
.todo-v2-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-card-hover);
}
.todo-v2-card:focus-visible {
  outline: 2px solid var(--acc);
  outline-offset: 1px;
}
/* Bordure colorée selon sévérité (style v1 carrés mais avec accent visible) */
.todo-v2-card.red {
  border-color: var(--fg-danger);
  background: linear-gradient(180deg, var(--bg-danger) 0%, var(--sur2) 60%);
}
.todo-v2-card.ora {
  border-color: var(--fg-warning);
  background: linear-gradient(180deg, var(--bg-warning) 0%, var(--sur2) 60%);
}
.todo-v2-card.info {
  border-color: var(--fg-info);
  background: linear-gradient(180deg, var(--bg-info) 0%, var(--sur2) 60%);
}
.todo-v2-card-icon {
  font-size: 22px;
  line-height: 1;
}
.todo-v2-card-label {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.3px;
  color: var(--t2);
  text-transform: uppercase;
  margin-top: 2px;
}
.todo-v2-card-count {
  font-family: var(--display);
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1;
  margin-top: 2px;
  color: var(--t1);
}
.todo-v2-card.red .todo-v2-card-count { color: var(--fg-danger); }
.todo-v2-card.ora .todo-v2-card-count { color: var(--fg-warning); }
.todo-v2-card.info .todo-v2-card-count { color: var(--fg-info); }
.todo-v2-card-sub {
  font-size: 10px;
  color: var(--t3);
  font-style: italic;
}
.todo-v2-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1;
  font-size: 12.5px;
  color: var(--fg-success);
  font-weight: 600;
}

/* Responsive todo-v2 — sur mobile, cartes plus grandes */
@media (max-width: 767px) {
  .todo-v2-cards { grid-template-columns: repeat(2, 1fr); }
  .todo-v2-card { min-height: 96px; padding: 10px 6px 8px; }
  .todo-v2-card-icon { font-size: 20px; }
  .todo-v2-card-count { font-size: 24px; }
}
@media (max-width: 380px) {
  .todo-v2-cards { grid-template-columns: 1fr; }
}

/* Responsive hero v2 */
@media (max-width: 900px) {
  .hero-v2-grid { gap: 10px; }
  .hero-v2 .hero-value { font-size: 24px; }
}

/* ═══════════════════════════════════════════════════════════════════════
   v15.34 Phase B Sprint 1 — Bandeau "Priorisation Avril 2026" (top dashboard)
   Affiché uniquement si DB.params.dashRenderV === 'v2'
   ═══════════════════════════════════════════════════════════════════════ */
.dash-top-bandeau-wrap { width: 100%; }
.dash-top-bandeau-wrap:empty { display: none; }
.dash-prio-bandeau {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 16px 18px;
  background: linear-gradient(120deg, var(--sur, var(--sur2)), var(--sur2));
  border: 1px solid var(--bor);
  border-radius: 14px;
  margin-bottom: 14px;
  position: relative;
  overflow: hidden;
}
.dash-prio-bandeau::before {
  content: '';
  position: absolute;
  top: -30%;
  right: -10%;
  width: 280px;
  height: 280px;
  background: radial-gradient(circle, var(--warn, var(--fg-warning)) 0%, transparent 70%);
  opacity: 0.08;
  pointer-events: none;
}
.dash-prio-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  position: relative;
  z-index: 1;
}
.dash-prio-headtxt {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.dash-prio-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: var(--warn, var(--fg-warning));
}
.dash-prio-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--warn, var(--fg-warning));
  display: inline-block;
  box-shadow: 0 0 8px var(--warn, var(--fg-warning));
}
.dash-prio-title {
  font-family: var(--display);
  font-size: 22px;
  font-weight: 800;
  color: var(--t1);
  letter-spacing: -0.02em;
}
.dash-prio-empty .dash-prio-eyebrow {
  color: var(--fg-success);
}
.dash-prio-empty .dash-prio-dot {
  background: var(--fg-success);
  box-shadow: 0 0 8px var(--fg-success);
}
.dash-prio-sub {
  font-size: 13px;
  color: var(--t2);
}
.dash-prio-cta {
  flex-shrink: 0;
  background: var(--warn, var(--fg-warning));
  color: #1a1a1a;
  border: none;
  padding: 10px 18px;
  border-radius: 10px;
  font-family: inherit;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.5px;
  cursor: pointer;
  transition: all var(--t-fast);
  white-space: nowrap;
}
.dash-prio-cta:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 16px rgba(251, 176, 64, 0.35);
}
.dash-prio-cta:active {
  transform: translateY(0);
}
.dash-prio-cards {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 10px;
  position: relative;
  z-index: 1;
}
.dash-prio-card {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 10px 12px;
  background: var(--sur2);
  border: 1px solid var(--bor);
  border-radius: 10px;
  cursor: pointer;
  transition: all var(--t-fast);
  text-align: left;
  font: inherit;
  color: inherit;
}
.dash-prio-card:hover {
  border-color: var(--warn, var(--fg-warning));
  transform: translateY(-1px);
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.06);
}
.dash-prio-card:focus-visible {
  outline: 2px solid var(--acc);
  outline-offset: 2px;
}
.dash-prio-card-num {
  flex-shrink: 0;
  width: 26px;
  height: 26px;
  border-radius: 8px;
  background: var(--bg-warning);
  color: var(--warn, var(--fg-warning));
  display: grid;
  place-items: center;
  font-family: var(--display);
  font-weight: 800;
  font-size: 13px;
}
.dash-prio-card-body {
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 1;
  min-width: 0;
}
.dash-prio-card-title {
  font-size: 13px;
  font-weight: 700;
  color: var(--t1);
  overflow: hidden;
  text-overflow: ellipsis;
  /* v15.36 CP1 — retiré white-space:nowrap : titre peut faire 2 lignes en tablette/mobile sans tronquage agressif */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  line-clamp: 2;
}
.dash-prio-card-sub {
  font-size: 11px;
  color: var(--t3);
  overflow: hidden;
  text-overflow: ellipsis;
  /* v15.36 CP1 — line-clamp 2 lignes max (au lieu de nowrap qui tronquait dès 1 mot) */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  line-clamp: 2;
}
.dash-prio-card-arrow {
  flex-shrink: 0;
  color: var(--t3);
  font-size: 16px;
  font-weight: 700;
  transition: all var(--t-fast);
}
.dash-prio-card:hover .dash-prio-card-arrow {
  color: var(--warn, var(--fg-warning));
  transform: translateX(2px);
}
.dash-prio-more {
  background: transparent;
  border: 1px dashed var(--bor);
  color: var(--t3);
  font-size: 12px;
  font-weight: 600;
  border-radius: 10px;
  cursor: pointer;
  padding: 0 14px;
  font-family: inherit;
  transition: all var(--t-fast);
}
.dash-prio-more:hover {
  border-color: var(--warn, var(--fg-warning));
  color: var(--warn, var(--fg-warning));
}

/* Responsive Bandeau Priorisation */
@media (max-width: 900px) {
  .dash-prio-cards { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) {
  .dash-prio-cards { grid-template-columns: 1fr; }
  .dash-prio-title { font-size: 18px; }
  .dash-prio-head { flex-direction: column; align-items: flex-start; }
  .dash-prio-cta { align-self: stretch; }
}

/* ═══════════════════════════════════════════════════════════════════════
   v15.36 DASH-REFONTE-GLOBALE-V4 CP2 — Cockpit Hero V4 Stripe narrative
   Remplace .cockpit-v2 (jauge SVG 220×220) par format narrative :
   eyebrow + titre + delta vs mois-1 + barre progress + 4 satellites.
   Les classes .cockpit-v2 / .cockpit-gauge restent en CSS (orphelines, inertes).
   ═══════════════════════════════════════════════════════════════════════ */
.cockpit-v4 {
  display: block;
  width: 100%;
  padding: 18px 22px 16px;
  background: var(--sur);
  border: 1px solid var(--bor);
  border-radius: 14px;
  cursor: pointer;
  position: relative;
  font: inherit;
  color: inherit;
  text-align: left;
  transition: all var(--t-fast);
}
.cockpit-v4:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-card-hover, 0 4px 18px rgba(0,0,0,.18));
  border-color: var(--acc, var(--fg-info));
}
.cockpit-v4:focus-visible {
  outline: 2px solid var(--acc);
  outline-offset: 2px;
}
.cv4-eyebrow {
  font-size: 10.5px;
  font-weight: 700;
  color: var(--t3);
  text-transform: uppercase;
  letter-spacing: 0.14em;
  margin-bottom: 10px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
}
.cv4-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--cta, var(--fg-success));
  display: inline-block;
  box-shadow: 0 0 8px var(--cta, var(--fg-success));
}
.cv4-title {
  font-family: var(--display);
  font-size: 23px;
  font-weight: 700;
  color: var(--t2);
  letter-spacing: -0.02em;
  margin-bottom: 5px;
  line-height: 1.25;
}
.cv4-title strong { color: var(--t1); font-weight: 800; }
.cv4-pct { font-weight: 800; }
.cv4-pct.pos { color: var(--fg-success); }
.cv4-pct.warn { color: var(--fg-warning); }
.cv4-pct.neg { color: var(--fg-danger); }
.cv4-delta {
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 14px;
}
.cv4-delta.pos { color: var(--fg-success); }
.cv4-delta.neg { color: var(--fg-danger); }
.cv4-delta.neu { color: var(--t3); font-style: italic; }
.cv4-progress {
  width: 100%;
  height: 6px;
  background: var(--sur3, rgba(255,255,255,.06));
  border-radius: 3px;
  overflow: hidden;
  margin-bottom: 16px;
}
.cv4-progress-fill {
  height: 100%;
  border-radius: 3px;
  transition: width .8s cubic-bezier(.4,0,.2,1);
}
.cv4-progress-fill.pos {
  background: linear-gradient(90deg, var(--fg-success), var(--cta, var(--fg-success)));
}
.cv4-progress-fill.warn {
  background: linear-gradient(90deg, var(--fg-warning), var(--cta, var(--fg-success)));
}
.cv4-progress-fill.neg {
  background: linear-gradient(90deg, var(--fg-danger), var(--fg-warning));
}
.cv4-sats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}
.cv4-sat {
  background: var(--sur2);
  border: 1px solid var(--bor);
  border-radius: 10px;
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.cv4-sat-lbl {
  font-size: 9.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--t3);
}
.cv4-sat-val {
  font-family: var(--display);
  font-size: 20px;
  font-weight: 800;
  color: var(--t1);
  letter-spacing: -0.02em;
  line-height: 1.1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cv4-sat-val.pos { color: var(--fg-success); }
.cv4-sat-val.neg { color: var(--fg-danger); }
.cv4-sat-delta {
  font-size: 10.5px;
  font-weight: 600;
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cv4-sat-delta.pos { color: var(--fg-success); }
.cv4-sat-delta.neg { color: var(--fg-danger); }
.cv4-sat-delta.warn { color: var(--fg-warning); }
.cv4-sat-delta.neu { color: var(--t3); font-style: italic; font-weight: 500; }
.cv4-drill {
  position: absolute;
  top: 14px;
  right: 16px;
  width: 22px;
  height: 22px;
  border-radius: 6px;
  background: var(--sur2);
  color: var(--t3);
  font-size: 13px;
  font-weight: 700;
  display: grid;
  place-items: center;
  transition: all var(--t-fast);
}
.cockpit-v4:hover .cv4-drill {
  background: var(--acc, var(--fg-info));
  color: #fff;
}
@media (max-width: 1024px) {
  .cv4-sats { grid-template-columns: repeat(2, 1fr); }
  .cv4-title { font-size: 20px; }
}
@media (max-width: 500px) {
  .cv4-sats { grid-template-columns: 1fr 1fr; gap: 8px; }
  .cv4-title { font-size: 17px; }
  .cv4-sat-val { font-size: 17px; }
  .cockpit-v4 { padding: 14px 14px 12px; }
}

/* ═══════════════════════════════════════════════════════════════════════
   v15.36 DASH-REFONTE-GLOBALE-V4 CP3 — KPI Bloomberg : eyebrow + valeur
   grosse + delta avec flèche couleur + mini-sparkline inline.
   ═══════════════════════════════════════════════════════════════════════ */
.bb-eyebrow {
  font-family: var(--mono);
  font-size: 9.5px;
  font-weight: 700;
  color: var(--t3);
  text-transform: uppercase;
  letter-spacing: 0.14em;
  display: flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 8px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* P2 reskin : pastille icône neutre dans les cartes KPI (mockup Propryo) */
.bb-icon-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 7px;
  background: var(--sur2);
  color: var(--t2);
  flex-shrink: 0;
  border: 1px solid var(--bor);
}
.bb-icon-pill svg { width: 13px; height: 13px; display: block; flex-shrink: 0; }
[data-theme="dark"] .bb-icon-pill {
  background: rgba(255,255,255,.09);
  color: var(--t2);
  border-color: rgba(255,255,255,.12);
}
/* texte de l'eyebrow en petites capitales après la pastille */
.bb-eyebrow .bb-eyebrow-txt {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.bb-card .dw-kpi-label { /* surcharge label legacy → cache (eyebrow le remplace) */
  display: none;
}
.bb-card .dw-kpi-value {
  font-family: var(--display);
  font-size: 24px;
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.1;
}
.bb-delta {
  font-family: inherit;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .01em;
}
.bb-delta.pos { color: var(--fg-success); }
.bb-delta.neg { color: var(--fg-danger); }
.bb-delta.warn { color: var(--fg-warning); }
.bb-delta.neu { color: var(--t3); font-style: italic; font-weight: 500; }
.bb-sub {
  font-size: 11px;
  color: var(--t3);
  margin-top: 3px;
  line-height: 1.35;
}
.bb-spark {
  margin-top: auto;
  padding-top: 6px;
  width: 100%;
}
.bb-spark svg { display: block; width: 100%; height: 30px; }

/* ═══════════════════════════════════════════════════════════════════════
   v15.33 Phase B Étape A — Widget HERO COCKPIT (jauge + 4 satellites)
   ⚠ ORPHELIN depuis v15.36 CP2 (remplacé par .cockpit-v4) — conservé pour
   compat (mais aucun rendu ne l'utilise plus). À supprimer en V3-VISUEL.
   ═══════════════════════════════════════════════════════════════════════ */
.cockpit-v2 {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 18px;
  align-items: center;
  width: 100%;
  padding: 14px 16px;
  background: var(--sur);
  border: 1px solid var(--bor);
  border-radius: 14px;
  cursor: pointer;
  position: relative;
  overflow: hidden;
  font: inherit;
  color: inherit;
  text-align: left;
  transition: all var(--t-fast);
}
.cockpit-v2:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-card-hover);
  border-color: var(--acc);
}
.cockpit-v2:focus-visible {
  outline: 2px solid var(--acc);
  outline-offset: 2px;
}
.cockpit-glow {
  position: absolute;
  top: -50%;
  right: -30%;
  width: 320px;
  height: 320px;
  background: radial-gradient(circle, var(--cta, var(--fg-success)) 0%, transparent 70%);
  opacity: 0.08;
  pointer-events: none;
}
.cockpit-gauge {
  position: relative;
  width: 220px;
  height: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.cockpit-gauge svg {
  transform: rotate(-90deg);
}
.cockpit-gauge-fill {
  transition: stroke-dashoffset 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}
.cockpit-gauge-text {
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.cockpit-gauge-pct {
  font-family: var(--display);
  font-size: 48px;
  font-weight: 800;
  color: var(--t1);
  letter-spacing: -0.04em;
  line-height: 1;
}
.cockpit-gauge-pct small {
  font-size: 24px;
  font-weight: 700;
}
.cockpit-gauge-lbl {
  font-size: 11px;
  font-weight: 600;
  color: var(--t3);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-top: 4px;
}
.cockpit-body {
  position: relative;
  z-index: 1;
}
.cockpit-eyebrow {
  font-size: 11px;
  font-weight: 700;
  color: var(--t3);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 4px;
}
.cockpit-title {
  font-size: 17px;
  font-weight: 800;
  color: var(--t1);
  letter-spacing: -0.02em;
  margin-bottom: 12px;
}
.cockpit-sats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 9px;
}
.cockpit-sat {
  background: var(--sur2);
  border-radius: 11px;
  padding: 9px 12px;
  display: flex;
  flex-direction: column;
  gap: 3px;
  border: 1px solid var(--bor);
}
.cockpit-sat-lbl {
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--t3);
}
.cockpit-sat-val {
  font-family: var(--display);
  font-size: 20px;
  font-weight: 800;
  color: var(--t1);
  letter-spacing: -0.02em;
}
.cockpit-sat-val.pos { color: var(--fg-success); }
.cockpit-sat-val.neg { color: var(--fg-danger); }
.cockpit-sat-delta {
  font-size: 11px;
  font-weight: 600;
}
.cockpit-sat-delta.pos { color: var(--fg-success); }
.cockpit-sat-delta.neg { color: var(--fg-danger); }
.cockpit-sat-delta.warn { color: var(--fg-warning); }
.cockpit-sat-delta.neu { color: var(--t3); font-style: italic; font-weight: 500; }
.cockpit-drill-ind {
  position: absolute;
  top: 10px;
  right: 12px;
  width: 24px;
  height: 24px;
  border-radius: 6px;
  background: var(--sur2);
  color: var(--t3);
  font-size: 13px;
  font-weight: 700;
  display: grid;
  place-items: center;
  z-index: 2;
  transition: all var(--t-fast);
}
.cockpit-v2:hover .cockpit-drill-ind {
  background: var(--acc);
  color: #fff;
}

/* Responsive cockpit */
@media (max-width: 900px) {
  .cockpit-v2 { grid-template-columns: 180px 1fr; gap: 12px; }
  .cockpit-gauge { width: 170px; height: 170px; }
  .cockpit-gauge svg { width: 170px; height: 170px; }
  .cockpit-gauge-pct { font-size: 36px; }
  .cockpit-gauge-pct small { font-size: 18px; }
  .cockpit-sat-val { font-size: 17px; }
}
@media (max-width: 767px) {
  .cockpit-v2 { grid-template-columns: 1fr; }
  .cockpit-gauge { margin: 0 auto; }
  .cockpit-sats { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
  .hero-v2-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }
  .hero-v2 .hero-blk + .hero-blk::before {
    left: 6px;
    right: 6px;
    top: 0;
    bottom: auto;
    width: auto;
    height: 1px;
  }
  .hero-v2 .hero-blk + .hero-blk {
    padding-top: 12px;
    padding-left: 4px;
  }
  .hero-v2 .hero-value { font-size: 22px; }
}

/* ═══════════════════════════════════════════════════════════════════════
   RESPONSIVE Tablette 768-1279
   ═══════════════════════════════════════════════════════════════════════ */
@media (max-width: 1279px) and (min-width: 768px) {
  /* Tabs persona dashboard : labels plus compacts sur tablette */
  #p-dashboard > .tabs[role="tablist"] .tab {
    font-size: 12px;
    padding: 6px 10px;
  }
  /* Filtres dashboard : compactes */
  #p-dashboard .flex-b.mb14 .inp {
    font-size: 12px;
  }
  /* Drill modal : 90vw au lieu de 800px fixe */
  .ov .modal { max-width: 90vw !important; }
}

/* ═══════════════════════════════════════════════════════════════════════
   RESPONSIVE Mobile <768
   ═══════════════════════════════════════════════════════════════════════ */
@media (max-width: 767px) {
  /* Tabs dashboard : scrollables horizontalement sur mobile */
  #p-dashboard > .tabs[role="tablist"] {
    overflow-x: auto;
    flex-wrap: nowrap !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }
  #p-dashboard > .tabs[role="tablist"] .tab {
    flex-shrink: 0;
    font-size: 12px;
    padding: 7px 11px;
    white-space: nowrap;
  }
  /* Filtres dashboard : empilent sur mobile */
  #p-dashboard > .flex-b.mb14 {
    flex-direction: column;
    align-items: stretch !important;
    gap: 8px !important;
  }
  #p-dashboard > .flex-b.mb14 > .flex-c {
    width: 100%;
    flex-wrap: wrap;
  }
  #p-dashboard > .flex-b.mb14 .inp {
    flex: 1;
    min-width: 0;
  }
  /* Mini-cards Patrimoine : 1 colonne pleine largeur sur mobile */
  #p-dashboard.dash-mode-patrimoine .dw-imm-bulle > div[style*="grid-template-columns"]:last-child {
    grid-template-columns: 1fr !important;
  }
  /* Touch targets : boutons agrandis pour pouce */
  #p-dashboard .btn.bs.bb,
  #p-dashboard .btn.bp {
    min-height: 40px;
    padding: 8px 14px;
  }
  /* Statut visuel mini-card : pastille agrandie pour touch */
  #p-dashboard.dash-mode-patrimoine .dw-log-mini span[style*="border-radius:10px"] {
    padding: 3px 9px !important;
    font-size: 12px !important;
  }
  /* Drill-down modal : plein écran sur mobile */
  .ov.hidden { display: none; }
  .ov .modal {
    max-width: 100vw !important;
    max-height: 100vh !important;
    width: 100vw !important;
    height: 100vh !important;
    border-radius: 0 !important;
    margin: 0 !important;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   v15.24 Phase B — POLISH VISUEL WIDGETS DASHBOARD (refonte CSS-only)
   Améliore visuellement les widgets existants sans toucher au JS.
   Drill-downs et logique métier 100% préservés (cf. DASHBOARD-DRILLDOWNS-INVENTAIRE).
   ═══════════════════════════════════════════════════════════════════════ */

/* ── Container widget (dans dash-kpi-grid) : élévation + transition ── */
#dash-kpi-grid > div {
  border-radius: 12px;
  transition: transform var(--t-fast), box-shadow var(--t-fast), border-color var(--t-fast);
}

/* ── Hero (Cash-flow) : padding + radius + hover élévation + value taille ── */
.dw-hero-click {
  border-radius: 12px;
  padding: 14px 18px;
}
.dw-hero-click:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-card-hover);
}
.dw-hero-value {
  font-family: var(--display);
  font-size: 42px;
  font-weight: 800;
  letter-spacing: -0.025em;
}
@media (max-width: 900px) { .dw-hero-value { font-size: 36px; } }
@media (max-width: 768px) { .dw-hero-value { font-size: 30px; } }
.dw-hero-label {
  text-transform: uppercase;
  font-size: 11px;
  letter-spacing: 0.6px;
  font-weight: 700;
  color: var(--t3);
}

/* ── KPI tiles (Occupation / Rendement / Charges / DG) : cards marquées ── */
.dw-kpi-click {
  border-radius: 12px;
  padding: 12px 15px;
  background: var(--sur);
  border: 1px solid var(--bor);
  transition: all var(--t-fast);
  box-shadow: var(--shadow-card);
}
.dw-kpi-click:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-card-hover);
  border-color: var(--acc);
}
.dw-kpi-label {
  text-transform: uppercase;
  font-size: 11px;
  letter-spacing: 0.5px;
  font-weight: 700;
  color: var(--t3);
}
.dw-kpi-value {
  font-family: var(--display);
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -0.02em;
}
/* Drill indicator ↗ plus visible au hover */
.dw-kpi-arrow {
  color: var(--acc);
  font-size: 14px;
  font-weight: 700;
}

/* ── À traiter (todo-unified) : pastilles plus visibles ── */
.dw-todo-quad,
.dw-todo-item {
  border-radius: 8px;
  transition: all var(--t-fast);
}
.dw-todo-item:hover {
  background: var(--sur2);
  transform: translateX(2px);
}

/* ── Pills (général) : padding et weight améliorés ── */
.dw-pill {
  font-weight: 600;
  padding: 5px 12px;
}
.dw-pill.delta-up,
.dw-pill.delta-down {
  font-weight: 700;
}

/* ── Mini-cards Patrimoine (vue Entité/Immeuble/Logements) ── */
/* Cards entité : ombre + bordure arrondie marquée */
.dw-ent-card {
  border-radius: 14px;
  box-shadow: var(--shadow-card);
  transition: all var(--t-fast);
  border: 1px solid var(--bor);
}
.dw-ent-card:hover {
  box-shadow: var(--shadow-card-hover);
  border-color: var(--bor2);
}

/* Cards immeuble : un peu de chaleur sur le hover */
.dw-imm-bulle {
  border-radius: 11px !important;
  transition: all var(--t-fast);
  cursor: pointer;
}
.dw-imm-bulle:hover {
  transform: translateY(-1px);
  box-shadow: var(--shadow-card-hover);
}

/* Mini-cards logement : statuts ✓ ~ ✗ avec bordures + animation hover */
.dw-log-mini {
  border-radius: 10px !important;
  transition: all var(--t-fast);
}
.dw-log-mini:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-card-hover);
}
/* Pastille statut : agrandir légèrement + ombre */
.dw-log-mini span[style*="border-radius:10px"] {
  font-size: 12px !important;
  font-weight: 800 !important;
  min-width: 22px;
  text-align: center;
}

/* ── Context bar : header bandeau plus marqué ── */
.dw-context-greet {
  font-weight: 600;
}
.dw-context-date {
  text-transform: uppercase;
  letter-spacing: 0.6px;
  font-weight: 600;
}

/* ── Section titles (Alertes & Actions) : style consolidé ── */
#p-dashboard .ct {
  text-transform: uppercase;
  font-size: 11px;
  letter-spacing: 0.8px;
  font-weight: 700;
  color: var(--t3);
}

/* ── Tabs dashboard : tab actif plus marqué ── */
#p-dashboard > .tabs[role="tablist"] .tab {
  border-radius: 8px 8px 0 0;
  transition: all var(--t-fast);
}
#p-dashboard > .tabs[role="tablist"] .tab.act {
  font-weight: 700;
  position: relative;
}
#p-dashboard > .tabs[role="tablist"] .tab.act::after {
  content: '';
  position: absolute;
  bottom: -1px;
  left: 0;
  right: 0;
  height: 3px;
  background: var(--acc);
  border-radius: 3px 3px 0 0;
}

/* ── Dark mode polish : KPI tiles & hero plus marquées sur fond foncé ── */
[data-theme="dark"] .dw-kpi-click,
[data-theme="dark"] .dw-hero-click {
  background: var(--sur);
}
[data-theme="dark"] .dw-kpi-click:hover {
  box-shadow: 0 6px 24px rgba(59, 126, 246, 0.18), 0 1px 3px rgba(0, 0, 0, 0.4);
  border-color: rgba(59, 126, 246, 0.5);
}
[data-theme="dark"] .dw-ent-card,
[data-theme="dark"] .dw-imm-bulle,
[data-theme="dark"] .dw-log-mini {
  background: var(--sur);
}

/* ── Coloré mode polish : accents teal Deliveroo visibles ── */
[data-theme="colore"] .dw-kpi-click:hover {
  border-color: var(--pos);
  box-shadow: 0 6px 22px rgba(255, 90, 60, 0.20), 0 1px 4px rgba(0, 0, 0, 0.05);
}
[data-theme="colore"] .dw-hero-click:hover {
  box-shadow: 0 8px 28px rgba(255, 90, 60, 0.18);
}
[data-theme="colore"] .dw-log-mini:hover {
  border-color: var(--pos);
}

/* ── Sobre mode polish : noir/blanc minimaliste ── */
[data-theme="sobre"] .dw-kpi-click:hover,
[data-theme="sobre"] .dw-hero-click:hover {
  border-color: var(--t1);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
}

/* ── Drill modal (openDashDrill) : design plus moderne ── */
.ov .modal {
  border-radius: 14px;
  box-shadow: var(--shadow-lg);
}
.m-head {
  border-radius: 14px 14px 0 0;
}

/* ═══════════════════════════════════════════════════════════════════════
   RESPONSIVE Très petit mobile <480
   ═══════════════════════════════════════════════════════════════════════ */
@media (max-width: 479px) {
  /* Cards entité (dash-ent-card) : padding réduit, font réduit */
  #p-dashboard .dw-ent-card {
    padding: 12px 10px;
    font-size: 13px;
  }
  #p-dashboard .dw-ent-card .g3 {
    grid-template-columns: 1fr !important;
  }
  /* Cards immeuble (dw-imm-bulle) : compact */
  #p-dashboard .dw-imm-bulle .g3 {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 6px !important;
  }
}

/* ════════════════════════════════════════════════════════════════════════════
   v15.37 DASH-REFONTE-GLOBALE-V4 — REFONTE V4 STRIPE
   Référence : docs/strategie/dashboard-mockups/galerie-finale-sans-surcharge.html l.947-1136
   Scope : actif uniquement quand body[data-dash-v4="on"] (dashRenderV='v2' + thème dark)
   Préfixe : .v4s (pour ne pas collisionner avec classes existantes .coach .hero etc.)
   ════════════════════════════════════════════════════════════════════════════ */

body[data-dash-v4="on"] {
  --v4-rad: 14px;
  /* v15.37 fix retour user : bump contraste --t2/--t3 pour V4 (dark trop pâle) */
  --t2: #CDD4E5;
  /* v15.694 CHARTE M-17 (sombre) : #8B95B5 → #929cbb = ≥ 4,5:1 sur tous les fonds sombres
     (sur 5,83 · sur2 5,19 · sur3 4,56 · bg 6,62). Le clair est surchargé plus bas (sobre). */
  --t3: #929cbb;
}
/* En sobre/coloré : redonner du contraste cohérent avec le thème */
html[data-theme="sobre"] body[data-dash-v4="on"] {
  --t2: #475569;
  /* v15.688 CHARTE M-17 : #64748b ne faisait que 4,37:1 sur le fond de page (--bg) et
     4,20:1 sur --sur3 → #5f6f86 = 4,69 / 4,52 (≥ 4,5 partout). Le sombre est inchangé. */
  --t3: #5f6f86;
}
html[data-theme="colore"] body[data-dash-v4="on"] {
  --t2: #6b4a2a;
  --t3: #8b6940;
}

/* v15.37 — Hide tous les éléments legacy du dashboard en mode V4.
   Les filtres période sont DÉPLACÉS dans la topbar #tb-actions par _v4SyncTopbarFilters.
   Le filtre entité est SUPPRIMÉ (les 4 carrés sidebar V4 suffisent). */
body[data-dash-v4="on"] #p-dashboard > .tabs[role="tablist"],
body[data-dash-v4="on"] #p-dashboard > .flex-b.mb14,
body[data-dash-v4="on"] #p-dashboard > .flex-b.mb9,
body[data-dash-v4="on"] #p-dashboard #dash-panel,
body[data-dash-v4="on"] #p-dashboard #dash-edit-bar,
body[data-dash-v4="on"] #p-dashboard #dash-top-bandeau,
body[data-dash-v4="on"] #p-dashboard #dash-grid,
body[data-dash-v4="on"] #p-dashboard #dash-kpi-grid,
body[data-dash-v4="on"] #p-dashboard #dash-ent-cards,
body[data-dash-v4="on"] #p-dashboard #dash-alerts {
  display: none !important;
}

/* v15.37 — Topbar : réserve juste la place pour drive-fab (chip DK retournée en sidebar) */
body[data-dash-v4="on"] .tb {
  padding-right: 110px !important;
  min-height: 54px;
  height: auto !important;
}
body[data-dash-v4="on"] .tb-actions {
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
}

/* v15.37 — Footer DK en bas de la sidebar V4 (au lieu de la topbar — plus de chevauchement) */
body[data-dash-v4="on"] .v4s-sb-userfoot {
  margin-top: auto;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 16px;
  border-top: 1px solid var(--bor);
  background: transparent;
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: inherit;
  border-left: 0; border-right: 0; border-bottom: 0;
  transition: background .15s;
}
body[data-dash-v4="on"] .v4s-sb-userfoot:hover {
  background: var(--sur2);
}
body[data-dash-v4="on"] .v4s-sb-userfoot:focus-visible {
  outline: 2px solid var(--acc);
  outline-offset: -2px;
}
body[data-dash-v4="on"] .v4s-sb-userfoot-av {
  width: 34px; height: 34px;
  border-radius: 50%;
  background: #5566aa;
  display: flex;
  align-items: center;
  justify-content: center;
  font: 700 12px var(--display);
  color: #fff;
  flex-shrink: 0;
  letter-spacing: .02em;
}
body[data-dash-v4="on"] .v4s-sb-userfoot-info {
  display: flex;
  flex-direction: column;
  min-width: 0;
  flex: 1;
  overflow: hidden;
}
body[data-dash-v4="on"] .v4s-sb-userfoot-name {
  font: 600 13px 'Inter', sans-serif;
  color: var(--t1);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body[data-dash-v4="on"] .v4s-sb-userfoot-role {
  font: 500 11px 'Inter', sans-serif;
  color: var(--t3);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

/* ─── v15.344 Connexion D1 — Menu Compte + Déconnexion (variante A : popover remonte) ───
   Réutilise les tokens existants de l'app (var(--sur), --bor, --t1/2/3, --cta, --red…) pour
   rester cohérent avec le design system actuel (PAS les tokens corail du mockup Propryo). */
body[data-dash-v4="on"] .v4s-acct-wrap {
  position: relative;
  margin-top: auto;
}
/* Le bouton pied reprend .v4s-sb-userfoot (déjà stylé) + chevron + état ouvert */
body[data-dash-v4="on"] .v4s-acct-wrap .v4s-sb-userfoot { margin-top: 0; width: 100%; }
body[data-dash-v4="on"] .v4s-acct-chev {
  margin-left: auto;
  color: var(--t3);
  font-size: 12px;
  transition: transform .15s;
  flex-shrink: 0;
}
body[data-dash-v4="on"] .v4s-sb-userfoot.open .v4s-acct-chev { transform: rotate(180deg); }
body[data-dash-v4="on"] .v4s-sb-userfoot.open { background: var(--sur2); }

/* Popover (desktop) : ancré au pied, REMONTE au-dessus du bouton (variante A) */
body[data-dash-v4="on"] .v4s-acct-pop {
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: calc(100% + 6px);
  background: var(--sur);
  border: 1px solid var(--bor);
  border-radius: var(--rl, 14px);
  box-shadow: var(--shadow-lg, 0 8px 40px rgba(0,0,0,.13));
  padding: 7px;
  z-index: 30;
  display: none;
}
body[data-dash-v4="on"] .v4s-acct-pop.open { display: block; }
body[data-dash-v4="on"] .v4s-acct-grab { display: none; } /* visible en bottom-sheet mobile uniquement */
body[data-dash-v4="on"] .v4s-acct-who {
  padding: 9px 11px 10px;
  border-bottom: 1px solid var(--bor2, var(--bor));
  margin-bottom: 6px;
}
body[data-dash-v4="on"] .v4s-acct-n {
  font: 700 14px var(--display);
  color: var(--t1);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body[data-dash-v4="on"] .v4s-acct-e {
  font: 500 12px 'Inter', sans-serif;
  color: var(--t3);
  margin-top: 1px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body[data-dash-v4="on"] .v4s-acct-esp {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
  max-width: 100%;
  background: var(--sur2);
  color: var(--t2);
  font: 600 11px 'Inter', sans-serif;
  padding: 3px 9px;
  border-radius: 999px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body[data-dash-v4="on"] .v4s-acct-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--grn, var(--pos, #16a34a));
  flex-shrink: 0;
}
body[data-dash-v4="on"] .v4s-acct-it {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 9px 11px;
  border: 0;
  background: transparent;
  border-radius: 9px;
  color: var(--t2);
  font: 500 13.5px 'Inter', sans-serif;
  text-align: left;
  cursor: pointer;
}
body[data-dash-v4="on"] .v4s-acct-it:hover { background: var(--sur2); }
body[data-dash-v4="on"] .v4s-acct-it:focus-visible {
  outline: 2px solid var(--acc);
  outline-offset: -2px;
}
body[data-dash-v4="on"] .v4s-acct-it .v4s-acct-ic {
  width: 17px;
  text-align: center;
  opacity: .85;
  flex-shrink: 0;
}
body[data-dash-v4="on"] .v4s-acct-it .v4s-acct-ic svg { width: 15px; height: 15px; vertical-align: middle; }
body[data-dash-v4="on"] .v4s-acct-danger { color: var(--red, var(--neg, #dc2626)); font-weight: 600; }
body[data-dash-v4="on"] .v4s-acct-danger:hover { background: var(--bg-danger, rgba(220,38,38,.10)); }
body[data-dash-v4="on"] .v4s-acct-sep {
  height: 1px;
  background: var(--bor2, var(--bor));
  margin: 6px 4px;
}
/* Backdrop : masqué en desktop (le clic-extérieur global suffit), affiché en bottom-sheet mobile */
body[data-dash-v4="on"] .v4s-acct-backdrop { display: none; }

/* Bottom-sheet mobile : sidebar masquée/écran étroit → le menu vient du bas, pouce-compatible */
@media (max-width: 768px) {
  /* La sidebar mobile (#sb.open) porte un transform → elle devient le BLOC CONTENEUR de tout
     position:fixed descendant (le sheet serait sinon coincé à la largeur de la sidebar ~260px).
     On force donc une largeur/hauteur en unités viewport (vw/vh) pour reprendre tout l'écran. */
  body[data-dash-v4="on"] .v4s-acct-pop {
    position: fixed;
    left: 0;
    right: auto;
    width: 100vw;
    bottom: 0;
    top: auto;
    border-radius: 18px 18px 0 0;
    border-left: 0; border-right: 0; border-bottom: 0;
    box-shadow: 0 -16px 40px -18px rgba(0,0,0,.4);
    padding: 8px 12px max(16px, env(safe-area-inset-bottom));
    z-index: 2100; /* au-dessus de la sidebar overlay (2000) */
  }
  body[data-dash-v4="on"] .v4s-acct-grab {
    display: block;
    width: 38px; height: 4px;
    border-radius: 3px;
    background: var(--bor);
    margin: 2px auto 10px;
  }
  body[data-dash-v4="on"] .v4s-acct-backdrop.open {
    display: block;
    position: fixed;
    left: 0; top: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0,0,0,.5);
    z-index: 2099;
  }
  body[data-dash-v4="on"] .v4s-acct-it { padding: 11px; }
}

/* v15.37 — Contrôles topbar regroupés (mode + filtres + thèmes + chip DK) */
body[data-dash-v4="on"] .v4s-tb-controls {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  /* Empêche les éléments de se superposer (chip DK ne doit pas chevaucher sobre) */
  row-gap: 6px;
}
/* v15.42 : tous les contrôles COMPLÈTEMENT à gauche (juste après le titre
   "Tableau de bord"). Override le flex:1 de .tb-breadcrumb qui poussait les
   contrôles à droite. Espace restant pousse à droite (margin-right:auto)
   pour ne pas conflicter avec le Drive FAB position:fixed. */
body[data-dash-v4="on"] .tb-breadcrumb { flex: 0 0 auto; }
body[data-dash-v4="on"] .tb-actions {
  flex: 0 0 auto;
  margin-right: auto;
  margin-left: 0;
}
/* z-index : chip DK doit être SOUS les boutons thème pour ne pas les cacher */
body[data-dash-v4="on"] .v4s-tb-controls > * {
  position: relative;
  z-index: 1;
}
body[data-dash-v4="on"] .v4s-user-chip {
  z-index: 0;
}
body[data-dash-v4="on"] .v4s-tb-sep {
  width: 1px;
  height: 22px;
  background: var(--bor);
  margin: 0 2px;
}
body[data-dash-v4="on"] .v4s-tb-controls .v4s-tb-label {
  font: 600 10.5px/1.2 var(--mono);
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--t3);
  margin-right: 2px;
}
body[data-dash-v4="on"] .v4s-tb-controls select {
  background: var(--sur2);
  border: 1px solid var(--bor);
  color: var(--t1);
  font: 600 13px/1 'Inter', sans-serif;
  padding: 6px 9px;
  border-radius: 7px;
  cursor: pointer;
  transition: border-color .15s;
}
body[data-dash-v4="on"] .v4s-tb-controls select:hover { border-color: var(--cta); }
body[data-dash-v4="on"] .v4s-tb-controls select:focus {
  outline: 2px solid var(--acc);
  outline-offset: 1px;
  border-color: var(--cta);
}

/* Sélecteur mode (Solo / Premium / Gestionnaire) — segmented control */
body[data-dash-v4="on"] .v4s-mode-row {
  display: flex;
  background: var(--sur2);
  border: 1px solid var(--bor);
  border-radius: 8px;
  padding: 2px;
  gap: 1px;
}
body[data-dash-v4="on"] .v4s-mode-btn {
  background: transparent;
  border: 0;
  padding: 5px 11px;
  border-radius: 6px;
  color: var(--t2);
  font: 600 12px/1 'Inter', sans-serif;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  transition: all .15s;
}
body[data-dash-v4="on"] .v4s-mode-btn .v4s-mode-ic { font-size: 14px; }
body[data-dash-v4="on"] .v4s-mode-btn .v4s-mode-ic svg { width: 14px; height: 14px; vertical-align: middle; }
body[data-dash-v4="on"] .v4s-mode-btn:hover { color: var(--t1); }
body[data-dash-v4="on"] .v4s-mode-btn.act {
  /* v15.38 : fond opaque léger + texte cta + border (au lieu de fond plein cyan
     qui paraissait comme "un carré vert" vide en topbar) */
  background: var(--sur);
  color: var(--t1);
  box-shadow: inset 0 0 0 1.5px var(--cta);
  font-weight: 700;
}
body[data-dash-v4="on"] .v4s-mode-btn.act .v4s-mode-ic { filter: none; }

/* 3 boutons thèmes dans la topbar — version compacte */
body[data-dash-v4="on"] .v4s-theme-tb-row {
  display: flex;
  gap: 3px;
  background: var(--sur2);
  border: 1px solid var(--bor);
  border-radius: 8px;
  padding: 2px;
}
body[data-dash-v4="on"] .v4s-theme-tb-row .v4s-theme-btn {
  width: 30px;
  height: 26px;
  border-radius: 6px;
  border: 0;
  background: transparent;
  color: var(--t2);
  font: 600 14px 'Inter', sans-serif;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all .15s;
}
body[data-dash-v4="on"] .v4s-theme-tb-row .v4s-theme-btn svg { width: 16px; height: 16px; }
body[data-dash-v4="on"] .v4s-theme-tb-row .v4s-theme-btn:hover { color: var(--t1); }
body[data-dash-v4="on"] .v4s-theme-tb-row .v4s-theme-btn.act {
  /* v15.38 : outline (inset border) au lieu de fond plein cyan ("carré vert") */
  background: var(--sur);
  color: var(--t1);
  box-shadow: inset 0 0 0 1.5px var(--cta);
}

/* ─── MODE SOLO ─── */
body[data-dash-v4="on"] .v4s-weather-hero {
  background: linear-gradient(135deg, var(--sur) 0%, var(--sur2) 100%);
  border: 1px solid var(--bor);
  border-radius: 18px;
  padding: 24px;
  display: flex;
  align-items: center;
  gap: 24px;
  position: relative;
  overflow: hidden;
}
body[data-dash-v4="on"] .v4s-weather-hero::after {
  content: '';
  position: absolute;
  bottom: -40%; left: -10%;
  width: 300px; height: 300px;
  background: radial-gradient(circle, var(--warn) 0%, transparent 70%);
  opacity: .10;
}
body[data-dash-v4="on"] .v4s-weather-icon {
  font-size: 100px;
  line-height: 1;
  filter: drop-shadow(0 4px 12px rgba(251,176,64,.35));
  position: relative;
  z-index: 1;
}
body[data-dash-v4="on"] .v4s-weather-text { flex: 1; position: relative; z-index: 1; }
body[data-dash-v4="on"] .v4s-weather-text h1 {
  font: 800 28px/1.1 var(--display);
  color: var(--t1);
  letter-spacing: -.03em;
}
body[data-dash-v4="on"] .v4s-weather-sub {
  font: 500 14px/1.5 'Inter', sans-serif;
  color: var(--t2);
  margin-top: 6px;
}
body[data-dash-v4="on"] .v4s-weather-kpis {
  display: flex;
  gap: 22px;
  margin-top: 14px;
}
body[data-dash-v4="on"] .v4s-weather-kpis .wk {
  display: flex;
  flex-direction: column;
}
body[data-dash-v4="on"] .v4s-weather-kpis .wk .v {
  font: 800 20px/1 var(--display);
  color: var(--t1);
  letter-spacing: -.02em;
}
body[data-dash-v4="on"] .v4s-weather-kpis .wk .v.pos { color: var(--pos); }
body[data-dash-v4="on"] .v4s-weather-kpis .wk .v.neg { color: var(--neg); }
body[data-dash-v4="on"] .v4s-weather-kpis .wk .l {
  font: 700 11px/1 var(--mono);
  color: var(--t3);
  text-transform: uppercase;
  letter-spacing: .08em;
  margin-top: 4px;
}

body[data-dash-v4="on"] .v4s-card {
  background: var(--sur);
  border: 1px solid var(--bor);
  border-radius: 14px;
  padding: 16px;
}
body[data-dash-v4="on"] .v4s-solo-grid {
  display: grid;
  grid-template-columns: 1fr 360px;
  gap: 14px;
}
body[data-dash-v4="on"] .v4s-solo-card {
  display: flex; flex-direction: column;
  background: var(--sur);
  border: 1px solid var(--bor);
  border-radius: 14px;
  padding: 16px;
  text-align: left;
  font: inherit; color: inherit;
  cursor: pointer;
  transition: all .15s;
}
body[data-dash-v4="on"] .v4s-solo-card:hover { border-color: var(--cta); transform: translateY(-1px); }
body[data-dash-v4="on"] .v4s-solo-ref {
  font: 700 11px/1 var(--mono);
  color: var(--t3);
  letter-spacing: .08em;
  text-transform: uppercase;
}
body[data-dash-v4="on"] .v4s-solo-card h3 {
  font-family: var(--display);
  font-size: 19px;
  font-weight: 800;
  line-height: 1;
  color: var(--t1);
  margin-top: 4px;
  letter-spacing: -.02em;
}
body[data-dash-v4="on"] .v4s-solo-addr {
  font: 500 12.5px/1.4 'Inter', sans-serif;
  color: var(--t3);
  margin-top: 2px;
}
body[data-dash-v4="on"] .v4s-solo-loc {
  font: 500 13px/1.4 'Inter', sans-serif;
  color: var(--t2);
  margin-top: 3px;
}
body[data-dash-v4="on"] .v4s-solo-mont {
  font: 900 34px/1 var(--display);
  color: var(--t1);
  letter-spacing: -.03em;
  margin-top: 14px;
}
body[data-dash-v4="on"] .v4s-solo-mont small {
  font: 600 14px/1 'Inter', sans-serif;
  color: var(--t3);
  margin-left: 3px;
}
body[data-dash-v4="on"] .v4s-solo-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 9px 0;
  border-top: 1px dashed var(--bor);
  margin-top: 14px;
  font-size: 13px;
}
body[data-dash-v4="on"] .v4s-solo-row .k { color: var(--t2); }
body[data-dash-v4="on"] .v4s-solo-row .v {
  color: var(--t1); font-weight: 600;
}
body[data-dash-v4="on"] .v4s-solo-row .v.pos { color: var(--pos); }
body[data-dash-v4="on"] .v4s-solo-row .v.neg { color: var(--neg); }
body[data-dash-v4="on"] .v4s-solo-gen-btn {
  width: 100%;
  margin-top: 16px;
  padding: 11px 16px;
  /* v15.37 fix : couleurs HARDCODED (en thème sobre --cta=#0d1420 → noir, pas voulu) */
  background: var(--acc);
  color: #fff;
  border: 0;
  border-radius: 10px;
  font: 700 13px/1 'Inter', sans-serif;
  cursor: pointer;
  transition: all .15s;
  box-shadow: 0 4px 12px rgba(255,90,60,.30);
}
body[data-dash-v4="on"] .v4s-solo-gen-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(255,90,60,.38);
}
body[data-dash-v4="on"] .v4s-solo-todo h3 {
  font: 700 15px/1.2 var(--display);
  color: var(--t1);
  margin-bottom: 12px;
  display: flex; align-items: center; gap: 8px;
}
body[data-dash-v4="on"] .v4s-solo-pill {
  background: rgba(92,138,255,.16);
  color: var(--info);
  font: 700 11px/1 var(--display);
  padding: 4px 8px;
  border-radius: 999px;
  letter-spacing: .02em;
}
body[data-dash-v4="on"] .v4s-solo-todo-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px;
  background: var(--sur2);
  border-radius: 10px;
  border: 1px solid var(--bor);
  margin-top: 8px;
  width: 100%;
  text-align: left;
  font: inherit; color: inherit;
  cursor: pointer;
  transition: all .15s;
}
body[data-dash-v4="on"] .v4s-solo-todo-item:hover { border-color: var(--cta); }
body[data-dash-v4="on"] .v4s-solo-todo-item .ico {
  width: 40px; height: 40px;
  border-radius: 10px;
  /* v15.37 fix : couleurs HARDCODED (var--cta devient noir en sobre) */
  background: linear-gradient(135deg, #34D399 0%, #1a8f6f 100%);
  display: flex; align-items: center; justify-content: center;
  font-size: 20px;
  flex-shrink: 0;
  box-shadow: 0 3px 8px rgba(52,211,153,.25);
}
body[data-dash-v4="on"] .v4s-solo-todo-item .txt {
  flex: 1;
  font: 600 13px/1.35 'Inter', sans-serif;
  color: var(--t1);
}
body[data-dash-v4="on"] .v4s-solo-todo-item .txt small {
  color: var(--t2);
  font-weight: 400;
  display: block;
  font-size: 11.5px;
  margin-top: 2px;
}
body[data-dash-v4="on"] .v4s-solo-todo-arr {
  color: var(--t3);
  font-size: 16px;
}
body[data-dash-v4="on"] .v4s-solo-todo-empty {
  text-align: center;
  color: var(--pos);
  padding: 18px;
  font-weight: 500;
}
body[data-dash-v4="on"] .v4s-solo-upsell {
  padding: 16px 22px;
  background: var(--sur2);
  border: 1.5px solid var(--acc);
  color: var(--t1);
  border-radius: 14px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
}
body[data-dash-v4="on"] .v4s-solo-upsell h4 {
  font: 800 17px/1 var(--display);
  letter-spacing: -.01em;
  color: var(--acc);
}
body[data-dash-v4="on"] .v4s-solo-upsell p {
  font: 500 12.5px/1.4 'Inter', sans-serif;
  opacity: .85;
  margin-top: 4px;
  color: var(--t2);
}
body[data-dash-v4="on"] .v4s-solo-upsell-btn {
  background: var(--acc);
  color: #fff;
  padding: 10px 20px;
  border-radius: 999px;
  border: 0;
  font: 700 13px var(--display);
  cursor: pointer;
  white-space: nowrap;
  transition: all .15s;
}
body[data-dash-v4="on"] .v4s-solo-upsell-btn:hover { transform: translateY(-1px); opacity: .9; }

/* ─── MODE GESTIONNAIRE ─── */
body[data-dash-v4="on"] .v4s-weather-gest {
  background: linear-gradient(135deg, var(--sur) 0%, var(--sur2) 100%);
  border: 1px solid var(--bor);
  border-radius: 16px;
  padding: 18px;
  display: flex;
  align-items: center;
  gap: 18px;
}
body[data-dash-v4="on"] .v4s-weather-gest .icon {
  font-size: 72px;
  line-height: 1;
  filter: drop-shadow(0 3px 8px rgba(0,0,0,.10));
}
body[data-dash-v4="on"] .v4s-weather-gest .core h2 {
  font-family: var(--display);
  font-size: 22px;
  font-weight: 800;
  line-height: 1.1;
  color: var(--t1);
  letter-spacing: -.02em;
}
body[data-dash-v4="on"] .v4s-weather-gest .core .sub {
  font: 500 13px/1.5 'Inter', sans-serif;
  color: var(--t2);
  margin-top: 4px;
}
body[data-dash-v4="on"] .v4s-weather-gest .stats {
  margin-left: auto;
  display: flex;
  gap: 22px;
}
body[data-dash-v4="on"] .v4s-weather-gest .stat { text-align: center; }
body[data-dash-v4="on"] .v4s-weather-gest .stat .v {
  font: 800 22px/1 var(--display);
  color: var(--t1);
  letter-spacing: -.02em;
}
body[data-dash-v4="on"] .v4s-weather-gest .stat .l {
  font: 700 10.5px/1 var(--mono);
  color: var(--t3);
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-top: 4px;
}
body[data-dash-v4="on"] .v4s-gest-grid {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 14px;
}
body[data-dash-v4="on"] .v4s-gest-matrix table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 13px;
}
body[data-dash-v4="on"] .v4s-gest-matrix th {
  font: 700 10.5px/1 var(--mono);
  color: var(--t3);
  text-transform: uppercase;
  letter-spacing: .06em;
  padding: 9px 7px;
  text-align: left;
  border-bottom: 1px solid var(--bor);
}
body[data-dash-v4="on"] .v4s-gest-matrix td {
  padding: 11px 7px;
  border-bottom: 1px solid var(--bor);
  color: var(--t1);
  font-weight: 500;
}
body[data-dash-v4="on"] .v4s-gest-matrix tr:hover td { background: var(--sur2); }
body[data-dash-v4="on"] .v4s-mat-ref {
  font-weight: 700;
  font-size: 12px;
  color: var(--t2);
}
body[data-dash-v4="on"] .v4s-mat-dot {
  display: inline-block;
  width: 10px; height: 10px;
  border-radius: 50%;
}
body[data-dash-v4="on"] .v4s-mat-dot.ok { background: var(--pos); }
body[data-dash-v4="on"] .v4s-mat-dot.ko { background: var(--neg); }
body[data-dash-v4="on"] .v4s-mat-dot.wn { background: var(--warn); }
body[data-dash-v4="on"] .v4s-mat-pill {
  font: 700 11px/1 var(--display);
  padding: 4px 9px;
  border-radius: 999px;
  letter-spacing: .02em;
}
body[data-dash-v4="on"] .v4s-mat-pill.pos { background: rgba(52,211,153,.16); color: var(--pos); }
body[data-dash-v4="on"] .v4s-mat-pill.neg { background: rgba(248,113,113,.16); color: var(--neg); }
body[data-dash-v4="on"] .v4s-mat-pill.warn { background: rgba(251,176,64,.18); color: var(--warn); }
body[data-dash-v4="on"] .v4s-mat-pill.info { background: rgba(92,138,255,.16); color: var(--info); }
body[data-dash-v4="on"] .v4s-mat-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 12px;
  font-size: 11.5px;
  color: var(--t2);
}
body[data-dash-v4="on"] .v4s-mat-legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
body[data-dash-v4="on"] .v4s-gest-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 10px;
}
body[data-dash-v4="on"] .v4s-gest-head h3,
body[data-dash-v4="on"] .v4s-gest-agenda h3 {
  font: 700 15px/1.2 var(--display);
  color: var(--t1);
  margin-bottom: 12px;
}
body[data-dash-v4="on"] .v4s-gest-events {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

/* v15.37 — 4 cards conformité en bas du mode Gestionnaire */
body[data-dash-v4="on"] .v4s-conf-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}
body[data-dash-v4="on"] .v4s-conf-card {
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: inherit;
  transition: all .15s;
}
body[data-dash-v4="on"] button.v4s-conf-card:hover {
  border-color: var(--cta);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0,0,0,.08);
}
body[data-dash-v4="on"] button.v4s-conf-card:focus-visible {
  outline: 2px solid var(--acc);
  outline-offset: 1px;
}
body[data-dash-v4="on"] .v4s-conf-top {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
body[data-dash-v4="on"] .v4s-conf-lbl {
  font: 700 11px/1.2 var(--mono);
  color: var(--t3);
  text-transform: uppercase;
  letter-spacing: .08em;
}
body[data-dash-v4="on"] .v4s-conf-val {
  font: 800 22px/1.1 var(--display);
  color: var(--t1);
  margin-top: 4px;
  letter-spacing: -.02em;
}
body[data-dash-v4="on"] .v4s-conf-ic {
  font-size: 26px;
  width: 44px; height: 44px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
body[data-dash-v4="on"] .v4s-conf-ic.warn {
  background: linear-gradient(135deg, #FBB040, #EA580C);
  color: #fff;
}
body[data-dash-v4="on"] .v4s-conf-ic.info {
  background: linear-gradient(135deg, #7788cc, #5566aa);
  color: #fff;
}
body[data-dash-v4="on"] .v4s-conf-ic.pos {
  background: linear-gradient(135deg, #34D399, #1a8f6f);
  color: #fff;
}
body[data-dash-v4="on"] .v4s-conf-ic.neg {
  background: linear-gradient(135deg, #F87171, #DC2626);
  color: #fff;
}
body[data-dash-v4="on"] .v4s-conf-ctx {
  font: 500 12px/1.4 'Inter', sans-serif;
  color: var(--t2);
  margin-top: 2px;
}
@media (max-width: 900px) {
  body[data-dash-v4="on"] .v4s-conf-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* v15.37 — Agenda 15j calendar visuel */
body[data-dash-v4="on"] .v4s-gest-calendar {
  display: grid;
  grid-template-columns: repeat(15, 1fr);
  gap: 4px;
  margin-bottom: 8px;
}
body[data-dash-v4="on"] .v4s-cal-day {
  aspect-ratio: 1;
  background: var(--sur2);
  border: 1px solid var(--bor);
  border-radius: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  font: 700 11px 'Inter', sans-serif;
  color: var(--t3);
}
body[data-dash-v4="on"] .v4s-cal-day.has-warn {
  background: var(--warn);
  color: #fff;
  border-color: transparent;
}
body[data-dash-v4="on"] .v4s-cal-day.has-neg {
  background: var(--neg);
  color: #fff;
  border-color: transparent;
}
body[data-dash-v4="on"] .v4s-cal-day.has-info {
  background: var(--info);
  color: #fff;
  border-color: transparent;
}
body[data-dash-v4="on"] .v4s-cal-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 10px;
  font-size: 11px;
  color: var(--t2);
}
body[data-dash-v4="on"] .v4s-cal-legend span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
body[data-dash-v4="on"] .v4s-cal-legend .sw {
  width: 9px; height: 9px;
  border-radius: 2px;
}
body[data-dash-v4="on"] .v4s-cal-legend .sw.warn { background: var(--warn); }
body[data-dash-v4="on"] .v4s-cal-legend .sw.neg { background: var(--neg); }
body[data-dash-v4="on"] .v4s-cal-legend .sw.info { background: var(--info); }
body[data-dash-v4="on"] .v4s-gest-ev {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  background: var(--sur2);
  border: 1px solid var(--bor);
  border-radius: 10px;
  transition: all .15s;
}
body[data-dash-v4="on"] .v4s-gest-ev:hover { border-color: var(--cta); }
body[data-dash-v4="on"] .v4s-gest-ev .ico {
  font-size: 18px;
  width: 36px; height: 36px;
  border-radius: 8px;
  /* v15.37 fix : couleurs franches selon sévérité (data-sev sur le parent) */
  background: linear-gradient(135deg, #7788cc 0%, #5566aa 100%);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 2px 6px rgba(85,102,170,.25);
}
body[data-dash-v4="on"] .v4s-gest-ev[data-sev="red"] .ico {
  background: linear-gradient(135deg, #F87171 0%, #DC2626 100%);
  box-shadow: 0 2px 6px rgba(248,113,113,.25);
}
body[data-dash-v4="on"] .v4s-gest-ev[data-sev="ora"] .ico {
  background: linear-gradient(135deg, #FBB040 0%, #EA580C 100%);
  box-shadow: 0 2px 6px rgba(251,176,64,.25);
}
body[data-dash-v4="on"] .v4s-gest-ev[data-sev="info"] .ico {
  background: linear-gradient(135deg, #A78BFA 0%, #7C3AED 100%);
  box-shadow: 0 2px 6px rgba(167,139,250,.25);
}
body[data-dash-v4="on"] .v4s-gest-ev .lbl {
  flex: 1;
  font: 600 13px/1.35 'Inter', sans-serif;
  color: var(--t1);
}
body[data-dash-v4="on"] .v4s-gest-ev .lbl small {
  display: block;
  font-size: 11.5px;
  color: var(--t2);
  font-weight: 400;
  margin-top: 2px;
}

/* Responsive Solo/Gestionnaire */
@media (max-width: 900px) {
  body[data-dash-v4="on"] .v4s-solo-grid,
  body[data-dash-v4="on"] .v4s-gest-grid {
    grid-template-columns: 1fr;
  }
  body[data-dash-v4="on"] .v4s-weather-hero { flex-direction: column; text-align: center; }
  body[data-dash-v4="on"] .v4s-weather-kpis { justify-content: center; }
}

/* Container V4 */
body[data-dash-v4="on"] #dash-v4 {
  display: flex;
  flex-direction: column;
  gap: 14px;
  font-family: 'Inter', sans-serif;
}
body[data-dash-v4="on"] #dash-v4:empty { display: none; }
body[data-dash-v4="on"] #p-dashboard { padding: 0; }
body[data-dash-v4="on"] .pc { padding: 18px 22px; }

/* ─── COACH IA (bandeau Priorisation) ─── */
.v4s-coach {
  background: linear-gradient(180deg, var(--sur), var(--sur2));
  border: 1px solid var(--bor);
  border-radius: var(--v4-rad);
  padding: 14px 18px;
  display: flex;
  align-items: center;
  gap: 16px;
  position: relative;
  overflow: hidden;
}
.v4s-coach-left { flex: 0 0 240px; }
.v4s-coach-eye {
  font: 700 11px/1.2 var(--mono);
  letter-spacing: .14em;
  color: var(--warn);
  text-transform: uppercase;
}
.v4s-coach h2 {
  font-family: var(--display);
  font-size: 19px;
  font-weight: 800;
  line-height: 1.2;
  color: var(--t1);
  margin-top: 6px;
  letter-spacing: -.02em;
}
.v4s-coach-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  flex: 1;
}
.v4s-coach-c {
  background: rgba(255,255,255,.025);
  border: 1px solid var(--bor);
  border-radius: 10px;
  padding: 10px 12px;
  display: flex;
  gap: 10px;
  align-items: flex-start;
  cursor: pointer;
  transition: all .15s;
  text-align: left;
  font: inherit;
  color: inherit;
}
.v4s-coach-c:hover {
  border-color: rgba(255,255,255,.18);
  transform: translateY(-1px);
}
.v4s-coach-c .v4s-n {
  width: 26px; height: 26px;
  border-radius: 50%;
  background: rgba(251,176,64,.18);
  color: var(--warn);
  font: 700 13px var(--display);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.v4s-coach-c .v4s-ti {
  font: 600 13.5px/1.3 'Inter', sans-serif;
  color: var(--t1);
  margin-bottom: 2px;
}
.v4s-coach-c .v4s-me {
  font: 500 12px/1.4 'Inter', sans-serif;
  color: var(--t2);
}
.v4s-coach-cta {
  background: linear-gradient(135deg, #FF9D38, var(--warn));
  color: #0A0E27;
  border: 0;
  font: 700 13px/1 var(--display);
  letter-spacing: .06em;
  padding: 12px 20px;
  border-radius: 9px;
  cursor: pointer;
  box-shadow: 0 6px 16px rgba(251,176,64,.30);
  white-space: nowrap;
}
.v4s-coach-cta:hover { transform: translateY(-1px); }

/* ─── NARRATE (phrase narrative discrète) ─── */
.v4s-narrate {
  background: transparent;
  padding: 4px 4px 0;
  font: 500 14.5px/1.5 'Inter', sans-serif;
  color: var(--t2);
  letter-spacing: .005em;
}
.v4s-narrate em { color: var(--t1); font-weight: 600; font-style: normal; }
.v4s-narrate .red { color: var(--neg); }
.v4s-narrate .pos { color: var(--pos); }

/* ─── ROW 1 (Hero + Cash + Sujets) ─── */
.v4s-row1 {
  display: grid;
  grid-template-columns: 1.05fr 1.45fr 1fr;
  gap: 14px;
}

/* Hero jauge demi-cercle */
.v4s-hero {
  background: var(--sur);
  border: 1px solid var(--bor);
  border-radius: var(--v4-rad);
  padding: 18px;
  display: flex;
  flex-direction: column;
  align-items: center;
  position: relative;
  overflow: hidden;
  cursor: pointer;
  transition: all .15s;
  font: inherit;
  color: inherit;
  text-align: left;
  width: 100%;
}
.v4s-hero:hover { transform: translateY(-1px); border-color: rgba(255,255,255,.18); }
.v4s-hero-eye {
  font: 700 11px/1.2 var(--mono);
  letter-spacing: .14em;
  color: var(--t2);
  align-self: flex-start;
  text-transform: uppercase;
}
.v4s-hero-gauge {
  position: relative;
  width: 220px;
  height: 125px;
  margin: 8px auto 4px;
}
.v4s-hero-gauge svg { width: 100%; height: 100%; }
.v4s-hero-gv {
  position: absolute;
  left: 0; right: 0; bottom: 6px;
  text-align: center;
}
.v4s-hero-gv b {
  font: 800 42px/1 var(--display);
  color: var(--t1);
  letter-spacing: -.02em;
}
.v4s-hero-gv b sup {
  font-size: 18px;
  color: var(--t2);
  font-weight: 600;
  margin-left: 2px;
}
.v4s-hero-mt {
  font: 800 28px/1 var(--display);
  color: var(--cta);
  margin-top: 8px;
  letter-spacing: -.01em;
}
.v4s-hero-sub {
  font: 500 12.5px/1.5 'Inter', sans-serif;
  color: var(--t2);
  text-align: center;
  margin-top: 6px;
  max-width: 90%;
}
.v4s-hero-alert {
  margin-top: auto;
  background: rgba(248,113,113,.10);
  border: 1px solid rgba(248,113,113,.30);
  border-radius: 8px;
  padding: 10px 12px;
  color: var(--neg);
  font: 600 12.5px/1.4 'Inter', sans-serif;
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  margin-top: 10px;
}
.v4s-hero-alert .v4s-dot {
  width: 7px; height: 7px;
  background: var(--neg);
  border-radius: 50%;
  animation: v4sPulse 2s infinite;
}

/* v15.37 — Alerte impayés cliquable (drill-down) — sans width:100% qui cassait le grid */
body[data-dash-v4="on"] .v4s-hero-alert-clickable {
  cursor: pointer;
  transition: background .15s, border-color .15s, transform .15s;
}
body[data-dash-v4="on"] .v4s-hero-alert-clickable:hover {
  background: rgba(248,113,113,.18);
  border-color: rgba(248,113,113,.50);
  transform: translateY(-1px);
}
body[data-dash-v4="on"] .v4s-hero-alert-clickable:focus-visible {
  outline: 2px solid var(--acc);
  outline-offset: 1px;
}
body[data-dash-v4="on"] .v4s-hero-alert-arr {
  margin-left: auto;
  font-size: 14px;
  font-weight: 700;
}
@keyframes v4sPulse { 0%,100%{opacity:1} 50%{opacity:.5} }

/* Cash-flow */
.v4s-cash {
  background: var(--sur);
  border: 1px solid var(--bor);
  border-radius: var(--v4-rad);
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  cursor: pointer;
  transition: all .15s;
}
.v4s-cash:hover { border-color: rgba(255,255,255,.18); }
.v4s-cash-head { display: flex; align-items: center; gap: 10px; }
.v4s-cash-head .v4s-ey {
  font: 700 11px/1.2 var(--mono);
  letter-spacing: .14em;
  color: var(--t2);
  text-transform: uppercase;
}
.v4s-cash-head h3 {
  font: 700 16px/1 var(--display);
  color: var(--t1);
  margin-left: 6px;
}
.v4s-cash-head .v4s-pill {
  margin-left: auto;
  background: rgba(52,211,153,.14);
  color: var(--pos);
  font: 700 12px/1 var(--display);
  padding: 6px 10px;
  border-radius: 6px;
  letter-spacing: .02em;
}
.v4s-cash-head .v4s-pill.neg {
  background: rgba(248,113,113,.14);
  color: var(--neg);
}
.v4s-cash-kpis {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
.v4s-cash-kpi {
  background: var(--sur2);
  border: 1px solid var(--bor2);
  border-radius: 9px;
  padding: 9px 11px;
}
.v4s-cash-kpi s {
  font: 600 11px/1.2 var(--mono);
  letter-spacing: .10em;
  color: var(--t2);
  text-decoration: none;
  text-transform: uppercase;
}
.v4s-cash-kpi b {
  font: 800 22px/1.1 var(--display);
  display: block;
  margin-top: 5px;
  letter-spacing: -.01em;
}
.v4s-cash-kpi.pos b { color: var(--pos); }
.v4s-cash-kpi.neg b { color: var(--neg); }
.v4s-cash-chart { height: 90px; margin-top: auto; }
.v4s-cash-chart svg { display: block; width: 100%; height: 100%; }

/* Sujets à traiter */
.v4s-sjt {
  background: var(--sur);
  border: 1px solid var(--bor);
  border-radius: var(--v4-rad);
  padding: 14px 14px 8px;
  display: flex;
  flex-direction: column;
}
.v4s-sjt-ey {
  font: 700 11px/1.2 var(--mono);
  letter-spacing: .14em;
  color: var(--t2);
  text-transform: uppercase;
  margin-bottom: 4px;
}
.v4s-sjt h3 {
  font: 700 16px/1.2 var(--display);
  color: var(--t1);
  margin-bottom: 12px;
}
.v4s-sjt-it {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 8px 6px;
  border-bottom: 1px solid var(--bor2);
  cursor: pointer;
  background: transparent;
  border-left: 0; border-right: 0; border-top: 0;
  width: 100%;
  text-align: left;
  font: inherit;
  color: inherit;
  transition: background .15s;
}
.v4s-sjt-it:last-child { border-bottom: 0; }
.v4s-sjt-it:hover { background: rgba(255,255,255,.02); }
.v4s-sjt-it .v4s-n {
  width: 24px; height: 24px;
  border-radius: 50%;
  background: rgba(251,176,64,.18);
  color: var(--warn);
  font: 700 12.5px var(--display);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.v4s-sjt-it .v4s-tt {
  flex: 1;
  font: 600 13px/1.35 'Inter', sans-serif;
  color: var(--t1);
}
.v4s-sjt-it .v4s-tt em {
  display: block;
  font: 500 12px/1.35 'Inter', sans-serif;
  color: var(--t2);
  font-style: normal;
  margin-top: 2px;
}
.v4s-sjt-it .v4s-ar { color: var(--t2); font-size: 16px; }
.v4s-sjt-it:hover .v4s-ar { color: var(--cta); transform: translateX(2px); transition: .2s; }

/* ─── ROW 2 — 5 KPIs Bloomberg ─── */
.v4s-row2 {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 12px;
}
.v4s-k {
  background: var(--sur);
  border: 1px solid var(--bor);
  border-radius: var(--v4-rad);
  padding: 12px 13px;
  display: flex;
  flex-direction: column;
  gap: 5px;
  position: relative;
  overflow: hidden;
  min-height: 138px;
  cursor: pointer;
  text-align: left;
  font: inherit;
  color: inherit;
  transition: all .15s;
}
.v4s-k:hover { border-color: rgba(255,255,255,.18); transform: translateY(-1px); }
.v4s-k-lab {
  font: 700 11px/1.2 var(--mono);
  letter-spacing: .14em;
  color: var(--t2);
  text-transform: uppercase;
  display: flex;
  align-items: center;
  gap: 6px;
}
.v4s-k-lab .v4s-pill {
  margin-left: auto;
  font: 700 11px/1 var(--display);
  padding: 4px 7px;
  border-radius: 5px;
  letter-spacing: .02em;
}
.v4s-pill.pos { background: rgba(52,211,153,.14); color: var(--pos); }
.v4s-pill.neg { background: rgba(248,113,113,.14); color: var(--neg); }
.v4s-pill.neu { background: rgba(160,168,195,.14); color: var(--t2); }
.v4s-pill.warn { background: rgba(251,176,64,.14); color: var(--warn); }
.v4s-k-val {
  font: 800 26px/1 var(--display);
  color: var(--t1);
  margin-top: 3px;
  letter-spacing: -.02em;
}
.v4s-k-val.pos { color: var(--pos); }
.v4s-k-val.neg { color: var(--neg); }
.v4s-k-ctx {
  font: 500 12px/1.4 'Inter', sans-serif;
  color: var(--t2);
  min-height: 28px;
}
.v4s-k-spk { height: 32px; margin-top: auto; }
.v4s-k-spk svg { display: block; width: 100%; height: 100%; }
.v4s-k-ft {
  font: 500 11px/1.2 var(--mono);
  color: var(--t2);
  letter-spacing: .04em;
  margin-top: 4px;
}

/* v15.37 — Widget Projection annuelle : background gradient subtil */
body[data-dash-v4="on"] .v4s-k-projection {
  background: linear-gradient(135deg, var(--sur) 0%, var(--sur2) 100%);
  position: relative;
  overflow: hidden;
}
body[data-dash-v4="on"] .v4s-k-projection::before {
  content: '';
  position: absolute;
  top: 0; right: 0;
  width: 60%; height: 60%;
  background: radial-gradient(circle at top right, rgba(52,211,153,.12), transparent 70%);
  pointer-events: none;
  border-radius: var(--v4-rad);
}
body[data-dash-v4="on"] .v4s-k-projection > * {
  position: relative;
  z-index: 1;
}

/* ─── ENTVIEW (SCI / immeubles / lots colorés) ─── */
.v4s-entview {
  background: var(--sur);
  border: 1px solid var(--bor);
  border-radius: var(--v4-rad);
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.v4s-entview-head {
  display: flex;
  align-items: center;
  gap: 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--bor);
}
.v4s-entview-head .v4s-ic {
  width: 30px; height: 30px;
  border-radius: 8px;
  background: #5566aa;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font: 800 11px var(--display);
  flex-shrink: 0;
}
.v4s-entview-head h3 {
  font: 700 17px/1 var(--display);
  color: var(--t1);
}
.v4s-entview-head s {
  font: 500 12.5px/1 'Inter', sans-serif;
  color: var(--t2);
  text-decoration: none;
  margin-left: 4px;
}
.v4s-entview-head .v4s-kpis {
  margin-left: auto;
  display: flex;
  gap: 18px;
}
.v4s-entview-head .v4s-kp {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
.v4s-entview-head .v4s-kp s {
  font: 600 10.5px/1.2 var(--mono);
  letter-spacing: .10em;
  color: var(--t2);
  text-decoration: none;
  text-transform: uppercase;
}
.v4s-entview-head .v4s-kp b {
  font: 800 15.5px/1 var(--display);
  margin-top: 4px;
}
.v4s-entview-head .v4s-kp.pos b { color: var(--pos); }
.v4s-entview-head .v4s-kp.neg b { color: var(--neg); }
.v4s-entview-imm { display: flex; flex-direction: column; gap: 6px; }
.v4s-entview-imrow { display: flex; align-items: center; gap: 10px; }
.v4s-entview-imname {
  font: 600 12px/1.2 'Inter', sans-serif;
  color: var(--t1);
  width: 160px;
  flex-shrink: 0;
  text-transform: uppercase;
  letter-spacing: .05em;
  transition: color .15s;
}
.v4s-entview-imname:hover { color: var(--cta); }
/* v15.71 — Option 1 condensé : grid responsive + border-left coloré + icône carrée */
.v4s-entview-lots {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(165px, 1fr));
  gap: 5px;
  flex: 1;
}
.v4s-entview-lot {
  background: var(--sur2);
  border: 1px solid var(--bor);
  border-left: 3px solid var(--bor);
  border-radius: 8px;
  padding: 5px 8px;
  display: grid;
  grid-template-columns: 18px 1fr auto;
  gap: 6px;
  align-items: center;
  min-width: 0;
  cursor: pointer;
  transition: .15s;
}
.v4s-entview-lot:hover {
  transform: translateY(-1px);
  box-shadow: 0 1px 4px rgba(20,25,54,.06);
}
.v4s-entview-lot .v4s-st {
  width: 18px; height: 18px;
  border-radius: 5px;
  display: flex; align-items: center; justify-content: center;
  font: 700 11px/1 'Inter', sans-serif;
  color: #fff;
  flex-shrink: 0;
}
.v4s-entview-lot.ok { border-left-color: var(--pos); }
.v4s-entview-lot.ok .v4s-st { background: var(--pos); }
.v4s-entview-lot.warn { border-left-color: var(--warn); background: rgba(245,158,11,.04); }
.v4s-entview-lot.warn .v4s-st { background: var(--warn); }
.v4s-entview-lot.warn .v4s-am { color: var(--warn); font-weight: 700; }
.v4s-entview-lot.imp { border-left-color: var(--neg); background: rgba(239,68,68,.05); }
.v4s-entview-lot.imp .v4s-st { background: var(--neg); }
.v4s-entview-lot.imp .v4s-am { color: var(--neg); font-weight: 700; }
.v4s-entview-lot.imp:hover { background: rgba(239,68,68,.10); }
.v4s-entview-lot.vac { border-left-color: var(--t3); background: repeating-linear-gradient(45deg, var(--sur2) 0 5px, var(--bor2) 5px 10px); }
.v4s-entview-lot.vac .v4s-st { background: var(--t3); }
.v4s-entview-lot.vac .v4s-am { color: var(--t3); }
.v4s-entview-lot .v4s-nm {
  min-width: 0;
  display: flex; flex-direction: column; gap: 0;
}
.v4s-entview-lot .v4s-nm b {
  font: 700 11.5px/1.15 'Inter', sans-serif;
  color: var(--t1);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.v4s-entview-lot .v4s-nm s {
  font: 500 9.5px/1.2 'Inter', sans-serif;
  color: var(--t3);
  text-decoration: none;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.v4s-entview-lot .v4s-am {
  font: 700 11px/1 var(--mono);
  color: var(--t1);
  white-space: nowrap;
  text-align: right;
}

/* ─── SIDEBAR V4 (mode dashRenderV='v2') ─── */
/* v15.37 fix : override le gradient bleu nuit hardcoded de .sb-nav legacy pour
   utiliser var(--sur) qui s'adapte au thème (dark/sobre/coloré).
   Sinon, en sobre/coloré le texte foncé sur fond bleu nuit est illisible. */
body[data-dash-v4="on"] .sb-nav {
  font-family: 'Inter', sans-serif;
  /* CHROME SOMBRE CONSTANT (charte + maquette validée). Fond dark + RE-SCOPE des tokens
     → tous les enfants (nav, icônes, pastilles, headers, footer) utilisent var(--t1/--sur/...)
     donc deviennent clairs-sur-sombre AUTOMATIQUEMENT, en mode clair ET sombre. */
  background: #141925 !important;
  background-image: linear-gradient(180deg,#171c29 0%,#11151f 100%) !important;
  border-right: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: 1px 0 0 rgba(0,0,0,.28);
  color: #aab4c6;
  --bg: #141925;
  --sur: #1e222c;
  --sur2: rgba(255,255,255,.07);
  --sur3: rgba(255,255,255,.11);
  --bor: rgba(255,255,255,.10);
  --bor2: rgba(255,255,255,.06);
  --t1: #e6ebf3;
  --t2: #aab4c6;
  /* v15.694 CHARTE M-17 : titres de section / version / rôle / e-mail du menu compte
     #6c778c (3,77:1) → #818ca1 : ≥ 5,02 sur le dégradé, 4,70 sur --sur (menu compte PC),
     4,51 sur --sur2 en bas de barre (pied survolé / menu ouvert). */
  --t3: #818ca1;
  --neutral-soft: rgba(255,255,255,.08);
  --neutral-ink: #cdd6e3;
  /* Les 5 couleurs sémantiques suivent le chrome, pas le thème de la page. Sans ça, en
     thème clair, les valeurs calibrées POUR DU BLANC se retrouvent sur un fond #141925 :
     « Se déconnecter » tombait à 2,98 et --warn à 3,28. Valeurs du bloc [data-theme="dark"]. */
  --pos: #3fd6a3;  --pos-soft: rgba(63,214,163,.12);
  --neg: #ff7f7f;  --neg-soft: rgba(255,127,127,.12);
  --warn: #f1bd55; --warn-soft: rgba(241,189,85,.12);
  --info: #aeb9cb; --info-soft: rgba(174,185,203,.12);
  --adv: #7ab6ea;  --adv-bg: rgba(122,182,234,.16);
  --grn: #3fd6a3;  --red: #ff7f7f; --ora: #f1bd55; --pur: #8f7fc4;
  --grn-bg: rgba(63,214,163,.12);
  --red-bg: rgba(255,127,127,.12);
  --ora-bg: rgba(241,189,85,.12);
  --acc-bg: rgba(255,106,74,.12);
  --pur-bg: rgba(143,127,196,.12);
  --gry-bg: rgba(205,214,227,.14);
  --bg-success: rgba(63,214,163,.12);
  --bg-danger: rgba(255,127,127,.12);
  --bg-warning: rgba(241,189,85,.12);
  --bg-info: rgba(174,185,203,.12);
  --fg-success: #3fd6a3;
  --fg-danger: #ff7f7f;
  --fg-warning: #f1bd55;
  --fg-info: #aeb9cb;
}
/* Sidebar = CHROME SOMBRE CONSTANT (charte + maquette validée) — sombre aussi en thème clair. */
html[data-theme="sobre"] body[data-dash-v4="on"] .sb-nav,
html[data-theme="colore"] body[data-dash-v4="on"] .sb-nav {
  background: #141925 !important;
  background-image: linear-gradient(180deg,#171c29 0%,#11151f 100%) !important;
}
/* En SOMBRE : sidebar encore plus sombre que le fond (#14161d) pour la distinguer, comme la maquette. */
html[data-theme="dark"] body[data-dash-v4="on"] .sb-nav {
  background: #10131a !important;
  background-image: linear-gradient(180deg,#12151d 0%,#0d1016 100%) !important;
  --t1: #f2f5fa; --t2: #9aa6b8; --t3: #818ca1; /* v15.694 M-17 : #737e93 (4,46) → ≥ 4,51 partout (sur 4,70, pied survolé 4,77) */
}
body[data-dash-v4="on"] .v4s-sb-logo {
  font-family: var(--display);
  font-weight: 700; /* logo = Schibsted Grotesk Bold 700 (réf. business plan) */
  font-size: 14px;
  letter-spacing: .04em;
  color: var(--t1);
  padding: 4px 8px 14px;
  display: flex;
  align-items: center;
  gap: 8px;
}
/* Logo validé : image SVG vectorisée (brand-assets/propryo-logo-dark.svg), mot blanc sur chrome sombre. */
body[data-dash-v4="on"] .v4s-sb-logo .v4s-logo-img {
  height: 28px;
  width: auto;
  display: block;
}
body[data-dash-v4="on"] .v4s-sb-logo .v4s-prem {
  color: var(--cta);
  font-size: 9.5px;
  letter-spacing: .16em;
  background: rgba(255,90,60,.10);
  padding: 3px 6px;
  border-radius: 4px;
  margin-left: auto;
}
body[data-dash-v4="on"] .v4s-sb-version {
  font: 600 10px/1 var(--mono);
  color: var(--t3);
  letter-spacing: .12em;
  padding: 0 22px 12px;
  text-transform: uppercase;
}
body[data-dash-v4="on"] .v4s-sb-ent {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  padding: 0 8px 12px;
  border-bottom: 1px dashed var(--bor);
  margin-bottom: 10px;
}
body[data-dash-v4="on"] .v4s-sb-ent .v4s-e {
  border-radius: 999px;
  background: var(--sur2);
  border: 1px solid var(--bor);
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 3px 9px 3px 8px;
  cursor: pointer;
  position: relative;
  transition: .2s;
}
body[data-dash-v4="on"] .v4s-sb-ent .v4s-e:hover { border-color: rgba(255,255,255,.18); }
body[data-dash-v4="on"] .v4s-sb-ent .v4s-e b {
  font: 800 10px/1 var(--display);
  color: var(--t1);
  letter-spacing: .02em;
}
body[data-dash-v4="on"] .v4s-sb-ent .v4s-e s {
  font: 600 9.5px/1 'Inter', sans-serif;
  color: var(--t2);
  text-decoration: none;
}
body[data-dash-v4="on"] .v4s-sb-ent .v4s-e.act {
  background: rgba(255,106,74,.20);
  border-color: rgba(255,106,74,.55);
}
body[data-dash-v4="on"] .v4s-sb-ent .v4s-e.act b { color: var(--cta); }
body[data-dash-v4="on"] .v4s-sb-ent .v4s-e.add {
  border-style: dashed;
  color: var(--t3);
  font-size: 14px;
  line-height: 1;
  padding: 3px 11px;
}
/* v15.44 — Chip "Toutes" (reset filtre entité). Look distinct : étoile + couleur cta. */
body[data-dash-v4="on"] .v4s-sb-ent .v4s-e-all {
  background: linear-gradient(135deg, rgba(255,90,60,.06), rgba(255,90,60,.04));
}
body[data-dash-v4="on"] .v4s-sb-ent .v4s-e-all b {
  color: var(--cta);
  font-size: 15px;
}
body[data-dash-v4="on"] .v4s-sb-ent .v4s-e-all.act {
  background: linear-gradient(135deg, rgba(255,90,60,.10), rgba(255,90,60,.07));
}
body[data-dash-v4="on"] .v4s-sb-nav { flex: 1; overflow: auto; padding: 2px 0; }
body[data-dash-v4="on"] .v4s-sb-nav h6 {
  font: 600 9.5px/1 'Inter', sans-serif;
  letter-spacing: .14em;
  color: var(--t3);
  padding: 14px 10px 6px;
  text-transform: uppercase;
}
body[data-dash-v4="on"] .v4s-sb-nav .v4s-a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border-radius: 8px;
  color: var(--t2);
  font-size: 12.5px;
  font-weight: 500;
  text-decoration: none;
  margin-bottom: 1px;
  position: relative;
  cursor: pointer;
}
body[data-dash-v4="on"] .v4s-sb-nav .v4s-a .v4s-ic {
  width: 16px; height: 16px;
  display: inline-flex;
  justify-content: center;
  color: var(--t2);
}
body[data-dash-v4="on"] .v4s-sb-nav .v4s-a .v4s-ic svg {
  width: 16px; height: 16px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
body[data-dash-v4="on"] .v4s-sb-nav .v4s-a:hover { background: var(--sur2); color: var(--t1); }
body[data-dash-v4="on"] .v4s-sb-nav .v4s-a.act { background: var(--sur2); color: var(--t1); font-weight: 600; }
body[data-dash-v4="on"] .v4s-sb-nav .v4s-a.act .v4s-ic { color: var(--cta); }
body[data-dash-v4="on"] .v4s-sb-nav .v4s-a.act::before {
  content: "";
  position: absolute;
  left: 0; top: 8px; bottom: 8px;
  width: 2px;
  background: var(--cta);
  border-radius: 0 2px 2px 0;
}
body[data-dash-v4="on"] .v4s-sb-nav .v4s-a .v4s-bd {
  margin-left: auto;
  background: var(--sur3);
  color: var(--t2);
  font: 600 9.5px/1 var(--mono);
  padding: 2px 6px;
  border-radius: 8px;
}
/* ─── NAV-SOUS-MENUS (chantier A) — sous-menus dépliables des onglets-groupes ─── */
body[data-dash-v4="on"] .v4s-sb-nav .v4s-lb { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body[data-dash-v4="on"] .v4s-sb-nav .v4s-a.parent.has-active .v4s-ic { color: var(--cta); }
body[data-dash-v4="on"] .v4s-sb-nav .v4s-a .v4s-chev {
  margin-left: auto; width: 18px; height: 18px; flex: 0 0 auto;
  display: inline-flex; align-items: center; justify-content: center;
  color: var(--t3); border-radius: 5px; cursor: pointer;
  transition: transform .18s ease, background .15s, color .15s;
}
body[data-dash-v4="on"] .v4s-sb-nav .v4s-a .v4s-chev svg { width: 13px; height: 13px; stroke: currentColor; fill: none; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
body[data-dash-v4="on"] .v4s-sb-nav .v4s-a .v4s-chev:hover { background: var(--sur3); color: var(--t1); }
body[data-dash-v4="on"] .v4s-sb-nav .v4s-a.open .v4s-chev { transform: rotate(90deg); }
body[data-dash-v4="on"] .v4s-sub { max-height: 0; overflow: hidden; transition: max-height .22s ease; }
body[data-dash-v4="on"] .v4s-a.open + .v4s-sub { max-height: 260px; }
body[data-dash-v4="on"] .v4s-sub-in { margin: 1px 0 3px 19px; padding-left: 12px; border-left: 1.5px solid var(--bor); }
body[data-dash-v4="on"] .v4s-sub .v4s-child {
  display: flex; align-items: center; gap: 9px; padding: 6px 9px; border-radius: 7px;
  color: var(--t3); font-size: 12px; font-weight: 500; margin-bottom: 1px; position: relative; cursor: pointer;
}
body[data-dash-v4="on"] .v4s-sub .v4s-child .v4s-ic { width: 14px; height: 14px; display: inline-flex; justify-content: center; color: var(--t3); flex: 0 0 auto; }
body[data-dash-v4="on"] .v4s-sub .v4s-child .v4s-ic svg { width: 14px; height: 14px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
body[data-dash-v4="on"] .v4s-sub .v4s-child:hover { background: var(--sur2); color: var(--t1); }
body[data-dash-v4="on"] .v4s-sub .v4s-child.act { background: var(--sur2); color: var(--t1); font-weight: 600; }
body[data-dash-v4="on"] .v4s-sub .v4s-child.act .v4s-ic { color: var(--cta); }
body[data-dash-v4="on"] .v4s-sub .v4s-child.act::before { content: ""; position: absolute; left: -13.5px; top: 6px; bottom: 6px; width: 2px; background: var(--cta); border-radius: 2px; }
body[data-dash-v4="on"] .v4s-sub .v4s-child .v4s-bd { margin-left: auto; background: var(--sur3); color: var(--t2); font: 600 9px/1 var(--mono); padding: 1px 5px; border-radius: 7px; }
body[data-dash-v4="on"] .v4s-sb-foot {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 8px;
  border-top: 1px solid var(--bor);
  margin-top: 6px;
}
body[data-dash-v4="on"] .v4s-sb-foot .v4s-av {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: #5566aa;
  display: flex;
  align-items: center;
  justify-content: center;
  font: 700 12px var(--display);
  color: #fff;
}
body[data-dash-v4="on"] .v4s-sb-foot b {
  font: 600 13.5px 'Inter', sans-serif;
  color: var(--t1);
  display: block;
}
body[data-dash-v4="on"] .v4s-sb-foot s {
  font: 500 11.5px 'Inter', sans-serif;
  color: var(--t2);
  text-decoration: none;
  display: block;
}
body[data-dash-v4="on"] .v4s-foot-info { flex: 1; min-width: 0; overflow: hidden; }

/* v15.37 — Chip utilisateur DK dans zone fixed top-right (à côté de drive-fab) */
.v4s-user-chip {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 4px 11px 4px 4px;
  border-radius: 18px;
  background: var(--sur2);
  border: 1px solid var(--bor);
  font-size: 11.5px;
  cursor: pointer;
  user-select: none;
  transition: all .15s;
  max-width: 180px;
}
.v4s-user-chip:hover {
  border-color: var(--cta);
  transform: translateY(-1px);
}
.v4s-user-chip .v4s-uc-av {
  width: 24px; height: 24px;
  border-radius: 50%;
  background: #5566aa;
  display: flex;
  align-items: center;
  justify-content: center;
  font: 700 10.5px var(--display);
  color: #fff;
  flex-shrink: 0;
  letter-spacing: .02em;
}
.v4s-user-chip .v4s-uc-name {
  font: 600 12px 'Inter', sans-serif;
  color: var(--t1);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* v15.37 — Sélecteur de thème : 3 boutons visibles (sobre / coloré / dark) */
body[data-dash-v4="on"] .v4s-theme-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6px;
  padding: 10px 14px 14px;
  margin: 0 4px;
}
body[data-dash-v4="on"] .v4s-theme-btn {
  height: 34px;
  border-radius: 8px;
  border: 1px solid var(--bor);
  background: var(--sur2);
  color: var(--t2);
  font: 600 16px 'Inter', sans-serif;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all .15s;
  padding: 0;
}
body[data-dash-v4="on"] .v4s-theme-btn:hover {
  border-color: var(--cta);
  color: var(--t1);
  transform: translateY(-1px);
}
body[data-dash-v4="on"] .v4s-theme-btn.act {
  /* v15.38 : outline subtle + couleur cta (au lieu de fond gradient "vert plein") */
  background: var(--sur);
  border-color: var(--cta);
  color: var(--t1);
  box-shadow: inset 0 0 0 1.5px var(--cta);
}
body[data-dash-v4="on"] .v4s-theme-btn:focus-visible {
  outline: 2px solid var(--acc);
  outline-offset: 1px;
}
/* Hide ancien sidebar en mode V4 */
body[data-dash-v4="on"] .sb-nav .sb-logo,
body[data-dash-v4="on"] .sb-nav > .sb-section,
body[data-dash-v4="on"] .sb-nav > #sb-pinned-ents,
body[data-dash-v4="on"] .sb-nav > #sb-user-footer,
body[data-dash-v4="on"] .sb-nav > .sb-collapse-btn,
body[data-dash-v4="on"] .sb-nav .sb-footer {
  display: none !important;
}
/* v15.38 — Fix layout : .layout (parent sidebar) doit respecter les bannières
   top (readonly-banner en prod 50px, sandbox-banner en test 36px, etc.).
   --top-banners-h calculée en JS via _v4SyncBannersHeight() (cf index-test.html). */
body[data-dash-v4="on"] .layout {
  height: calc(100vh - var(--top-banners-h, 0px)) !important;
}
body[data-dash-v4="on"] .sb-nav {
  padding: 14px 0 0;
  display: flex;
  flex-direction: column;
  height: 100%;
  max-height: 100%;
}
body[data-dash-v4="on"] .v4s-sb-logo { padding: 4px 18px 8px; min-height: auto; flex-shrink: 0; }
body[data-dash-v4="on"] .v4s-sb-version { flex-shrink: 0; }
body[data-dash-v4="on"] .v4s-sb-ent { margin-bottom: 8px; padding-bottom: 8px; flex-shrink: 0; }
body[data-dash-v4="on"] .v4s-sb-nav {
  padding-bottom: 4px;
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
}
body[data-dash-v4="on"] .v4s-sb-nav .v4s-a { padding: 7px 18px; }
body[data-dash-v4="on"] .v4s-sb-nav h6 { padding: 10px 18px 4px; }
body[data-dash-v4="on"] .v4s-theme-row {
  border-top: 1px solid var(--bor);
  padding: 10px 14px 12px;
  flex-shrink: 0;
}
body[data-dash-v4="on"] .v4s-sb-userfoot { flex-shrink: 0; }

/* ─── Responsive V4 Stripe DASHBOARD (v15.56 audit complet) ─── */

/* TABLET LANDSCAPE (1024-1279px) : layout proche desktop mais plus serré */
@media (min-width: 1024px) and (max-width: 1279px) {
  body[data-dash-v4="on"] .v4s-row1 {
    grid-template-columns: 1fr 1.4fr;
    grid-template-rows: auto auto;
  }
  body[data-dash-v4="on"] .v4s-row1 .v4s-sjt {
    grid-column: 1 / 3;
    grid-row: 2;
  }
  body[data-dash-v4="on"] .v4s-row2 { grid-template-columns: repeat(5, 1fr); gap: 8px; }
  body[data-dash-v4="on"] .v4s-coach-cards { grid-template-columns: repeat(2, 1fr); }
  body[data-dash-v4="on"] .v4s-coach-c:nth-child(3) { display: none; }
}

/* TABLET PORTRAIT (768-1023px) */
@media (min-width: 768px) and (max-width: 1023px) {
  body[data-dash-v4="on"] .v4s-row1 {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto auto;
  }
  body[data-dash-v4="on"] .v4s-row1 .v4s-sjt {
    grid-column: 1 / 3;
    grid-row: 2;
  }
  body[data-dash-v4="on"] .v4s-row2 { grid-template-columns: repeat(3, 1fr); gap: 8px; }
  body[data-dash-v4="on"] .v4s-row2 .v4s-k:nth-child(4) { grid-column: 1 / 3; }
  body[data-dash-v4="on"] .v4s-row2 .v4s-k:nth-child(5) { grid-column: 3 / 4; }
  body[data-dash-v4="on"] .v4s-coach-cards { grid-template-columns: repeat(2, 1fr); }
  body[data-dash-v4="on"] .v4s-coach-c:nth-child(3) { display: none; }
  /* Entity view : grid lots plus serré */
  body[data-dash-v4="on"] .v4s-entview-imname { width: 130px; }
  body[data-dash-v4="on"] .v4s-entview-lot { max-width: 160px; }
}
@media (max-width: 767px) {
  body[data-dash-v4="on"] .v4s-coach {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    padding: 12px;
  }
  body[data-dash-v4="on"] .v4s-coach-left { flex: none; }
  body[data-dash-v4="on"] .v4s-coach-cards { grid-template-columns: 1fr; }
  body[data-dash-v4="on"] .v4s-coach-cta { width: 100%; }
  body[data-dash-v4="on"] .v4s-row1 { grid-template-columns: 1fr; gap: 10px; }
  body[data-dash-v4="on"] .v4s-row2 { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  body[data-dash-v4="on"] .v4s-row2 .v4s-k:nth-child(5) { grid-column: span 2; }
  body[data-dash-v4="on"] .v4s-entview-head { flex-wrap: wrap; }
  body[data-dash-v4="on"] .v4s-entview-head .v4s-kpis {
    width: 100%;
    justify-content: space-between;
    margin-left: 0;
    margin-top: 6px;
  }
  body[data-dash-v4="on"] .v4s-entview-imname { width: 100%; }

  /* v15.40 — Mobile : fixes overflow / compaction topbar */

  /* Topbar : compact + 1 ligne autant que possible */
  body[data-dash-v4="on"] .v4s-tb-controls {
    gap: 6px;
    row-gap: 4px;
  }
  body[data-dash-v4="on"] .v4s-tb-controls .v4s-tb-label { display: none; }
  body[data-dash-v4="on"] .v4s-tb-controls select {
    padding: 5px 7px;
    font-size: 12px;
  }
  body[data-dash-v4="on"] .v4s-tb-sep { margin: 0; }
  body[data-dash-v4="on"] .v4s-mode-btn { padding: 4px 8px; font-size: 11px; }
  body[data-dash-v4="on"] .v4s-mode-btn .v4s-mode-lbl { display: none; }
  body[data-dash-v4="on"] .v4s-mode-btn.act .v4s-mode-lbl { display: inline; }
  body[data-dash-v4="on"] .v4s-theme-tb-row .v4s-theme-btn { width: 28px; height: 24px; }

  /* Cash-flow KPIs : empile en 1 colonne (sinon overflow valeurs) */
  body[data-dash-v4="on"] .v4s-cash-kpis { grid-template-columns: 1fr; gap: 6px; }
  body[data-dash-v4="on"] .v4s-cash-kpi { padding: 7px 9px; }
  body[data-dash-v4="on"] .v4s-cash-kpi b { font-size: 18px; }

  /* Hero V4 dashboard : padding réduit + gauge SVG plus petit */
  body[data-dash-v4="on"] .v4s-hero { padding: 14px 16px; }
  body[data-dash-v4="on"] .v4s-hero-gauge svg { max-width: 160px; height: auto; }
  body[data-dash-v4="on"] .v4s-hero-gv b { font-size: 36px; }
  body[data-dash-v4="on"] .v4s-hero-mt { font-size: 22px; }
  body[data-dash-v4="on"] .v4s-hero-sub { font-size: 11px; }

  /* Cash-flow : sparkline plus courte */
  body[data-dash-v4="on"] .v4s-cash-chart { height: 70px; }
  body[data-dash-v4="on"] .v4s-cash h3 { font-size: 14px; }

  /* Sujets à traiter (sjt) : compact */
  body[data-dash-v4="on"] .v4s-sjt h3 { font-size: 14px; }
  body[data-dash-v4="on"] .v4s-sjt-it { padding: 8px 10px; }

  /* KPI tiles (row2) : titre + valeur plus petits */
  body[data-dash-v4="on"] .v4s-k { padding: 10px 12px; }
  body[data-dash-v4="on"] .v4s-k-v { font-size: 18px !important; }
  body[data-dash-v4="on"] .v4s-k-ey { font-size: 9px; }
  body[data-dash-v4="on"] .v4s-k-s { font-size: 10px; }

  /* Entité card : header compact */
  body[data-dash-v4="on"] .v4s-entview { padding: 12px 14px; }
  body[data-dash-v4="on"] .v4s-entview-head h3 { font-size: 14px; }
  body[data-dash-v4="on"] .v4s-entview-head .v4s-kp b { font-size: 12px; }

  /* Entity lots : passe de flex-wrap à grid 3 cols (évite overflow refs longs) */
  body[data-dash-v4="on"] .v4s-entview-lots {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 5px;
  }
  body[data-dash-v4="on"] .v4s-entview-lot { max-width: none; padding: 5px 7px; }
  body[data-dash-v4="on"] .v4s-entview-lot .v4s-nm { font-size: 11px; }
  body[data-dash-v4="on"] .v4s-entview-lot .v4s-am { font-size: 10px; }

  /* Entité view : nom immeuble au-dessus des lots (au lieu de côte à côte) */
  body[data-dash-v4="on"] .v4s-entview-imrow {
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
  }
  body[data-dash-v4="on"] .v4s-entview-imname {
    width: 100%;
    margin-bottom: 2px;
  }
  body[data-dash-v4="on"] .v4s-entview-lot { max-width: none; }
}

/* ════════════════════════════════════════════════════════════════════════
   v15.43 — PAGE ACCUEIL (#p-accueil)
   Page d'entrée pour TOUS les modes. Replace dashboard en mode Solo.
   4 sections : hero météo · 4 QA tiles (2×2) · donut payés/impayés · À traiter en carrés.
   ════════════════════════════════════════════════════════════════════════ */

body[data-dash-v4="on"] #p-accueil { padding: 0; }
body[data-dash-v4="on"] .v4h {
  display: flex;
  flex-direction: column;
  gap: 20px;
  max-width: 1600px;
  margin: 0 auto;
}

/* Hero météo — XL */
body[data-dash-v4="on"] .v4h-hero {
  background: var(--sur);
  border: 1px solid var(--bor);
  border-radius: 20px;
  padding: 26px 32px;
  display: flex;
  align-items: center;
  gap: 26px;
  box-shadow: 0 1px 3px rgba(20,25,54,.04);
}
/* v15.reskin — hero-ic : pastille neutre + SVG (remplace l'emoji) */
body[data-dash-v4="on"] .v4h-hero-ic {
  flex-shrink: 0;
  width: 88px; height: 88px;
  border-radius: 20px;
  background: var(--sur2);
  color: var(--t2);
  display: flex; align-items: center; justify-content: center;
}
body[data-dash-v4="on"] .v4h-hero-ic svg {
  width: 48px; height: 48px;
  stroke: currentColor; fill: none; stroke-width: 2.4;
  stroke-linecap: round; stroke-linejoin: round;
}
/* couleur ambre douce pour le soleil (météo = sémantique, pas accent) */
body[data-dash-v4="on"] .v4h-hero-ic svg .sun { color: var(--fg-warning, #b27a12); }
body[data-dash-v4="on"] .v4h-hero-info { flex: 1; min-width: 0; }
body[data-dash-v4="on"] .v4h-hero h2 {
  font-family: var(--display);
  font-size: 28px;
  font-weight: 800;
  line-height: 1.2;
  color: var(--t1);
  margin-bottom: 4px;
  letter-spacing: -.02em;
}
body[data-dash-v4="on"] .v4h-hero-sub {
  font: 500 15px/1.4 'Inter', sans-serif;
  color: var(--t2);
  margin-bottom: 16px;
}
body[data-dash-v4="on"] .v4h-hero-kpis { display: flex; gap: 36px; flex-wrap: wrap; }
body[data-dash-v4="on"] .v4h-hero-kpi b {
  font-family: var(--display);
  font-size: 22px;
  font-weight: 800;
  line-height: 1;
  color: var(--t1);
  letter-spacing: -.02em;
}
/* v15.reskin — KPI Reçu (class .key) en corail accent */
body[data-dash-v4="on"] .v4h-hero-kpi.key b { color: var(--acc); }
body[data-dash-v4="on"] .v4h-hero-kpi b.pos { color: var(--pos); }
body[data-dash-v4="on"] .v4h-hero-kpi b.neg { color: var(--neg); }
body[data-dash-v4="on"] .v4h-hero-kpi s {
  font: 600 10.5px/1 var(--mono);
  color: var(--t3);
  letter-spacing: .12em;
  text-transform: uppercase;
  text-decoration: none;
  display: block;
  margin-top: 6px;
}

/* Row 1 : 4 QA + Donut */
body[data-dash-v4="on"] .v4h-row1 {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 20px;
}

/* 4 QA tiles (2×2) — XL */
body[data-dash-v4="on"] .v4h-qa-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}
body[data-dash-v4="on"] .v4h-qa {
  background: var(--sur);
  border: 1px solid var(--bor);
  border-radius: 16px;
  padding: 24px 22px;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 14px;
  transition: transform .15s, box-shadow .15s, border-color .15s;
  text-decoration: none;
  color: inherit;
  text-align: left;
  font-family: inherit;
  min-height: 130px;
}
body[data-dash-v4="on"] .v4h-qa:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 18px rgba(20,25,54,.10);
  border-color: var(--cta);
}
/* v15.reskin — pastilles neutres (plus de gradients multicolores t1/t2/t3/t4) */
body[data-dash-v4="on"] .v4h-qa-ic {
  width: 56px; height: 56px;
  border-radius: 14px;
  display: flex; align-items: center; justify-content: center;
  background: var(--neutral-soft); color: var(--neutral-ink);
}
body[data-dash-v4="on"] .v4h-qa-ic svg {
  width: 24px; height: 24px;
  stroke: currentColor; fill: none; stroke-width: 2;
  stroke-linecap: round; stroke-linejoin: round;
}
/* t1-t4 : toutes identiques neutres (annule les anciens gradients) */
body[data-dash-v4="on"] .v4h-qa.t1 .v4h-qa-ic,
body[data-dash-v4="on"] .v4h-qa.t2 .v4h-qa-ic,
body[data-dash-v4="on"] .v4h-qa.t3 .v4h-qa-ic,
body[data-dash-v4="on"] .v4h-qa.t4 .v4h-qa-ic { background: var(--neutral-soft); color: var(--neutral-ink); }
body[data-dash-v4="on"] .v4h-qa b {
  font: 700 16px/1.2 var(--display);
  color: var(--t1);
  display: block;
}
body[data-dash-v4="on"] .v4h-qa s {
  font: 500 13px/1.4 'Inter', sans-serif;
  color: var(--t3);
  text-decoration: none;
}

/* Donut payés/impayés — XL */
body[data-dash-v4="on"] .v4h-donut {
  background: var(--sur);
  border: 1px solid var(--bor);
  border-radius: 16px;
  padding: 22px 24px;
  box-shadow: 0 1px 3px rgba(20,25,54,.04);
  display: flex;
  flex-direction: column;
}
body[data-dash-v4="on"] .v4h-donut-h {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 18px;
}
body[data-dash-v4="on"] .v4h-donut-h h3 {
  font: 700 17px/1.2 var(--display);
  color: var(--t1);
}
body[data-dash-v4="on"] .v4h-donut-h .v4h-small {
  font: 500 12px/1 'Inter', sans-serif;
  color: var(--t3);
}
body[data-dash-v4="on"] .v4h-donut-wrap {
  display: flex; align-items: center; gap: 26px;
  flex: 1;
}
body[data-dash-v4="on"] .v4h-donut-wrap svg { flex-shrink: 0; }
body[data-dash-v4="on"] .v4h-donut-info {
  flex: 1; min-width: 0;
  display: flex; flex-direction: column; gap: 8px;
}
body[data-dash-v4="on"] .v4h-donut-vl {
  font: 800 32px/1 var(--display);
  color: var(--pos);
  margin-bottom: 6px;
  letter-spacing: -.01em;
}
body[data-dash-v4="on"] .v4h-donut-row {
  display: flex; align-items: center; gap: 10px;
  padding: 9px 12px;
  border-radius: 10px;
  font: 500 13px/1.35 'Inter', sans-serif;
  color: var(--t2);
  border: 1px solid transparent;
  transition: background .15s, border-color .15s;
}
/* P4 reskin : point → badge pill sémantique (mockup Propryo) */
body[data-dash-v4="on"] .v4h-donut-row .v4h-dot {
  width: 8px; height: 8px; border-radius: 50%;
  flex-shrink: 0;
}
body[data-dash-v4="on"] .v4h-donut-row b {
  color: var(--t1); font-weight: 700; margin-right: 2px;
}
body[data-dash-v4="on"] .v4h-donut-row .v4h-am {
  margin-left: auto; font: 700 12px/1 var(--display); color: var(--t1);
  letter-spacing: -.01em;
}
/* badge pill statut (P4) : s'applique aux spans enfants avec data-badge */
body[data-dash-v4="on"] .v4h-badge {
  display: inline-flex; align-items: center;
  padding: 2px 8px; border-radius: 999px;
  font: 700 9.5px/1 'Inter',sans-serif;
  text-transform: uppercase; letter-spacing: .04em;
  border: 1px solid transparent; white-space: nowrap;
}
body[data-dash-v4="on"] .v4h-badge.paid  { background: var(--bg-success); color: var(--pos);        border-color: var(--pos); }
body[data-dash-v4="on"] .v4h-badge.warn  { background: var(--warn-soft,var(--bg-warning)); color: var(--fg-warning); border-color: var(--fg-warning); }
body[data-dash-v4="on"] .v4h-badge.bad   { background: var(--bg-danger); color: var(--neg);          border-color: var(--neg); }
body[data-dash-v4="on"] .v4h-badge.neu   { background: var(--sur2);      color: var(--t3);           border-color: var(--bor); }
body[data-dash-v4="on"] .v4h-donut-row.pos .v4h-dot { background: var(--pos); }
body[data-dash-v4="on"] .v4h-donut-row.neg {
  background: rgba(239,68,68,.04);
  border-color: rgba(239,68,68,.18);
  cursor: pointer;
}
body[data-dash-v4="on"] .v4h-donut-row.neg:hover {
  background: rgba(239,68,68,.10);
  border-color: rgba(239,68,68,.35);
}
body[data-dash-v4="on"] .v4h-donut-row.neg .v4h-dot { background: var(--neg); }
body[data-dash-v4="on"] .v4h-donut-row.neg .v4h-am { color: var(--neg); }
body[data-dash-v4="on"] .v4h-donut-row.neg .v4h-chev {
  color: var(--neg); font-weight: 700;
  font-size: 14px; margin-left: 6px;
}
body[data-dash-v4="on"] .v4h-donut-row.vac .v4h-dot { background: #8B95AB; }
body[data-dash-v4="on"] .v4h-donut-row.vac { color: var(--t3); }
body[data-dash-v4="on"] .v4h-donut-row.vac .v4h-am { color: var(--t3); }

/* À traiter — grid de carrés (XL : 5 cols visibles, hauteur plus grande) */
body[data-dash-v4="on"] .v4h-todo {
  background: var(--sur);
  border: 1px solid var(--bor);
  border-radius: 16px;
  padding: 20px 22px;
  box-shadow: 0 1px 3px rgba(20,25,54,.04);
}
body[data-dash-v4="on"] .v4h-todo-h {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 16px;
}
body[data-dash-v4="on"] .v4h-todo-h h3 {
  font: 700 17px/1.2 var(--display);
  color: var(--t1);
}
body[data-dash-v4="on"] .v4h-todo-h .v4h-pill {
  background: rgba(255,90,60,.10);
  color: var(--cta);
  font: 600 12px/1 'Inter', sans-serif;
  padding: 5px 11px;
  border-radius: 9px;
}
body[data-dash-v4="on"] .v4h-todo-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 8px;
  max-height: 380px;
  overflow-y: auto;
  padding-right: 4px;
}
body[data-dash-v4="on"] .v4h-todo-grid::-webkit-scrollbar { width: 6px; }
body[data-dash-v4="on"] .v4h-todo-grid::-webkit-scrollbar-thumb { background: var(--bor); border-radius: 3px; }

body[data-dash-v4="on"] .v4h-sq {
  background: var(--sur2);
  border: 1px solid var(--bor);
  border-radius: 11px;
  padding: 11px 13px;
  cursor: pointer;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px;
  align-items: center;
  transition: .15s;
  position: relative;
  min-height: 0;
  font-family: inherit;
  text-align: left;
  color: inherit;
}
body[data-dash-v4="on"] .v4h-sq:hover {
  border-color: var(--cta);
  background: var(--sur);
  transform: translateY(-1px);
  box-shadow: 0 2px 6px rgba(20,25,54,.06);
}
/* v15.reskin — sq-ic : SVG inline + pastilles sémantiques soft (plus de gradients) */
body[data-dash-v4="on"] .v4h-sq-ic {
  width: 32px; height: 32px;
  border-radius: 8px;
  background: var(--sur3, var(--sur2));
  color: var(--t2);
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
body[data-dash-v4="on"] .v4h-sq-ic svg {
  width: 16px; height: 16px;
  stroke: currentColor; fill: none; stroke-width: 2;
  stroke-linecap: round; stroke-linejoin: round;
}
body[data-dash-v4="on"] .v4h-sq-ic.b-impaye { background: var(--bg-danger, rgba(239,68,68,.12)); color: var(--neg); }
body[data-dash-v4="on"] .v4h-sq-ic.b-ass    { background: var(--bg-danger, rgba(239,68,68,.12)); color: var(--neg); }
body[data-dash-v4="on"] .v4h-sq-ic.b-irl    { background: var(--bg-success, rgba(16,185,129,.12)); color: var(--pos); }
body[data-dash-v4="on"] .v4h-sq-ic.b-regul  { background: var(--warn-soft, rgba(245,158,11,.12)); color: var(--fg-warning, #b27a12); }
body[data-dash-v4="on"] .v4h-sq-ic.b-edl    { background: rgba(139,92,246,.12); color: #8B5CF6; }
body[data-dash-v4="on"] .v4h-sq-info {
  min-width: 0;
  display: flex; flex-direction: column; gap: 1px;
}
body[data-dash-v4="on"] .v4h-sq b {
  font: 700 13px/1.3 'Inter', sans-serif;
  color: var(--t1);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
body[data-dash-v4="on"] .v4h-sq s {
  font: 500 11.5px/1.3 'Inter', sans-serif;
  color: var(--t3); text-decoration: none;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
body[data-dash-v4="on"] .v4h-sq.urg {
  background: rgba(239,68,68,.04);
  border-color: rgba(239,68,68,.15);
}
body[data-dash-v4="on"] .v4h-sq.urg:hover {
  background: rgba(239,68,68,.08);
  border-color: rgba(239,68,68,.35);
}
body[data-dash-v4="on"] .v4h-sq-urgent {
  position: absolute;
  top: 6px; right: 6px;
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--neg);
}
body[data-dash-v4="on"] .v4h-todo-empty {
  padding: 30px 20px; text-align: center;
  color: var(--t3); font-size: 13px;
}

/* ════════════════════════════════════════════════════════════════════════
   v15.54 — RESPONSIVE PAGE ACCUEIL (mockup user validé : mobile + tablette)
   - Desktop ≥1280px : XL (specs originales du #p-accueil)
   - Tablette landscape 1024-1279px : row1 1.1fr+1fr, à traiter 4 cols, donut 150
   - Tablette portrait 768-1023px : row1 1fr+1fr, à traiter 3 cols, donut 130, hero medium
   - Mobile ≤767px : row1 stack 1 col, à traiter 2 cols, donut 100, hero compact
   ════════════════════════════════════════════════════════════════════════ */

/* TABLET LANDSCAPE (1024-1279px) */
@media (min-width: 1024px) and (max-width: 1279px) {
  body[data-dash-v4="on"] .v4h { max-width: 100%; gap: 14px; }
  body[data-dash-v4="on"] .v4h-row1 { grid-template-columns: 1.1fr 1fr; gap: 14px; }
  body[data-dash-v4="on"] .v4h-hero { padding: 20px 24px; gap: 20px; }
  body[data-dash-v4="on"] .v4h-hero-ic { font-size: 62px; }
  body[data-dash-v4="on"] .v4h-hero h2 { font-size: 22px; }
  body[data-dash-v4="on"] .v4h-hero-kpi b { font-size: 18px; }
  body[data-dash-v4="on"] .v4h-qa { padding: 18px 16px; min-height: 110px; }
  body[data-dash-v4="on"] .v4h-qa-ic { width: 48px; height: 48px; font-size: 22px; }
  body[data-dash-v4="on"] .v4h-qa b { font-size: 14px; }
  body[data-dash-v4="on"] .v4h-donut svg { width: 150px; height: 150px; }
  body[data-dash-v4="on"] .v4h-donut-vl { font-size: 26px; }
  body[data-dash-v4="on"] .v4h-todo-grid { grid-template-columns: repeat(4, 1fr); max-height: 300px; }
}

/* TABLET PORTRAIT (768-1023px) */
@media (min-width: 768px) and (max-width: 1023px) {
  body[data-dash-v4="on"] .v4h { max-width: 100%; gap: 12px; }
  body[data-dash-v4="on"] .v4h-row1 { grid-template-columns: 1fr 1fr; gap: 12px; }
  body[data-dash-v4="on"] .v4h-hero { padding: 18px 22px; gap: 18px; }
  body[data-dash-v4="on"] .v4h-hero-ic { font-size: 56px; }
  body[data-dash-v4="on"] .v4h-hero h2 { font-size: 20px; }
  body[data-dash-v4="on"] .v4h-hero-sub { font-size: 12.5px; }
  body[data-dash-v4="on"] .v4h-hero-kpi b { font-size: 17px; }
  body[data-dash-v4="on"] .v4h-qa { padding: 16px; min-height: 108px; }
  body[data-dash-v4="on"] .v4h-qa-ic { width: 44px; height: 44px; font-size: 20px; }
  body[data-dash-v4="on"] .v4h-qa b { font-size: 14px; }
  body[data-dash-v4="on"] .v4h-donut svg { width: 130px; height: 130px; }
  body[data-dash-v4="on"] .v4h-donut-vl { font-size: 24px; }
  body[data-dash-v4="on"] .v4h-todo-grid { grid-template-columns: repeat(3, 1fr); max-height: 280px; }
  body[data-dash-v4="on"] .v4h-sq { padding: 8px 10px; }
  body[data-dash-v4="on"] .v4h-sq-ic { width: 26px; height: 26px; font-size: 13px; }
  body[data-dash-v4="on"] .v4h-sq b { font-size: 11.5px; }
}

/* MOBILE ≤767px */
@media (max-width: 767px) {
  body[data-dash-v4="on"] .v4h { gap: 10px; }
  /* Hero compact */
  body[data-dash-v4="on"] .v4h-hero { padding: 14px 16px; gap: 12px; border-radius: 14px; }
  body[data-dash-v4="on"] .v4h-hero-ic { font-size: 42px; }
  body[data-dash-v4="on"] .v4h-hero h2 { font-size: 17px; }
  body[data-dash-v4="on"] .v4h-hero-sub { font-size: 11.5px; margin-bottom: 8px; }
  body[data-dash-v4="on"] .v4h-hero-kpis { gap: 14px; }
  body[data-dash-v4="on"] .v4h-hero-kpi b { font-size: 13px; }
  body[data-dash-v4="on"] .v4h-hero-kpi s { font-size: 8.5px; margin-top: 3px; }
  /* Row1 stack vertical (QA puis donut) */
  body[data-dash-v4="on"] .v4h-row1 { grid-template-columns: 1fr; gap: 10px; }
  /* QA 2x2 compact */
  body[data-dash-v4="on"] .v4h-qa-grid { grid-template-columns: 1fr 1fr; gap: 8px; }
  body[data-dash-v4="on"] .v4h-qa { padding: 12px; min-height: 96px; border-radius: 12px; gap: 8px; }
  body[data-dash-v4="on"] .v4h-qa-ic { width: 38px; height: 38px; font-size: 17px; border-radius: 10px; }
  body[data-dash-v4="on"] .v4h-qa b { font-size: 12.5px; }
  body[data-dash-v4="on"] .v4h-qa s { font-size: 10.5px; }
  /* Donut compact */
  body[data-dash-v4="on"] .v4h-donut { padding: 12px 14px; border-radius: 12px; }
  body[data-dash-v4="on"] .v4h-donut-h { margin-bottom: 10px; }
  body[data-dash-v4="on"] .v4h-donut-h h3 { font-size: 13px; }
  body[data-dash-v4="on"] .v4h-donut svg { width: 100px; height: 100px; }
  body[data-dash-v4="on"] .v4h-donut-wrap { gap: 12px; }
  body[data-dash-v4="on"] .v4h-donut-vl { font-size: 19px; }
  body[data-dash-v4="on"] .v4h-donut-row { padding: 6px 8px; font-size: 11px; gap: 7px; }
  body[data-dash-v4="on"] .v4h-donut-row .v4h-am { font-size: 10.5px; }
  /* À traiter grid 2 cols (carrés très compacts) */
  body[data-dash-v4="on"] .v4h-todo { padding: 12px 14px; border-radius: 12px; }
  body[data-dash-v4="on"] .v4h-todo-h { margin-bottom: 10px; }
  body[data-dash-v4="on"] .v4h-todo-h h3 { font-size: 13px; }
  body[data-dash-v4="on"] .v4h-todo-grid { grid-template-columns: 1fr 1fr; gap: 6px; max-height: none; }
  body[data-dash-v4="on"] .v4h-sq { padding: 7px 9px; border-radius: 8px; gap: 7px; }
  body[data-dash-v4="on"] .v4h-sq-ic { width: 24px; height: 24px; font-size: 12px; border-radius: 6px; }
  body[data-dash-v4="on"] .v4h-sq b { font-size: 10.5px; }
  body[data-dash-v4="on"] .v4h-sq s { font-size: 9px; }
}

/* ════════════════════════════════════════════════════════════════════════
   v15.53 — BOTTOM NAV MOBILE (Strategy B validée user)
   Visible UNIQUEMENT en mode V4 + viewport ≤767px.
   Sur desktop/tablette : la sidebar reste utilisée (display:none ici).
   ════════════════════════════════════════════════════════════════════════ */

.v4-bnav {
  display: none; /* caché par défaut, affiché par media query mobile uniquement */
}

/* v15.140 BUG-MOBILE-MENU-PLUS — Backdrop caché par défaut (desktop), affiché en mobile via .open */
#sb-backdrop { display: none; }

/* ════════════════════════════════════════════════════════════════════════
   v15.142 BUG-MOBILE-MENU-PLUS — Drawer bottom-sheet mobile (remplace l'overlay
   sidebar latérale qui échouait sur iPhone). Élément dédié, slide-up depuis le bas.
   ════════════════════════════════════════════════════════════════════════ */
.more-ov {
  display: none;
  position: fixed; inset: 0;
  background: rgba(0,0,0,.5);
  z-index: 2100;          /* au-dessus de la sidebar (2000) et du bottom nav (999) */
}
.more-ov.open { display: block; animation: more-bd-in .2s ease; }
@keyframes more-bd-in { from { opacity: 0; } to { opacity: 1; } }
.more-sheet {
  position: absolute; left: 0; right: 0; bottom: 0;
  background: var(--sur);
  border-radius: 18px 18px 0 0;
  box-shadow: 0 -8px 32px rgba(0,0,0,.28);
  max-height: 82vh; overflow-y: auto;
  padding: 8px 16px calc(env(safe-area-inset-bottom, 12px) + 16px);
  transform: translateY(100%);
  transition: transform .26s cubic-bezier(.22,.61,.36,1);
}
.more-ov.open .more-sheet { transform: translateY(0); }
.more-grip { width: 40px; height: 4px; border-radius: 4px; background: var(--bor); margin: 8px auto 6px; }
.more-head { display: flex; align-items: center; justify-content: space-between; padding: 4px 2px 12px; }
.more-head strong { font-size: 16px; color: var(--t1); }
.more-x { background: none; border: 0; font-size: 18px; color: var(--t3); cursor: pointer; padding: 4px 8px; line-height: 1; }
.more-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.more-it {
  display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 6px;
  background: var(--sur2); border: 1px solid var(--bor); border-radius: 14px;
  padding: 14px 6px; cursor: pointer;
  color: var(--t2); font: 600 11px/1.2 'Inter', sans-serif; text-align: center;
  transition: background .15s, border-color .15s;
}
.more-it:active { background: var(--bor); }
.more-it .more-ic { font-size: 24px; line-height: 1; display: flex; align-items: center; justify-content: center; color: var(--t2); }
@media (min-width: 480px) { .more-grid { grid-template-columns: repeat(4, 1fr); } }

@media (max-width: 767px) {
  /* Affiche bottom nav SI mode V4 actif */
  body[data-dash-v4="on"] .v4-bnav {
    display: flex;
    position: fixed;
    bottom: 0; left: 0; right: 0;
    background: var(--sur);
    border-top: 1px solid var(--bor);
    padding: 3px 0 calc(env(safe-area-inset-bottom, 6px) + 3px) 0;
    box-shadow: 0 -2px 8px rgba(20,25,54,.05);
    z-index: 999;
  }
  body[data-dash-v4="on"] .v4-bnav .v4-bn {
    flex: 1; background: transparent; border: 0; cursor: pointer;
    display: flex; flex-direction: column; align-items: center; gap: 2px;
    padding: 4px 4px;
    color: var(--t3);
    font: 600 10px/1 'Inter', sans-serif;
    transition: color .15s;
  }
  body[data-dash-v4="on"] .v4-bnav .v4-bn .ic {
    font-size: 19px; line-height: 1; filter: grayscale(.5);
    transition: filter .15s;
    display: flex; align-items: center; justify-content: center;
  }
  body[data-dash-v4="on"] .v4-bnav .v4-bn.act { color: var(--cta); }
  body[data-dash-v4="on"] .v4-bnav .v4-bn.act .ic { filter: grayscale(0); }

  /* BARRE À FAVORIS — action rapide : pastille corail surélevée (FAB), icône blanche.
     Calé sur la maquette NAV-FAVORIS-PROTO.html (.bar>button.act .ring). */
  body[data-dash-v4="on"] .v4-bnav { overflow: visible; }
  body[data-dash-v4="on"] .v4-bnav .v4-bn.fav-act { color: var(--cta); font-weight: 700; overflow: visible; }
  /* MOBILE-REFONTE — action rapide = petite pastille corail INLINE (pas de FAB surélevé) :
     robuste quel que soit le nombre d'actions favorites (fini le chevauchement de 2 FAB collés). */
  body[data-dash-v4="on"] .v4-bnav .v4-bn.fav-act .ic.fav-ring {
    width: 28px; height: 28px; border-radius: 50%;
    background: var(--cta);
    display: flex; align-items: center; justify-content: center;
    box-shadow: none; border: 0; filter: none; transform: none;
  }
  body[data-dash-v4="on"] .v4-bnav .v4-bn.fav-act .ic.fav-ring svg { width: 16px; height: 16px; stroke: #fff; }
  body[data-dash-v4="on"] .v4-bnav .v4-bn.fav-act .lbl.fav-albl { margin-top: 2px; }

  /* Body : reserve space pour le bottom nav fixe (≈64px) */
  body[data-dash-v4="on"] .pc { padding-bottom: 80px !important; }

  /* v15.139 BUG-MOBILE-DASH-PROFILES : on GARDE le sélecteur de mode dashboard
     (Solo/Premium/Gestionnaire) sur mobile (parité desktop) mais en COMPACT : icônes
     seules (labels masqués) pour tenir dans le topbar. Avant : display:none → l'utilisateur
     mobile restait bloqué sur le mode par défaut. */
  body[data-dash-v4="on"] .v4s-mode-row { padding: 1px; gap: 0; }
  body[data-dash-v4="on"] .v4s-mode-btn { padding: 6px 9px; }
  body[data-dash-v4="on"] .v4s-mode-lbl { display: none; }
  /* Garder thèmes (préférence rapide) mais plus compacts */
  body[data-dash-v4="on"] .v4s-theme-tb-row .v4s-theme-btn {
    width: 24px; height: 22px; font-size: 11px;
  }
  /* Cacher le label "Année" pour gagner de la place */
  body[data-dash-v4="on"] .v4s-tb-controls .v4s-tb-label { display: none; }
  /* Selects compacts */
  body[data-dash-v4="on"] .v4s-tb-controls select {
    padding: 5px 7px; font-size: 12px;
  }
  /* Séparateurs plus discrets */
  body[data-dash-v4="on"] .v4s-tb-sep { display: none; }

  /* v15.55 — Drive FAB caché sur mobile (couvre le topbar 390px).
     Accessible via Plus → sidebar overlay → Paramètres → bouton Drive. */
  body[data-dash-v4="on"] #drive-fab,
  body[data-dash-v4="on"] #drive-user-badge { display: none !important; }

  /* v15.55 — Sidebar overlay mobile : au-dessus du bottom nav quand ouverte */
  /* v15.141 — z-index 2000 (au-dessus du backdrop 1900). Cette règle a une spécificité
     supérieure à .sb-nav.open : c'est ELLE qui fixe le z-index réel de la sidebar en mode V4.
     Doit donc rester > backdrop sinon la sidebar passe DERRIÈRE l'ombrage gris. */
  body[data-dash-v4="on"] .sb-nav { z-index: 2000 !important; box-shadow: 4px 0 24px rgba(0,0,0,.4); }
}

/* ════════════════════════════════════════════════════════════════════════
   v15.230 ARCHI-FICHES-UNIFIED Session 4 — CSS RAPATRIÉE DEPUIS index.html
   AUDIT 2026-05-29 a identifié que ces ~225 lignes étaient placées DANS le
   template literal `BAIL_TEMPLATE_DEFAULT` (string JS qui sert à générer le
   PDF du bail). Le browser ne les voyait JAMAIS car elles étaient dans une
   string JavaScript, pas dans une stylesheet active. Bug A user 2026-05-29 :
   cards Locataires empilées verticalement → CAUSE RACINE.
   Fix : déplacement ici dans la VRAIE stylesheet externe chargée par
   <link rel="stylesheet" href="css/main.css?v=15.230">.

   Page Biens — Variante A (blocs immeubles repliables + log-rows détaillés)
   Page Locataires — Variante L-B (cards groupé par immeuble + avatars)
   Mockup-spec validé user 2026-05-29 (cf mockups/SESSION4-PAGES/mockup.html)
   Mobile-spec : sticky headers, cards empilées, touch min 44px, font 14px
   ════════════════════════════════════════════════════════════════════════ */

/* === Bloc immeuble (variante A) === */
.imm-block-a {
  background: var(--sur, #fff); border: 1px solid var(--bor, #e5e7eb); border-radius: 8px;
  margin-bottom: 12px; overflow: hidden;
}
.imm-block-a.is-archived { opacity: 0.65; }
.imm-block-a-header {
  background: linear-gradient(90deg, #eff6ff, var(--sur, #fff));
  padding: 12px 16px; display: flex; align-items: center; gap: 12px;
  cursor: pointer; border-bottom: 1px solid var(--bor, #e5e7eb);
  user-select: none;
}
.imm-block-a-header:hover { background: linear-gradient(90deg, #dbeafe, var(--sur2, #f3f4f6)); }
.imm-block-a-header .imm-icon { font-size: 24px; flex-shrink: 0; }
.imm-block-a-header .imm-info { flex: 1; min-width: 0; }
.imm-block-a-header .imm-name { font-weight: 700; font-size: 15px; color: var(--t1, #1f2937); }
.imm-block-a-header .imm-adr { font-size: 11.5px; color: var(--t2, #6b7280); margin-top: 2px; overflow: hidden; text-overflow: ellipsis; }
.imm-block-a-header .imm-stats { display: flex; gap: 16px; font-size: 10.5px; color: var(--t2, #6b7280); flex-shrink: 0; }
.imm-block-a-header .imm-stats b { display: block; font-size: 14px; color: var(--t1, #1f2937); margin-top: 2px; text-align: right; }
.imm-block-a-header .chevron-a { font-size: 18px; color: var(--t2, #6b7280); flex-shrink: 0; transition: transform 0.2s; }
.imm-block-a.collapsed .chevron-a { transform: rotate(-90deg); }
.imm-block-a.collapsed .imm-log-list-a { display: none; }
.imm-block-a-bailleur {
  font-size: 10.5px; color: var(--t3, #9ca3af); text-transform: uppercase; letter-spacing: 0.4px;
  padding: 0 16px; padding-top: 8px; padding-bottom: 0;
  background: var(--sur2, #f3f4f6);
  border-bottom: 1px solid var(--bor, #e5e7eb);
}

/* === Log-list & log-row variante A === */
.imm-log-list-a { padding: 6px 12px 10px; }
.log-row-a {
  display: grid; grid-template-columns: 80px auto 1fr auto auto auto auto;
  gap: 12px; align-items: center;
  padding: 9px 12px; border-radius: 6px; cursor: pointer;
  border-bottom: 1px solid var(--sur2, #f3f4f6);
  transition: background 0.12s;
}
.log-row-a:hover { background: var(--sur3, #f9fafb); }
.log-row-a:last-child { border-bottom: none; }
.log-row-a.is-vacant { background: linear-gradient(90deg, #fef3c7, var(--sur, #fff)); }
.log-row-a.is-vacant:hover { background: linear-gradient(90deg, #fde68a, var(--sur2, #f3f4f6)); }
.log-row-a-ref { font-weight: 700; font-size: 12.5px; color: var(--acc, #ff5a3c); }
.log-row-a-type {
  background: var(--sur2, #f3f4f6); border-radius: 12px; padding: 2px 9px;
  font-size: 11px; font-weight: 600; color: var(--t1, #1f2937);
  text-align: center; min-width: 36px;
}
.log-row-a-details { font-size: 12px; color: var(--t1, #1f2937); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.log-row-a-loc { font-size: 11.5px; color: var(--t2, #6b7280); display: flex; align-items: center; gap: 6px; min-width: 0; }
.log-row-a-loc .dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.log-row-a-loc .dot.green { background: var(--ok, #10b981); }
.log-row-a-loc .dot.red { background: var(--err, #ef4444); }
.log-row-a-loc .dot.orange { background: var(--warn, #f59e0b); }
.log-row-a-loc .loc-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.log-row-a-loyer { font-weight: 700; font-size: 13px; color: var(--t1, #1f2937); text-align: right; min-width: 80px; white-space: nowrap; }
.log-row-a-loyer small { font-weight: 400; color: var(--t2, #6b7280); font-size: 10.5px; display: block; margin-top: 1px; }
.log-row-a-action, .log-row-a-action-annonce {
  padding: 6px 10px; border: 1px solid var(--bor, #e5e7eb); border-radius: 4px;
  font-size: 11px; cursor: pointer; background: var(--sur, #fff); color: var(--t1, #1f2937);
  white-space: nowrap;
}
.log-row-a-action:hover { background: var(--acc, #ff5a3c); color: #fff; border-color: var(--acc, #ff5a3c); }
.log-row-a-action-annonce { background: #fef3c7; color: #92400e; border-color: #f59e0b; font-weight: 600; }
.log-row-a-action-annonce:hover { background: #fde68a; }

/* === Page Locataires variante L-B (cards groupé par immeuble) === */
.locimm-block-b {
  background: var(--sur, #fff); border: 1px solid var(--bor, #e5e7eb); border-radius: 8px;
  margin-bottom: 10px; overflow: hidden;
}
.locimm-block-b-header {
  background: var(--sur3, #f9fafb); padding: 10px 14px;
  font-weight: 700; font-size: 13px; border-bottom: 1px solid var(--bor, #e5e7eb);
  display: flex; align-items: center; gap: 10px; cursor: pointer;
  user-select: none;
}
.locimm-block-b-header:hover { background: var(--sur2, #f3f4f6); }
.locimm-block-b-header .imm-icon-b { font-size: 18px; }
.locimm-block-b-header .imm-name-b { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.locimm-block-b-header .count-b {
  background: var(--sur, #fff); border: 1px solid var(--bor, #e5e7eb); border-radius: 12px;
  padding: 2px 10px; font-size: 11px; font-weight: 500; color: var(--t2, #6b7280);
}
.locimm-block-b.collapsed .locimm-body-b { display: none; }
.locimm-block-b-header .chevron-b { font-size: 14px; color: var(--t2, #6b7280); transition: transform 0.2s; }
.locimm-block-b.collapsed .chevron-b { transform: rotate(-90deg); }
.locimm-body-b { padding: 6px 0; }

.loc-card-row-b {
  display: grid; grid-template-columns: 36px 1fr auto auto auto auto;
  gap: 12px; align-items: center;
  padding: 10px 14px; border-bottom: 1px solid var(--sur2, #f3f4f6);
  cursor: pointer; transition: background 0.12s;
}
.loc-card-row-b:hover { background: var(--sur3, #f9fafb); }
.loc-card-row-b:last-child { border-bottom: none; }
/* v15.x DEPART-VISIBILITE — état « départ » de la carte locataire (au lieu du seul menu ⋮) */
.loc-card-row-b.loc-depart { box-shadow: inset 3px 0 0 var(--acc,#ff5a3c); background: linear-gradient(90deg, rgba(255,90,60,.06), transparent 55%); }
.loc-card-row-b.loc-depart:hover { background: linear-gradient(90deg, rgba(255,90,60,.10), var(--sur3,#f9fafb) 55%); }
.loc-card-row-b.loc-depart .loc-avatar-b { background: var(--acc,#ff5a3c); }
.loc-dep-cell { display: flex; align-items: center; gap: 5px; color: var(--acc,#ff5a3c); font-weight: 700; cursor: pointer; }
.loc-ech-b.loc-dep-cell::before { content: '' !important; }
.loc-dep-dg { font-weight: 700; color: var(--warn); }
.loc-dep-dg.late { color: var(--neg); }
.loc-actions-b button.loc-dep-go { background: var(--acc,#ff5a3c); border-color: var(--acc,#ff5a3c); color: #fff; }
.loc-actions-b button.loc-dep-go:hover { filter: brightness(1.06); background: var(--acc,#ff5a3c); border-color: var(--acc,#ff5a3c); color: #fff; }
.loc-actions-b button.loc-dep-prep { background: #fff; border-color: var(--warn,#f59e0b); color: var(--ora,#b27a12); font-weight: 700; white-space: nowrap; }
.loc-actions-b button.loc-dep-prep:hover { background: var(--warn,#f59e0b); color: #fff; border-color: var(--warn,#f59e0b); }
.loc-card-row-b.warn-soon { background: var(--warn-soft); }
.loc-card-row-b.warn-soon:hover { background: var(--warn-soft); filter: brightness(0.97); }

.loc-avatar-b {
  width: 32px; height: 32px; border-radius: 50%;
  background: var(--t1); color: var(--sur);
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 12px; letter-spacing: .3px;
}
/* v15.614 REFONTE-PC — avatar sobre monochrome uniforme : le statut vit sur la ligne (liseré + échéance), jamais sur l'avatar */
.loc-card-row-b.warn-soon .loc-avatar-b,
.loc-card-row-b.loc-depart .loc-avatar-b { background: var(--t1); color: var(--sur); }
.loc-card-row-b.loc-vacant .loc-avatar-b { background: transparent; color: var(--t3); border: 1px solid var(--bor2); }
.loc-info-b { min-width: 0; }
.loc-info-b .nom-b { font-weight: 600; font-size: 13px; color: var(--t1, #1f2937); display: flex; align-items: center; gap: 5px; flex-wrap: wrap; }
.loc-info-b .nom-b .loc-nom-badge { font-size: 9.5px; padding: 1px 6px; font-weight: 700; white-space: nowrap; flex: none; }
.loc-info-b .nom-b .loc-vacant-tag { color: var(--neg); font-weight: 700; }
.loc-info-b .meta-b { font-size: 11px; color: var(--t2, #6b7280); margin-top: 1px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.loc-loyer-b { font-weight: 600; font-size: 13px; color: var(--t1, #1f2937); white-space: nowrap; }
.loc-ech-b { font-size: 11.5px; white-space: nowrap; display: inline-flex; align-items: center; gap: 4px; }
/* v15.614 REFONTE-PC — tokens sémantiques (avant : --ok/--err inexistants → hex figés cassaient en sombre) */
.loc-ech-b.ok { color: var(--pos); }
.loc-ech-b.warn { color: var(--warn); font-weight: 600; }
.loc-ech-b.err { color: var(--neg); font-weight: 700; }
.loc-meta-bail-b { font-size: 11px; color: var(--t2, #6b7280); white-space: nowrap; }
.loc-actions-b { display: flex; gap: 4px; flex-wrap: wrap; justify-content: flex-end; }
.loc-actions-b button {
  padding: 5px 9px; background: var(--sur, #fff); border: 1px solid var(--bor, #e5e7eb);
  border-radius: 4px; font-size: 11px; cursor: pointer; color: var(--t1, #1f2937);
  white-space: nowrap; display: inline-flex; align-items: center; gap: 5px;
}
.loc-actions-b button svg { width: 14px; height: 14px; flex: none; }
.loc-actions-b button:hover { background: var(--acc, #ff5a3c); color: #fff; border-color: var(--acc, #ff5a3c); }
/* v15.614 REFONTE-PC — couleurs d'action tokenisées (avant : hex #16a34a/#dc2626 inline) */
.loc-actions-b button.loc-act-sign, .loc-actions-b button.loc-act-mrh-ok { color: var(--pos); }
.loc-actions-b button.loc-act-mrh-no { color: var(--neg); }
.loc-actions-b button.loc-act-sign:hover, .loc-actions-b button.loc-act-mrh-ok:hover, .loc-actions-b button.loc-act-mrh-no:hover { color: #fff; }

/* v15.614 REFONTE-PC — intercalaire bailleur (réutilise le langage « étiquette bailleur » de la page Biens :
   fine capitale grise + icône bailleur). Fixe, non repliable ; rendu seulement si ≥2 bailleurs. */
.locbail-inter {
  display: flex; align-items: center; gap: 7px;
  padding: 16px 4px 6px; font-size: 10.5px; font-weight: 700;
  color: var(--t3); text-transform: uppercase; letter-spacing: 0.4px;
}
.locbail-inter:first-child { padding-top: 4px; }
.locbail-inter .locbail-ico { color: var(--t3); display: inline-flex; }
.locbail-inter .locbail-name { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.locbail-inter .locbail-stats { margin-left: auto; text-transform: none; letter-spacing: 0; font-weight: 500; color: var(--t3); white-space: nowrap; }

/* Breakpoint tablette intermédiaire (481-1024px) */
@media (max-width: 1024px) and (min-width: 481px) {
  .log-row-a {
    grid-template-columns: 70px auto 1fr auto auto auto auto;
    gap: 6px;
    padding: 8px 10px;
  }
  .log-row-a .log-row-a-action-annonce, .log-row-a .log-row-a-action { font-size: 10.5px; padding: 5px 7px; white-space: nowrap; }
  .log-row-a-ref { font-size: 11.5px; }
  .log-row-a-type { font-size: 10.5px; min-width: 32px; padding: 2px 6px; }
  .log-row-a-details { font-size: 11px; }
  .log-row-a-loc { font-size: 10.5px; }
  .log-row-a-loyer { font-size: 12px; min-width: 65px; }
  .log-row-a-loyer small { font-size: 9.5px; }
  .imm-block-a-header { padding: 10px 12px; }
  .imm-block-a-header .imm-stats { gap: 10px; font-size: 10px; }
  .imm-block-a-header .imm-stats b { font-size: 12.5px; }
  .imm-block-a-header .imm-adr { font-size: 11px; }
  .imm-block-a-header .imm-name { font-size: 14px; }
  .loc-actions-b button { padding: 4px 7px; font-size: 10.5px; }
}

/* v15.614 REFONTE-PC — sous plein desktop (≤1279px) la rangée passe en 2 lignes :
   infos en haut, actions LIBELLÉES sur leur propre ligne pleine largeur → jamais de débordement
   ni de badges écrasés, quelle que soit la largeur de la fenêtre. */
@media (min-width: 768px) and (max-width: 1279px) {
  .loc-card-row-b {
    grid-template-columns: 36px minmax(0, 1fr) auto auto;
    grid-template-areas:
      "av info loyer ech"
      "act act act act";
    gap: 6px 12px;
    align-items: center;
    padding: 9px 12px;
  }
  .loc-card-row-b > .loc-avatar-b { grid-area: av; }
  .loc-card-row-b > .loc-info-b { grid-area: info; }
  .loc-card-row-b > .loc-loyer-b { grid-area: loyer; }
  .loc-card-row-b > .loc-ech-b { grid-area: ech; }
  .loc-card-row-b > .loc-meta-bail-b { display: none; }
  .loc-card-row-b > .loc-actions-b { grid-area: act; justify-content: flex-end; margin-top: 2px; }
}

/* === MOBILE SPEC ≤ 480px : cards empilées + sticky + touch 44px === */
@media (max-width: 480px) {
  .imm-block-a-header {
    flex-wrap: wrap; padding: 10px 12px;
    position: sticky; top: 0; z-index: 5;
    background: linear-gradient(180deg, #dbeafe, #eff6ff);
  }
  .imm-block-a-header .imm-info { flex: 1 1 60%; min-width: 0; }
  .imm-block-a-header .imm-name { font-size: 14px; }
  .imm-block-a-header .imm-adr { font-size: 10.5px; }
  .imm-block-a-header .imm-stats {
    width: 100%; margin-top: 6px; padding-top: 6px;
    border-top: 1px dashed rgba(0,0,0,0.12);
    gap: 14px; font-size: 10px;
  }
  .imm-block-a-header .imm-stats b { font-size: 12.5px; }
  .imm-block-a-header .chevron-a { margin-left: auto; align-self: flex-start; }
  .imm-log-list-a { padding: 6px 10px 10px; }
  .log-row-a {
    display: block; padding: 12px 14px;
    border: 1px solid var(--bor, #e5e7eb); border-radius: 8px;
    margin-bottom: 8px; background: var(--sur, #fff);
  }
  .log-row-a > * { display: block; margin: 0; }
  .log-row-a-ref { display: inline-block !important; margin-right: 8px; font-size: 13px; }
  .log-row-a-type { display: inline-block !important; margin-right: 0; }
  .log-row-a-details { font-size: 12px; color: var(--t2, #6b7280); margin-top: 6px; white-space: normal; overflow: visible; }
  .log-row-a-loc { margin-top: 6px; padding-top: 6px; border-top: 1px solid var(--sur2, #f3f4f6); font-size: 12px; }
  .log-row-a-loyer { margin-top: 6px; font-size: 15px; text-align: left !important; min-width: 0; }
  .log-row-a-loyer small { display: inline; margin-left: 4px; }
  .log-row-a-action, .log-row-a-action-annonce {
    margin-top: 10px; width: 100%; padding: 12px; font-size: 13px; font-weight: 600;
    min-height: 44px;
  }
  .locimm-block-b-header {
    position: sticky; top: 0; z-index: 5;
    padding: 10px 12px; font-size: 12.5px;
  }
  .loc-card-row-b {
    display: block; padding: 12px 14px;
    border: 1px solid var(--bor, #e5e7eb); border-radius: 8px;
    margin: 8px 10px; background: var(--sur, #fff);
  }
  .loc-avatar-b { float: left; margin: 0 10px 6px 0; width: 36px; height: 36px; font-size: 13px; }
  .loc-info-b { overflow: hidden; }
  .loc-info-b .nom-b { font-size: 14px; white-space: normal; }
  .loc-info-b .meta-b { font-size: 11.5px; white-space: normal; }
  .loc-loyer-b, .loc-ech-b, .loc-meta-bail-b {
    clear: left; display: flex; justify-content: space-between;
    margin-top: 8px; padding: 4px 0; border-bottom: 1px solid var(--sur2, #f3f4f6);
    font-size: 12.5px;
  }
  .loc-loyer-b:before { content: '💰 Loyer'; font-weight: 500; color: var(--t2, #6b7280); }
  .loc-ech-b:before { content: '📅 Échéance'; font-weight: 500; color: var(--t2, #6b7280); }
  .loc-meta-bail-b:before { content: 'ℹ Bail'; font-weight: 500; color: var(--t2, #6b7280); }
  .loc-actions-b { display: flex; gap: 8px; margin-top: 10px; }
  .loc-actions-b button {
    flex: 1; min-height: 44px; padding: 12px; font-size: 13px; font-weight: 600;
  }
}

/* MOBILE ≤767 (téléphone/tablette portrait) : mêmes cartes empilées Locataires que ≤480,
   pour aligner sur la frontière mobile de l'app (avant, 481-767 restait en grille 2 lignes).
   On ne touche PAS le bloc ≤480 (qui porte aussi la fiche immeuble) ni le PC (≥768). */
@media (min-width: 481px) and (max-width: 767px) {
  .locimm-block-b-header { position: sticky; top: 0; z-index: 5; padding: 10px 12px; font-size: 12.5px; }
  .loc-card-row-b {
    display: block; padding: 12px 14px;
    border: 1px solid var(--bor, #e5e7eb); border-radius: 8px;
    margin: 8px 10px; background: var(--sur, #fff);
  }
  .loc-avatar-b { float: left; margin: 0 10px 6px 0; width: 36px; height: 36px; font-size: 13px; }
  .loc-info-b { overflow: hidden; }
  .loc-info-b .nom-b { font-size: 14px; white-space: normal; }
  .loc-info-b .meta-b { font-size: 11.5px; white-space: normal; }
  .loc-loyer-b, .loc-ech-b, .loc-meta-bail-b {
    clear: left; display: flex; justify-content: space-between;
    margin-top: 8px; padding: 4px 0; border-bottom: 1px solid var(--sur2, #f3f4f6);
    font-size: 12.5px;
  }
  .loc-loyer-b:before { content: '💰 Loyer'; font-weight: 500; color: var(--t2, #6b7280); }
  .loc-ech-b:before { content: '📅 Échéance'; font-weight: 500; color: var(--t2, #6b7280); }
  .loc-meta-bail-b:before { content: 'ℹ Bail'; font-weight: 500; color: var(--t2, #6b7280); }
  .loc-actions-b { display: flex; gap: 8px; margin-top: 10px; }
  .loc-actions-b button { flex: 1; min-height: 44px; padding: 12px; font-size: 13px; font-weight: 600; }
}

/* v15.674 BUG-VACANT-TACITE — logement vacant : la cellule échéance est un <div> VIDE
   (conservé pour tenir la colonne de la grille PC ≥1280 et l'alignement des actions).
   En ≤767 (cartes avec libellé `:before`), on masque ce div vide pour éviter une ligne
   fantôme « 📅 Échéance ». PC/tablette : le div vide reste (0 px). */
@media (max-width: 767px) { .loc-ech-b:empty { display: none; } }

/* MOBILE ≤767 : onglet Historique — le tableau 7 colonnes devient des cartes (rendu JS
   par rBauxHistorique quand _isPhone()). PC (≥768) = tableau inchangé. */
@media (max-width:767px){
  #baux-tab-historique .tbl-wrap{overflow:visible;border:0;background:none;box-shadow:none}
  #baux-tab-historique thead{display:none}
  #baux-tab-historique table.tbl,#baux-tab-historique .tbl tbody{display:block;width:auto}
  #baux-tab-historique #baux-hist-tbody > tr{display:block}
  #baux-tab-historique #baux-hist-tbody > tr > td{display:block;padding:0;border:0}
  .bxh-card{background:var(--sur);border:1px solid var(--bor);border-radius:12px;padding:11px 12px;margin-bottom:8px}
  .bxh-top{display:flex;align-items:center;gap:8px}
  .bxh-ref{font-family:var(--display,inherit);font-weight:800;font-size:13.5px;flex:0 0 auto}
  .bxh-loc{flex:1;min-width:0;font-size:12.5px;color:var(--t1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .bxh-more{flex:0 0 auto;min-height:0;color:var(--t3);background:none;border:0;padding:2px;margin:-2px -4px -2px 0;cursor:pointer;display:inline-flex}
  .bxh-more svg{width:18px;height:18px}
  .bxh-per{display:flex;align-items:center;gap:6px;margin-top:6px;color:var(--t3);font-size:11.5px}
  .bxh-per svg{width:12px;height:12px;flex:0 0 auto}
  .bxh-motif{display:inline-block;font-size:10px;font-weight:600;color:var(--t2);background:var(--sur2);border:1px solid var(--bor);border-radius:6px;padding:3px 7px;margin-top:7px}
  .bxh-foot{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:9px;font-size:11px;color:var(--t3)}
  .bxh-foot .dg{display:inline-flex;align-items:center;gap:4px}
  .bxh-foot .dg.ok{color:var(--pos)}
  .bxh-foot .dg svg{width:12px;height:12px}
  .bxh-acts{display:flex;gap:7px;margin-top:11px}
  .bxh-acts button{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:5px;font:inherit;font-size:12px;font-weight:700;border-radius:9px;padding:9px 0;min-height:38px;cursor:pointer;border:1px solid var(--bor);background:var(--sur2);color:var(--t2)}
  .bxh-acts svg{width:14px;height:14px;flex:0 0 auto}
  .bxh-moreacts{display:none;margin-top:7px}
  .bxh-card.open .bxh-moreacts{display:block}
  .bxh-card.open .bxh-more{color:var(--acc)}
  .bxh-moreacts button{width:100%;display:inline-flex;align-items:center;justify-content:center;gap:6px;font:inherit;font-size:12.5px;font-weight:700;border-radius:9px;padding:9px 0;min-height:40px;cursor:pointer;border:1px solid color-mix(in srgb,var(--red) 35%,var(--bor));background:var(--sur);color:var(--red)}
  .bxh-moreacts svg{width:15px;height:15px}
}

/* ════════════════════ LOG-CANDIDATS — Onglet Candidats (variante B) ════════════════════
   Classes spécifiques au pipeline candidatures. Tokens/composants réutilisés depuis le
   design system ci-dessus (--grn/--ora/--red, .badge, .tbl, .filters…). */
.page-subtitle{font-size:13px;color:var(--t2);margin-top:2px}
/* Voyant Confiance + score (aide à la décision, jamais un verdict) */
.voyant{display:inline-block;width:10px;height:10px;border-radius:50%;flex-shrink:0}
.voyant.grn{background:var(--grn);box-shadow:0 0 0 3px rgba(22,163,74,.15)}
.voyant.ora{background:var(--ora);box-shadow:0 0 0 3px rgba(234,88,12,.15)}
.voyant.red{background:var(--red);box-shadow:0 0 0 3px rgba(220,38,38,.15)}
.conf-cell{display:inline-flex;align-items:center;gap:8px}
.conf-num{font-family:var(--font);font-weight:700;font-size:14px;font-variant-numeric:tabular-nums}
.conf-num.grn{color:var(--grn)}.conf-num.ora{color:var(--ora)}.conf-num.red{color:var(--red)}
.conf-decl{background:rgba(90,110,135,.12);color:var(--t2);font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;padding:1px 6px;border-radius:8px;cursor:help}
.note-lien{display:inline-flex;align-items:center;background:rgba(124,58,237,.12);color:var(--pur);font-size:9.5px;font-weight:700;padding:1px 7px;border-radius:8px;margin-left:6px;letter-spacing:.2px}
.avatar{width:34px;height:34px;border-radius:50%;background:#5566aa;display:flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:700;font-size:12px;color:#fff;flex-shrink:0;letter-spacing:.02em}
.cand-b-name{display:flex;align-items:center;gap:10px}
.cand-b-name .nm{font-weight:600;font-size:14px;display:flex;align-items:center}
.cand-b-name .sub{font-size:11.5px;color:var(--t3)}

/* Responsive : table → cards en mobile (calqué sur le pattern #irl-table) */
@media (max-width:600px){
  #cand-table thead{display:none}
  #cand-table table,#cand-table tbody,#cand-table tr{display:block;width:100%}
  #cand-table .tbl-wrap{border:none;box-shadow:none;background:transparent}
  #cand-table tbody tr{
    background:var(--sur);margin-bottom:10px;border-radius:10px;
    border:1px solid var(--bor);border-left:4px solid var(--t3);
    padding:10px 12px;box-shadow:0 1px 3px rgba(0,0,0,.04);
  }
  #cand-table tbody tr:hover td{background:transparent}
  #cand-table td{
    display:grid;grid-template-columns:115px 1fr;gap:8px;
    border:none;padding:5px 0;text-align:left !important;font-size:13px;align-items:center;
  }
  #cand-table td::before{
    content:attr(data-label);font-size:10.5px;font-weight:600;color:var(--t2);
    text-transform:uppercase;letter-spacing:.04em;
  }
  #cand-table td:first-child{
    display:block;font-size:15px;font-weight:700;
    border-bottom:1px solid var(--bor);padding-bottom:6px;margin-bottom:4px;
  }
  #cand-table td:first-child::before{display:none}
  #cand-table td.num{justify-content:flex-start;font-variant-numeric:tabular-nums}
  #cand-table td[colspan]{display:block;grid-template-columns:none}
  #cand-table td[colspan]::before{display:none}
}

/* ── 🛟 SAUVEGARDE de sécurité (Chantier 3 cloud-cutover) ────────────────────
   Carte Réglages → Données. Tokens du design-system (var(--t1/t2/t3), --sur2, --bor,
   --pos/--pos-soft, --warn/--warn-soft, --acc). Préfixe bk- pour ne rien écraser. */
#backup-card .bk-ch{display:flex;align-items:center;gap:9px;margin-bottom:4px}
#backup-card .bk-ic{width:30px;height:30px;border-radius:8px;background:var(--sur2);display:grid;place-items:center;font-size:15px;flex:0 0 auto}
#backup-card .bk-ch h3{font-size:14.5px;font-weight:700;color:var(--t1);margin:0}
#backup-card .bk-sub{font-size:12px;color:var(--t3);margin:0 0 12px 39px}
#backup-card .bk-row{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px solid var(--bor)}
#backup-card .bk-row:first-of-type{border-top:none}
#backup-card .bk-lbl{font-size:13px;color:var(--t2);flex:1}
#backup-card .bk-val{font-size:12.5px;color:var(--t1);font-weight:600}
#backup-card .bk-hint{font-size:11.5px;color:var(--t3);margin-top:12px;line-height:1.5}
#backup-card .bk-pill{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:600;padding:3px 10px;border-radius:999px}
#backup-card .bk-pill.ok{background:var(--pos-soft);color:var(--pos)}
#backup-card .bk-pill.warn{background:var(--warn-soft);color:var(--warn)}
#backup-card .bk-pill .dot{width:6px;height:6px;border-radius:50%;background:currentColor}
#backup-card .bk-seg{display:inline-flex;background:var(--sur2);border:1px solid var(--bor);border-radius:9px;padding:2px;gap:1px}
#backup-card .bk-seg span{font-size:12px;font-weight:600;color:var(--t3);padding:5px 10px;border-radius:7px;cursor:pointer;user-select:none}
#backup-card .bk-seg span.on{background:var(--sur);color:var(--t1);box-shadow:0 1px 2px rgba(0,0,0,.08)}
#backup-card .bk-foldchip{display:inline-flex;align-items:center;gap:7px;background:var(--sur2);border:1px solid var(--bor);border-radius:8px;padding:6px 10px;font-size:12px;font-weight:600;color:var(--t1);max-width:230px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#backup-card .bk-mobmsg{background:var(--sur2);border:1px solid var(--bor);border-radius:12px;padding:16px;text-align:center;margin-top:6px}
#backup-card .bk-mobmsg .big{font-size:26px;margin-bottom:8px}
#backup-card .bk-mobmsg .t{font-size:13px;font-weight:700;color:var(--t1);margin-bottom:6px}
#backup-card .bk-mobmsg .d{font-size:12px;color:var(--t3);line-height:1.5}
#backup-card .bk-prog{height:8px;background:var(--sur2);border-radius:999px;overflow:hidden;margin:10px 0 6px}
#backup-card .bk-prog i{display:block;height:100%;background:var(--acc);border-radius:999px;transition:width .2s ease}

/* Bandeau de proposition (mode zip / dossier non autorisé) — fixé en bas, responsive. */
.bk-propose{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:9000;display:flex;align-items:center;gap:12px;
  background:var(--warn-soft);border:1px solid var(--warn);border-radius:12px;padding:12px 14px;width:660px;max-width:calc(100vw - 32px);
  box-shadow:0 10px 36px -16px rgba(16,21,33,.45)}
.bk-propose .tx{flex:1;font-size:13px;color:var(--t1)}
.bk-propose .tx b{color:var(--t1)}
/* Rappel hebdomadaire « planifie une sauvegarde » — bandeau doux (accent corail), fixé en bas. */
.bk-reminder{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:9000;display:flex;align-items:center;gap:12px;
  background:var(--sur);border:1px solid var(--bor);border-left:3px solid var(--acc);border-radius:12px;padding:12px 14px;width:560px;max-width:calc(100vw - 32px);
  box-shadow:0 10px 36px -16px rgba(16,21,33,.45)}
.bk-reminder .bk-rm-ic{flex:0 0 auto;width:34px;height:34px;border-radius:9px;background:var(--acc-soft);color:var(--acc);display:flex;align-items:center;justify-content:center}
.bk-reminder .tx{flex:1;min-width:0;font-size:13px;color:var(--t1)}
.bk-reminder .tx small{display:block;color:var(--t3);font-size:11.5px;margin-top:1px}
.bk-reminder .bk-rm-x{border:0;background:none;color:var(--t3);cursor:pointer;display:inline-flex;flex-shrink:0}
@media(max-width:640px){.bk-reminder{flex-wrap:wrap;left:8px;right:8px;transform:none;width:auto} .bk-reminder .tx{flex:1 1 100%}}
/* Restauration depuis le dossier — modale (liste d'instantanés) + overlay de progression. */
#bkr-ov{position:fixed;inset:0;background:rgba(15,30,50,.42);z-index:100000;display:flex;align-items:center;justify-content:center;padding:20px}
.bkr-modal{background:var(--sur);border:1px solid var(--bor);border-radius:14px;box-shadow:var(--shadow-lg);width:min(540px,94vw);max-height:82vh;display:flex;flex-direction:column;overflow:hidden}
.bkr-hd{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid var(--bor)}
.bkr-hd h3{margin:0;font-family:var(--display);font-weight:700;font-size:15px;color:var(--t1);display:flex;align-items:center;gap:8px}
.bkr-hd h3 svg{color:var(--acc)}
.bkr-x{border:0;background:none;color:var(--t3);cursor:pointer;display:inline-flex}
.bkr-bd{padding:15px 16px;overflow:auto}
.bkr-warn{display:flex;gap:9px;align-items:flex-start;background:var(--warn-soft);border:1px solid var(--warn);color:var(--warn);border-radius:10px;padding:10px 12px;font-size:12.5px;line-height:1.45;margin-bottom:13px}
.bkr-warn b{color:var(--t1)} .bkr-warn svg{flex-shrink:0;margin-top:1px}
.bkr-snap{display:flex;align-items:center;gap:11px;padding:11px 12px;border:1px solid var(--bor);border-radius:11px;margin-bottom:7px}
.bkr-snap.top{border-color:var(--acc)}
.bkr-ic{flex:0 0 auto;width:32px;height:32px;border-radius:8px;background:var(--neutral-soft);color:var(--neutral-ink);display:flex;align-items:center;justify-content:center}
.bkr-m{flex:1;min-width:0} .bkr-d{font-size:13.5px;font-weight:600;color:var(--t1)} .bkr-s{font-size:11px;color:var(--t3);margin-top:1px}
.bkr-tag{font-size:9.5px;font-weight:700;color:var(--grn);background:var(--bg-success);border-radius:5px;padding:2px 6px;margin-left:4px;vertical-align:1px}
.bkr-empty{text-align:center;padding:22px 12px;color:var(--t3)} .bkr-empty b{display:block;font-size:14px;color:var(--t1);margin:8px 0 3px} .bkr-empty span{font-size:12px}
.bkr-foot{margin-top:14px;padding-top:12px;border-top:1px solid var(--bor);display:flex;flex-direction:column;gap:7px;align-items:flex-start}
#bkr-progress{position:fixed;inset:0;background:rgba(15,30,50,.5);z-index:100001;display:flex;align-items:center;justify-content:center}
.bkr-prog-box{background:var(--sur);border:1px solid var(--bor);border-radius:12px;padding:20px 26px;display:flex;align-items:center;gap:14px;font-size:14px;color:var(--t1);box-shadow:var(--shadow-lg)}
.bkr-prog-spin{width:24px;height:24px;border:3px solid var(--bor);border-top-color:var(--acc);border-radius:50%;animation:bkr-spin .8s linear infinite;flex-shrink:0}
@keyframes bkr-spin{to{transform:rotate(360deg)}}
@media(max-width:640px){
  .bk-propose{flex-wrap:wrap;left:8px;right:8px;transform:none;width:auto}
  .bk-propose .tx{flex:1 1 100%}
  #backup-card .bk-row{flex-wrap:wrap}
  #backup-card .bk-seg{flex-wrap:wrap}
}

/* ── ASSISTANT DE DÉPART — fil rouge guidé (v15.x DEPART-ASSISTANT) ───────────── */
#ov-depart .modal{max-width:640px}
.dep-prog{display:flex;align-items:center;gap:10px;margin-top:10px}
.dep-bar{flex:1;height:7px;background:var(--sur3);border-radius:5px;overflow:hidden}
.dep-bar i{display:block;height:100%;background:var(--grn);border-radius:5px;transition:width .3s}
.dep-pc{font-size:11.5px;color:var(--t2);font-weight:700;white-space:nowrap}
.dep-dl{display:flex;gap:9px;align-items:flex-start;background:var(--bg-warning);border:1px solid var(--ora);border-radius:10px;padding:10px 13px;margin:0 0 14px;font-size:12.5px}
.dep-dl.late{background:var(--bg-danger);border-color:var(--red)}
.dep-dl b{color:var(--ora)} .dep-dl.late b{color:var(--red)}
.dep-dl .small{font-size:11.5px;color:var(--t2)}
/* DEPART-ESTIM Phase B : alerte acompte avant l'EDL */
.dep-acp{border:1px solid var(--ora);background:var(--bg-warning);border-radius:11px;padding:11px 13px;margin:0 0 14px}
.dep-acp-h{font-weight:700;font-size:12.5px;color:var(--ora);margin-bottom:8px}
.dep-acp-l{display:flex;justify-content:space-between;gap:10px;font-size:12px;padding:2px 0;font-variant-numeric:tabular-nums}
.dep-acp-l.tot{border-top:1px solid var(--ora);margin-top:4px;padding-top:6px;font-weight:700}
.dep-acp-l .neg{color:var(--red);font-weight:700}
.dep-acp-rc{font-size:11.5px;color:var(--t1);line-height:1.45;margin-top:8px}
.dep-acp-ok{font-size:12px;color:var(--grn);font-weight:600;margin-top:8px}
.dep-steps{position:relative}
.dep-step{position:relative;padding:12px 0 12px 42px;border-bottom:1px solid var(--bor2)}
.dep-step:last-child{border-bottom:0}
.dep-step::before{content:'';position:absolute;left:13px;top:34px;bottom:-12px;width:2px;background:var(--bor)}
.dep-step:last-child::before{display:none}
.dep-dot{position:absolute;left:0;top:12px;width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;border:2px solid var(--bor);background:var(--sur)}
.dep-dot.done{background:var(--grn);border-color:var(--grn);color:#fff}
.dep-dot.cur{background:var(--acc);border-color:var(--acc);color:#fff;box-shadow:0 0 0 4px var(--acc-soft)}
.dep-dot.lock{background:var(--sur3);color:var(--t3)}
.dep-dot.wait{background:var(--bg-warning);border-color:var(--ora);color:var(--ora)}
.dep-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.dep-ttl{font-weight:700;font-size:14px;color:var(--t1)}
.dep-step.locked .dep-ttl,.dep-step.locked .dep-sub{color:var(--t3)}
.dep-pill{font-size:9.5px;padding:2px 8px;border-radius:20px;font-weight:700;text-transform:uppercase;letter-spacing:.3px}
.dep-pill.ok{background:var(--bg-success);color:var(--grn)}
.dep-pill.cur{background:var(--acc-soft);color:var(--acc)}
.dep-pill.lock{background:var(--sur3);color:var(--t3)}
.dep-pill.wait{background:var(--bg-warning);color:var(--ora)}
.dep-pill.todo{background:var(--sur3);color:var(--t3)}
.dep-sub{font-size:12px;color:var(--t2);margin-top:3px;line-height:1.45}
.dep-alert{font-size:11.5px;color:var(--ora);margin-top:5px;line-height:1.45}
.dep-cta{margin-top:8px;display:inline-flex;gap:7px;flex-wrap:wrap}
.dep-cta button{border:1px solid var(--acc);background:var(--acc-soft);color:var(--acc);border-radius:8px;padding:6px 12px;font:inherit;font-size:12px;font-weight:600;cursor:pointer}
.dep-cta button.ghost{border-color:var(--bor);background:var(--sur);color:var(--t2)}
.dep-cta button:disabled{opacity:.5;cursor:not-allowed;border-color:var(--bor);background:var(--sur2);color:var(--t3)}
.dep-chips{display:flex;flex-direction:column;gap:6px;margin-top:8px}
.dep-chip{display:flex;align-items:center;gap:8px;background:var(--sur2);border:1px solid var(--bor);border-radius:8px;padding:7px 10px;font-size:12px;color:var(--t1)}
.dep-chip .s{margin-left:auto;font-size:10px;color:var(--t3)}
.dep-form .fg{margin-bottom:12px}
.dep-form label{display:block;font-size:11.5px;font-weight:600;color:var(--t2);margin-bottom:4px}
@media(max-width:560px){
  #ov-depart .modal{max-width:100%}
  .dep-step{padding-left:38px}
  .dep-dot{width:24px;height:24px;font-size:12px}
  .dep-step::before{left:11px}
}

/* ── Vignettes photos EDL (orientation respectée + agrandies, option A « contenir ») ──
   Carré = surface égale portrait/paysage ; object-fit:contain = photo entière, jamais rognée.
   Remplace les anciens styles inline 48×38 / 38×30 / 48×48 + object-fit:cover.
   Le fond/bord suivent les tokens → s'adaptent au mode sombre. */
.edl-thumb{
  width:96px; height:96px;
  /* §A.6 : vignette de liste CARRÉE (cover) — le clic ouvre l'image entière (contain). */
  object-fit:cover;
  background:var(--bg);
  border:1px solid var(--bor);
  border-radius:6px;
  cursor:pointer;
  display:block;
}
@media (max-width:640px){ .edl-thumb{ width:72px; height:72px; } }

/* EDL TERRAIN lot 3 — « 34 / 77 photos à l'abri ». Tant qu'il en reste, le
   compteur se signale (couleur d'attention de la charte, pas un fond coloré). */
.edl-photos-attente{color:var(--ora);font-weight:600}
/* Indicateur de sauvegarde cloud CALME de la liste (décision Didier 27/08 : jamais de fraction
   anxiogène). Trois états discrets, dans les couleurs de la charte. */
.edl-cloud-ok{color:var(--muted,#8a94a6);font-weight:500;font-size:.9em}
.edl-cloud-wip{color:var(--muted,#8a94a6);font-weight:500;font-size:.9em;font-style:italic}
.edl-cloud-warn{color:var(--ora);font-weight:600;font-size:.9em}

/* ── Consultation EDL (décision 27/08) : « Voir l'EDL » (lecture seule) + « Photos » (galerie) ── */
.edl-consult-ov{position:fixed;inset:0;background:rgba(20,28,50,.55);z-index:9500;display:flex;align-items:flex-start;justify-content:center;padding:24px 12px;overflow:auto}
.edl-consult-card{background:var(--sur);border:1px solid var(--bor);border-radius:16px;width:100%;max-width:820px;box-shadow:0 18px 60px rgba(20,28,50,.28);overflow:hidden;margin:auto}
.edl-consult-hd{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding:14px 16px;border-bottom:1px solid var(--bor);position:sticky;top:0;background:var(--sur);z-index:2}
.edl-consult-t{font-weight:800;font-size:16px}
.edl-consult-st{font-size:12.5px;color:var(--muted);margin-top:2px}
.edl-consult-x{border:0;background:var(--sur3);color:var(--txt,#1c2333);width:34px;height:34px;min-width:34px;padding:0;box-sizing:border-box;border-radius:50%;font-size:22px;line-height:1;cursor:pointer;flex:0 0 34px;display:flex;align-items:center;justify-content:center}
.edl-consult-x:hover{background:var(--bor)}
.edl-consult-actions{display:flex;gap:8px;flex-wrap:wrap;padding:10px 16px;border-bottom:1px solid var(--bor2);background:var(--sur2)}
.edl-consult-body{padding:8px 16px 18px}
.btn.bprim{border-color:var(--acc);color:var(--acc)}
/* Voir l'EDL — corps lecture seule */
.edl-v-id{display:grid;grid-template-columns:1fr 1fr;gap:4px 18px;padding:10px 0 12px;font-size:13px;border-bottom:1px solid var(--bor2)}
.edl-v-id b{color:var(--muted);font-weight:600;margin-right:4px}
.edl-v-sec{padding:12px 0;border-bottom:1px solid var(--bor2)}
.edl-v-sec h4{margin:0 0 8px;font-size:14px}
.edl-v-el{display:flex;gap:10px;align-items:flex-start;padding:7px 0;border-top:1px dashed var(--bor)}
.edl-v-el:first-of-type{border-top:0}
.edl-v-nom{flex:0 0 104px;font-size:13px;font-weight:600}
.edl-v-main{flex:1;min-width:0}
.edl-v-etats{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.edl-v-arrow{color:var(--muted)}
.edl-v-obs{font-size:12.5px;color:var(--muted);margin-top:4px;white-space:pre-wrap}
.edl-v-kvs{display:flex;flex-direction:column;gap:3px;margin-bottom:6px}
.edl-v-kv{font-size:13px}
.edl-v-kv b{color:var(--muted);font-weight:600;margin-right:6px}
.edl-v-thumbs{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.edl-v-thumbs .edl-thumb,.edl-gal-cell .edl-thumb{width:56px;height:56px;object-fit:cover;border-radius:8px;border:1px solid var(--bor);cursor:pointer;background:var(--sur3)}
.edl-v-empty{padding:24px;text-align:center;color:var(--muted)}
/* Galerie photos */
.edl-gal-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding:12px 0}
.edl-gal-cell{position:relative;aspect-ratio:1/1;border-radius:10px;overflow:hidden;border:1px solid var(--bor);cursor:pointer;background:var(--sur3)}
.edl-gal-cell .edl-thumb{width:100%;height:100%;border-radius:0;border:0}
.edl-gal-cap{position:absolute;left:0;right:0;bottom:0;font-size:10px;line-height:1.25;padding:3px 5px;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.62));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.edl-gal-pin{position:absolute;top:4px;right:5px;font-size:12px;filter:drop-shadow(0 1px 1px rgba(0,0,0,.5))}
@media (max-width:767px){
  .edl-v-id{grid-template-columns:1fr}
  .edl-v-nom{flex-basis:78px}
  .edl-gal-grid{grid-template-columns:repeat(3,1fr)}
  .edl-consult-ov{padding:0}
  .edl-consult-card{max-width:none;border-radius:0;min-height:100vh}
}

/* ── EDL TERRAIN lot 2 · invitation à installer l'app ──────────────────────
   CDC §3 verrou 4. Bandeau discret, au-dessus de la barre du bas, jamais
   par-dessus le contenu de saisie. Téléphone uniquement (le module refuse
   au-delà de 767 px, la media query le redit côté rendu). */
.pwa-invite{
  position:fixed;
  left:12px;right:12px;
  bottom:calc(env(safe-area-inset-bottom, 8px) + 76px);
  z-index:1500;
  display:flex;flex-direction:column;gap:10px;
  background:var(--sur);
  border:1px solid var(--bor);
  border-radius:14px;
  box-shadow:0 8px 28px rgba(20,25,54,.18);
  padding:14px 16px;
}
.pwa-invite-txt{display:flex;flex-direction:column;gap:4px}
.pwa-invite-txt strong{font-size:14px;color:var(--t1)}
.pwa-invite-txt span{font-size:12.5px;line-height:1.5;color:var(--t2)}
.pwa-invite-act{display:flex;gap:8px;justify-content:flex-end}
.pwa-invite-act .btn{min-height:40px}
@media (min-width:768px){ .pwa-invite{ display:none; } }

/* EDL TERRAIN lot 1 (CDC docs/CDC-EDL.md §1) — sur téléphone, l'enregistrement
   est AUTOMATIQUE : le bouton « 💾 Enregistrer » n'y a plus de rôle et il prend
   une place précieuse dans un pied de page utilisé d'une seule main. Il reste
   sur tablette et PC. Fermer (✕) enregistre, sur tous les formats. */
@media (max-width:640px){ #edl-btn-save{ display:none; } }

/* ═══════════════════════════════════════════════════════════════════════════
   v15.414 DASH-ACTIONS-REFONTE + BUG-DASH-GESTIONNAIRE-PARC — dashboard
   Gestionnaire refondu (mockup B validé user 2026-07-05) :
   parc COMPLET pleine hauteur à gauche (scroll interne, intercalaires immeuble)
   · droite : Agenda → « À traiter » (pastilles par catégorie dépliables, bulle
   FIGÉE, scroll interne) → 4 widgets conformité 2×2 ÉPINGLÉS en bas.
   La page ne déborde jamais (hauteur calée viewport).
   ═══════════════════════════════════════════════════════════════════════════ */
body[data-dash-v4="on"] .v4s-gest2{display:flex;flex-direction:column;gap:14px;height:calc(100dvh - 100px);min-height:520px}
body[data-dash-v4="on"] .v4s-gest2 .v4s-weather-gest{flex-shrink:0;margin-bottom:0}
body[data-dash-v4="on"] .v4s-gest2-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;flex:1;min-height:0}
body[data-dash-v4="on"] .v4s-gest2-parc{display:flex;flex-direction:column;min-width:0;min-height:0}
body[data-dash-v4="on"] .v4s-gest2-parcwrap{flex:1;min-height:0;overflow-y:auto;border:1px solid var(--bor2);border-radius:8px}
body[data-dash-v4="on"] .v4s-gest2-parcwrap table{width:100%;border-collapse:collapse}
body[data-dash-v4="on"] .v4s-gest2-parcwrap thead th{position:sticky;top:0;background:var(--sur2);z-index:2;text-align:left;padding:6px 7px;font:700 9.5px Inter,sans-serif;letter-spacing:.5px;text-transform:uppercase;color:var(--t3);border-bottom:1px solid var(--bor)}
body[data-dash-v4="on"] .v4s-gest2-parcwrap tbody td{padding:5px 7px;border-bottom:1px solid var(--bor2);font:500 11.5px Inter,sans-serif;color:var(--t1);white-space:nowrap}
body[data-dash-v4="on"] .v4s-gest2-parcwrap tbody tr:not(.v4s-gest2-immsep):hover{background:var(--sur2);cursor:pointer}
body[data-dash-v4="on"] .v4s-gest2-parcwrap td:nth-child(n+3),
body[data-dash-v4="on"] .v4s-gest2-parcwrap th:nth-child(n+3){text-align:center}
body[data-dash-v4="on"] .v4s-gest2-immsep td{background:var(--sur3);font:700 10px Inter,sans-serif;padding:3px 8px;color:var(--t2)}
body[data-dash-v4="on"] .v4s-gest2-right{display:flex;flex-direction:column;gap:14px;min-width:0;min-height:0}
body[data-dash-v4="on"] .v4s-gest2-right > .v4s-card{flex-shrink:0}
body[data-dash-v4="on"] .v4s-gest2-conf{margin-top:auto;display:grid;grid-template-columns:1fr 1fr;gap:10px}
body[data-dash-v4="on"] .v4s-gest2-conf .v4s-conf-card{min-width:0}
body[data-dash-v4="on"] .v4s-gest2-actions{height:238px;display:flex;flex-direction:column;overflow:hidden}
body[data-dash-v4="on"] .v4s-gest2-ah{display:flex;align-items:center;gap:8px;margin:0 0 8px}
body[data-dash-v4="on"] .v4s-gest2-ah h3{font:700 13.5px var(--display);color:var(--t1);margin:0}
body[data-dash-v4="on"] .v4s-gest2-count{background:#fee2e2;color:#991b1b;border-radius:12px;padding:2px 9px;font:700 11px Inter,sans-serif}
body[data-dash-v4="on"] .v4s-gest2-all{margin-left:auto;background:none;border:none;color:var(--acc);font:700 12px Inter,sans-serif;cursor:pointer}
body[data-dash-v4="on"] .v4s-gest2-chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:6px}
body[data-dash-v4="on"] .v4s-gest2-chip{display:flex;align-items:center;gap:6px;border:1.5px solid var(--bor);background:var(--sur);border-radius:16px;padding:4px 10px;cursor:pointer;font:600 11.5px Inter,sans-serif;color:var(--t1)}
body[data-dash-v4="on"] .v4s-gest2-chip .n{background:var(--sur3);border-radius:9px;padding:0 6px;font:800 10.5px Inter,sans-serif}
body[data-dash-v4="on"] .v4s-gest2-chip.red{border-color:#fca5a5}
body[data-dash-v4="on"] .v4s-gest2-chip.red .n{background:#fee2e2;color:#991b1b}
body[data-dash-v4="on"] .v4s-gest2-chip.ora{border-color:#fcd34d}
body[data-dash-v4="on"] .v4s-gest2-chip.ora .n{background:#fef3c7;color:#92400e}
body[data-dash-v4="on"] .v4s-gest2-chip.open{background:var(--t1);color:var(--sur);border-color:var(--t1)}
body[data-dash-v4="on"] .v4s-gest2-chip.open .n{background:rgba(255,255,255,.22);color:inherit}
body[data-dash-v4="on"] .v4s-gest2-bbody{border-top:1px dashed var(--bor);padding-top:5px;display:none;flex:1;min-height:0;overflow-y:auto}
body[data-dash-v4="on"] .v4s-gest2-bbody.open{display:block}
body[data-dash-v4="on"] .v4s-gest2-row{display:flex;align-items:center;gap:9px;padding:6px 8px;border-radius:8px;cursor:pointer;border:1px solid transparent}
body[data-dash-v4="on"] .v4s-gest2-row:hover{background:var(--sur2);border-color:var(--bor2)}
body[data-dash-v4="on"] .v4s-gest2-row .ic{width:26px;height:26px;border-radius:7px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
body[data-dash-v4="on"] .v4s-gest2-row .ic svg{width:14px;height:14px}
body[data-dash-v4="on"] .v4s-gest2-row.sev-red .ic{background:#fee2e2;color:#dc2626}
body[data-dash-v4="on"] .v4s-gest2-row.sev-ora .ic{background:#fef3c7;color:#b45309}
body[data-dash-v4="on"] .v4s-gest2-row.sev-info .ic{background:#e0f2fe;color:#0369a1}
body[data-dash-v4="on"] .v4s-gest2-row .tx{min-width:0;flex:1}
body[data-dash-v4="on"] .v4s-gest2-row .tx b{display:block;font:600 11.5px Inter,sans-serif;color:var(--t1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body[data-dash-v4="on"] .v4s-gest2-row .tx s{display:block;text-decoration:none;color:var(--t3);font:400 10px Inter,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body[data-dash-v4="on"] .v4s-gest2-row .go{flex-shrink:0;font:700 10.5px Inter,sans-serif;color:var(--acc);background:rgba(255,90,60,.08);border:none;border-radius:6px;padding:4px 8px;cursor:pointer;white-space:nowrap}
body[data-dash-v4="on"] .v4s-gest2-pill{display:inline-block;border-radius:9px;padding:1px 7px;font:700 9.5px Inter,sans-serif;white-space:nowrap}
body[data-dash-v4="on"] .v4s-gest2-pill.pos{background:#dcfce7;color:#166534}
body[data-dash-v4="on"] .v4s-gest2-pill.neg{background:#fee2e2;color:#991b1b}
body[data-dash-v4="on"] .v4s-gest2-pill.warn{background:#fef3c7;color:#92400e}
/* Empilement mobile/tablette étroite */
@media(max-width:1000px){
  body[data-dash-v4="on"] .v4s-gest2{height:auto}
  body[data-dash-v4="on"] .v4s-gest2-grid{grid-template-columns:1fr}
  body[data-dash-v4="on"] .v4s-gest2-parcwrap{max-height:420px}
  body[data-dash-v4="on"] .v4s-gest2-actions{height:auto;max-height:340px}
}
/* Écrans courts : compacter la colonne droite pour garder les widgets collés en bas */
@media(max-height:840px) and (min-width:1001px){
  body[data-dash-v4="on"] .v4s-gest2-actions{height:180px}
  body[data-dash-v4="on"] .v4s-gest2 .v4s-cal-legend{display:none}
  body[data-dash-v4="on"] .v4s-gest2-conf .v4s-conf-card{padding:10px 12px}
  body[data-dash-v4="on"] .v4s-gest2-conf .v4s-conf-val{font-size:16px}
}
/* Dark mode : les pastilles sévérité gardent leurs teintes (lisibles sur fond sombre) */
[data-theme="dark"] body[data-dash-v4="on"] .v4s-gest2-chip.open{background:var(--sur3);color:var(--t1);border-color:var(--bor)}

/* ═══ EDL TERRAIN lot 4 — MODE HORS LIGNE ═══════════════════════════════════
   Bandeau permanent (invariant 19c) + onglets fermés annoncés (19, 19b).
   Même mécanique que #readonly-banner : le bandeau est DANS LE FLUX en tête de
   <body>, et sa hauteur entre dans --top-banners-h (cf. _v4SyncBannersHeight)
   → .layout prend la hauteur restante au lieu de passer dessous.
   Couleurs prises aux TOKENS de la charte. Le fond porte la teinte d’alerte
   (--warn-soft) mais le TEXTE reste l’encre principale (--t1 / --t2) : l’encre
   --warn sur ce fond ne donnait que 4,31:1 en thème clair, sous le seuil 4,5:1.
   Seule l’icône garde --warn. Les deux thèmes suivent, sans règle dupliquée. */
#hl-bar{
  position:sticky; top:0; z-index:60;
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  padding:8px 18px;
  background:var(--warn-soft); color:var(--t1);
  border-bottom:1px solid var(--bor);
  font-size:var(--fs-base); font-weight:600; line-height:1.35;
}
#hl-bar .hl-ic{font-size:15px;flex-shrink:0;color:var(--warn)}
#hl-bar .hl-tx{white-space:nowrap}
/* La 2e ligne garde l’encre PRINCIPALE, la hiérarchie passe par la graisse et
   la taille. --t2 serait le choix naturel, mais body[data-dash-v4="on"] le force
   à #CDD4E5 SANS condition de thème (correctif v15.37) : en thème clair la
   consigne tombait à 1,2:1, illisible. Defaut pre-existant, signale au pilotage. */
#hl-bar .hl-sub{font-weight:400;color:var(--t1);font-size:var(--fs-sm)}
@media(max-width:768px){
  /* Téléphone : le libellé daté reste la ligne 1 (c'est l'invariant), la
     consigne de retour passe dessous plutôt que d'être tronquée. */
  #hl-bar{padding:7px 12px;gap:6px}
  #hl-bar .hl-sub{flex-basis:100%;font-size:var(--fs-xs);line-height:1.3}
}

/* Onglet fermé hors ligne : visiblement inactif, mais TOUJOURS cliquable —
   le clic est ce qui affiche la raison (invariant 19 : « aucune action n'est
   cliquable sans afficher sa raison » ; un pointer-events:none rendrait le
   bouton muet, exactement ce que le CDC refuse). */
.v4s-a.hl-off, .v4s-child.hl-off, .v4-bn.hl-off{
  opacity:.42;
  cursor:not-allowed;
}
.v4s-a.hl-off:hover, .v4s-child.hl-off:hover, .v4-bn.hl-off:hover{
  opacity:.55;
  background:transparent;
}

/* A11Y clavier (passe 2026-09) : anneau de focus visible sur les commandes non-natives
   (div/span onclick promus role=button/[data-a11y]). :focus-visible = clavier seulement, pas au clic souris. */
[data-a11y]:focus-visible,
[role="button"]:focus-visible{outline:2px solid var(--acc);outline-offset:2px;border-radius:5px}

/* VISALE-GMBI (docs/CDC-VISALE-GMBI.md) — choix de garantie, visa Visale, alerte déclaration d'occupation.
   Jetons uniquement (clair / sombre suivent les thèmes). Cibles ≥ 44 px. */
.gar-seg-lbl{font-size:13px;font-weight:600;color:var(--t1);margin-bottom:8px}
.gar-seg{display:flex;border:1px solid var(--bor);border-radius:var(--r);overflow:hidden;margin-bottom:12px}
.gar-seg [role="radio"]{flex:1;min-height:44px;border:0;border-right:1px solid var(--bor);background:var(--sur);color:var(--t2);font:600 13px var(--font,inherit);cursor:pointer;padding:0 8px}
.gar-seg [role="radio"]:last-child{border-right:0}
.gar-seg [role="radio"][aria-checked="true"]{background:var(--acc-bg);color:var(--acc);box-shadow:inset 0 -2px 0 var(--acc)}
.gar-seg [role="radio"]:focus-visible{outline:2px solid var(--acc);outline-offset:-2px}
.visale-chk{gap:8px;min-height:44px;font-weight:600;font-size:13px;color:var(--t1);cursor:pointer}
.visale-chk input{width:20px;height:20px;min-height:0}
.visale-warn,.visale-ok{display:flex;gap:8px;align-items:flex-start;border-radius:var(--r);padding:9px 12px;font-size:12.5px;margin-top:10px;line-height:1.45}
.visale-warn{border:1px solid var(--warn);background:var(--warn-soft);color:var(--t1)}
.visale-warn .uic{color:var(--warn);flex:0 0 auto;margin-top:1px}
.visale-ok{border:1px solid var(--pos);background:var(--pos-soft);color:var(--t1)}
.visale-ok .uic{color:var(--pos);flex:0 0 auto;margin-top:1px}
.visale-plaf{margin-top:10px;font-size:12px;color:var(--t2)}
.visale-plaf summary{cursor:pointer;font-weight:600;color:var(--adv);list-style:none;min-height:44px;display:flex;align-items:center;gap:6px}
.visale-plaf summary::-webkit-details-marker{display:none}
.visale-plaf > div{margin-top:6px;line-height:1.55}
.visale-plaf a{color:var(--adv);font-weight:600}
.visale-card{border:1px solid var(--adv);background:var(--adv-bg);border-radius:var(--r);padding:10px 12px}
.visale-card-h{font-weight:700;font-size:13px;color:var(--adv);display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.visale-badge{background:var(--adv);color:var(--sur);font-size:10px;font-weight:700;padding:1px 7px;border-radius:20px}
.gmbi-box{border:1px solid var(--bor);border-radius:var(--rl,12px);background:var(--sur2);padding:12px 14px}
.gmbi-h{font-weight:700;font-size:13px;color:var(--t1);display:flex;align-items:center;gap:7px;margin-bottom:8px}
.gmbi-pick{border:2px solid var(--acc);background:var(--acc-bg);border-radius:var(--r);padding:10px 12px;font-weight:600;font-size:13.5px;color:var(--t1)}
.gmbi-pick small{display:block;font-weight:500;color:var(--t2);font-size:12px;margin-top:3px}
.gmbi-sub{font-size:12px;font-weight:700;color:var(--t2);margin:10px 0 4px}
.gmbi-opt{border:1px solid var(--bor);border-radius:var(--r);padding:8px 12px;font-size:12.5px;color:var(--t2);margin:6px 0;background:var(--sur)}
#ov-gmbi .kv-grid{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;font-size:13.5px;align-items:baseline}
#ov-gmbi .kv-grid .k{color:var(--t2);font-size:12.5px}
#ov-gmbi .kv-grid .v{font-weight:600;color:var(--t1)}
#ov-gmbi .m-foot .btn{min-height:44px;text-decoration:none}
@media (max-width:767px){
  #ov-gmbi .kv-grid{grid-template-columns:1fr;gap:0}
  #ov-gmbi .kv-grid .v{margin-bottom:8px}
  #ov-gmbi .m-foot .btn{flex:1 1 0;justify-content:center}
  /* M-16 : page plein écran (100 % largeur et hauteur), corps défilant, pied collant en bas. */
  #ov-gmbi{padding:0 !important}
  #ov-gmbi .modal{width:100% !important;max-width:none !important;height:100dvh;border-radius:0;display:flex;flex-direction:column;margin:0}
  #ov-gmbi .m-body{flex:1 1 auto;overflow-y:auto;max-height:none}
  #ov-gmbi .m-foot{margin-top:auto;border-radius:0}
}

/* DOC-3 — cadre isolé des documents .pro-doc (iframe sandbox, cf. _docRenderSandboxed). */
.doc-sandbox{display:block;width:100%;border:0;min-height:220px;background:#fff}

/* ════════════════════════════════════════════════════════════════════════════════════════
   EDL-TÉLÉPHONE — CHARTE MOBILE (25/09, docs/CHARTE-MOBILE.md ; maquette
   mockups/EDL-TELEPHONE/MAQUETTE-375.html validée, variante A « cartes compactes »).
   Audit mesuré à 375 px (AUDIT-375.html) : texte de lecture jusqu'à 9,5 px, 10 valeurs coupées,
   47 types de cibles < 44 px. Ce bloc corrige le TÉLÉPHONE (≤ 767 px) seulement : la tablette
   (768–1023) garde les cartes du bloc « B) FORMULAIRE EDL », le PC (≥ 1024) son tableau.
   Placé en fin de fichier : il passe après toutes les règles EDL existantes.
   ════════════════════════════════════════════════════════════════════════════════════════ */

/* Éléments ajoutés pour le téléphone : invisibles ailleurs. */
.edl-wd,.edl-el-txt,.edl-el-more,.edl-addph-lbl,.edl-ph-title,.edl-ph-sub,.edl-rail-prog,.edl-rail-bar,
.edl-rail-arr-lbl,.edl-log-card,.edl-cle-del-lbl,.edl-legal-foot,.edl-lmore{display:none}
@media (min-width:768px){ #ov-edl .edl-ph-more{display:none !important} }
/* Ex-champs d'une ligne devenus <textarea class="inp edl-1l"> : hors téléphone ils gardent l'ALLURE
   d'un champ (une ligne, sans poignée) — sinon la règle globale textarea.inp (70 px, resize) les
   étirait sur PC et tablette (audit B1). Le téléphone les laisse passer à la ligne (bloc ≤ 767). */
#ov-edl textarea.inp.edl-1l{min-height:0;resize:none;overflow:hidden;white-space:pre;overflow-wrap:normal}
.edl-page{display:none}

@media (max-width:767px){
  /* ── Couleurs (M-15 : pas de rouge — le corail marque « Mauvais », l'écart, la suppression) ── */
  #ov-edl{--e-mauvais:var(--acc)}

  /* ── En-tête : le nom de l'étape en titre, « Entrée · F-001 · Enregistré à … » dessous ── */
  #ov-edl .m-head{padding:8px 4px 8px 14px !important;align-items:center !important;gap:2px;min-height:64px}
  #ov-edl .m-head > div:first-child{flex:1;min-width:0}
  #ov-edl #m-edl-title,#ov-edl .edl-legal-head{display:none !important}
  #ov-edl .edl-ph-title{display:block;font:800 18px/1.2 var(--display);color:var(--t1);margin:0}
  #ov-edl .edl-ph-sub{display:inline;font:400 14px/1.35 var(--font);color:var(--t2)}
  #ov-edl #edl-autosave-etat{display:inline !important;font-size:14px !important;color:var(--t2);margin:0 !important}
  #ov-edl #edl-autosave-etat:not(:empty)::before{content:' · '}
  #ov-edl #edl-photos-abri{font-size:14px !important;color:var(--t2)}
  #ov-edl .edl-ph-more,#ov-edl .m-head .m-close{flex:none;width:44px;height:44px;min-width:44px;display:flex;align-items:center;
    justify-content:center;border-radius:12px;background:none;border:none;color:var(--t1);padding:0 !important;font-size:20px;cursor:pointer}
  #ov-edl .edl-ph-more svg,#ov-edl .m-head .m-close svg{width:22px;height:22px}

  /* ── Pied d'action à deux étages : progression (→ Sommaire) + barre, puis Précédent / Suivant ── */
  #ov-edl .edl-rail{flex-wrap:wrap;gap:0 10px !important;padding:4px 12px calc(10px + env(safe-area-inset-bottom,0px)) !important}
  #ov-edl .edl-rail-prog{display:flex;order:1;align-items:center;gap:8px;width:100%;min-height:44px;background:none;border:none;
    color:var(--t2);font:400 14px/1.3 var(--font);text-align:left;padding:0 4px;cursor:pointer}
  #ov-edl .edl-rail-prog-t{flex:1;min-width:0}
  #ov-edl .edl-rail-prog-t b{color:var(--t1);font-weight:700}
  #ov-edl .edl-rail-prog-ic{display:inline-flex;color:var(--t2)}
  #ov-edl .edl-rail-prog-go{font-size:22px;line-height:1;color:var(--t2)}
  #ov-edl .edl-rail-bar{display:block;order:2;width:calc(100% - 8px);height:4px;margin:0 4px 8px;border-radius:4px;background:var(--sur3);overflow:hidden}
  #ov-edl .edl-rail-bar i{display:block;height:100%;width:0;background:var(--pos);border-radius:4px;transition:width .2s}
  #ov-edl .edl-rail-mid{display:none !important}
  #ov-edl #edl-rail-prev{order:3}
  #ov-edl #edl-rail-next{order:4}
  #ov-edl .edl-rail-arrow{flex:1 1 0 !important;min-height:48px;display:flex;align-items:center;justify-content:center;
    padding:4px 10px;font:700 16px/1.2 var(--font);border-radius:12px;text-align:center}
  #ov-edl .edl-rail-arr{display:none}
  #ov-edl .edl-rail-arr-lbl{display:inline-flex;align-items:center;justify-content:center;gap:8px}
  #ov-edl .edl-rail-arr-lbl svg{width:20px;height:20px;flex:none}
  #ov-edl #edl-rail-prev{background:transparent;color:var(--t1);border:1px solid var(--bor)}
  #ov-edl #edl-rail-next{background:var(--acc);border:1px solid var(--acc);color:var(--cta-text)}
  #ov-edl #edl-rail-next:disabled{background:var(--sur2);border-color:var(--bor);color:var(--t2)}

  /* ── Page plein écran au-dessus de l'étape (actions pièce / élément, choix du logement) ── */
  #ov-edl > .modal{position:relative}
  #ov-edl .edl-page{position:absolute;inset:0;z-index:80;flex-direction:column;background:var(--bg)}
  .edl-page.edl-lpage{position:fixed;inset:0;z-index:1001;flex-direction:column;background:var(--bg)}
  .edl-page-head{flex:none;display:flex;align-items:center;gap:6px;min-height:64px;padding:8px 14px 8px 4px;
    background:var(--sur);border-bottom:1px solid var(--bor)}
  .edl-page-back{flex:none;min-height:44px;min-width:44px;display:inline-flex;align-items:center;gap:4px;padding:0 10px;
    background:none;border:none;border-radius:12px;color:var(--t1);font:600 16px var(--font);cursor:pointer}
  .edl-page-back span{font-size:26px;line-height:1}
  .edl-page-title{flex:1;min-width:0;font:800 18px/1.25 var(--display);color:var(--t1);overflow-wrap:anywhere}
  .edl-page-body{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:16px}
  .edl-page-foot{flex:none;display:flex;gap:10px;padding:10px 12px calc(10px + env(safe-area-inset-bottom,0px));
    background:var(--sur);border-top:1px solid var(--bor)}
  .edl-page-foot .btn{flex:1 1 0;min-height:48px;justify-content:center;font:700 16px var(--font);border-radius:12px}
  .edl-page-foot .edl-page-sec{background:transparent;border:1px solid var(--bor);color:var(--t1)}
  .edl-page-foot .edl-page-pri{background:var(--acc);border:1px solid var(--acc);color:var(--cta-text)}
  .edl-page-foot .edl-page-danger{background:transparent;border:1px solid var(--acc);color:var(--acc)}
  .edl-page-lab{display:block;font:600 14px var(--font);color:var(--t2);margin:0 0 6px}
  .edl-page-fld{width:100%;min-height:48px;font-size:16px;line-height:1.35;padding:12px 14px;border-radius:12px;resize:none}
  .edl-page-list{display:flex;flex-direction:column;gap:0;margin:16px 0;background:var(--sur);border:1px solid var(--bor);
    border-radius:16px;overflow:hidden}
  .edl-page-row{display:flex;align-items:center;gap:12px;width:100%;min-height:56px;padding:10px 14px;background:none;border:none;
    border-top:1px solid var(--bor);color:var(--t1);font:400 16px/1.35 var(--font);text-align:left;cursor:pointer}
  .edl-page-row:first-child{border-top:none}
  .edl-page-row.cur{background:var(--acc-soft);font-weight:700}
  .edl-page-row svg{width:22px;height:22px;flex:none;color:var(--t2)}
  .edl-page-del{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:48px;margin-top:4px;
    background:transparent;border:1px solid var(--acc);border-radius:12px;color:var(--acc);font:700 16px var(--font);cursor:pointer}
  .edl-page-del svg{width:20px;height:20px}
  .edl-page-note{font:400 15px/1.45 var(--font);color:var(--t2);margin:12px 0 0}
  .edl-page-q{font:700 17px/1.4 var(--font);color:var(--t1);margin:0}

  /* ── Pièce : la gestion quitte le haut de l'écran (⋮ de l'en-tête) ; légende inutile (états en mots) ── */
  #edl-pieces-section .edl-piece-head,#edl-pieces-section > .edl-legend{display:none !important}
  #edl-pieces-section .edl-piece-block{border:none !important;margin:0 !important;overflow:visible !important;border-radius:0 !important}
  #edl-pieces-section .tbl-wrap table.tbl tbody{display:block}
  /* chaque élément = une carte */
  #edl-pieces-section .tbl-wrap table.tbl tr{background:var(--sur) !important;border:1px solid var(--bor) !important;
    border-radius:16px;margin:0 0 10px;padding:12px 12px 14px 14px !important}
  /* nom en entier (plus de champ qui coupe) + ⋮ (renommer / supprimer en page) */
  #edl-pieces-section .tbl-wrap table.tbl td.edl-cell-nom{display:flex !important;align-items:flex-start;gap:4px;
    padding:0 !important;margin:0 !important;border:none !important}
  #edl-pieces-section .tbl-wrap table.tbl td.edl-cell-nom .edl-el-in{display:none !important}
  #edl-pieces-section .edl-el-txt{display:block;flex:1;min-width:0;padding-top:11px;font:700 16px/1.3 var(--font);color:var(--t1);overflow-wrap:anywhere}
  #edl-pieces-section .edl-el-more{display:flex;flex:none;align-items:center;justify-content:center;width:44px;height:44px;
    margin:-2px -6px 0 0;background:none;border:none;border-radius:12px;color:var(--t2);cursor:pointer}
  #edl-pieces-section .edl-el-more svg{width:22px;height:22px}
  #edl-pieces-section .tbl-wrap table.tbl td[style*="width:20px"]{display:none !important}
  /* états en toutes lettres, 5 cases égales de 44 px */
  #ov-edl .edl-ab{display:none}
  #ov-edl .edl-wd{display:inline}
  #edl-pieces-section .tbl-wrap table.tbl td:nth-child(2){display:grid !important;grid-template-columns:repeat(5,minmax(0,1fr));
    gap:4px !important;padding:10px 0 0 !important}
  #edl-pieces-section .tbl-wrap table.tbl td:nth-child(2)::before{content:none !important}
  #edl-pieces-section .tbl-wrap table.tbl td button[onclick^="edlEtat"]{min-width:0 !important;min-height:44px !important;
    margin:0 !important;padding:0 2px !important;font-size:14px !important;border-radius:10px !important;letter-spacing:-.1px}
  #edl-pieces-section .tbl-wrap table.tbl td button[onclick^="edlEtat"][aria-pressed="false"]{background:var(--sur2) !important}
  /* observation : zone qui grandit avec le texte */
  #edl-pieces-section .tbl-wrap table.tbl td:nth-child(3){padding:8px 0 0 !important}
  #edl-pieces-section .tbl-wrap table.tbl td:nth-child(3)::before{content:none !important}
  #edl-pieces-section .tbl-wrap table.tbl td textarea{min-height:44px !important;padding:11px 12px !important;border-radius:12px !important;
    resize:none !important;overflow:hidden;line-height:1.35 !important;font-size:16px !important;color:var(--t1) !important}
  /* photos : vignettes 64 px, ajout libellé 44 px, suppression par zone de 44 px */
  #edl-pieces-section .tbl-wrap table.tbl td[style*="vertical-align:top"]{padding:10px 0 0 !important}
  #edl-pieces-section .tbl-wrap table.tbl td[style*="vertical-align:top"]::before{content:none !important}
  #edl-pieces-section .tbl-wrap table.tbl td[style*="vertical-align:top"] > div:first-child{display:flex;flex-wrap:wrap;gap:10px}
  #ov-edl .edl-thumb{width:64px !important;height:64px !important;border-radius:10px;object-fit:cover}
  #ov-edl .edl-addph{display:inline-flex !important;align-items:center;gap:8px;min-height:44px !important;margin:10px 0 0 !important;
    padding:0 14px !important;border:1px dashed color-mix(in srgb,var(--t2) 55%,transparent) !important;border-radius:12px !important;
    background:transparent !important;color:var(--t1) !important;font:600 15px var(--font) !important}
  #ov-edl .edl-addph svg{width:20px;height:20px}
  #ov-edl .edl-addph-lbl{display:inline}
  #ov-edl .edl-addph-pc{display:none}
  #ov-edl .edl-delphoto{top:-12px !important;right:-12px !important;width:44px !important;height:44px !important;padding:4px !important;
    background:transparent !important;box-shadow:none !important;align-items:flex-start !important;justify-content:flex-end !important}
  #ov-edl .edl-dp-i{display:flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:var(--sur);
    border:1px solid var(--bor);color:var(--t1);box-shadow:0 1px 3px rgba(0,0,0,.25)}
  #ov-edl .edl-dp-i svg{width:14px;height:14px}

  /* ── Sortie : verdict d'abord, référence d'entrée en lecture, sortie à constater (liseré corail) ── */
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl tbody tr{
    grid-template-areas:'nom' 'verdict' 'etatE' 'obsE' 'photoE' 'etatS' 'obsS' 'photoS' !important;padding:12px 12px 14px 14px !important}
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td.edl-cell-nom{padding:0 !important;margin:0 !important;border:none !important}
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td.edl-verdict-cell{border-top:none !important;margin:2px 0 10px !important;padding:0 !important}
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td.edl-verdict-cell::before{content:none !important}
  #ov-edl .edl-vbadge{font:700 14px var(--font) !important;padding:3px 11px}
  #ov-edl .edl-vbadge.vc-ok{color:var(--pos);border-color:var(--pos);background:color-mix(in srgb,var(--pos) 10%,transparent)}
  #ov-edl .edl-vbadge.vc-ko{color:var(--acc);border-color:var(--acc);background:var(--acc-soft);font-weight:700}
  #ov-edl .edl-vbadge.vc-att{color:var(--t2);border-color:var(--bor);background:var(--sur2)}
  #ov-edl .edl-vwarn{display:block;max-width:none !important;margin-top:6px;font:600 14px/1.35 var(--font) !important;color:var(--acc)}
  #ov-edl .edl-pastille{font:700 14px var(--font) !important;padding:4px 12px}
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(2)::before{content:'Entrée — référence signée' !important;
    font:600 14px var(--font) !important;text-transform:none !important;letter-spacing:0 !important;color:var(--t2) !important;margin-bottom:8px !important}
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td.edl-cell-obsE::before{content:'Observation à l’entrée' !important;
    font:600 14px var(--font) !important;text-transform:none !important;letter-spacing:0 !important;color:var(--t2) !important;margin:8px 0 2px !important}
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td.edl-cell-obsE textarea{border:none !important;background:transparent !important;
    padding:0 !important;min-height:0 !important;font-style:normal !important;color:var(--t1) !important;opacity:1 !important}
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(4)::before{content:'Photos à l’entrée' !important;
    font:600 14px var(--font) !important;text-transform:none !important;letter-spacing:0 !important;color:var(--t2) !important;margin:8px 0 6px !important}
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(5),
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(6),
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(7){
    background:color-mix(in srgb,var(--acc) 5%,transparent) !important;border-left:4px solid var(--acc) !important;
    border-right:1px solid color-mix(in srgb,var(--acc) 30%,transparent) !important}
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(5){display:grid !important;grid-template-columns:repeat(5,minmax(0,1fr));
    gap:4px !important;border-top:1px solid color-mix(in srgb,var(--acc) 30%,transparent) !important}
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(5)::before{content:'Sortie — à constater' !important;grid-column:1 / -1;
    font:600 14px var(--font) !important;text-transform:none !important;letter-spacing:0 !important;color:var(--t1) !important;margin:0 0 4px !important}
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(5) button{flex:none !important}
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(6)::before{content:none !important}
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(7)::before{content:'Photos à la sortie' !important;
    font:600 14px var(--font) !important;text-transform:none !important;letter-spacing:0 !important;color:var(--t2) !important;margin:6px 0 4px !important}
  #edl-pieces-section.edl-sortie-mode .tbl-wrap table.tbl td:nth-child(7){border-bottom:1px solid color-mix(in srgb,var(--acc) 30%,transparent) !important}
  #ov-edl #edl-ref-banner{font-size:15px !important;line-height:1.45;background:var(--sur2) !important;color:var(--t1) !important;
    border:1px solid var(--bor) !important;border-radius:12px !important;padding:12px !important}

  /* ── Infos / compteurs / clés / détecteur : libellés lisibles, cibles de 44 px ── */
  #ov-edl label{font-size:14px !important;line-height:1.35}
  #ov-edl .fg > label,#ov-edl label[style*="font-size:11px"],#ov-edl label[style*="font-size:11.5px"]{font-weight:600;color:var(--t2)}
  #ov-edl textarea.inp.edl-1l{resize:none;overflow:hidden;min-height:48px;line-height:1.35;white-space:pre-wrap;overflow-wrap:anywhere}
  #ov-edl .edl-cpt-tbl td[data-label]::before,#ov-edl .edl-cles-tbl td[data-label]::before{font:600 14px var(--font) !important;
    text-transform:none !important;letter-spacing:0 !important;color:var(--t2) !important;margin-bottom:6px !important}
  #ov-edl .edl-cpt-tbl td > span[style*="font-size:11px"]{font-size:14px !important;font-weight:600}
  #ov-edl .edl-cpt-tbl td button[onclick*="edlCptAddPhoto"]{min-height:44px !important}
  /* cases et boutons radio : la ligne entière est la cible (44 px), la case est lisible (22 px) */
  #ov-edl input[type="checkbox"],#ov-edl input[type="radio"]{width:22px !important;height:22px !important;flex:none;margin:0;accent-color:var(--acc)}
  #ov-edl label:has(> input[type="checkbox"]),#ov-edl label:has(> input[type="radio"]){display:flex !important;align-items:center;gap:12px;
    min-height:44px;font-size:16px !important;font-weight:500 !important;color:var(--t1) !important;cursor:pointer}
  #ov-edl > .modal div[style*="border-top:1px solid var(--bor)"] > .flex-c.mb4{flex-direction:row !important;flex-wrap:wrap;align-items:center !important;gap:8px !important}
  #ov-edl > .modal div[style*="border-top:1px solid var(--bor)"] > .flex-c.mb4 > label:has(> input[type="checkbox"]){width:auto !important;
    padding:0 16px !important;border:1px solid var(--bor);border-radius:999px;background:var(--sur)}
  #ov-edl > .modal div[style*="border-top:1px solid var(--bor)"] > .flex-c.mb4 > label:has(> input:checked){border:2px solid var(--t1);background:var(--sur3);font-weight:700 !important}
  #ov-edl [data-edl-step="daaf"] label:has(> input[type="radio"]){min-height:56px;padding:8px 14px;margin:0 0 8px;border:1px solid var(--bor);
    border-radius:14px;background:var(--sur)}
  #ov-edl [data-edl-step="daaf"] label:has(> input:checked){border:2px solid var(--t1)}
  /* sections détecteur / mobilier : fonds jaunes codés en dur (illisibles en sombre) → surfaces du thème */
  #ov-edl #edl-daaf-section,#ov-edl #edl-mobilier-section{background:var(--sur) !important;border-color:var(--bor) !important;color:var(--t1)}
  #ov-edl #edl-daaf-section [style*="background:#"],#ov-edl #edl-mobilier-section [style*="background:#"]{background:var(--sur2) !important;border-color:var(--bor) !important;color:var(--t1) !important}
  #ov-edl #edl-daaf-section [style*="color:#"],#ov-edl #edl-mobilier-section [style*="color:#"]{color:var(--t1) !important}
  #ov-edl #edl-daaf-section [style*="font-size:1"],#ov-edl #edl-mobilier-section [style*="font-size:1"]{font-size:15px !important;line-height:1.45}
  /* l'alerte « Risque juridique » reste une ALERTE (corail), pas un encart gris (audit M8) */
  #ov-edl #edl-daaf-warning{background:var(--acc-soft) !important;border:1px solid color-mix(in srgb,var(--acc) 45%,transparent) !important;color:var(--t1) !important;border-radius:12px}
  #ov-edl #edl-daaf-warning *{color:var(--t1) !important}
  /* suppression d'une clé : un bouton libellé de 44 px, en bas de sa carte (plus de croix sur le libellé) */
  #ov-edl .edl-cles-tbl tr td.edl-cle-delcell{position:static !important;padding:8px 0 0 !important}
  #ov-edl .edl-cles-tbl tr td.edl-cle-delcell > button.edl-cle-del{width:auto !important;height:auto !important;min-height:44px;display:inline-flex !important;
    align-items:center;gap:8px;padding:0 14px !important;border:1px solid var(--acc) !important;border-radius:12px;background:transparent !important;
    color:var(--acc) !important;font:600 15px var(--font) !important}
  #ov-edl .edl-cle-del-lbl{display:inline}
  #ov-edl .btn.bs{min-height:44px;font-size:15px !important}
  /* logement : une carte lisible en entier (le <select> reste la source, caché) */
  #ov-edl select#edl-log{display:none !important}
  #ov-edl .edl-log-card{display:flex;align-items:flex-start;gap:10px;padding:12px 12px 12px 14px;border:1px solid var(--bor);border-radius:14px;background:var(--sur)}
  #ov-edl .edl-log-card-x{flex:1;min-width:0;font-size:15px;color:var(--t1);overflow-wrap:anywhere}
  #ov-edl .edl-log-card-x b{font:800 17px var(--display)}
  #ov-edl .edl-log-card-l2{font-size:15px;margin-top:2px}
  #ov-edl .edl-log-card-l3{font-size:14px;color:var(--t2);margin-top:2px}
  #ov-edl .edl-log-change,#ov-edl .edl-log-pick{flex:none;min-height:44px;padding:0 14px;font:600 15px var(--font);border-radius:12px}
  #ov-edl .edl-log-pick{flex:1;background:var(--acc);border-color:var(--acc);color:var(--cta-text)}
  /* mention légale : quitte l'en-tête, rappelée en bas d'Infos et des Signatures */
  #ov-edl .edl-legal-foot{display:block;font:400 14px/1.45 var(--font);color:var(--t2);margin:14px 0 2px}
  /* textes des signatures et de l'engagement */
  #ov-edl #edl-engagement-titre{font-size:16px !important}
  #ov-edl #edl-engagement-txt1,#ov-edl #edl-engagement-txt2,#ov-edl #edl-faitle-text,#ov-edl #edl-sigintro-text{font-size:15px !important;line-height:1.5 !important}
  #ov-edl [data-edl-step="fin"] div[style*="font-size:11px"],#ov-edl [data-edl-step="fin"] div[style*="font-size:12px"]{font-size:14px !important}
  #ov-edl [data-edl-step="fin"] .btn{min-height:44px;font-size:15px !important}

  /* ── Sommaire des étapes : PAGE plein écran (était un volet sur la moitié basse, M-16) ── */
  #ov-edl .edl-piece-sheet{background:var(--bg);align-items:stretch}
  #ov-edl .edl-sheet-panel{max-width:none;max-height:none;height:100%;border-radius:0;border:none;box-shadow:none}
  #ov-edl .edl-sheet-head{min-height:64px;padding:8px 4px 8px 16px}
  #ov-edl .edl-sheet-head b{font:800 18px var(--display);color:var(--t1)}
  #ov-edl .edl-sheet-close{width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:12px;color:var(--t1)}
  #ov-edl .edl-sheet-row{min-height:56px;border-radius:12px}
  #ov-edl .edl-sheet-nom{font:600 16px/1.3 var(--font);white-space:normal;overflow:visible;text-overflow:clip}
  #ov-edl .edl-sheet-tag{font:600 14px var(--font);text-transform:none;letter-spacing:0;padding:0;background:none !important;color:var(--t2) !important}
  #ov-edl .edl-pcount,#ov-edl .edl-pecart{font-size:14px;padding:2px 10px}
  #ov-edl .edl-pecart{color:var(--acc);border-color:var(--acc);background:var(--acc-soft)}
  #ov-edl .edl-sheet-add-lbl{font:600 14px var(--font);text-transform:none;letter-spacing:0;color:var(--t2)}
  #ov-edl .edl-sheet-add-row .btn{min-height:48px;font-size:15px}

  /* ── Relecture : tout lisible (≥ 14 px), écart en corail, « Corriger » de 44 px ── */
  #ov-edl .edl-rl-title{font:800 20px var(--display)}
  #ov-edl .edl-rl-hint{font-size:15px;color:var(--t2)}
  #ov-edl .edl-rl-chip .n{font:800 24px var(--display)}
  #ov-edl .edl-rl-chip .l{font-size:14px;text-transform:none;letter-spacing:0;color:var(--t2)}
  #ov-edl .edl-rl-chip.ko .n{color:var(--acc)}
  #ov-edl .edl-rl-chip.att .n{color:var(--t1)}
  #ov-edl .edl-rl-banner{font-size:15px;background:var(--acc-soft);border-color:color-mix(in srgb,var(--acc) 45%,transparent)}
  #ov-edl .edl-rl-banner b{color:var(--t1)}
  #ov-edl .edl-rl-arow{font-size:15px;min-height:44px}
  #ov-edl .edl-rl-sech{font-size:16px;min-height:52px}
  #ov-edl .edl-rl-secnom{white-space:normal;overflow:visible}
  #ov-edl .edl-rl-badge{font:700 14px var(--font)}
  #ov-edl .edl-rl-badge.ko{color:var(--acc);border-color:var(--acc);background:var(--acc-soft)}
  #ov-edl .edl-rl-badge.ok{color:var(--pos);border-color:var(--pos);background:color-mix(in srgb,var(--pos) 10%,transparent)}
  #ov-edl .edl-rl-li{font-size:15px;flex-wrap:wrap}
  #ov-edl .edl-rl-li.flag{min-height:44px}
  #ov-edl .edl-rl-li .obs{font-size:14px;color:var(--t2)}
  #ov-edl .edl-rl-li .obs.s{color:var(--t1)}
  #ov-edl .edl-rl-li .trans{font-size:14px;white-space:normal}
  #ov-edl .edl-rl-li .trans .att{color:var(--t2)}
  #ov-edl .edl-rl-li .vb{font:700 14px var(--font);padding:2px 9px}
  #ov-edl .edl-rl-li .vb.ko{color:var(--acc);border-color:var(--acc);background:var(--acc-soft)}
  #ov-edl .edl-rl-li .vb.att{color:var(--t2);border-color:var(--bor);background:var(--sur2)}
  #ov-edl .edl-rl-li .fix{display:inline-flex;align-items:center;gap:6px;min-height:44px;margin-top:6px;padding:0 14px;border:1px solid var(--bor);
    border-radius:12px;background:var(--sur);color:var(--t1);font:600 15px var(--font)}
  #ov-edl .edl-rl-after{font-size:15px;color:var(--t2)}

  /* ── « Avant de signer » : PAGE plein écran (était un pop-up, M-16) ── */
  #ov-edl .edl-signmodal{padding:0;background:var(--bg);align-items:stretch}
  #ov-edl .edl-sm-box{max-width:none;width:100%;height:100%;border:none;border-radius:0;display:flex;flex-direction:column;
    padding:20px 16px calc(12px + env(safe-area-inset-bottom,0px))}
  #ov-edl .edl-sm-title{font:800 20px var(--display)}
  #ov-edl .edl-sm-body{flex:1;overflow-y:auto;font-size:16px;line-height:1.5}
  #ov-edl .edl-sm-actions{flex-direction:row;gap:10px}
  #ov-edl .edl-sm-btn{flex:1 1 0;min-height:48px;font:700 16px var(--font);border-radius:12px}
  #ov-edl .edl-sm-btn.go{background:var(--acc);color:var(--cta-text)}
  #ov-edl .edl-sm-btn.back{background:transparent;color:var(--t1)}
  /* ── Compléments après mesure (25/09) ── */
  /* titres de section : encre, pas corail (M-15 : le corail dit « action », pas « titre ») */
  #ov-edl [data-edl-step] div[style*="color:var(--acc)"][style*="font-weight:700"]{font:800 17px/1.3 var(--display) !important;color:var(--t1) !important;margin-bottom:10px !important}
  /* libellés des équipements (Chauffage, Entretien, Radiateurs, Ancien occupant) : 14–15 px */
  #ov-edl [data-edl-step="compteurs"] [style*="font-size:12px"],#ov-edl [data-edl-step="compteurs"] [style*="font-size:10px"]{font-size:15px !important;color:var(--t1) !important;line-height:1.45}
  #ov-edl [data-edl-step="compteurs"] b{font-weight:700}
  /* puces (chauffage, eau chaude, technologies) : 44 px */
  #ov-edl > .modal div[style*="border-top:1px solid var(--bor)"] > .flex-c.mb4 > label:has(> input[type="checkbox"]){min-height:44px !important;padding:0 16px !important}
  /* « Reprendre l’entrée / la sortie » : 44 px */
  #ov-edl > .modal div[style*="margin-left:auto"] > .btn{min-height:44px !important}
  /* zones de texte : police de l’app (le navigateur prenait une chasse fixe) */
  #ov-edl textarea{font-family:var(--font) !important}

  /* détecteur : chaque choix sur UNE ligne, pleine largeur (le texte passait sous le rond) */
  #ov-edl [data-edl-step="daaf"] label:has(> input[type="radio"]){width:100% !important;box-sizing:border-box}
  #ov-edl label:has(> input[type="radio"]) > span,#ov-edl label:has(> input[type="checkbox"]) > span{flex:1 1 auto;min-width:0}
  /* « Reprendre l’entrée / la sortie » : l’un sous l’autre (côte à côte, le second était rogné) */
  #ov-edl > .modal div[style*="margin-left:auto"]{grid-template-columns:1fr !important}
  #ov-edl > .modal div[style*="margin-left:auto"] > .btn{white-space:normal !important}
  /* relecture : le titre est déjà dans l’en-tête */
  #ov-edl .edl-rl-title{display:none}

  /* sommaire : étape faite = coche dessinée (plus de caractère ✓) */
  #ov-edl .edl-sheet-row.done .edl-sheet-nom::before{content:'';display:inline-block;width:6px;height:12px;margin:0 12px 3px 4px;
    border:solid var(--pos);border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}

  /* ── Liste des EDL : un seul corail (« Nouvel état des lieux »), locataires en entier, Supprimer derrière ⋮ ── */
  #p-edl #edl-f-log{min-height:44px !important;font-size:16px}
  #p-edl .tbl tr{border-left:1px solid var(--bor) !important;border-radius:16px !important;padding:14px !important}
  #p-edl .tbl tr td.edl-lcell-log{display:flex !important;align-items:flex-start;gap:6px;font:800 18px/1.3 var(--display) !important}
  #p-edl .tbl tr td.edl-lcell-log b{flex:1;min-width:0;padding-top:10px}
  #p-edl .edl-lmore{display:flex;flex:none;align-items:center;justify-content:center;width:44px;height:44px;margin:0 -6px 0 0;
    background:none;border:none;border-radius:12px;color:var(--t2);cursor:pointer}
  #p-edl .edl-lmore svg{width:22px;height:22px}
  #p-edl .tbl tr td:nth-child(2){font-size:15px !important;color:var(--t1) !important;white-space:normal !important;overflow:visible !important;text-overflow:clip !important;overflow-wrap:anywhere}
  #p-edl .tbl tr td:nth-child(4){font-size:14px !important;color:var(--t2) !important}
  #p-edl .tbl tr td:nth-child(5){font-size:14px !important;color:var(--t2) !important}
  #p-edl .badge{font-size:14px}
  #p-edl .tbl tr td.act-cell .btn{min-height:44px !important;font-size:15px !important;white-space:normal !important;overflow:visible !important;text-overflow:clip !important}
  #p-edl .tbl tr td.act-cell .btn:nth-child(1){grid-column:auto !important;background:var(--sur2) !important;color:var(--t1) !important;border:1px solid var(--bor) !important}
  #p-edl .tbl tr td.act-cell .btn.br{display:none !important}
}

/* ═══════════════════════════════════════════════════════════════════════
   ANNONCES (CDC validé 29/09/2026) — modale « Créer une annonce » (#ov-annonce).
   Maquette : mockups/ANNONCES/index.html (PC 2 colonnes · tablette 1 colonne, contrôle au-dessus,
   replié quand tout est bon · téléphone page plein écran M-16, pied collant, cibles 44 px).
   Jetons uniquement : les deux thèmes réels (sobre / dark) suivent sans règle dédiée.
   ═══════════════════════════════════════════════════════════════════════ */
#ov-annonce .an-modal{max-width:1100px;width:96vw;max-height:94vh;display:flex;flex-direction:column;padding:0;overflow:hidden}
#ov-annonce .m-head{flex-shrink:0}
#ov-annonce .an-body{flex:1;overflow-y:auto;padding:14px 16px;min-height:0}
#ov-annonce .an-foot{flex-shrink:0;display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 16px;border-top:1px solid var(--bor);background:var(--sur2)}
#ov-annonce .an-sp{flex:1}
#ov-annonce .an-foot-hint{font-size:12px;color:var(--t2)}

/* Étape 1 — confirmer le loyer */
#ov-annonce #an-step1{max-width:560px;width:100%;margin:0 auto}
#ov-annonce .an-total{display:flex;align-items:baseline;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:6px;padding:10px 12px;border-radius:var(--r);background:var(--sur2);border:1px solid var(--bor)}
#ov-annonce .an-total span{font-size:12.5px;color:var(--t2)}
#ov-annonce .an-total b{font-size:17px;color:var(--t1)}
#ov-annonce .an-info{font-size:12.5px;color:var(--t2);line-height:1.45;margin-top:12px;padding-left:10px;border-left:3px solid var(--info)}

/* Étape 2 — texte | contrôle */
#ov-annonce .an-step2{display:grid;grid-template-columns:minmax(0,1fr) 320px;padding:0}
#ov-annonce .an-col-t{padding:14px 16px;border-right:1px solid var(--bor);min-width:0}
#ov-annonce .an-col-c{padding:14px 16px;background:var(--sur2);min-width:0}
#ov-annonce .an-lab{display:flex;align-items:baseline;gap:7px;font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.07em;color:var(--t2);margin-bottom:6px}
#ov-annonce .an-hint{margin-left:auto;text-transform:none;letter-spacing:0;font-weight:600;font-size:11px;color:var(--t2)}
/* Texte UNIQUE : textarea transparente au-dessus d'un calque miroir qui surligne les emplacements
   « [À COMPLÉTER : …] ». Mêmes police / marges / retour à la ligne / gouttière de défilement des deux
   côtés, sinon le surlignage glisse. Ambre + pointillés (pas de rouge, M-15) ; texte lisible (M-17). */
#ov-annonce .an-ed-wrap{position:relative;background:var(--sur);border:1px solid var(--bor);border-radius:var(--r)}
#ov-annonce .an-ed-wrap:focus-within{border-color:var(--acc);box-shadow:0 0 0 3px var(--acc-soft)}
#ov-annonce .an-ed,#ov-annonce .an-ed-bd{font-family:inherit;font-size:13px;font-weight:400;line-height:1.6;letter-spacing:normal;padding:10px 12px;margin:0;white-space:pre-wrap;overflow-wrap:break-word;word-break:normal;tab-size:4;scrollbar-gutter:stable;box-sizing:border-box}
#ov-annonce .an-ed-bd{position:absolute;inset:0;overflow:hidden;color:transparent;pointer-events:none;border:0}
#ov-annonce .an-ed{position:relative;display:block;width:100%;height:480px;min-height:260px;resize:vertical;overflow-y:auto;background:transparent;border:0;box-shadow:none;outline:none;color:var(--t1);caret-color:var(--t1)}
#ov-annonce .an-ed-bd .an-miss{color:transparent;background:var(--warn-soft);border-radius:3px;outline:1px dashed var(--warn);outline-offset:0}
#ov-annonce .an-cnt{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:11px;color:var(--t2);margin-top:4px}
#ov-annonce .an-foot-hint.w{color:var(--t1);font-weight:700}   /* M-17 : ambre trop pâle sur fond clair → encre, en gras */

/* Contrôle */
#ov-annonce .an-chk-h{display:flex;align-items:center;gap:8px;margin-bottom:8px}
#ov-annonce .an-sc{font-size:20px;font-weight:800}
#ov-annonce .an-sc.ok{color:var(--pos)}
#ov-annonce .an-sc.ko{color:var(--warn)}
#ov-annonce .an-chk-t{font-size:12px;color:var(--t2);line-height:1.35}
#ov-annonce .an-chk{list-style:none;margin:0;padding:0;border:1px solid var(--bor);border-radius:var(--r);background:var(--sur);overflow:hidden}
#ov-annonce .an-chk li{display:flex;align-items:flex-start;gap:8px;padding:7px 10px;border-bottom:1px solid var(--bor2);font-size:12.5px;line-height:1.35;color:var(--t1)}
#ov-annonce .an-chk li:last-child{border-bottom:0}
#ov-annonce .an-ic{flex:none;width:18px;height:18px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;margin-top:1px;font-weight:800}
#ov-annonce .an-chk li.ok .an-ic{background:var(--pos-soft);color:var(--pos)}
#ov-annonce .an-chk li.ko .an-ic{background:var(--warn-soft);color:var(--warn)}
#ov-annonce .an-chk li.warn .an-ic,#ov-annonce .an-chk li.retire .an-ic{background:var(--warn-soft);color:var(--warn)}
#ov-annonce .an-chk li.ko .an-tx{cursor:pointer}
#ov-annonce .an-chk li.na{color:var(--t2)}
#ov-annonce .an-chk li.na .an-ic{background:var(--sur3);color:var(--t2)}
#ov-annonce .an-tx{flex:1;min-width:0}
#ov-annonce .an-tx small{display:block;color:var(--t2);font-size:11px}
#ov-annonce .an-go{flex:none;background:none;border:0;padding:2px 4px;min-height:28px;color:var(--acc);font-weight:700;font-size:12px;cursor:pointer;font-family:inherit}
#ov-annonce .an-go:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
#ov-annonce .an-chk-sum{display:none;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--pos);background:var(--sur);border:1px solid var(--bor);border-radius:var(--r);padding:6px 10px}
#ov-annonce .an-chk-sum .btn{margin-left:auto}
#ov-annonce .an-tg{display:flex;align-items:center;gap:10px;margin-top:14px;padding-top:10px;border-top:1px solid var(--bor2);font-size:12.5px;color:var(--t1);cursor:pointer}
#ov-annonce .an-tg input{width:18px;height:18px;flex:none;accent-color:var(--acc)}
#ov-annonce .an-tg small{display:block;color:var(--t2);font-size:11px}
#ov-annonce .an-src{font-size:11px;color:var(--t2);margin-top:10px;line-height:1.4}

/* Bandeaux DPE (calendrier de décence) */
#ov-annonce .an-ban{display:flex;gap:9px;align-items:flex-start;border-radius:var(--r);padding:9px 11px;font-size:12.5px;line-height:1.45;margin-bottom:12px;border:1px solid var(--bor);color:var(--t1)}
#ov-annonce .an-ban.neg{background:var(--neg-soft);border-color:var(--neg)}
#ov-annonce .an-ban.warn{background:var(--warn-soft);border-color:var(--warn)}
#ov-annonce .an-ban.info{background:var(--info-soft);border-color:var(--info)}
#ov-annonce .an-ban.neg > svg{color:var(--neg)}
#ov-annonce .an-ban.warn > svg{color:var(--warn)}

/* Tablette : une colonne, le contrôle AU-DESSUS, replié en une ligne quand tout est bon. */
@media (max-width:899.98px){
  #ov-annonce .an-step2{grid-template-columns:1fr}
  #ov-annonce .an-go{min-height:44px;padding:0 6px}
  #ov-annonce .an-col-t{order:2;border-right:0}
  #ov-annonce .an-col-c{order:1;border-bottom:1px solid var(--bor)}
  #ov-annonce .an-col-c.allok .an-chk,
  #ov-annonce .an-col-c.allok .an-chk-h{display:none}
  #ov-annonce .an-col-c.allok .an-chk-sum{display:flex}
}
/* Téléphone : PAGE plein écran (M-16, même mécanisme que « Avant de signer » de l'EDL : l'overlay perd
   sa marge, la modale prend 100 % de l'écran), pied collant, CTA primaire d'abord. */
@media (max-width:767px){
  #ov-annonce{padding:0;align-items:stretch}
  #ov-annonce .an-modal{width:100% !important;max-width:none !important;height:100% !important;max-height:none !important;border:0 !important;border-radius:0 !important}
  #ov-annonce .an-body{padding:12px}
  #ov-annonce .an-step2{padding:0}
  #ov-annonce .an-col-t,#ov-annonce .an-col-c{padding:12px}
  #ov-annonce .inp,#ov-annonce .an-ed,#ov-annonce .an-ed-bd{font-size:16px}
  #ov-annonce .an-ed{height:60vh}
  #ov-annonce .an-tg{min-height:44px}
  #ov-annonce .an-chk-sum .btn{min-height:44px}
  #ov-annonce .an-foot{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);padding:10px 12px}
  #ov-annonce .an-foot .an-sp{display:none}
  #ov-annonce .an-foot .an-foot-hint{grid-column:1 / -1;order:-2}
  #ov-annonce .an-foot .btn{width:100%;min-width:0;min-height:44px;justify-content:center;white-space:normal;text-align:center;line-height:1.25}
  #ov-annonce .an-foot .btn.bp{grid-column:1 / -1;order:-1}
  #ov-annonce .an-go{min-height:44px;padding:0 6px}
  #ov-annonce .an-chk li{align-items:center}
  #ov-annonce .an-hint{display:none}
}