/* La vue d'ensemble de la boîte de BC Clients : la phrase de Mia Insights, le dessin des semaines, le
   tableau (ecTable). Les jetons sont ceux de Vision (assets/style.css). */
.scl-charge-dit { margin:0 0 12px; font-size:13px; color:var(--ink-soft); }

/* Le dessin : une barre par semaine, un seul axe, des repères discrets. */
.scl-ch { margin:0 0 16px; padding:14px 16px 10px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); }
.scl-ch-tete { display:flex; flex-wrap:wrap; align-items:baseline; justify-content:space-between; gap:4px 14px; font-size:13px; color:var(--ink); }
.scl-ch-leg { display:inline-flex; align-items:center; gap:6px; font-size:12px; color:var(--muted); }
.scl-ch-leg i { display:inline-block; width:10px; height:10px; border-radius:3px; }
.scl-ch-leg i + i { margin-left:6px; }
.scl-ch-leg i.recue, .scl-ch-b.recue { background:var(--primary); }
.scl-ch-leg i.attendue, .scl-ch-b.attendue { background:color-mix(in srgb, var(--primary) 34%, var(--surface)); }
.scl-ch-zone { position:relative; height:150px; margin:22px 0 0 30px; border-bottom:1px solid var(--line); }
.scl-ch-ligne { position:absolute; left:0; right:0; border-top:1px dashed var(--line-soft); }
.scl-ch-ligne span { position:absolute; left:-30px; top:-8px; width:26px; text-align:right; font-size:10.5px; color:var(--muted); font-variant-numeric:tabular-nums; }
.scl-ch-barres { position:absolute; inset:0; display:flex; align-items:flex-end; gap:2px; }
.scl-ch-b { position:relative; flex:1 1 0; min-width:0; border-radius:4px 4px 0 0; }
.scl-ch-b.cour, .scl-ch-leg i.cour { box-shadow:0 0 0 2px var(--surface), 0 0 0 3px var(--primary); }
.scl-ch-leg i.cour { margin-left:10px; }
.scl-ch-val { position:absolute; left:50%; bottom:100%; transform:translate(-50%, -3px); font-size:11px; font-weight:700; color:var(--ink); white-space:nowrap; }
.scl-ch-mois { display:flex; gap:2px; margin:4px 0 0 30px; }
.scl-ch-mois span { flex:1 1 0; min-width:0; font-size:10.5px; color:var(--muted); white-space:nowrap; overflow:visible; }
.scl-ch-mois b { color:var(--ink); font-weight:600; }

/* Le tableau : chaque nom de colonne tient sur une ligne, la flèche du tri contre lui (le tableau
   commun laisse passer les noms à la ligne au-delà de 1000 px : ici, la place y est). */
@media (min-width:1001px){ .scl-charge .ec-table th { white-space:nowrap; } }

@media (max-width:640px){
  /* L'onglet « Vue d'ensemble » ne garde que son dessin : « À orienter » et « Historique » tiennent à côté. */
  .liste-taches .scl-ong .scl-ong-mot { display:none; }
  .scl-ch { padding:12px 10px 8px; }
  .scl-ch-zone { height:120px; }
  .scl-ch-mois span { font-size:9.5px; }
}
