/* ============================================================
   Georgi Invest Documents — compléments de la charte (base : compta.css)
   ============================================================ */

/* Disposition : navigation des catégories à gauche, documents à droite. */
.doc-layout{display:grid;grid-template-columns:260px 1fr;gap:1.3rem;align-items:start}
.doc-aside{background:var(--card);border:1px solid var(--border);border-radius:6px;padding:.6rem;position:sticky;top:84px}
.doc-main{min-width:0}

/* Navigation des catégories */
.cat-nav a{display:flex;align-items:center;gap:.55rem;padding:.5rem .6rem;border-radius:5px;color:var(--text);font-size:.9rem;border-left:2px solid transparent}
.cat-nav a:hover{background:var(--card-hi);color:var(--white)}
.cat-nav a.active{background:var(--card-hi);color:var(--white);border-left-color:var(--gold)}
.cat-nav .sub{margin-left:.9rem;font-size:.86rem;color:var(--muted)}
.cat-nav .count{margin-left:auto;font-size:.72rem;color:var(--muted);background:#0e0e0e;border:1px solid var(--border);border-radius:20px;padding:.05rem .45rem}
.cat-nav .cat-head{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:#666;padding:.7rem .6rem .3rem}

/* Pastille de couleur d'étiquette */
.dot{width:11px;height:11px;border-radius:50%;flex:0 0 auto;display:inline-block;border:1px solid rgba(255,255,255,.18)}

/* Étiquette de catégorie colorée */
.tag{display:inline-flex;align-items:center;gap:.4rem;font-size:.78rem;padding:.12rem .5rem;border-radius:20px;
  border:1px solid var(--border);background:#0e0e0e;color:var(--text);white-space:nowrap}

/* Sélecteur de couleur */
input[type=color]{width:44px;height:34px;padding:2px;background:#0e0e0e;border:1px solid var(--border);border-radius:5px;cursor:pointer}
.color-row{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.swatch-pick{display:inline-flex;gap:.3rem;flex-wrap:wrap}
.swatch-pick button{width:22px;height:22px;border-radius:50%;border:1px solid rgba(255,255,255,.2);cursor:pointer}

/* Zone de dépôt */
.drop{border:1.5px dashed var(--border);border-radius:8px;padding:1.6rem;text-align:center;color:var(--muted);transition:.18s}
.drop:hover,.drop.drag{border-color:var(--gold);color:var(--white);background:var(--card-hi)}
.drop .big{font-size:1.6rem;color:var(--gold)}

/* Boutons monter / descendre */
.reorder{display:inline-flex;gap:.15rem;margin-right:.25rem;vertical-align:middle}
.reorder .btn{padding:.28rem .5rem;line-height:1}

/* Colonne de sélection (cases à cocher) */
.selcol{width:38px;text-align:center}
.selcol input{width:17px;height:17px;cursor:pointer;accent-color:var(--gold)}

/* Liste des fichiers sélectionnés (dépôt en masse) */
.flist{display:flex;flex-direction:column;gap:.3rem;margin-top:.7rem;max-height:260px;overflow:auto}
.fitem{display:flex;justify-content:space-between;gap:1rem;align-items:center;font-size:.86rem;
  padding:.35rem .6rem;border:1px solid var(--border);border-radius:5px;background:#0e0e0e}
.fitem span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Type de fichier (mini-badge) */
.ftype{font-size:.66rem;letter-spacing:.06em;text-transform:uppercase;color:var(--gold);border:1px solid #5a4a22;border-radius:4px;padding:.05rem .35rem}

/* Tableau des documents → fiches empilées sur mobile (préférence Georgi) */
@media (max-width:760px){
  .doc-layout{grid-template-columns:1fr}
  .doc-aside{position:static}
  table.cards thead{display:none}
  table.cards, table.cards tbody, table.cards tr, table.cards td{display:block;width:100%}
  table.cards tr{border:1px solid var(--border);border-radius:6px;margin-bottom:.7rem;padding:.3rem .2rem;background:var(--card)}
  table.cards td{border:none;white-space:normal;padding:.35rem .8rem;display:flex;justify-content:space-between;gap:1rem}
  table.cards td::before{content:attr(data-label);color:var(--muted);font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;flex:0 0 42%}
  table.cards td.row-actions{justify-content:flex-end;flex-wrap:wrap}
}
