/* KPI Finanzas · analisis de costos.
 *
 * Todo acotado a .mod-kpi-finanzas. Los CSS de los modulos se cargan TODOS
 * siempre: sin el prefijo, este archivo le cambiaria las tablas a Despacho.
 *
 * Monocromo, como el resto de la casa. El original del KPI Institute usa verde
 * de acento; aqui el color se reserva a lo que esta mal (--alarma), que es la
 * regla de tokens.css. Un tablero donde todo tiene color no distingue nada.
 */

.mod-kpi-finanzas{max-width:1180px}
.mod-kpi-finanzas h4{
  font-size:clamp(11px,.78vw,13px);font-weight:600;text-transform:uppercase;
  letter-spacing:.08em;margin:22px 0 8px;padding-bottom:5px;
  border-bottom:1px solid var(--ink);
}
.mod-kpi-finanzas .nota{font-size:13px;color:var(--meta);margin-top:10px;max-width:70ch}
.mod-kpi-finanzas .intro{font-size:14px;margin:14px 0 4px;max-width:88ch}
.mod-kpi-finanzas .vacio{color:var(--meta);margin-top:24px}

/* ---- tramos de confianza ---- */
.mod-kpi-finanzas .tramos{display:flex;gap:14px;flex-wrap:wrap;margin-top:18px}
.mod-kpi-finanzas .tramo{flex:1 1 230px;border-top:2px solid var(--ink);padding-top:8px}
.mod-kpi-finanzas .tramo p{font-size:12.5px;margin-top:4px}
.mod-kpi-finanzas .tramo.t-reconstruido,
.mod-kpi-finanzas .tramo.t-incompleto{border-top-style:dashed}
.mod-kpi-finanzas .tramo.t-confiable{border-top-color:var(--ink)}
.mod-kpi-finanzas .guardas li{margin-bottom:7px}

/* ---- scorecard ---- */
.mod-kpi-finanzas table.sc{width:100%;border-collapse:collapse;margin-top:16px;font-size:13px}
.mod-kpi-finanzas table.sc th{
  text-align:left;font-weight:500;font-size:11px;text-transform:uppercase;
  letter-spacing:.07em;color:var(--meta);border-bottom:1px solid var(--ink);
  padding:0 10px 7px 0;vertical-align:bottom;
}
.mod-kpi-finanzas table.sc td{padding:7px 10px 7px 0;border-bottom:1px solid var(--rule);vertical-align:top}
.mod-kpi-finanzas table.sc td.n{color:var(--meta);width:26px}
.mod-kpi-finanzas table.sc td.kn{font-weight:500}
.mod-kpi-finanzas table.sc td.act{font-weight:600}
.mod-kpi-finanzas table.sc td.tr{font-size:15px;text-align:center}
.mod-kpi-finanzas table.sc td.num,
.mod-kpi-finanzas table.sc th{font-variant-numeric:tabular-nums}
.mod-kpi-finanzas table.sc tr.e-nd td{color:var(--meta)}
.mod-kpi-finanzas .ojo{color:var(--meta);font-weight:400;cursor:help}

.mod-kpi-finanzas .et{
  font-size:10px;text-transform:uppercase;letter-spacing:.08em;
  border:1px solid var(--rule);padding:1px 6px;white-space:nowrap;
}
.mod-kpi-finanzas .et.vi{border-color:var(--ink)}
.mod-kpi-finanzas .et.pa{border-style:dashed;border-color:var(--ink)}
.mod-kpi-finanzas .et.nd{color:var(--meta)}

