/* Presupuesto anual · Seguimiento (rediseño 2026-10-25).
   Cada cifra dice si es real, parcial o estimada. Clases nuevas con prefijo
   .budget-; reutiliza finance-coverage-banner/chip, finance-flag y
   management-kpi-label. Va después de app.css y corrige dos contrastes de allí. */

/* «Borrador» sobre el fondo de la página: el ámbar de las pastillas (4,44:1 sobre --bg) no llega a 4,5:1; oscurecido, supera 6:1. */
.budget-status[data-status="draft"] strong{color:color-mix(in srgb,var(--amber) 78%,black)}

/* Foco visible (auditoría 03/11/2026): el control segmentado recorta el anillo exterior, que aquí va dentro; la tabla desplazable se puede enfocar con el teclado. */
.budget-toolbar .segmented>button:focus-visible{position:relative;z-index:1;outline-offset:-3px}
.budget-matrix-wrap:focus-visible,.budget-sheet .finance-table-wrap:focus-visible{outline:3px solid var(--blue-dark);outline-offset:2px}
.budget-table input:focus-visible{position:relative;z-index:2}

.budget-reading{margin:0 0 12px;padding:12px 16px;border:1px solid var(--line);border-left:4px solid var(--blue-dark);border-radius:var(--radius);background:var(--surface)}
.budget-reading p{margin:0;font-size:15px;font-weight:800;line-height:1.4;color:var(--text)}
.budget-reading ul{margin:6px 0 0;padding-left:18px;font-size:13px;color:var(--muted);line-height:1.45}
.budget-reading li{margin:2px 0}

.budget-tracking .budget-scope{margin:0 0 4px}
.budget-tracking .finance-coverage-banner{margin:8px 0 12px}

/* Barra de meses: estado con símbolo y texto, no solo color. */
.budget-monthbar-wrap{display:grid;gap:6px;margin:0 0 14px}
.budget-monthbar{display:flex;flex-wrap:wrap;gap:4px;margin:0;padding:0;list-style:none}
.budget-monthbar li,.budget-legend li{display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:999px;border:1px solid transparent;font-size:11.5px;font-weight:700;line-height:1.3}
.budget-monthbar li b{font-weight:800}
.budget-monthbar [data-status="closed"],.budget-legend [data-status="closed"]{background:var(--soft);color:var(--blue-dark)}
.budget-monthbar [data-status="sales_only"],.budget-legend [data-status="sales_only"]{background:var(--info-soft);color:var(--info)}
.budget-monthbar [data-status="partial"],.budget-legend [data-status="partial"]{background:var(--amber-soft);color:var(--amber)}
.budget-monthbar [data-status="future"],.budget-legend [data-status="future"]{background:var(--surface);border-color:var(--line);color:var(--muted)}
.budget-legend{display:flex;flex-wrap:wrap;gap:4px 8px;margin:0;padding:0;list-style:none}
.budget-legend li{font-weight:600}

/* Tarjetas */
.budget-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;margin:0 0 16px}
.budget-card{display:grid;align-content:start;gap:3px;padding:12px 14px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);min-width:0}
.budget-card header{margin:0 0 2px;align-items:flex-start}
.budget-card header{flex-wrap:wrap}
.budget-card header .finance-coverage-chip,.budget-card header .finance-flag{max-width:100%;white-space:normal}
.budget-card-caption{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)}
.budget-card strong{font-size:21px;line-height:1.2;font-variant-numeric:tabular-nums;color:var(--text);overflow-wrap:anywhere}
.budget-card>span,.budget-card>small{font-size:12.5px;color:var(--muted);overflow-wrap:anywhere}
.budget-card .budget-card-variance{font-weight:700;color:var(--text)}
.budget-card[data-tone="negative"]{border-left:4px solid var(--red)}
.budget-card[data-tone="negative"] .budget-card-variance{color:var(--red)}
.budget-card[data-tone="positive"]{border-left:4px solid var(--green)}
.budget-card[data-tone="positive"] .budget-card-variance{color:var(--green)}
.budget-card[data-kind="off"]{background:var(--foot)}
.budget-card .budget-card-off{font-size:17px;color:var(--muted)}
.budget-card[data-kind="estimate"]{border-style:dashed}
.budget-estimate{font-style:italic}

/* Revisa el presupuesto */
.budget-checks{margin:0 0 16px;padding:12px 16px}
.budget-checks h3{margin:0 0 6px;font-size:14px}
.budget-checks h3 small{display:block;margin-top:2px;font-size:12px;font-weight:500;color:var(--muted)}
.budget-checks ul{margin:0;padding-left:18px;font-size:13px;line-height:1.45}
.budget-checks li{margin:4px 0}
.budget-checks p{margin:8px 0 0}
.budget-checks .link-button{padding:0;border:0;background:none;color:var(--blue-dark);font:inherit;font-weight:700;text-decoration:underline;cursor:pointer}

