/* JAADE — styles (repris de la maquette validée le 13/11/2026). */
:root{
  --fond:#e9edf1; --carte:#ffffff; --carte2:#f3f5f8; --encre:#1c2733; --gris:#566573; --trait:#cdd5dd;
  --accent:#35557a; --accent-encre:#ffffff; --accent-doux:#dbe5f0; --ajout:#eeebe3;
  --bon:#1b7347; --bon-doux:#dbeee3; --attente:#8f5b00; --attente-doux:#f8eacb; --bloque:#ad342c; --bloque-doux:#f7dcd9;
  --texte:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --code:"IBM Plex Mono",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --fond:#141a21; --carte:#1c242d; --carte2:#222c37; --encre:#e3e9ef; --gris:#9aa8b6; --trait:#35424f;
    --accent:#8fb3da; --accent-encre:#0f1e2c; --accent-doux:#26394e; --ajout:#2b2a24;
    --bon:#6fcf9b; --bon-doux:#1b3829; --attente:#e6b656; --attente-doux:#3b2f17; --bloque:#ef8f86; --bloque-doux:#42211e;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --fond:#141a21; --carte:#1c242d; --carte2:#222c37; --encre:#e3e9ef; --gris:#9aa8b6; --trait:#35424f;
  --accent:#8fb3da; --accent-encre:#0f1e2c; --accent-doux:#26394e; --ajout:#2b2a24;
  --bon:#6fcf9b; --bon-doux:#1b3829; --attente:#e6b656; --attente-doux:#3b2f17; --bloque:#ef8f86; --bloque-doux:#42211e;
  color-scheme:dark;
}
*{box-sizing:border-box}
body{background:var(--fond);color:var(--encre);font-family:var(--texte);font-size:15px;line-height:1.45}
h1,h2,h3{margin:0;text-wrap:balance;line-height:1.2}
h1{font-size:22px;font-weight:700}
h2{font-size:17px;font-weight:600}
h3{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--gris)}
p{margin:0}
ul,ol,dl,dd{margin:0;padding:0;list-style:none}
.mono{font-family:var(--code);font-size:13px}
.gris{color:var(--gris)}
.petit{font-size:13px}
.num{font-variant-numeric:tabular-nums}
.lim{max-width:72ch}