/* ---- ficha ---- */
.mod-kpi-finanzas .kpi{
  margin-top:34px;padding-top:18px;border-top:2px solid var(--ink);
  scroll-margin-top:70px;
}
.mod-kpi-finanzas .kpi.e-nd{border-top-style:dashed;border-top-width:1px}
.mod-kpi-finanzas .kh{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.mod-kpi-finanzas .kno{
  font-size:11px;text-transform:uppercase;letter-spacing:.09em;
  background:var(--ink);color:var(--paper);padding:3px 9px;
}
.mod-kpi-finanzas .kh h3{font-size:clamp(15px,1.25vw,20px);font-weight:600;flex:1 1 auto}
.mod-kpi-finanzas .kval{font-size:clamp(17px,1.5vw,24px);font-weight:600;white-space:nowrap}
.mod-kpi-finanzas .kpi.e-nd .kval{color:var(--meta);font-weight:400}

.mod-kpi-finanzas .kmeta{
  display:flex;gap:22px;flex-wrap:wrap;margin-top:10px;
  font-size:12px;color:var(--meta);
}
.mod-kpi-finanzas .kmeta i{display:block;margin-bottom:1px}

.mod-kpi-finanzas .salvedad{
  margin-top:12px;padding:9px 12px;border-left:3px solid var(--ink);
  background:#fafafa;font-size:13px;max-width:92ch;
}
.mod-kpi-finanzas .ndbox{
  margin-top:12px;padding:10px 12px;border:1px dashed var(--ink);font-size:13px;max-width:92ch;
}
.mod-kpi-finanzas .ndbox .desb{margin-top:7px}
.mod-kpi-finanzas .ndbox .lbl{display:block}

.mod-kpi-finanzas .cols{display:flex;gap:clamp(18px,2.6vw,42px);flex-wrap:wrap}
.mod-kpi-finanzas .col{flex:1 1 340px;min-width:0}
.mod-kpi-finanzas dl{margin:0}
.mod-kpi-finanzas dt{
  font-size:11px;text-transform:uppercase;letter-spacing:.07em;
  color:var(--meta);margin-top:11px;
}
.mod-kpi-finanzas dd{font-size:13.5px;margin-top:2px}
.mod-kpi-finanzas dd.form{font-variant-numeric:tabular-nums;font-weight:500}
.mod-kpi-finanzas .sub{font-size:13px}
.mod-kpi-finanzas ul.li{list-style:none;padding:0}
.mod-kpi-finanzas ul.li li{font-size:13px;padding-left:14px;position:relative;margin-bottom:4px}
.mod-kpi-finanzas ul.li li::before{content:"·";position:absolute;left:4px;color:var(--meta)}
.mod-kpi-finanzas a{color:inherit}

.mod-kpi-finanzas table.comp{width:100%;border-collapse:collapse;font-size:13px;margin-top:6px}
.mod-kpi-finanzas table.comp td{padding:5px 10px 5px 0;border-bottom:1px solid var(--rule);vertical-align:top}
.mod-kpi-finanzas table.comp td.l{font-weight:600;width:22px}
.mod-kpi-finanzas table.comp td.num{font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}

/* ---- dashboard ---- */
.mod-kpi-finanzas .dash{display:flex;gap:clamp(18px,2.6vw,42px);flex-wrap:wrap;margin-top:12px}
.mod-kpi-finanzas .barras{flex:1 1 320px;min-width:0}
.mod-kpi-finanzas .barra{display:flex;align-items:center;gap:10px;margin-bottom:4px;font-size:12px}
.mod-kpi-finanzas .barra .bm{width:46px;color:var(--meta);flex:none}
.mod-kpi-finanzas .barra .bt{flex:1 1 auto;min-width:0;background:#f2f2f2;height:16px;display:block}
.mod-kpi-finanzas .barra .bt i{display:block;height:100%;background:var(--ink)}
.mod-kpi-finanzas .barra.flojo .bt i{background:#b9b9b9}
.mod-kpi-finanzas .barra.fuera .bt i{background:repeating-linear-gradient(90deg,#c9c9c9 0 3px,transparent 3px 6px)}
.mod-kpi-finanzas .barra .bv{width:96px;text-align:right;flex:none;font-variant-numeric:tabular-nums}
.mod-kpi-finanzas .linea{flex:1 1 360px;min-width:0;max-width:600px;color:var(--ink)}
.mod-kpi-finanzas .linea .pv{font-size:9px;fill:var(--meta)}
.mod-kpi-finanzas .linea .px{font-size:9px;fill:var(--meta)}

@media (max-width:720px){
  .mod-kpi-finanzas table.sc th:nth-child(3),
  .mod-kpi-finanzas table.sc td.ref,
  .mod-kpi-finanzas table.sc th:nth-child(4),
  .mod-kpi-finanzas table.sc td.fr{display:none}
  .mod-kpi-finanzas .barra .bv{width:78px}
}
