/* Oqora CRM · styles de la section Mes chiffres (lot K, spécification C.9).
   Toutes les règles sont préfixées par la classe racine de la section (.s-chiffres) ; aucun jeton :root ici (ceux de
   crm.css, lot 0). Barre de période reprise de l'outil clientes (onglets, flèches, dates libres). Téléphone
   (< 640 px) : une colonne, boutons de 44 px, aucun défilement horizontal. */
.s-chiffres{ display:block; }
.s-chiffres .sc{ display:flex; flex-direction:column; gap:var(--sp-5); max-width:1080px; min-width:0; }
.s-chiffres .sc-chargement{ padding:var(--sp-6); }
.s-chiffres .sc-erreur{ display:flex; flex-direction:column; align-items:flex-start; gap:var(--sp-3); padding:var(--sp-5); }

/* ---- barre de période ---- */
.s-chiffres .sc-barre{ display:flex; flex-direction:column; gap:var(--sp-3); padding:var(--sp-4) var(--sp-5); min-width:0; }
.s-chiffres .sc-modes{ display:inline-flex; flex-wrap:wrap; gap:var(--sp-1); padding:var(--sp-1); align-self:flex-start;
  border-radius:var(--r-full); background:var(--bande); box-shadow:inset 0 0 0 1px var(--rule-soft); max-width:100%; }
.s-chiffres .sc-mode{ min-height:36px; padding:0 var(--sp-4); border:0; border-radius:var(--r-full); background:transparent;
  color:var(--ink-soft); font:inherit; font-weight:600; cursor:pointer; white-space:nowrap; }
.s-chiffres .sc-mode:hover{ color:var(--bleu); }
.s-chiffres .sc-mode--actif{ background:var(--surface); color:var(--ink); box-shadow:var(--sh-1); }
.s-chiffres .sc-mode:focus-visible, .s-chiffres .sc-fleche:focus-visible{ outline:2px solid var(--bleu-ring); outline-offset:2px; }
.s-chiffres .sc-nav{ display:flex; align-items:center; flex-wrap:wrap; gap:var(--sp-2); min-width:0; }
.s-chiffres .sc-libelle{ display:flex; align-items:center; gap:var(--sp-2); flex-wrap:wrap; min-width:0;
  font-size:var(--fs-md); }
.s-chiffres .sc-libelle b{ font-weight:700; }
.s-chiffres .sc-fleche{ min-width:36px; justify-content:center; }
.s-chiffres .sc-fleche[disabled]{ opacity:.35; cursor:default; }
.s-chiffres .sc-libre{ display:flex; align-items:flex-end; flex-wrap:wrap; gap:var(--sp-3); }
.s-chiffres .sc-date{ display:flex; align-items:center; gap:var(--sp-2); color:var(--ink-soft); font-weight:600; }
.s-chiffres .sc-date input{ min-height:36px; cursor:pointer; max-width:100%; }
.s-chiffres .sc-filtres{ display:flex; align-items:center; flex-wrap:wrap; gap:var(--sp-3) var(--sp-5); }
.s-chiffres .sc-personne{ display:flex; align-items:center; gap:var(--sp-2); }
.s-chiffres .sc-personne select{ min-height:36px; max-width:100%; }
.s-chiffres .sc-anciens{ display:inline-flex; align-items:center; gap:var(--sp-2); cursor:pointer; font-weight:600; }
.s-chiffres .sc-anciens input{ width:18px; height:18px; margin:0; accent-color:var(--bleu); cursor:pointer; }
.s-chiffres .sc-note{ font-size:var(--fs-sm); }

