/* Charte Caillou Vert Conseil. Une surface : fond OU bordure ;
la hiérarchie vient de l’espace. */@font-face{
  font-family:Montserrat;
  src:url("marque/Montserrat.ttf") format("truetype");
  font-weight:100 900;
  font-style:normal;
  font-display:swap
}
:root{
  --encre:#2e3a3c;
  --texte:#2e3a3c;
  --secondaire:#5c6b6d;
  --fond:#eef3f3;
  --bord:#bacdd0;
  --bleu:#317a85;
  --teal-fonce:#275f68;
  --clair:#e3edef;
  --vert:#286449;
  --teal-clair:#6fa3ac;
  --police:Montserrat,"Segoe UI",system-ui,sans-serif
}
*{
  box-sizing:border-box
}
body{
  margin:0;
  color:var(--texte);
  background:var(--fond);
  font-family:var(--police);
  font-size:14px;
  line-height:1.5
}
a{
  color:var(--bleu);
  text-underline-offset:3px
}
button,input,select,textarea{
  font:inherit
}
button,.bouton{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:40px;
  border:0;
  border-radius:7px;
  padding:9px 15px;
  background:var(--clair);
  color:var(--encre);
  font-weight:600;
  cursor:pointer;
  text-decoration:none;
  white-space:normal
}
button:hover,.bouton:hover{
  background:#d5e5e7
}
.principal{
  background:var(--bleu);
  color:white
}
.principal:hover{
  background:var(--teal-fonce);
  color:white
}
button:disabled{
  opacity:.55;
  cursor:wait
}
.lien{
  padding:0;
  border:0;
  min-height:30px;
  background:transparent;
  font-size:13px
}
.compact{
  min-height:32px;
  padding:6px 10px;
  font-size:12px;
  margin:3px
}
.danger{
  color:#9b3f35
}
input,select,textarea{
  display:block;
  max-width:100%;
  width:100%;
  padding:10px 12px;
  border:1px solid var(--bord);
  border-radius:6px;
  background:transparent;
  color:var(--texte)
}
input[type=file]{
  font-size:12px;
  padding:8px
}
label{
  display:block;
  font-weight:600;
  font-size:13px;
  margin:16px 0 10px
}
label input,label select,label textarea{
  margin-top:6px
}
h1,h2,h3,p{
  margin-top:0
}
h1{
  font-size:30px;
  line-height:1.22;
  letter-spacing:-.8px;
  color:var(--encre);
  margin-bottom:0;
  font-weight:700
}
h2{
  font-size:19px;
  line-height:1.35;
  letter-spacing:-.3px;
  margin-bottom:16px
}
h3{
  font-size:15px;
  margin-bottom:0;
  font-weight:650
}
p{
  margin-bottom:14px
}
.secondaire{
  color:var(--secondaire);
  font-size:14px
}
.note{
  font-size:12px;
  color:var(--secondaire)
}
.sr{
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  clip:rect(0,0,0,0)
}
.evitement{
  position:absolute;
  left:12px;
  top:-100px;
  padding:10px;
  background:white;
  z-index:100
}
.evitement:focus{
  top:10px
}
:focus-visible{
  outline:3px solid var(--teal-clair);
  outline-offset:4px
}
[hidden]{
  display:none!important
}
.navigation{
  width:244px;
  position:fixed;
  inset:0 auto 0 0;
  background:white;
  padding:27px 20px 20px;
  display:flex;
  flex-direction:column;
  z-index:10
}
.marque{
  display:flex;
  align-items:center;
  gap:10px;
  text-decoration:none;
  color:var(--encre);
  font-size:21px;
  letter-spacing:-.5px;
  line-height:1.15
}
.logo-officiel{
  display:block;
  width:48px;
  height:48px;
  object-fit:contain;
  flex-shrink:0
}
.marque-mobile{
  display:none
}
.navigation nav{
  margin-top:40px
}
.navigation nav a{
  display:flex;
  gap:10px;
  align-items:center;
  color:var(--secondaire);
  font-size:13px;
  text-decoration:none;
  border-radius:7px;
  padding:11px 10px;
  margin:6px 0
}
.navigation nav a.actif{
  color:var(--encre);
  background:var(--clair);
  font-weight:650
}
.navigation nav a:hover{
  background:var(--fond)
}
.bas-navigation{
  margin-top:auto;
  padding:20px 10px 0;
  font-size:12px;
  color:var(--secondaire)
}
.bas-navigation a{
  display:inline-block;
  margin-bottom:12px
}
.connecte .corps{
  margin-left:244px
}
main{
  max-width:1510px;
  margin:auto;
  padding:36px 38px;
  min-height:calc(100vh - 52px)
}
.entete-page{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  margin-bottom:30px
}
.entete-page p:last-child{
  margin-bottom:0
}
.entete-page:has(+ .deux-colonnes){
  margin-bottom:35px
}
.boutons,.ligne{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px
}
.indicateurs{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  background:white;
  border:0;
  border-radius:10px;
  margin-bottom:32px;
  padding:24px 8px
}
.indicateurs>div{
  padding:0 24px
}
.indicateurs span{
  min-height:36px;
  display:block;
  color:var(--secondaire);
  font-size:12px;
  margin-bottom:10px
}
.indicateurs strong{
  font-size:32px;
  line-height:1;
  color:var(--encre);
  font-weight:650
}
.indicateurs small{
  font-size:20px;
  color:var(--secondaire);
  font-weight:400
}
.outils{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:20px;
  margin:20px 0
}
.outils:has(.fil-ariane){
  justify-content:space-between
}
.recherche{
  position:relative;
  display:flex;
  max-width:420px;
  width:100%
}
.recherche input{
  min-width:0;
  padding-left:38px
}
.icone-recherche{
  position:absolute;
  top:50%;
  left:13px;
  transform:translateY(-50%);
  font-size:21px;
  color:var(--secondaire)
}
.grille-batiments{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:22px
}
.carte{
  background:white;
  border:0;
  border-radius:10px;
  padding:24px;
  min-width:0
}
.carte-batiment{
  display:block;
  text-decoration:none;
  color:inherit;
  padding:24px;
  transition:transform .15s
}
.carte-batiment:hover{
  transform:translateY(-2px)
}
.carte-batiment h3{
  font-size:21px;
  margin:26px 0;
  letter-spacing:-.5px
}
.icone-batiment{
  font-size:23px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:var(--clair);
  width:42px;
  height:42px;
  color:var(--bleu);
  border-radius:9px
}
.badge{
  display:inline-flex;
  padding:4px 8px;
  border:0;
  background:#eaf0f0;
  border-radius:5px;
  font-size:11px;
  line-height:1.6;
  color:var(--secondaire);
  white-space:nowrap
}
.complet{
  color:var(--vert);
  background:#e8f2ec
}
.attente{
  background:#f7eedc;
  color:#876331
}
.compte{
  font-size:12px;
  font-weight:600;
  display:block;
  margin-bottom:8px;
  color:var(--secondaire)
}
progress{
  display:block;
  width:100%;
  height:5px;
  border:0;
  border-radius:8px;
  background:#dbe6e7;
  overflow:hidden;
  accent-color:var(--bleu)
}
progress::-webkit-progress-bar{
  background:#dbe6e7
}
progress::-webkit-progress-value{
  background:var(--bleu);
  border-radius:6px
}
progress::-moz-progress-bar{
  background:var(--bleu)
}
.vide{
  grid-column:1/-1;
  text-align:center;
  padding:55px 25px;
  color:var(--secondaire)
}
.vide .icone-batiment{
  margin:0 auto 20px
}
.vide p{
  max-width:480px;
  margin:12px auto 22px
}
.aide-discrete{
  display:flex;
  justify-content:flex-end;
  margin:16px 0
}
.aide{
  margin-top:30px;
  color:var(--secondaire);
  font-size:12px
}
.aide summary{
  cursor:pointer
}
.trois-colonnes,.quatre-colonnes{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px
}
.quatre-colonnes{
  grid-template-columns:repeat(4,1fr)
}
.trois-colonnes p,.quatre-colonnes p{
  font-size:13px;
  color:var(--secondaire);
  margin:16px 0 0
}
.trois-colonnes strong,.quatre-colonnes strong{
  display:block;
  color:var(--encre);
  margin-bottom:8px
}
.retour{
  display:inline-block;
  font-size:13px;
  text-decoration:none;
  margin-bottom:28px;
  color:var(--secondaire)
}
.bandeau-etat{
  display:flex;
  align-items:center;
  gap:42px;
  border:0;
  background:white;
  border-radius:10px;
  padding:27px 30px;
  margin-bottom:30px
}
.bandeau-etat>div{
  display:flex;
  align-items:baseline;
  gap:12px
}
.bandeau-etat strong{
  font-size:30px;
  font-weight:650;
  white-space:nowrap
}
.bandeau-etat span{
  font-size:12px;
  color:var(--secondaire)
}
.onglets{
  display:flex;
  gap:28px;
  margin-bottom:30px
}
.onglets a{
  padding:10px 0;
  border-bottom:2px solid transparent;
  color:var(--secondaire);
  text-decoration:none;
  font-size:14px
}
.onglets a.selectionne{
  border-color:var(--bleu);
  color:var(--encre);
  font-weight:650
}
.onglets a span{
  margin-left:8px;
  font-size:12px
}
.lot{
  margin:0 0 34px;
  min-width:0
}
.entete-lot{
  padding:0 0 18px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px
}
.entete-lot h2{
  margin:0;
  font-size:22px
}
.progression-lot{
  min-width:165px
}
.checklist{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:20px
}
.piece{
  border:1px dashed var(--bord);
  background:transparent;
  border-radius:10px;
  padding:22px;
  min-width:0;
  scroll-margin-top:80px
}
.piece[data-ajout]{
  cursor:pointer
}
.piece[data-ajout]:hover{
  border-color:var(--bleu)
}
.piece-deposee{
  border:0;
  background:white;
  padding:23px
}
.entete-piece{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:16px
}
.entete-piece h3{
  flex:1;
  min-width:0;
  font-size:15px
}
.entete-piece .badge{
  font-size:10px
}
.zone-depot{
  border:0;
  background:transparent;
  padding:0;
  margin:0;
  min-width:0
}
.cible-depot{
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:94px;
  margin:0;
  color:var(--bleu);
  font-size:13px;
  font-weight:500;
  text-align:center;
  cursor:pointer;
  position:relative
}
.entree-fichier{
  position:absolute;
  width:1px!important;
  height:1px!important;
  margin:0!important;
  padding:0!important;
  opacity:0;
  overflow:hidden
}
.cible-depot:focus-within{
  outline:3px solid var(--teal-clair);
  outline-offset:4px;
  border-radius:5px
}
.ajout-piece summary{
  font-size:12px;
  color:var(--bleu);
  cursor:pointer;
  display:inline-block;
  margin-top:14px;
  list-style:none
}
.ajout-piece summary::before{
  content:'+ ';
  font-weight:600
}
.etat-depot{
  font-size:12px;
  margin:10px 0 0;
  color:var(--bleu)
}
.etat-depot:empty{
  display:none
}
.progression-depot{
  height:6px;
  margin-top:14px
}
.reessayer{
  margin-top:12px
}
.survol-depot{
  outline:3px solid var(--bleu);
  outline-offset:3px
}
.destination-active{
  background:var(--clair)
}
.fichiers-piece{
  list-style:none;
  margin:0;
  padding:0
}
.fichiers-piece li{
  display:flex;
  align-items:center;
  gap:10px;
  padding:7px 0;
  font-size:12px
}
.fichiers-piece li>a:first-child{
  flex:1;
  min-width:0;
  overflow-wrap:anywhere;
  text-decoration:none
}
.telechargement{
  font-size:19px;
  padding:0 5px;
  text-decoration:none
}
.information{
  position:relative;
  flex-shrink:0;
  font-size:12px;
  cursor:default
}
.information>summary{
  list-style:none;
  color:var(--secondaire);
  cursor:pointer;
  padding:3px;
  line-height:1.3;
  font-size:17px
}
.information>summary::-webkit-details-marker,.menu-actions>summary::-webkit-details-marker,.ajout-piece>summary::-webkit-details-marker{
  display:none
}
.information-contenu{
  position:absolute;
  z-index:30;
  right:0;
  top:calc(100% + 8px);
  width:285px;
  max-width:calc(100vw - 52px);
  padding:16px;
  background:var(--encre);
  color:white;
  border:0;
  border-radius:8px;
  font-size:12px;
  line-height:1.65;
  font-weight:400;
  cursor:auto
}
.menu-actions{
  position:relative
}
.menu-actions>summary{
  list-style:none;
  font-size:26px;
  line-height:1;
  cursor:pointer;
  padding:8px 12px
}
.menu-contenu{
  position:absolute;
  z-index:25;
  right:0;
  top:calc(100% + 8px);
  width:220px;
  padding:8px;
  background:white;
  border-radius:8px;
  box-shadow:0 8px 25px #2e3a3c18
}
.menu-contenu button{
  display:block;
  width:100%;
  text-align:left;
  background:transparent;
  font-size:13px
}
.menu-contenu button:hover{
  background:var(--clair)
}
.informations-batiment{
  display:grid;
  gap:12px;
  font-size:14px
}
.informations-batiment dt{
  color:var(--secondaire)
}
.informations-batiment dd{
  margin:0 0 12px;
  overflow-wrap:anywhere
}
.fil-ariane{
  display:flex;
  gap:9px;
  align-items:center;
  flex-wrap:wrap;
  font-size:13px
}
.fil-ariane strong{
  font-weight:600
}
.fil-ariane a{
  text-decoration:none
}
.explorateur,.table-responsive{
  overflow:auto;
  padding:0
}
table{
  width:100%;
  border-collapse:collapse;
  text-align:left;
  font-size:13px
}
th{
  font-size:12px;
  color:var(--secondaire);
  font-weight:500;
  padding:16px 20px;
  white-space:nowrap
}
td{
  padding:17px 20px
}
tbody tr:hover{
  background:#f3f7f7
}
.nom-fichier{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:130px;
  overflow-wrap:anywhere;
  text-decoration:none;
  font-weight:550
}
.icone-dossier{
  font-size:21px;
  color:var(--teal-clair)
}
.depot-libre{
  margin-top:24px;
  max-width:540px
}
.depot-libre input,.depot-libre select{
  max-width:100%
}
.depot-libre .ligne{
  align-items:start
}
.notification{
  padding:14px 18px;
  background:#e3eee7;
  border:0;
  border-radius:7px;
  font-size:13px;
  color:var(--vert);
  margin-bottom:24px
}
.deux-colonnes{
  display:grid;
  grid-template-columns:1.35fr 1fr;
  gap:22px
}
.empreinte{
  overflow-wrap:anywhere;
  font-family:ui-monospace,monospace;
  font-size:11px
}
.empreinte small,small.empreinte{
  display:block;
  color:var(--secondaire);
  max-width:350px;
  margin-top:8px
}
.metadonnees{
  margin-top:24px
}
.metadonnees summary{
  cursor:pointer;
  font-weight:600
}
.metadonnees dl{
  display:grid;
  grid-template-columns:160px 1fr;
  gap:12px;
  font-size:13px;
  margin-top:24px
}
.metadonnees dd{
  margin:0
}
.metadonnees dt{
  color:var(--secondaire)
}
.modele ol{
  padding-left:20px;
  margin-bottom:0
}
.modele li{
  padding-left:7px;
  font-size:13px;
  margin:14px 0
}
.modele li p{
  font-size:12px;
  color:var(--secondaire);
  margin:3px 0 0
}
.bloc{
  display:block;
  color:var(--secondaire)
}
.en-ligne{
  display:inline-block
}
.regles{
  margin-top:24px
}
.pleine-largeur{
  width:100%;
  justify-content:space-between
}
.courriel-compte{
  overflow-wrap:anywhere
}
.authentification main{
  max-width:1180px;
  padding:65px 45px;
  min-height:calc(100vh - 50px);
  display:flex;
  align-items:center;
  justify-content:center
}
.entree{
  display:grid;
  grid-template-columns:1.15fr 1fr;
  align-items:center;
  gap:90px;
  width:100%
}
.introduction .marque{
  margin-bottom:55px
}
.introduction h1{
  font-size:43px;
  line-height:1.18;
  letter-spacing:-1.5px;
  margin-bottom:25px
}
.introduction>p{
  font-size:15px;
  color:var(--secondaire);
  max-width:420px;
  line-height:1.7
}
.promesses{
  display:none
}
.connexion{
  padding:35px
}
.connexion h2{
  font-size:25px
}
.connexion label{
  margin:24px 0 15px
}
.connexion button{
  margin-top:14px
}
.connexion .note{
  font-size:11px;
  line-height:1.7;
  margin:26px 0 0
}
.auth-carte{
  max-width:510px;
  width:100%;
  padding:35px
}
.auth-carte .marque{
  margin-bottom:30px
}
.auth-carte h1{
  font-size:25px;
  margin-bottom:18px
}
.auth-carte p{
  font-size:13px;
  color:var(--secondaire)
}
.auth-carte form{
  margin:23px 0
}
.qr{
  display:block;
  width:200px;
  height:200px;
  margin:20px auto
}
.cle{
  display:block;
  overflow-wrap:anywhere;
  padding:15px 0;
  font-size:12px
}
.code-saisie{
  font-size:22px;
  letter-spacing:4px
}
.codes-secours{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  padding:20px;
  margin:25px 0;
  background:var(--fond);
  font-size:15px
}
.choix-espace{
  width:100%;
  justify-content:space-between;
  text-align:left
}
.choix-espace span{
  font-size:12px
}
.erreur{
  max-width:600px;
  margin:60px auto
}
.erreur .bouton{
  margin-left:10px
}
dialog{
  border:0;
  border-radius:10px;
  padding:28px;
  width:min(520px,calc(100% - 32px));
  background:white;
  color:var(--texte);
  max-height:90vh
}
dialog::backdrop{
  background:#2e3a3c66;
  backdrop-filter:blur(2px)
}
dialog .ligne h2{
  margin:0
}
dialog .ligne>button{
  font-size:20px;
  padding:0 10px;
  min-height:32px
}
dialog .principal{
  margin-top:10px
}
[draggable=true]{
  cursor:grab
}
[draggable=true]:active{
  cursor:grabbing
}
.barre-demo{
  position:sticky;
  top:0;
  z-index:20;
  display:flex;
  gap:16px;
  align-items:center;
  justify-content:flex-end;
  padding:9px 24px;
  background:#fff6db;
  border:0;
  color:#715721
}
.barre-demo>strong{
  font-size:12px;
  margin-right:auto
}
.barre-demo nav{
  display:flex;
  gap:5px;
  flex-wrap:wrap
}
.barre-demo form{
  margin:0
}
.barre-demo button{
  min-height:31px;
  font-size:11px;
  padding:6px 10px;
  background:transparent
}
.barre-demo button:hover{
  background:#f6e9c1
}
.barre-demo button.compte-demo-actif{
  background:var(--encre);
  color:white
}
@media(min-width:1600px){
  .checklist{
    grid-template-columns:repeat(3,minmax(0,1fr))
  }
}
@media(max-width:1250px){
  .navigation{
    width:215px;
    padding-left:15px;
    padding-right:15px
  }
  .connecte .corps{
    margin-left:215px
  }
  .grille-batiments{
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  main{
    padding:30px
  }
  .quatre-colonnes{
    grid-template-columns:repeat(2,1fr)
  }
  .bandeau-etat{
    gap:28px
  }
  .entree{
    gap:50px
  }
  .bandeau-etat>div{
    display:block
  }
  .bandeau-etat span{
    display:block
  }
}
@media(max-width:950px){
  .checklist,.deux-colonnes{
    grid-template-columns:1fr
  }
  .entete-page{
    align-items:start
  }
  .entete-page h1{
    font-size:27px
  }
  .entete-page .boutons{
    flex-shrink:0
  }
  .indicateurs>div{
    padding:0 16px
  }
  .indicateurs span{
    min-height:36px
  }
  .entree{
    gap:30px
  }
  .introduction h1{
    font-size:36px
  }
  .authentification main{
    padding:40px 28px
  }
  .connexion{
    padding:26px
  }
  .barre-demo{
    gap:6px;
    padding:9px 17px
  }
  .barre-demo button{
    font-size:10px;
    padding:5px 8px
  }
}
@media(max-width:720px){
  .navigation{
    position:static;
    width:auto;
    padding:16px;
    display:block
  }
  .navigation .marque{
    font-size:19px
  }
  .navigation nav{
    display:flex;
    flex-wrap:wrap;
    gap:3px;
    margin-top:18px
  }
  .navigation nav a{
    font-size:11px;
    padding:7px 9px;
    margin:0
  }
  .navigation .bas-navigation{
    display:flex;
    gap:18px;
    align-items:center;
    justify-content:flex-end;
    margin-top:12px;
    padding-top:0
  }
  .navigation .bas-navigation a{
    margin:0
  }
  .connecte .corps{
    margin-left:0
  }
  main{
    padding:25px 17px;
    min-height:auto
  }
  .entete-page{
    display:flex;
    flex-wrap:wrap;
    gap:18px;
    margin-bottom:25px
  }
  .entete-page .boutons{
    justify-content:flex-start;
    gap:8px
  }
  .indicateurs{
    grid-template-columns:repeat(2,1fr);
    gap:25px;
    padding:22px 4px;
    margin-bottom:25px
  }
  .indicateurs span{
    min-height:auto;
    font-size:11px
  }
  .indicateurs strong{
    font-size:30px
  }
  .grille-batiments{
    grid-template-columns:1fr
  }
  .outils{
    flex-direction:column;
    align-items:stretch
  }
  .recherche{
    max-width:none
  }
  .bandeau-etat{
    padding:22px 20px;
    gap:23px;
    flex-wrap:wrap
  }
  .bandeau-etat strong{
    font-size:27px
  }
  .bandeau-etat span{
    font-size:11px
  }
  .entete-lot{
    gap:18px;
    align-items:start
  }
  .entete-lot h2{
    font-size:20px
  }
  .progression-lot{
    min-width:125px;
    max-width:145px
  }
  .progression-lot .compte{
    font-size:11px
  }
  .piece{
    padding:18px
  }
  .piece-deposee{
    padding:19px
  }
  .entete-piece{
    gap:8px
  }
  .entete-piece h3{
    font-size:14px
  }
  .entete-piece .badge{
    font-size:9px
  }
  .trois-colonnes,.quatre-colonnes{
    grid-template-columns:1fr;
    gap:8px
  }
  .entree{
    display:block
  }
  .introduction{
    display:none
  }
  .connexion{
    padding:30px 25px;
    max-width:440px;
    margin:auto
  }
  .authentification main{
    padding:28px 17px;
    min-height:calc(100vh - 100px)
  }
  .auth-carte{
    padding:26px
  }
  .marque-mobile{
    display:flex;
    margin-bottom:28px
  }
  .marque-mobile .logo-officiel{
    width:44px;
    height:44px
  }
  .metadonnees dl{
    grid-template-columns:1fr;
    gap:6px
  }
  .metadonnees dd{
    margin-bottom:10px
  }
  td,th{
    padding:12px
  }
  .table-responsive code{
    font-size:10px
  }
  .regles{
    padding:20px
  }
  .auth-carte h1{
    font-size:23px
  }
  .barre-demo{
    justify-content:space-between;
    flex-wrap:wrap
  }
  .barre-demo>strong{
    font-size:11px
  }
  .barre-demo nav{
    gap:2px
  }
  .barre-demo button{
    font-size:10px;
    padding:5px 7px
  }
  .onglets{
    gap:20px
  }
  .onglets a{
    font-size:13px
  }
  .menu-contenu{
    right:0
  }
  .informations-batiment{
    grid-template-columns:1fr
  }
}

/* Explorateur : une ligne, des commandes communes et des détails à la demande. */
.sr-seul{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
border:0}
.barre-fichiers{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
margin:24px 0}
.commandes-fichiers{
  display:flex;
  align-items:center;
gap:14px}
.zone-recherche-fichiers{
  width:200px;
  min-width:0;
height:40px}
.recherche-fichiers{
  margin:0;
width:100%}
.recherche-fichiers input{
  border:0;
  background:var(--clair);
padding:10px 14px}
.barre-fichiers .menu-actions>summary{
  font-size:14px;
line-height:1.5}
.fil-ariane .icone-fichier{
  width:19px;
  height:19px;
display:block}
.selection-outils{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  height:40px;
font-size:12px}
.selection-outils>span{
font-weight:600}
.liste-fichiers{
  padding:8px;
  border:0;
  border-radius:12px;
  background:white;
min-height:0}
.liste-fichiers:not(:has(.ligne-fichier:not([hidden]))){
display:none}
.ligne-fichier{
  display:flex;
  align-items:center;
  gap:14px;
  min-height:66px;
  padding:10px 14px;
  border-radius:7px;
user-select:none}
.ligne-fichier:hover{
background:#f3f7f7}
.ligne-fichier.est-selectionne,.ligne-fichier.destination-active{
background:var(--clair)}
.selection-fichier{
  width:17px;
  height:17px;
  flex:none;
  margin:0;
  accent-color:var(--bleu);
cursor:pointer}
.ligne-fichier .nom-fichier{
  flex:1;
  min-width:0;
  color:var(--encre);
  font-size:14px;
line-height:1.45}
.ligne-fichier .nom-fichier>span{
  min-width:0;
overflow-wrap:anywhere}
.icone-fichier{
  flex:none;
color:var(--secondaire)}
.icone-fichier.dossier{
  color:var(--bleu);
fill:#e3edef}
.actions-fichier{
  display:flex;
  align-items:center;
  gap:8px;
flex:none}
.bouton-icone{
  width:36px;
  min-height:36px;
  padding:7px;
  background:transparent;
  border:0;
  color:var(--secondaire);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  font-size:25px;
  line-height:1;
  border-radius:6px;
cursor:pointer}
.bouton-icone .icone-fichier{
  width:18px;
height:18px}
.bouton-icone:hover{
background:var(--clair)}
.ligne-fichier small[data-chemin]{
  display:block;
  font-weight:400;
  color:var(--secondaire);
  margin-top:3px;
font-size:12px}
.depot-explorateur{
  margin-top:22px;
  border:1px dashed var(--bord);
  background:transparent;
  border-radius:10px;
padding:12px 24px}
.depot-explorateur .cible-depot{
min-height:108px}
.depot-explorateur .cible-depot>span{
font-size:14px}
.vide-fichiers{
  text-align:center;
  padding:48px 24px;
color:var(--secondaire)}
.menu-fichiers{
  position:fixed;
  inset:auto;
  margin:0;
  padding:7px;
  border:0;
  border-radius:9px;
  background:white;
  color:var(--encre);
  width:275px;
  max-width:calc(100vw - 16px);
box-shadow:0 8px 35px #2e3a3c26}
.menu-fichiers button{
  display:block;
  width:100%;
  text-align:left;
  background:transparent;
  padding:10px 12px;
font-size:13px}
.menu-fichiers button:hover,.menu-fichiers button:focus-visible{
background:var(--clair)}
.panneau-fichier{
  position:fixed;
  inset:0 0 0 auto;
  margin:0;
  height:100dvh;
  max-height:100dvh;
  width:450px;
  max-width:100vw;
  border-radius:0;
  padding:32px;
  overflow:auto;
box-shadow:-8px 0 40px #2e3a3c1f}
.panneau-fichier h2{
  font-size:22px;
overflow-wrap:anywhere}
.panneau-fichier h3{
margin:30px 0 12px}
.panneau-fichier .informations-batiment{
margin-top:26px}
.versions-fichier{
  list-style:none;
  padding:0;
margin:0 0 24px}
.versions-fichier li{
  display:flex;
  align-items:start;
  gap:12px;
  padding:10px 0;
font-size:13px}
.versions-fichier li>span:nth-child(2){
  flex:1;
overflow-wrap:anywhere}
.versions-fichier a{
  font-size:20px;
text-decoration:none}
.tracabilite-fichier{
  margin-top:26px;
font-size:13px}
.tracabilite-fichier summary{
  cursor:pointer;
color:var(--secondaire)}
@media(max-width:900px){
  .barre-fichiers{
    align-items:start;
    flex-direction:column;
  gap:16px}
  .commandes-fichiers{
  width:100%}
  .zone-recherche-fichiers{
    flex:1;
  width:auto}
  .commandes-fichiers>.menu-actions{
  margin-left:auto}
}
@media(max-width:480px){
  .ligne-fichier{
    gap:10px;
  padding:10px 5px}
  .actions-fichier{
  gap:0}
  .liste-fichiers{
  padding:5px}
  .ligne-fichier .nom-fichier{
  font-size:13px}
  .barre-fichiers{
  margin:20px 0}
  .commandes-fichiers{
  gap:10px}
  .panneau-fichier{
  padding:24px}
  .depot-explorateur{
  padding:10px 12px}
}

/* Configuration lisible, puis saisie du code dans une seule surface. */
.auth-facteur--configuration { max-width:760px; }
.configuration-facteur { display:grid; grid-template-columns:184px minmax(0,1fr); gap:36px; align-items:center; margin:28px 0 32px; }
.configuration-facteur .qr { width:184px; height:184px; margin:0; }
.configuration-cle { min-width:0; }
.configuration-cle h2 { font-size:13px; font-weight:600; margin:0 0 12px; }
.configuration-cle .cle { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:6px 12px; padding:0; margin:0 0 12px; font-size:20px; line-height:1.5; font-weight:600; user-select:all; }
.configuration-cle .cle span { white-space:nowrap; }
.configuration-cle .cle.cle-brute { display:block; }
.configuration-cle .compact { margin:0 0 10px; }
.configuration-cle .note { font-size:11px; margin:0; }
.statut-copie:empty { display:none; }
.auth-facteur .verification-facteur { max-width:360px; margin:28px auto 20px; }
.verification-facteur label { margin:0 0 12px; }
.verification-facteur .principal { margin-top:22px; min-height:46px; }
.cases-code { display:none; }
.saisie-code.code-interactif { position:relative; height:56px; }
.code-interactif .cases-code { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)) 8px repeat(3,minmax(0,1fr)); gap:8px; height:100%; }
.cases-code [data-case-code] { display:grid; place-items:center; border:1px solid var(--bord); border-radius:7px; font-size:26px; font-weight:600; color:var(--encre); }
.cases-code .case-active { outline:2px solid var(--bleu); outline-offset:2px; }
.cases-code .case-selectionnee { color:var(--bleu); font-weight:750; }
.code-interactif .code-saisie { position:absolute; inset:0; width:100%; height:100%; margin:0; opacity:0; cursor:text; }
.code-interactif.code-secours .cases-code { display:none; }
.code-interactif.code-secours .code-saisie { position:static; opacity:1; font-size:18px; letter-spacing:2px; }
.mode-secours { color:var(--bleu); margin-top:12px; font-size:12px; }
.auth-facteur .retour-auth { display:block; width:fit-content; margin:0 auto; font-size:12px; }
@media (max-width:620px) {
  .configuration-facteur { grid-template-columns:1fr; gap:24px; }
  .configuration-facteur .qr { margin-inline:auto; }
  .configuration-cle .cle { font-size:18px; }
}
@media (max-width:359px) {
  .auth-facteur { padding-inline:20px; }
  .code-interactif .cases-code { gap:5px; grid-template-columns:repeat(3,minmax(0,1fr)) 4px repeat(3,minmax(0,1fr)); }
}

/* Panneau commun : seuls les champs utiles sont révélés au besoin. */
.panneau-page { max-width: 42rem; margin: 0 auto; }
.panneau-fichier form, .panneau-page form { display: grid; gap: 1rem; margin-block: 1rem; }
.panneau-fichier details, .panneau-page details { margin-block: 1rem; }
.panneau-fichier [role="alert"]:empty, .panneau-page [role="alert"]:empty { display: none; }
.panneau-fichier [role="alert"], .panneau-page [role="alert"] { color: var(--danger, #9b2929); }
.ds-progress-view { display: inline-block; width: 1.4rem; height: 1.4rem; color: inherit; border: 2px solid currentColor; border-right-color: transparent; background: transparent; border-radius: 50%; animation: bacs-attente .8s linear infinite; margin: 1rem; }
@keyframes bacs-attente { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .ds-progress-view { animation: none; } }
.invitation { margin-block: 1.5rem; }
.entete-lot .note { display: block; margin-block: .5rem; }
