/**
 * depot.css — les styles du dossier client (depot.js).
 * ---------------------------------------------------------------------------
 * Extrait de mon_offre.html le 20/09/2026, quand le générateur est passé lui
 * aussi sur le dépôt : deux pages rendent le même `#depot`, et deux copies
 * d'une feuille de style finissent toujours par diverger — on corrige un
 * alignement d'un côté, on l'oublie de l'autre, et le client voit deux
 * versions de la même chose selon la porte par laquelle il est entré.
 *
 * Ce fichier ne porte QUE ce qui est commun. Ce qui appartient à une page —
 * la carte qui héberge le dossier, son affichage conditionnel — reste dans
 * cette page.
 */
/* --- le dossier déposé par le client (depot.js) --- */
#depot .zone{border:1px dashed #3d4a5c;border-radius:12px;padding:22px 18px;text-align:center;
     cursor:pointer;background:#1f2630;display:flex;flex-direction:column;gap:4px}
#depot .zone:hover,#depot .zone:focus,#depot .zone.survol{border-color:#c9895a;background:#242c36;outline:none}
#depot .zone b{color:#f0e6d2;font-size:15px}
#depot .zone span{font-size:12.5px;color:#93a0ad}
/* --- les pièces attendues, une ligne et un bouton chacune --- */
#depot ul.requis{list-style:none;padding:0;margin:0 0 14px}
#depot .besoin{display:flex;align-items:center;gap:10px;padding:9px 0;
     border-bottom:1px solid #262f3b;font-size:13.5px}
#depot .besoin .marque{flex:none;width:20px;text-align:center;font-weight:700}
#depot .besoin.fait .marque{color:#8ec06f}
#depot .besoin.attendu .marque{color:#e8bd8a}
#depot .besoin .quoi{flex:1;min-width:0;color:#dde5ee}
#depot .besoin.fait .quoi{color:#93a0ad}
#depot .besoin .depose{max-width:180px;overflow:hidden;text-overflow:ellipsis;
     white-space:nowrap;font-size:12px;color:#8ec06f}
#depot .besoin .poser{background:#242c36;border:1px solid #3d4a5c;color:#dde5ee;
     font:inherit;font-size:12.5px;border-radius:8px;padding:6px 12px;cursor:pointer;white-space:nowrap}
#depot .besoin .poser:hover{border-color:#c9895a;color:#f0e6d2}
#depot .besoin .poser:focus{outline:none;border-color:#5aa7d8}
@media (max-width:520px){
  #depot .besoin{flex-wrap:wrap}
  #depot .besoin .quoi{flex:1 0 calc(100% - 30px)}
  #depot .besoin .depose,#depot .besoin .poser{margin-left:30px;max-width:none}
}
#depot ul.pieces{list-style:none;padding:0;margin:14px 0 0}
#depot .piece{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid #262f3b;font-size:13.5px}
#depot .piece .nom{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#dde5ee}
/* Le rôle est un menu : il doit avoir l'air réglable sans crier plus fort que
   le nom du fichier, qui reste l'information principale de la ligne. */
#depot .piece .role{color:#93a0ad;font-size:12px;white-space:nowrap;font-family:inherit;
     background:#242c36;border:1px solid #3d4a5c;border-radius:7px;padding:4px 7px;
     max-width:190px;cursor:pointer}
#depot .piece .role:hover{border-color:#5a6a80;color:#dde5ee}
#depot .piece .role:focus{outline:none;border-color:#5aa7d8;color:#dde5ee}
#depot .piece .role:disabled{opacity:.55;cursor:default}
@media (max-width:520px){
  #depot .piece{flex-wrap:wrap}
  #depot .piece .nom{flex:1 0 100%}
  #depot .piece .role{max-width:none;flex:1}
}
#depot .piece .taille{color:#6d7885;font-size:12px;font-variant-numeric:tabular-nums;white-space:nowrap}
#depot .piece .oter{background:none;border:none;color:#6d7885;font-size:15px;cursor:pointer;padding:0 2px}
#depot .piece .oter:hover{color:#f08a7a}
#depot .compte{font-size:12px;color:#6d7885;margin:8px 0 0}
/* Le filet, quand le manifeste et l'archive ont divergé : bien en vue tant
   que rien n'est rattaché, presque invisible quand tout va bien. */
#depot .recup{font-size:11.5px;color:#6d7885;margin:10px 0 0;text-align:right}
#depot .recup a{color:#6d7885}
#depot .recup a:hover{color:#93a0ad}
#depot .manque{font-size:13.5px;color:#e8bd8a;margin:14px 0 0}
#depot .manque b{color:#f0e6d2}
#depot .pret{font-size:13.5px;color:#8ec06f;margin:14px 0 0}
#depot .avis{font-size:13.5px;color:#93a0ad;margin:12px 0 0}
#depot .erreur{font-size:13.5px;color:#f08a7a;margin:12px 0 0}
#depot .avis a,#depot .erreur a{color:#dde5ee}
#depot .agir{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:16px}
#depot .cta{background:#c9895a;border:none;color:#fff;font:inherit;font-size:15px;font-weight:600;
     border-radius:10px;padding:11px 18px;cursor:pointer}