.app{display:grid;grid-template-columns:220px minmax(0,1fr);gap:20px;align-items:start;max-width:1760px;margin:0 auto;
  padding-block:16px 40px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.menu{background:var(--carte);border:1px solid var(--trait);border-radius:6px;padding:14px 10px;display:flex;flex-direction:column;gap:5px;
  position:sticky;top:calc(env(safe-area-inset-top,0px) + 16px)}
.marque{font-size:22px;font-weight:700;letter-spacing:.1em;color:var(--accent);padding:0 8px 2px}
.marque small{display:block;font-size:11px;font-weight:500;letter-spacing:.04em;color:var(--gris)}
.mi{font:inherit;text-align:left;background:none;border:0;border-radius:4px;padding:8px 10px;color:var(--encre);cursor:pointer;display:flex;justify-content:space-between;gap:8px;align-items:center}
.mi:hover{background:var(--carte2)}
.mi[aria-current="page"]{background:var(--accent-doux);color:var(--accent);font-weight:600}
.mi .nb{font-size:12px;color:var(--gris);font-variant-numeric:tabular-nums}
.mi .nb.q{background:var(--attente-doux);color:var(--attente);font-weight:600;border-radius:9px;padding:0 7px}
.mi.sous{padding:5px 10px 5px 20px;font-size:14px}
.menu h3{padding:6px 10px 0;font-size:11px}
.menu .pied{margin-top:10px;border-top:1px solid var(--trait);padding:10px 8px 0;display:flex;flex-direction:column;gap:6px}
.avis{background:var(--attente-doux);color:var(--attente);border-radius:4px;padding:5px 8px;font-size:12px;font-weight:500}
.vue{display:flex;flex-direction:column;gap:14px;min-width:0}
@media (max-width:900px){
  .app{grid-template-columns:minmax(0,1fr)}
  .menu{position:static;flex-direction:row;flex-wrap:wrap;align-items:center}
  .menu h3{flex-basis:100%}
  .menu .pied{flex-basis:100%;margin-top:4px}
}

.carte{background:var(--carte);border:1px solid var(--trait);border-radius:6px;padding:14px 16px;display:flex;flex-direction:column;gap:10px;min-width:0}
.zt{display:flex;gap:8px 12px;align-items:baseline;flex-wrap:wrap}
.fil{font-size:13px;color:var(--gris)}
.rang{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.deux{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;align-items:start}
@media (max-width:1100px){.deux{grid-template-columns:minmax(0,1fr)}}
.col{display:flex;flex-direction:column;gap:14px;min-width:0}

.bouton{font:inherit;font-weight:500;background:var(--carte);color:var(--accent);border:1px solid var(--accent);border-radius:4px;padding:6px 12px;cursor:pointer;text-align:left}
.bouton:hover{background:var(--accent-doux)}
.bouton.plein{background:var(--accent);color:var(--accent-encre)}
.bouton.plein:hover{filter:brightness(1.1)}
.bouton.choisi{background:var(--accent-doux);border-width:2px}
.bouton.petitb{font-size:13px;padding:3px 9px}
.bouton[disabled]{opacity:.5;cursor:not-allowed}
.lien{font:inherit;font-size:13px;background:none;border:0;padding:0;color:var(--accent);text-decoration:underline;cursor:pointer;text-align:left}
button:focus-visible,textarea:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
textarea,input[type=text]{font:inherit;color:var(--encre);background:var(--carte2);border:1px solid var(--trait);border-radius:4px;padding:7px 9px;max-width:100%}
textarea{width:100%;min-height:44px;resize:vertical}
label{font-size:13px;color:var(--gris)}
.puce{font:inherit;font-size:13px;background:var(--carte2);color:var(--encre);border:1px dashed var(--gris);border-radius:14px;padding:3px 11px;cursor:pointer;text-align:left}
.puce:hover{background:var(--accent-doux)}
.verrou .mod{display:none}

.pastille{display:inline-block;font-size:12px;font-weight:600;border-radius:10px;padding:1px 9px;white-space:nowrap}
.p-ok{background:var(--bon-doux);color:var(--bon)}
.p-q{background:var(--attente-doux);color:var(--attente)}
.p-ko{background:var(--bloque-doux);color:var(--bloque)}
.p-att{background:var(--accent-doux);color:var(--accent)}
.p-non{background:var(--carte2);color:var(--gris);border:1px solid var(--trait)}
.bandeau{border-radius:4px;padding:9px 12px;font-weight:600}
.b-q{background:var(--attente-doux);color:var(--attente)}
.b-ok{background:var(--bon-doux);color:var(--bon)}
.b-ko{background:var(--bloque-doux);color:var(--bloque)}
.b-tr{background:var(--accent-doux);color:var(--accent)}

.onglets{display:flex;flex-wrap:wrap;gap:4px;background:var(--carte);border:1px solid var(--trait);border-radius:6px;padding:6px}
.og{font:inherit;font-weight:500;background:var(--carte2);border:1px solid var(--trait);border-radius:4px;padding:8px 12px;color:var(--encre);cursor:pointer;white-space:nowrap}
.og:hover{background:var(--accent-doux)}
.og[aria-selected="true"]{background:var(--accent);border-color:var(--accent);color:var(--accent-encre);font-weight:600}
.og[disabled]{opacity:.45;cursor:not-allowed}
.og[disabled]:hover{background:var(--carte2)}
.og .n{font-size:12px;font-weight:600;opacity:.7;margin-right:5px}
.og .nb{font-size:12px;font-weight:600;background:var(--attente-doux);color:var(--attente);border-radius:9px;padding:0 7px;margin-left:4px}
.og .nb.ko{background:var(--bloque-doux);color:var(--bloque)}

.chiffres{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:8px 18px;border-top:1px solid var(--trait);padding-top:10px}
.chiffres dt{font-size:12px;color:var(--gris);text-transform:uppercase;letter-spacing:.05em}
.chiffres dd{font-size:18px;font-weight:600;font-variant-numeric:tabular-nums}
.chiffres small{font-size:12px;color:var(--gris)}
.entete{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:10px 24px}
.entete div{display:flex;flex-direction:column;gap:2px;border-top:1px solid var(--trait);padding-top:6px;min-width:0}
.entete dt{font-size:12px;color:var(--gris)}
.entete dd{font-weight:500;overflow-wrap:anywhere}

.flux{display:grid;grid-template-columns:minmax(0,1.3fr) 28px minmax(0,.8fr) 28px minmax(0,1fr);gap:8px;align-items:center}
.flux .entrees{display:flex;flex-direction:column;gap:6px}
.fx{font:inherit;color:var(--encre);text-align:left;background:var(--carte2);border:1px solid var(--trait);border-radius:4px;padding:6px 10px;display:flex;gap:4px 10px;flex-wrap:wrap;align-items:baseline;min-width:0}
button.fx{cursor:pointer}
button.fx:hover{background:var(--accent-doux)}
.fx small{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--accent)}
.fx span{color:var(--gris);font-size:13px}
.fx.coeur{border:2px solid var(--accent);background:var(--carte);flex-direction:column;align-items:center;padding:14px 10px;text-align:center}
.fx.coeur b{font-size:20px;letter-spacing:.08em;color:var(--accent)}
.fl{color:var(--accent);display:grid;place-items:center}
.fl svg{width:26px;height:18px;display:block}
@media (max-width:760px){.flux{grid-template-columns:minmax(0,1fr)}.fl svg{transform:rotate(90deg)}}

.journal{display:flex;flex-direction:column;gap:5px}
.journal li,.controle li{padding-left:22px;position:relative}
.journal li::before,.controle li.c-ok::before{content:"";position:absolute;left:2px;top:.42em;width:10px;height:6px;border-left:2px solid var(--bon);border-bottom:2px solid var(--bon);transform:rotate(-45deg)}
.controle li.c-ko{color:var(--bloque)}
.controle li.c-ko::before{content:"×";position:absolute;left:3px;top:-.1em;font-weight:700}
.groupe{display:flex;flex-direction:column;gap:8px}
.q{background:var(--carte2);border:1px solid var(--trait);border-left:4px solid var(--attente);border-radius:4px;padding:11px 12px;display:flex;flex-direction:column;gap:8px}
.q.att{border-left-color:var(--accent)}
.q-t{font-weight:600}
.q-choix{display:flex;flex-direction:column;gap:6px}
.q-choix .bouton{width:100%}
.ecart{display:block;font-size:13px;font-weight:400;color:var(--attente)}
.exact{display:block;font-size:13px;font-weight:400;color:var(--bon)}
.sig{display:flex;flex-direction:column;gap:6px}
.sig li{padding:6px 10px;border-radius:4px;background:var(--carte2);border-left:4px solid var(--trait)}
.sig li.r{border-left-color:var(--attente)}
details>summary{cursor:pointer;color:var(--accent);font-size:13px}
.lettre{white-space:pre-wrap;font-size:13px;background:var(--carte);border:1px solid var(--trait);border-radius:4px;padding:8px 10px;margin-top:6px}

.liste{display:flex;flex-direction:column}
.liste li{display:flex;gap:6px 12px;justify-content:space-between;align-items:baseline;flex-wrap:wrap;padding:6px 0;border-top:1px solid var(--trait)}
.liste li:first-child{border-top:0}
.liste li>span:first-child{min-width:0;overflow-wrap:anywhere}
.liste li .corr{flex-basis:100%}

/* la liste des pièces à fournir (Check) */
.ck{display:flex;flex-direction:column}
.ck li{display:grid;grid-template-columns:118px minmax(0,1.6fr) minmax(0,1fr) minmax(0,auto);gap:4px 14px;align-items:baseline;padding:8px 0;border-top:1px solid var(--trait)}
.ck li:first-child{border-top:0}
.ck li>*{min-width:0;overflow-wrap:anywhere}
@media (max-width:900px){.ck li{grid-template-columns:minmax(0,1fr)}}

/* rangées de liste */
.rgs{display:flex;flex-direction:column}
.rg{font:inherit;color:var(--encre);text-align:left;background:none;border:0;border-top:1px solid var(--trait);padding:8px 6px;display:grid;gap:4px 14px;align-items:center;cursor:pointer;width:100%}
.rg:hover{background:var(--carte2)}
.rg>span{min-width:0;overflow-wrap:anywhere}
.rg .c1{display:flex;flex-direction:column}
.rg-t{cursor:default;border-top:0;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--gris);padding-bottom:4px}
.rg-t:hover{background:none}
.rg-d{grid-template-columns:minmax(0,2.2fr) minmax(0,1.1fr) minmax(0,.9fr) minmax(0,.9fr) minmax(0,1.1fr)}
.rg-a{grid-template-columns:76px minmax(0,2.2fr) minmax(0,1.2fr) minmax(0,.8fr) minmax(0,.8fr) minmax(0,.8fr) 92px 92px}
.dr{text-align:right}
@media (max-width:1000px){
  .rg-t{display:none}
  .rg-d,.rg-a{grid-template-columns:minmax(0,1fr)}
  .rg [data-t]::before{content:attr(data-t) " : ";color:var(--gris);font-size:13px}
  .dr{text-align:left}
}

