/* vue_arbre_pieces.css : L'ARBRE DES PIECES (DECISIONS 34.4).
   Oeuvre originale, projet Kedros (R17) ; ce fichier est SERVI : aucun nom propre.

   « Il faut que ce soit souple et facile. Comprehensible a premiere lecture.
   Intuitif. » Une rubrique tient donc en UNE ligne repliee : son nom, son compte, et
   ce qu'elle recueille. La palette est celle de la charte, aucune couleur inventee. */

#carte-pieces .pieces-vues,
.pieces-vues{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin:0 0 10px}
.pieces-vues button{font:inherit;font-size:.86rem;cursor:pointer;padding:4px 13px;
  border-radius:999px;border:1px solid var(--trait);background:var(--blanc);
  color:var(--encre)}
.pieces-vues button:hover{background:var(--fond)}
.pieces-vues button[aria-pressed=true]{background:var(--accent);
  border-color:var(--accent);color:var(--creme)}
.pieces-vues .sous{margin-left:auto}

#arbre-pieces.cache,#table-pieces.cache{display:none}

.arbre-rubrique{border:1px solid var(--trait);border-radius:var(--rayon);
  background:var(--blanc);margin-bottom:8px;overflow:hidden}
.arbre-rubrique > summary{cursor:pointer;padding:9px 14px;display:flex;
  align-items:center;gap:10px;background:var(--fond);list-style:none}
.arbre-rubrique > summary::-webkit-details-marker{display:none}
/* Le chevron dit l'etat sans un mot, et tourne a l'ouverture. */
.arbre-rubrique > summary::before{content:"\25B8";flex:0 0 auto;opacity:.55;
  transition:transform .15s ease}
.arbre-rubrique[open] > summary::before{transform:rotate(90deg)}
.arbre-rubrique > summary:hover{background:var(--accent-clair)}
.arbre-rubrique .nom{font-weight:500}
.arbre-rubrique .compte{font-size:.78rem;padding:1px 8px;border-radius:999px;
  border:1px solid var(--trait);background:var(--blanc);
  font-variant-numeric:tabular-nums}
.arbre-rubrique .aide{font-size:.82rem;opacity:.72;flex:1;min-width:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.arbre-pieces-liste{margin:0;padding:6px 0;list-style:none}
.arbre-pieces-liste li{display:flex;align-items:center;gap:10px;padding:3px 14px 3px 34px}
.arbre-pieces-liste li:hover{background:var(--fond)}
.arbre-pieces-liste li.cache,.arbre-rubrique.cache{display:none}
.arbre-pieces-liste .arbre-piece{font:inherit;font-size:.94rem;text-align:left;
  background:none;border:none;padding:0;cursor:pointer;color:var(--encre);
  flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.arbre-pieces-liste .arbre-piece:hover{text-decoration:underline}
.arbre-pieces-liste .quand{font-size:.8rem;opacity:.7;white-space:nowrap;
  font-variant-numeric:tabular-nums}

/* LE POSTE DE TRI du recueil (DECISIONS 38.1, app_21b) : greffe sur les lignes. */
.poste-tri-entete{display:flex;flex-wrap:wrap;gap:8px;align-items:center;
  padding:8px 14px 4px}
.poste-tri-dit{font-size:.85rem}
.poste-tri-dit.ok{color:#3f5a2e}
.poste-tri-dit.alerte{color:var(--alerte)}
.arbre-pieces-liste .poste-tri-ligne{display:inline-flex;flex-wrap:wrap;gap:6px;
  align-items:center;margin-left:auto;font-size:.85rem}
.poste-tri-prop{white-space:nowrap}
.poste-tri-prop b{font-weight:600}
.poste-tri-famille{font:inherit;font-size:.85rem;max-width:220px}
.poste-tri-rubriques{padding:4px 14px 8px;display:flex;flex-direction:column;gap:6px}
.poste-tri-rubrique{display:flex;flex-wrap:wrap;gap:6px;align-items:center;
  font-size:.88rem;padding:6px 10px;border:1px dashed var(--trait);border-radius:var(--rayon)}
.poste-tri-rubrique-lib b{font-weight:600}
.poste-tri-candidat{font-size:.85rem}
.arbre-rubrique[data-cle^='locale-'] > summary .nom::after{content:" (propre à ce dossier)";
  font-weight:normal;opacity:.7;font-size:.85em}

@media (max-width:720px){
  .pieces-vues .sous{margin-left:0;width:100%}
  .arbre-pieces-liste li{padding-left:20px}
  .arbre-rubrique .aide{display:none}
  .arbre-pieces-liste .poste-tri-ligne{margin-left:0;width:100%}
}
