/* ═══════════════════════════════════════
   ▓ COMPONENTE · TiraDias — gemelo vanilla ▓
   v1.0 · 2026-10-28. Ficha: `design-system/COMPONENTE_TIRA_DIAS.md`
   Kit: `catalogo-cd/components/TiraDias.jsx`

   Una fila de cuadritos, uno por día hábil, que dice de un vistazo qué días están cubiertos. Cada
   cuadrito lleva el número del día; el estado lo dice el color Y el texto del globo y de la lectura
   (el color nunca es la única señal).

   `DECISION-FUENTE: Ricardo, 2026-10-28 — «Puntos 8 y 9 se descartan. lo demas se acepta. El punto 8 no solo se descarta del catálogo, sino que es una idea que se descarta totalmente del diseño final que llegara a prod.»` (cosecha del invento 1 de la carga de bancos).

   REQUISITOS DEL ANFITRIÓN: los tokens del canon (`colors_and_type.css`) y `box-sizing: border-box`.
   ═══════════════════════════════════════ */

.exds-tira { display: inline-flex; gap: var(--space-0-5, 2px); flex-wrap: nowrap; vertical-align: middle; font-family: var(--font-sans, "Inter", -apple-system, "system-ui", sans-serif); }
.exds-tira-d {
  box-sizing: border-box;
  width: calc(var(--space-6, 24px) + var(--space-0-5, 2px));
  height: var(--space-6, 24px);
  border-radius: var(--radius-sm, 6px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: var(--fs-eyebrow, 11px);
  font-weight: var(--fw-medium, 500);
  font-variant-numeric: tabular-nums;
  border: 1px solid transparent;
}
/* cubierto = terminó bien, nadie da otro paso: verde */
.exds-tira-d[data-e="c"] { background: var(--color-success-tint); color: var(--color-success-deep); border-color: var(--color-success-stroke); }
/* falta = lo hace una persona de Exante: ámbar */
.exds-tira-d[data-e="f"] { background: var(--color-warning-tint); color: var(--color-warning-deep); border-color: var(--color-warning-stroke); }
/* descuadre = problema: rojo; y, con grave, un día que falta ya es problema: rojo */
.exds-tira-d[data-e="d"],
.exds-tira[data-grave="si"] .exds-tira-d[data-e="f"] { background: var(--color-error-tint); color: var(--color-error-deep); border-color: var(--color-error-stroke); }
/* hoy = informa, todavía no cuenta: punteado, sin color */
.exds-tira-d[data-e="h"] { background: var(--color-surface); color: var(--fg3); border: 1px dashed var(--color-border-control); }