#depot .cta:hover{background:#d6996d}
#depot .cta:disabled{opacity:.55;cursor:default}
#depot .cta.second{background:transparent;color:#c9895a;border:1px solid #c9895a}
#depot .cta.second:hover{background:rgba(201,137,90,.12)}
#depot .apres{font-size:12.5px;color:#6d7885}
/* --- paiement par carte --- */
#paieAvis{font-size:13.5px;border-radius:12px;padding:12px 14px;margin-bottom:16px}
#paieAvis.ok{background:#1f2f1c;color:#8ec06f;border:1px solid #3d5c39}
#paieAvis.attente{background:#2c2a1f;color:#e8bd8a;border:1px solid #5c5230}
#paieAvis.err{background:#2f211f;color:#f08a7a;border:1px solid #5c3a34}
.monter{margin-top:16px;padding-top:14px;border-top:1px solid #2e3947}
.monter h3{margin:0 0 8px;font-size:15px;color:#f0e6d2}
.monter .rangee{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.payer{background:#c9895a;border:none;color:#fff;font:inherit;font-size:14.5px;font-weight:600;
     border-radius:9px;padding:9px 16px;cursor:pointer}
.payer:hover{background:#d6996d}
.payer:disabled{opacity:.55;cursor:default}
.option .payer{align-self:flex-start;margin-top:6px;font-size:13px;padding:6px 12px}
.carte-note{font-size:11.5px;color:#6d7885;margin-top:8px}
/* --- règlements et factures --- */
#factures ul{list-style:none;padding:0;margin:0}
#factures li{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid #262f3b;font-size:13.5px;flex-wrap:wrap}
#factures .quoi{flex:1;min-width:140px;color:#dde5ee}
#factures .quand{color:#6d7885;font-size:12px;white-space:nowrap}
#factures .somme{color:#f0e6d2;font-variant-numeric:tabular-nums;white-space:nowrap}
#factures .pdf{background:#242c36;border:1px solid #3d4a5c;color:#dde5ee;border-radius:8px;
     padding:5px 11px;font:inherit;font-size:12.5px;cursor:pointer;white-space:nowrap}
#factures .pdf:hover{border-color:#5a6a80}
#factures .pdf:disabled{opacity:.55;cursor:default}
#factures .sans{color:#6d7885;font-size:12px}
/* --- l'adresse du terrain --- */
#depot .terrain{background:#1f2630;border:1px solid #2e3947;border-radius:12px;padding:14px 16px;margin-bottom:14px}
#depot .terrain label{display:block;font-size:13px;color:#f0e6d2;margin-bottom:6px}
#depot .terrain .ligne{display:flex;gap:8px;flex-wrap:wrap}
#depot .terrain input{flex:1;min-width:200px;background:#242c36;border:1px solid #3d4a5c;color:#dde5ee;
     border-radius:9px;padding:9px 11px;font:inherit;font-size:14px}
#depot .terrain input:focus{outline:none;border-color:#5aa7d8}
#depot .terrain button{background:#242c36;border:1px solid #3d4a5c;color:#dde5ee;border-radius:9px;
     padding:9px 14px;font:inherit;font-size:13.5px;cursor:pointer}
#depot .terrain button:hover{border-color:#5a6a80}
#depot .terrain .pourquoi{font-size:12px;color:#6d7885;margin:8px 0 0}
#depot .terrain.pose{display:flex;align-items:center;gap:10px}
#depot .terrain.pose .lab{flex:1;color:#dde5ee;font-size:14px}
#depot .terrain .changer{padding:5px 10px;font-size:12.5px}
#depot ul.candidats{list-style:none;padding:0;margin:10px 0 0}
#depot ul.candidats li{display:flex;align-items:center;gap:10px;padding:3px 0}
#depot .cand{flex:1;text-align:left;font-size:13.5px}
#depot .cand:disabled{opacity:.45;cursor:default}
#depot .conf{font-size:12px;color:#6d7885;white-space:nowrap}
/* --- ce que la construction a tiré du dossier --- */
#depot .volet{margin-top:20px;padding-top:16px;border-top:1px solid #2e3947}
#depot .volet h3{margin:0 0 10px;font-size:16px;color:#f0e6d2}
#depot .pluzone{font-size:13.5px;color:#cdd6e0;margin:0 0 10px}
#depot .pluzone .src{display:block;font-size:12px;color:#6d7885}
#depot ul.regles{list-style:none;padding:0;margin:0}
#depot ul.regles li{display:flex;gap:10px;padding:7px 0;border-bottom:1px solid #262f3b;font-size:13.5px}
#depot ul.regles .marque{flex:none;width:20px;text-align:center;font-weight:700}
#depot ul.regles li.conforme .marque{color:#8ec06f}
#depot ul.regles li.ecart .marque{color:#f08a7a}
#depot ul.regles li.avoir .marque{color:#e8bd8a}
#depot ul.regles .quoi{flex:1}
#depot ul.regles .val{display:block;font-size:12px;color:#93a0ad}
#depot ul.regles li.ecart .quoi b{color:#f08a7a}
#depot .sous-volet{font-size:12.5px;color:#93a0ad;margin:12px 0 0}
#depot .pied-volet{font-size:11.5px;color:#6d7885;margin:10px 0 0}
#depot .poste{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#c9895a;margin:14px 0 4px}
#depot dl.notice{display:grid;grid-template-columns:max-content 1fr;gap:2px 14px;margin:0;font-size:13.5px}
#depot dl.notice dt{color:#93a0ad}
#depot dl.notice dd{margin:0;color:#dde5ee}
@media (max-width:620px){
  #depot dl.notice{grid-template-columns:1fr;gap:0}
  #depot dl.notice dt{margin-top:6px}
}