/* le BPU de l'acheteur : ses colonnes à lui, puis celles que JAADE ajoute */
.legende{display:flex;gap:6px 16px;flex-wrap:wrap;font-size:13px;color:var(--gris);align-items:center}
.legende i{display:inline-block;width:14px;height:14px;border:1px solid var(--trait);border-radius:2px;vertical-align:-2px;margin-right:5px}
.tab{overflow-x:auto;max-width:100%}
table.bpu{border-collapse:collapse;width:100%;font-size:13px}
table.bpu th,table.bpu td{border:1px solid var(--trait);padding:5px 7px;vertical-align:top;text-align:left;overflow-wrap:anywhere}
table.bpu th{background:var(--carte2);font-weight:600;font-size:12.5px}
table.bpu .rem{background:var(--accent-doux)}
table.bpu .aj{background:var(--ajout)}
table.bpu .lc{font-family:var(--code);font-size:11px;color:var(--gris);font-weight:500}
table.bpu .lu{display:block;font-weight:400;font-size:11px;color:var(--gris);margin-top:2px}
table.bpu td.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
table.bpu td.modc{box-shadow:inset 0 0 0 2px var(--attente)}
table.bpu .avant{display:block;font-size:11px;color:var(--attente);white-space:normal}
table.bpu .vide{color:var(--gris)}
table.bpu tfoot td{font-weight:600;background:var(--carte2)}
table.bpu td.act{white-space:nowrap}
table.bpu tr.edrow>td{background:var(--carte2)}
@media (max-width:1100px){
  table.bpu thead{display:none}
  table.bpu,table.bpu tbody,table.bpu tfoot,table.bpu tr,table.bpu td{display:block;width:100%}
  table.bpu tr{border:1px solid var(--trait);border-radius:4px;margin-bottom:8px;overflow:hidden}
  table.bpu td{border:0;border-top:1px solid var(--trait)}
  table.bpu td:first-child{border-top:0}
  table.bpu td[data-t]::before{content:attr(data-t);display:block;font-size:11px;color:var(--gris);font-weight:400}
  table.bpu td.num{text-align:left}
}
.totaux{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 24px;max-width:480px;margin-left:auto;width:100%}
.totaux dd{text-align:right;font-variant-numeric:tabular-nums}
.totaux .fort{font-weight:700;border-top:2px solid var(--encre);padding-top:4px}
.totaux .sep{border-top:1px solid var(--trait);padding-top:4px}
.edit{display:flex;flex-direction:column;gap:8px;padding:6px 2px}

