/*
 * css/views/fleet-reports.css — Reportes por flota (Control y checklist Silver/Gold) y calendario multi-capa.
 *
 * 12-oct, fase 3 del kit de estilo: extraído del <style> de index.html (mismas reglas). El orden
 * de carga (index.html) es base -> components -> views; la verificación comparó los estilos
 * calculados de toda la página antes y después.
 */

/* Migration Status: tabla Postgres-vs-Bronze + calendario multi-capa */
.ms-summary { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; margin-bottom: 18px; }
.ms-pct-hero { font-family: var(--font-mono); font-variant-numeric: tabular-nums; font-size: 2.1rem; font-weight: 700; color: var(--lc); }
.ms-pct-hero .unit { font-size: 1.1rem; font-weight: 600; margin-left: 2px; }
.ms-sub { color: var(--text-dim); font-size: 0.78rem; }
.ms-table-wrap { overflow-x: auto; margin-bottom: 22px; }
.ms-table { width: 100%; border-collapse: collapse; font-size: 0.82rem; }
.ms-table th, .ms-table td { padding: 7px 12px; border-top: 1px solid var(--border); text-align: right; white-space: nowrap; }
.ms-table th { text-align: right; color: var(--text-dim); font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.03em; font-weight: 600; }
.ms-table th:first-child, .ms-table td:first-child { text-align: left; font-family: var(--font-mono); font-weight: 600; }
.ms-table tr:first-child td { border-top: none; }
.ms-table td.ms-pct { min-width: 130px; }
.ms-table tr.ms-total td { border-top: 2px solid var(--border); font-weight: 700; }
.ms-bar-wrap { display: flex; align-items: center; gap: 8px; justify-content: flex-end; }
.ms-bar-track { position: relative; width: 70px; height: 7px; border-radius: 4px; background: var(--surface-2); overflow: hidden; }
.ms-bar-fill { position: absolute; inset: 0; width: 0%; background: var(--ok); border-radius: 4px; }
.ms-bar-fill.warn { background: var(--gold); }
.ms-bar-fill.bad { background: var(--err); }
.ms-asof { color: var(--text-dim); font-size: 0.76rem; }
.ms-refresh-note { color: var(--text-dim); font-size: 0.76rem; margin-top: 4px; }
/* calendario multi-capa: mismo cal-months/cal-grid/cal-wd que el popup de 1 capa,
   pero cada celda lleva 3 barritas (bronze/silver/gold) en vez de 1 color plano */
.mcal-cell { aspect-ratio: 1; border-radius: 3px; background: var(--surface-2); display: flex; align-items: flex-end; justify-content: center; gap: 1.5px; padding: 1px; }
.mcal-cell.pad { background: transparent; }
.mcal-bar { width: 24%; min-height: 1px; border-radius: 1px 1px 0 0; background: var(--surface); align-self: flex-end; }
.mcal-bar.bronze { background: var(--bronze); }
.mcal-bar.silver { background: var(--silver); }
.mcal-bar.gold { background: var(--gold); }
.mcal-cell[title] { cursor: default; }
.mcal-legend { display: flex; align-items: center; gap: 14px; margin-top: 16px; color: var(--text-dim); font-size: 0.75rem; }
.mcal-legend .sw { display: inline-flex; align-items: center; gap: 5px; }
.mcal-legend .sw i { width: 10px; height: 10px; border-radius: 2px; display: inline-block; }
.mcal-legend .sw.bronze i { background: var(--bronze); }
.mcal-legend .sw.silver i { background: var(--silver); }
.mcal-legend .sw.gold i { background: var(--gold); }
.ms-tog { background: none; border: 0; padding: 0; font: inherit; color: inherit; cursor: pointer; font-weight: 600; }
.ms-tog:hover { color: var(--accent); }
.ms-tog:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.ms-table tr.ms-day-row td { font-size: 0.85em; background: color-mix(in srgb, var(--accent) 4%, transparent); }
.ms-table tr.ms-day-row td:first-child { padding-left: 18px; }
/* 5-oct: día que no había terminado / no había pasado por la cadena al medir */
.ms-table tr.ms-day-open td:not(:first-child) { opacity: 0.55; }
.ms-open-tag { display: inline-block; margin-left: 6px; padding: 0 6px; border-radius: 8px; font-size: 0.75rem;
  background: var(--accent-dim); color: var(--accent); vertical-align: 1px; }
.ms-table tr.ms-unit-row td { font-size: 0.8em; color: var(--text-dim); }
.ms-table tr.ms-unit-row td:first-child { padding-left: 48px; font-weight: 400; }
/* 7-oct: nivel flota (mes -> día -> flota -> unidad) y selector de flotas por pestaña */
.ms-table tr.ms-fleet-row td { font-size: 0.83em; }
.ms-table tr.ms-fleet-row td:first-child { padding-left: 32px; }
.fc-when { color: var(--text-dim); font-size: 0.75rem; font-weight: 400; font-family: inherit; }
.fc-wtag { display: inline-block; margin-left: 4px; padding: 0 6px; border-radius: 8px; font-size: 0.75rem;
  background: var(--gold-bg); color: var(--gold); font-family: inherit; font-weight: 600; }
.ms-detail-note { font-size: 0.78rem; color: var(--text-dim); text-align: left !important; font-family: inherit !important; font-weight: 400 !important; }
.ms-detail-refresh { margin-left: 10px; padding: 2px 8px; font-size: 0.75rem; }