/* APS — builders/doc/bibliotheque.css — 2026-10-22
   La Bibliothèque du Documentation Builder : onglets, puis trois colonnes
   (dossiers ou liste à gauche, tableau au centre, détail à droite). Couleurs
   par jetons, comme le Deploy Builder. */

:root{
  --bg:#0f1011; --bg2:#151718; --bg3:#1a1d1f; --bg4:#202427;
  --text:#eef0f1; --text-dim:#a6b0b8; --border:#262a2e;
  --accent:#d6d233; --ok:#58d68d; --warn:#f0b450; --err:#e74c3c; --info:#5dade2;
  color-scheme:dark;
}
[hidden]{ display:none !important; }
*{ box-sizing:border-box; }
html, body{ height:100%; }
body{
  margin:0; background:var(--bg); color:var(--text);
  font:13px/1.45 system-ui,-apple-system,Segoe UI,sans-serif;
  display:flex; flex-direction:column;
}
button, input, select{ font:inherit; color:inherit; }
a{ color:var(--accent); }
.aps-header .breadcrumb{ color:#c7ced3; font-size:12.5px; }
.aps-header .breadcrumb a{ color:#c7ced3; text-decoration:none; }
.aps-header .breadcrumb a:hover{ color:var(--text); }

/* ── Onglets ─────────────────────────────────────────────────────── */
.bib-onglets{ display:flex; flex-wrap:wrap; gap:18px; padding:0 20px; border-bottom:1px solid var(--border); background:var(--bg2); }
.bib-onglet{ background:none; border:0; border-bottom:2px solid transparent; color:var(--text-dim); padding:11px 2px; font-size:14px; cursor:pointer; }
.bib-onglet:hover{ color:var(--text); }
.bib-onglet[aria-current="page"]{ color:var(--text); border-bottom-color:var(--accent); }

.bib-main{ flex:1; min-height:0; display:flex; flex-direction:column; }
.bib-volet{ flex:1; min-height:0; display:flex; flex-direction:column; }

/* ── Barre et résumé ─────────────────────────────────────────────── */
.bib-barre{ display:flex; flex-wrap:wrap; align-items:center; gap:10px; padding:10px 20px; border-bottom:1px solid var(--border); }
.bib-libelle, .bib-dim{ color:var(--text-dim); }
.bib-valeur{ color:var(--text); }
.bib-lien{ text-decoration:none; }
.bib-lien[href]:hover{ text-decoration:underline; }
.bib-sep{ color:var(--text-dim); }
.bib-espace{ flex:1; }
.bib-erreur{ color:var(--err); max-width:520px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bib-select{ background:var(--bg3); border:1px solid var(--border); border-radius:6px; padding:5px 8px; }
.bib-bouton{
  display:inline-flex; align-items:center; gap:6px; background:transparent; color:var(--text);
  border:1px solid #3a4046; border-radius:7px; padding:6px 12px; cursor:pointer; text-decoration:none; font-size:13px;
}
.bib-bouton:hover{ border-color:var(--text-dim); }
.bib-bouton:disabled{ opacity:.6; cursor:default; }
.bib-primaire{ background:var(--accent); color:#0f1011; border-color:var(--accent); font-weight:650; }
.bib-primaire:hover{ border-color:var(--accent); filter:brightness(1.08); }
.bib-pastilles{ display:flex; flex-wrap:wrap; gap:8px; padding:10px 20px; border-bottom:1px solid var(--border); }
.bib-pastilles:empty{ display:none; }
.bib-pastille{ background:var(--bg3); border:1px solid var(--border); border-radius:999px; padding:3px 10px; color:var(--text-dim); }
.bib-pastille b{ color:var(--text); font-weight:650; }
.bib-pastille[data-etat="warn"]{ border-color:#7a5a22; }
.bib-pastille[data-etat="warn"] b{ color:var(--warn); }
.bib-vide{ padding:40px 20px; color:var(--text-dim); display:flex; flex-direction:column; align-items:flex-start; gap:14px; }
.bib-pose{ display:flex; flex-wrap:wrap; align-items:center; gap:14px; color:var(--text); }
.bib-bandeau{ padding:10px 20px; border-bottom:1px solid var(--border); background:var(--bg3); }

/* ── Trois colonnes ──────────────────────────────────────────────── */
.bib-corps{ flex:1; min-height:0; display:flex; flex-wrap:wrap; }
.bib-gauche{ flex:1 1 260px; max-width:320px; min-width:0; overflow:auto; padding:14px; background:var(--bg2); border-right:1px solid var(--border); }
.bib-centre{ flex:999 1 520px; min-width:0; overflow:auto; padding:14px 20px; }
.bib-droite{ flex:1 1 300px; max-width:380px; min-width:0; overflow:auto; padding:14px 16px; background:var(--bg2); border-left:1px solid var(--border); }
.bib-titre{ margin:16px 0 8px; font-size:12px; font-weight:600; text-transform:uppercase; letter-spacing:.06em; color:var(--text-dim); display:flex; align-items:center; gap:6px; }
.bib-titre:first-child{ margin-top:0; }
.bib-aide{
  display:inline-flex; align-items:center; justify-content:center; flex-shrink:0;
  width:16px; height:16px; border-radius:50%; border:1px solid var(--border);
  color:var(--text-dim); font-size:10.5px; font-weight:400; text-transform:none; letter-spacing:0; cursor:default; user-select:none;
}

/* Arbre des dossiers et listes de choix */
.bib-arbre, .bib-choix{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:2px; }
.bib-arbre li[data-profondeur="1"]{ padding-left:14px; }
.bib-arbre li[data-profondeur="2"]{ padding-left:28px; }
.bib-arbre li[data-profondeur="3"], .bib-arbre li[data-profondeur="4"]{ padding-left:42px; }
.bib-noeud{
  width:100%; display:flex; justify-content:space-between; align-items:baseline; gap:8px; text-align:left;
  background:transparent; border:1px solid transparent; border-radius:6px; padding:5px 8px; cursor:pointer;
}
.bib-noeud:hover{ background:var(--bg3); }
.bib-noeud[aria-pressed="true"]{ background:var(--bg4); border-color:var(--accent); }
.bib-noeud-nom{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bib-noeud-marque{ flex-shrink:0; font-size:11.5px; color:var(--text-dim); }
.bib-noeud[data-sorte="declare"] .bib-noeud-marque{ color:var(--ok); }
.bib-noeud[data-sorte="inconnu"] .bib-noeud-marque{ color:var(--warn); }
.bib-noeud[data-sorte="ignore"] .bib-noeud-nom{ color:#6c757d; }

/* Tableau des rattachements */
.bib-tableau-boite{ overflow-x:auto; border:1px solid var(--border); border-radius:8px; }
.bib-tableau{ width:100%; min-width:720px; border-collapse:collapse; }
.bib-tableau th{ text-align:left; font-weight:600; color:var(--text-dim); background:var(--bg3); padding:8px 12px; }
.bib-tableau td{ padding:7px 12px; border-top:1px solid var(--border); vertical-align:top; }
.bib-ligne{ cursor:pointer; }
.bib-ligne:hover td{ background:var(--bg2); }
.bib-ligne[aria-selected="true"] td{ background:var(--bg4); }
.bib-ligne:focus-visible{ outline:2px solid var(--accent); outline-offset:-2px; }
.bib-fichier{ max-width:340px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.bib-tableau td:nth-child(-n+3){ white-space:nowrap; }
.bib-etat{ white-space:nowrap; }
.bib-etat[data-etat="ok"] .bib-signe{ color:var(--ok); }
.bib-etat[data-etat="warn"]{ color:var(--warn); }
.bib-etat[data-etat="err"]{ color:var(--err); }

.bib-puces{ display:flex; flex-wrap:wrap; gap:6px; }
.bib-puce{ border:1px dashed #3a4046; border-radius:999px; padding:3px 10px; color:var(--text-dim); }
.bib-puce[data-etat="warn"]{ border-color:#7a5a22; color:var(--warn); }
.bib-liste{ margin:0; padding-left:18px; display:flex; flex-direction:column; gap:3px; }

/* Détail */
.bib-detail{ display:flex; flex-direction:column; gap:6px; }
.bib-detail-titre{ margin:0 0 6px; font-size:14px; font-weight:650; overflow-wrap:anywhere; }
.bib-sous-titre{ margin:10px 0 4px; font-size:12px; font-weight:600; text-transform:uppercase; letter-spacing:.06em; color:var(--text-dim); }
.bib-kv{ display:flex; gap:8px; align-items:baseline; }
.bib-k{ color:var(--text-dim); width:96px; flex-shrink:0; }
.bib-v{ min-width:0; overflow-wrap:anywhere; }
.bib-copier{ flex-shrink:0; background:transparent; border:1px solid var(--border); border-radius:5px; padding:1px 7px; font-size:11.5px; color:var(--text-dim); cursor:pointer; }
.bib-copier:hover{ color:var(--text); border-color:var(--text-dim); }
.bib-detail .bib-bouton{ align-self:flex-start; margin-top:6px; }

/* Sections d'un modèle */
.bib-sections{ list-style:none; margin:0; padding:0 0 0 12px; display:flex; flex-direction:column; gap:6px; border-left:1px solid var(--border); }
.bib-section-titre{ font-weight:600; }
.bib-blocs{ display:flex; flex-wrap:wrap; gap:4px; margin-top:3px; }
.bib-bloc{ font-size:11.5px; border:1px solid var(--border); border-radius:999px; padding:1px 8px; color:var(--text-dim); }
.bib-bloc[data-type="prose"]{ border-color:#6b6a1c; color:var(--accent); }
.bib-bloc[data-type="donnees"]{ border-color:#2b5c80; color:var(--info); }
.bib-bloc[data-type="saisie"]{ border-color:#7a5a22; color:var(--warn); }
.bib-bloc[data-type="elements"]{ border-color:#2e6b48; color:var(--ok); }

@media (max-width: 700px){
  .bib-gauche, .bib-droite{ max-width:none; border:0; border-bottom:1px solid var(--border); }
  .bib-barre, .bib-pastilles, .bib-onglets{ padding-left:16px; padding-right:16px; }
}