.champs{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px 18px}
.champ{display:flex;flex-direction:column;gap:3px;min-width:0}
.champ input{width:100%}
.fiche{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 24px}
.fiche dd{text-align:right;font-variant-numeric:tabular-nums}
.fichier{display:flex;gap:6px 12px;flex-wrap:wrap;align-items:baseline;background:var(--carte2);border:1px solid var(--trait);border-radius:4px;padding:8px 10px}
.calc{background:var(--accent-doux);border-radius:6px;padding:12px 14px;display:flex;flex-direction:column;gap:8px}
.jauge{height:12px;background:var(--carte2);border:1px solid var(--trait);border-radius:6px;position:relative;overflow:hidden}
.jauge i{position:absolute;inset:0 auto 0 0;background:var(--bon)}
.jauge b{position:absolute;top:0;bottom:0;width:2px;background:var(--encre)}
.arbre{font-family:var(--code);font-size:12.5px;background:var(--carte2);border:1px solid var(--trait);border-radius:4px;padding:10px;overflow-x:auto;white-space:pre;margin:0}
.depot{border:2px dashed var(--trait);border-radius:6px;padding:16px;display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.err{color:var(--bloque);font-size:13px}
.note{background:var(--bon-doux);color:var(--bon);border-radius:4px;padding:7px 10px;font-size:13px;font-weight:500}
.sommaire{display:flex;flex-direction:column;font-size:13px}
.sommaire li{display:flex;gap:8px;justify-content:space-between;border-bottom:1px dotted var(--trait);padding:3px 0}
.sommaire li>span:first-child{min-width:0;overflow-wrap:anywhere}

/* ---- ajouts du site ---- */
[hidden]{display:none!important}
body{margin:0}
.connexion{max-width:460px;margin:60px auto;padding:0 16px}
.connexion form{display:flex;flex-direction:column;gap:10px}
.connexion input{width:100%}
.charge{color:var(--gris);padding:20px 0}
.bandeau-err{background:var(--bloque-doux);color:var(--bloque);border-radius:4px;padding:8px 12px}
table.bpu td.edit-ok{cursor:text}
table.bpu td.edit-ok:hover{outline:1px dashed var(--accent)}
table.bpu td input.saisie{width:100%;min-width:70px;font:inherit;font-size:13px;padding:3px 5px}
table.bpu td.code{font-family:var(--code);font-size:12px;white-space:nowrap}
table.bpu th{position:sticky;top:0;z-index:1}
.tab.haute{max-height:calc(100vh - 220px);overflow:auto}
.filtres{display:flex;gap:8px 12px;flex-wrap:wrap;align-items:center}
.filtres input[type=text]{max-width:260px}
.etat-l{font-size:12px;font-weight:600;border-radius:9px;padding:1px 8px;white-space:nowrap;display:inline-block}
.e-pret{background:var(--bon-doux);color:var(--bon)}
.e-ver{background:var(--attente-doux);color:var(--attente)}
.e-ko{background:var(--bloque-doux);color:var(--bloque)}
.e-choix{background:var(--accent-doux);color:var(--accent)}
a.lien{font-size:13px;color:var(--accent)}
.boutons{display:flex;gap:8px;flex-wrap:wrap}
a.bouton{text-decoration:none;display:inline-block}
.fiches-l{display:flex;flex-direction:column;gap:2px}
.note-q{background:var(--attente-doux);color:var(--attente);border-radius:4px;padding:7px 10px;font-size:13px}
/* le BPU : des colonnes lisibles ; si le tableau est plus large que l'écran, il défile dans son cadre, la page ne bouge pas */
table.bpu{width:max-content;min-width:100%}
table.bpu th,table.bpu td{overflow-wrap:normal;word-break:normal;hyphens:auto;min-width:72px;max-width:240px}
table.bpu .r-besoin,table.bpu .r-desig,table.bpu .r-carac{min-width:170px}
table.bpu .r-nom_ft,table.bpu .r-nom_fds{min-width:160px;overflow-wrap:anywhere;font-family:var(--code);font-size:11.5px}
table.bpu .r-avis{min-width:200px}
table.bpu th .lu{font-size:10.5px}
@media (max-width:1100px){table.bpu{width:100%}table.bpu th,table.bpu td{max-width:none;min-width:0}}
/* la fenêtre Dossier : une grande fenêtre modale (1500 px), onglets à gauche comme le devis d'ANOON */
body.avec-modale{overflow:hidden}
.voile{position:fixed;inset:0;z-index:50;background:rgba(20,30,42,.45);display:flex;align-items:center;justify-content:center;
  padding:max(16px,env(safe-area-inset-top,0px)) max(16px,env(safe-area-inset-right,0px)) max(16px,env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px))}