/* ---- les chiffres ---- */
.s-chiffres .sc-corps{ display:flex; flex-direction:column; gap:var(--sp-5); min-width:0; }
.s-chiffres .sc-vide{ margin:0; }
.s-chiffres .sc-grille{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:var(--sp-4); }
.s-chiffres .sc-bloc{ display:flex; flex-direction:column; gap:var(--sp-3); padding:var(--sp-5); min-width:0; }
.s-chiffres .sc-bloc h2{ font-size:var(--fs-lg); font-weight:750; }
.s-chiffres .sc-aide{ font-size:var(--fs-sm); margin-top:calc(-1 * var(--sp-2)); }
.s-chiffres .sc-appels{ grid-column:1 / -1; border-top:3px solid var(--bleu); }
.s-chiffres .sc-rdv{ border-top:3px solid var(--teal); }
.s-chiffres .sc-visios{ border-top:3px solid var(--violet); }
.s-chiffres .sc-ventes{ grid-column:1 / -1; border-top:3px solid var(--vert); }
.s-chiffres .sc-stats{ display:grid; grid-template-columns:repeat(auto-fit, minmax(120px, 1fr)); gap:var(--sp-3); }
.s-chiffres .sc-stat{ display:flex; flex-direction:column; gap:var(--sp-1); padding:var(--sp-3) var(--sp-4);
  border-radius:var(--r-sm); background:var(--bande); min-width:0; }
.s-chiffres .sc-valeur{ font-size:var(--fs-2xl); font-weight:750; line-height:1.1; color:var(--ink);
  overflow-wrap:anywhere; }
.s-chiffres .sc-stat--grande .sc-valeur{ font-size:var(--fs-stat); }
.s-chiffres .sc-nom{ font-size:var(--fs-sm); color:var(--ink-soft); font-weight:600; }

/* ---- d'une étape à l'autre ---- */
.s-chiffres .sc-taux-liste{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:var(--sp-3); }
.s-chiffres .sc-taux-ligne{ display:grid; grid-template-columns:minmax(0, 1.4fr) minmax(80px, 1fr) 132px; align-items:center;
  gap:var(--sp-3); }
.s-chiffres .sc-taux-nom{ color:var(--ink-soft); font-weight:600; min-width:0; }
.s-chiffres .sc-jauge{ display:block; height:8px; border-radius:var(--r-full); background:var(--rule-soft); overflow:hidden; }
.s-chiffres .sc-jauge-plein{ display:block; height:100%; width:0; border-radius:var(--r-full); background:var(--bleu);
  transition:width .3s var(--ease); }
.s-chiffres .sc-taux-pct{ min-width:56px; text-align:right; font-variant-numeric:tabular-nums; }
.s-chiffres .sc-taux-pct.muted{ font-weight:500; font-size:var(--fs-sm); }

/* ---- téléphone ---- */
@media (max-width: 899px){
  .s-chiffres .sc-grille{ grid-template-columns:minmax(0, 1fr); }
}
@media (max-width: 639px){
  .s-chiffres .sc-barre{ padding:var(--sp-4); }
  .s-chiffres .sc-modes{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); width:100%; border-radius:var(--r-md); }
  .s-chiffres .sc-mode{ min-height:var(--tap); border-radius:var(--r-sm); }
  .s-chiffres .sc-nav .btn, .s-chiffres .sc-libre .btn{ min-height:var(--tap); }
  .s-chiffres .sc-fleche{ min-width:var(--tap); }
  .s-chiffres .sc-libelle{ flex:1 1 0; justify-content:center; text-align:center; }
  .s-chiffres .sc-nav [data-bouton="chiffres.actuelle"]{ width:100%; justify-content:center; }
  .s-chiffres .sc-libre{ flex-direction:column; align-items:stretch; }
  .s-chiffres .sc-date{ justify-content:space-between; }
  .s-chiffres .sc-date input, .s-chiffres .sc-personne select{ min-height:var(--tap); }
  .s-chiffres .sc-personne{ width:100%; }
  .s-chiffres .sc-personne select{ flex:1 1 auto; }
  .s-chiffres .sc-anciens{ min-height:var(--tap); }
  .s-chiffres .sc-stats{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .s-chiffres .sc-taux-ligne{ grid-template-columns:minmax(0, 1fr) auto; }
  .s-chiffres .sc-jauge{ grid-column:1 / -1; grid-row:2; }
}