/* Desviaciones */
.budget-deviations{margin:0 0 18px;padding:12px 16px;border:1px solid var(--line);border-left:4px solid var(--red);border-radius:0 var(--radius) var(--radius) 0;background:var(--surface)}
.budget-deviations[data-empty="true"]{border-left-color:var(--green)}
.budget-deviations h3{margin:0 0 8px;font-size:14px}
.budget-deviations h3 small{display:block;margin-top:2px;font-size:11.5px;font-weight:500;color:var(--muted)}
.budget-deviations p{margin:0;font-size:13px}
.budget-deviations ol{display:grid;gap:8px;margin:0;padding:0;list-style:none;counter-reset:deviation}
.budget-deviations li{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;padding:8px 0;border-top:1px solid var(--line-inner);font-size:13px;counter-increment:deviation}
.budget-deviations li:first-child{border-top:0;padding-top:0}
.budget-deviations li>div{display:grid;gap:2px;min-width:0}
.budget-deviations .budget-deviation-title{margin:0}
.budget-deviations li b{color:var(--red)}
.budget-deviations li span{color:var(--muted);overflow-wrap:anywhere}

/* Tablas */
/* Los textos ocultos de las celdas no deben escaparse del desplazamiento de la tabla. */
.budget-tracking .finance-table-wrap{position:relative}
.budget-track td[data-label="Meses"] .finance-coverage-chip{white-space:nowrap}
.budget-track .budget-note{white-space:normal}
.budget-track tr[data-kind="off"] td{color:var(--muted)}
.budget-matrix-wrap{max-width:100%}
.budget-matrix{font-size:12.5px}
.budget-matrix th,.budget-matrix td{white-space:nowrap}
.budget-matrix thead th small{display:block;font-size:11px;font-weight:500;color:var(--muted)}
.budget-matrix th:first-child{position:sticky;left:0;z-index:2;width:170px;min-width:170px;max-width:170px;white-space:normal;background:var(--surface)}
.budget-matrix thead th:first-child{background:var(--thead)}
.budget-matrix .budget-matrix-ytd{position:sticky;left:170px;z-index:1;min-width:120px;background:var(--thead);border-right:2px solid var(--line)}
.budget-cell{text-align:right;font-variant-numeric:tabular-nums;vertical-align:top}
.budget-cell span{display:block;font-weight:700}
.budget-cell small{display:block;font-size:11px;color:var(--muted);white-space:nowrap}
.budget-cell[data-tone="negative"] span{color:var(--red)}
.budget-cell[data-tone="positive"] span{color:var(--green)}
.budget-cell[data-comparable="false"]{background:repeating-linear-gradient(135deg,var(--surface) 0 6px,var(--line-inner) 6px 8px)}
.budget-cell[data-comparable="false"] span{font-weight:600;color:var(--muted)}
.budget-cell[data-future="true"]{background:var(--surface)}
.budget-matrix-total th,.budget-matrix-total td{border-top:2px solid var(--line);font-weight:800}

.budget-notes-fold{margin:8px 0 0;font-size:12.5px;color:var(--muted)}
.budget-notes-fold summary{cursor:pointer;font-weight:700;color:var(--text)}

@media (max-width:640px){
  .budget-reading{padding:10px 12px}
  .budget-reading p{font-size:14px}
  .budget-cards{grid-template-columns:1fr 1fr}
  .budget-card-wide{grid-column:1/-1}
  .budget-card strong{font-size:18px}
  .budget-scope label,.budget-scope select{width:100%}
  .budget-monthbar{display:grid;grid-template-columns:repeat(6,1fr)}
  .budget-monthbar li{justify-content:center;padding:4px 2px}
  .budget-deviations li{flex-direction:column}
  .budget-deviations li .button{align-self:stretch}
  .budget-matrix th:first-child{width:118px;min-width:118px;max-width:118px}
  .budget-matrix .budget-matrix-ytd{left:118px;min-width:124px}
  /* Tabla de conceptos en filas-tarjeta: concepto arriba; previsto, real y desviación debajo. */
  .budget-track thead{display:none}
  .budget-track,.budget-track tbody{display:block}
  .budget-track tr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px 8px;padding:8px 10px;border-bottom:1px solid var(--line-inner)}
  .budget-track tr th[scope="row"]{grid-column:1/-1;position:static;min-width:0;padding:0;background:none}
  .budget-track td{padding:0;border:0;text-align:left;font-size:12.5px;white-space:normal}
  .budget-track td[data-label]::before{content:attr(data-label);display:block;font-size:11px;font-weight:700;color:var(--muted)}
  .budget-track td[colspan]{grid-column:span 2}
  .budget-track td:last-child{grid-column:1/-1}
  .budget-track td:last-child:empty,.budget-track td[data-label="Meses"]:empty{display:none}
  .budget-track td:last-child .button{width:100%;justify-content:center}
}