.modale{background:var(--fond);width:min(1500px,100%);height:100%;max-height:1000px;border-radius:8px;box-shadow:0 12px 40px rgba(0,0,0,.35);
  display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--trait)}
.m-tete{background:var(--carte);border-bottom:1px solid var(--trait);padding:12px 16px;display:flex;gap:10px 24px;align-items:center;flex-wrap:wrap}
.m-titre{flex:1 1 320px;min-width:0}
.m-titre h1{font-size:20px}
.m-chiffres{display:flex;gap:6px 22px;flex-wrap:wrap;margin:0}
.m-chiffres div{display:flex;flex-direction:column}
.m-chiffres dt{font-size:11px;color:var(--gris);text-transform:uppercase;letter-spacing:.05em}
.m-chiffres dd{font-weight:600;font-variant-numeric:tabular-nums}
.m-chiffres small{font-weight:400;color:var(--gris)}
.m-fermer{font:inherit;font-size:20px;line-height:1;background:var(--carte2);border:1px solid var(--trait);border-radius:4px;width:38px;height:38px;cursor:pointer;color:var(--encre)}
.m-fermer:hover{background:var(--bloque-doux);color:var(--bloque)}
.m-corps{flex:1;display:grid;grid-template-columns:200px minmax(0,1fr);min-height:0}
.m-onglets{background:var(--carte);border-right:1px solid var(--trait);padding:10px 8px;display:flex;flex-direction:column;gap:4px;overflow-y:auto}
.m-onglets .og{display:flex;align-items:center;gap:6px;text-align:left;width:100%;white-space:normal}
.m-onglets .og .t{flex:1}
.m-contenu{overflow:auto;padding:14px 16px;min-width:0}
.m-contenu .tab.haute{max-height:calc(100vh - 300px)}
@media (max-width:900px){
  .voile{padding:0}
  .modale{border-radius:0;max-height:none}
  .m-corps{grid-template-columns:minmax(0,1fr);grid-template-rows:auto 1fr}
  .m-onglets{flex-direction:row;flex-wrap:wrap;border-right:0;border-bottom:1px solid var(--trait)}
  .m-onglets .og{width:auto}
  .m-chiffres{display:none}
}