/* Oqora CRM · styles de la section Tableau de bord (27/10/2026, .tb-*).
   Règles préfixées par la classe racine (.s-bord) ; seule crm.css définit des jetons :root. Même système que Mes
   chiffres et Mes pages (audit-visuel.md § 3) : cartes à traits fins, chiffres d'une seule couleur, aucun liseré. */

.s-bord{ display:block; max-width:var(--contenu-max, 1360px); }
.s-bord p, .s-bord ul{ margin:0; }
.s-bord .tb-chargement{ padding:var(--sp-6, 24px) 0; }
.s-bord .tb{ display:flex; flex-direction:column; gap:var(--sp-4, 16px); min-width:0; color:var(--ink); }

/* ---- barre : période, flèches, setter ---- */
.s-bord .tb-barre{ display:flex; align-items:center; flex-wrap:wrap; gap:var(--sp-3, 12px) var(--sp-5, 20px);
  padding:var(--sp-3, 12px) var(--sp-4, 16px); }
.s-bord .tb-modes{ display:inline-flex; flex-wrap:wrap; gap:2px; padding:2px; border-radius:var(--r-md, 8px);
  background:var(--surface-2, #f2f4f6); }
.s-bord .tb-mode{ min-height:var(--ctrl-h-sm, 32px); padding:0 12px; border:0; border-radius:var(--r-sm, 6px);
  background:transparent; color:var(--ink-soft); font:inherit; font-size:var(--fs-13, 13px);
  font-weight:var(--fw-moyen, 500); cursor:pointer; white-space:nowrap; }
.s-bord .tb-mode:hover{ color:var(--ink); }
.s-bord .tb-mode--actif{ background:var(--surface); color:var(--ink); box-shadow:0 1px 2px rgba(16,24,40,.08); }
.s-bord .tb-mode:focus-visible, .s-bord .tb-fleche:focus-visible{ outline:2px solid var(--bleu-ring); outline-offset:2px; }
.s-bord .tb-nav{ display:flex; align-items:center; gap:var(--sp-2, 8px); min-width:0; }
.s-bord .tb-libelle{ font-size:var(--fs-md, 15px); font-weight:var(--fw-fort, 600); white-space:nowrap; }
.s-bord .tb-fleche{ min-width:36px; justify-content:center; }
.s-bord .tb-fleche[disabled]{ opacity:.35; cursor:default; }
.s-bord .tb-setter{ display:flex; align-items:center; gap:var(--sp-2, 8px); }
.s-bord .tb-setter select{ min-height:36px; max-width:100%; }
.s-bord .tb-lu{ margin-left:auto; font-size:var(--fs-13, 13px); }

/* ---- groupes et tuiles ---- */
.s-bord .tb-grille{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:var(--sp-4, 16px); }
.s-bord .tb-groupe{ display:flex; flex-direction:column; gap:var(--sp-3, 12px); padding:var(--sp-4, 16px) var(--sp-5, 20px);
  min-width:0; }
.s-bord .tb-titre{ margin:0; font-size:var(--fs-16, 16px); font-weight:var(--fw-fort, 600); }
.s-bord .tb-tuiles{ display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:var(--sp-3, 12px) var(--sp-4, 16px); }
.s-bord .tb-tuile{ display:flex; flex-direction:column; gap:2px; padding-top:var(--sp-2, 8px);
  border-top:1px solid var(--rule-soft); min-width:0; }
.s-bord .tb-nom{ font-size:var(--fs-13, 13px); color:var(--ink-soft); }
.s-bord .tb-valeur{ font-size:var(--fs-24, 24px); font-weight:var(--fw-fort, 600); line-height:1.25;
  font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.s-bord .tb-detail{ font-size:var(--fs-12, 12px); color:var(--ink-soft); line-height:1.35; }
.s-bord .tb-liste{ list-style:none; padding:0; display:flex; flex-direction:column; gap:2px; font-size:var(--fs-13, 13px); }
.s-bord .tb-liste li{ display:flex; justify-content:space-between; gap:var(--sp-3, 12px); }
.s-bord .tb-liste b{ font-weight:var(--fw-fort, 600); font-variant-numeric:tabular-nums; }

/* ---- tableau par setter ---- */
.s-bord .tb-zone{ overflow-x:auto; }
.s-bord .tb-tableau{ width:100%; border-collapse:separate; border-spacing:0; }
.s-bord .tb-tableau th{ height:36px; padding:0 var(--sp-3, 12px); text-align:left; white-space:nowrap;
  font:var(--fw-moyen, 500) var(--fs-12, 12px)/1 var(--font); color:var(--ink-soft);
  background:var(--surface-2, #f2f4f6); border-bottom:1px solid var(--rule); }
.s-bord .tb-tableau td{ height:44px; padding:0 var(--sp-3, 12px); border-bottom:1px solid var(--rule-soft);
  font-size:var(--fs-14, 14px); white-space:nowrap; }
.s-bord .tb-tableau tbody tr:last-child td{ border-bottom:0; }
.s-bord .tb-tableau .tb-num{ text-align:right; font-variant-numeric:tabular-nums; }

/* ---- ce que la base ne sait pas ---- */
.s-bord .tb-absents{ display:flex; flex-wrap:wrap; gap:var(--sp-2, 8px); list-style:none; padding:0; }
.s-bord .tb-absents li{ padding:4px 10px; border-radius:6px; background:var(--surface-2, #f2f4f6);
  font-size:var(--fs-13, 13px); color:var(--ink-soft); }

/* Téléphone : une colonne, rien ne déborde */
@media (max-width:899px){
  .s-bord .tb-grille{ grid-template-columns:minmax(0, 1fr); }
  .s-bord .tb-lu{ margin-left:0; }
  .s-bord .tb-libelle{ white-space:normal; }
}
