/* Concepto: la pantalla habla el mismo idioma que los libros de Excel.
   Encabezado azul oscuro tipo INVIAS, celdas amarillas con letra azul para lo que se digita,
   negro para lo calculado. Una columna en celular; tablas a lo ancho en computador. */
:root {
  --tinta: #1F3864;        /* encabezados (C_OSC del motor) */
  --azul: #2E75B6;         /* secciones (C_MED) */
  --celeste: #DDEBF7;      /* fondos suaves (C_CLA) */
  --celda: #FFF9E5;        /* celda para diligenciar (CELDA_IN) */
  --total: #FFF2CC;        /* fila de total (C_TOT) */
  --dato: #0000FF;         /* dato editable */
  --vinculo: #008000;      /* vínculo / calculado de otra parte */
  --fondo: #F4F6FA;
  --papel: #FFFFFF;
  --texto: #1B2433;
  --suave: #5B6577;
  --linea: #CCD3DF;
  --ok: #1E7B3A;
  --alerta: #9A6400;
  --error: #B42318;
  --alerta-fondo: #FFF4DB;
  --error-fondo: #FDECEA;
  --ok-fondo: #E7F5EC;
  --sombra: 0 1px 2px rgba(31, 56, 100, .08), 0 4px 16px rgba(31, 56, 100, .06);
  --f-titulo: "Archivo", "Arial Narrow", Arial, sans-serif;
  --f-texto: "Source Sans 3", "Segoe UI", Arial, sans-serif;
  --f-codigo: "JetBrains Mono", Consolas, "Courier New", monospace;
  --r: 6px;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --tinta: #16233D; --azul: #6FA8DC; --celeste: #1E2B42; --celda: #2B2716; --total: #3A3216;
    --dato: #8DB4FF; --vinculo: #6FCF8A; --fondo: #0F1520; --papel: #171F2D; --texto: #E6EAF2;
    --suave: #9AA5B8; --linea: #2E3A50; --ok: #6FCF8A; --alerta: #F0B44C; --error: #FF8A80;
    --alerta-fondo: #33290F; --error-fondo: #3A1A18; --ok-fondo: #14301F;
    --sombra: 0 1px 2px rgba(0, 0, 0, .4); color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --tinta: #16233D; --azul: #6FA8DC; --celeste: #1E2B42; --celda: #2B2716; --total: #3A3216;
  --dato: #8DB4FF; --vinculo: #6FCF8A; --fondo: #0F1520; --papel: #171F2D; --texto: #E6EAF2;
  --suave: #9AA5B8; --linea: #2E3A50; --ok: #6FCF8A; --alerta: #F0B44C; --error: #FF8A80;
  --alerta-fondo: #33290F; --error-fondo: #3A1A18; --ok-fondo: #14301F;
  --sombra: 0 1px 2px rgba(0, 0, 0, .4); color-scheme: dark;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--fondo); color: var(--texto);
  font: 16px/1.45 var(--f-texto);
  padding-bottom: env(safe-area-inset-bottom, 0px);
}
body::before {
  content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px);
  z-index: 30; background: var(--tinta);
}
h1, h2, h3 { font-family: var(--f-titulo); text-wrap: balance; margin: 0; line-height: 1.15; }
h1 { font-size: 1.45rem; font-weight: 800; }
h2 { font-size: 1.1rem; font-weight: 700; }
button, input, select { font: inherit; color: inherit; }
:focus-visible { outline: 3px solid var(--azul); outline-offset: 2px; }
.vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
[hidden] { display: none !important; }

/* ---------- barra superior */
.barra {
  position: sticky; top: env(safe-area-inset-top, 0px); z-index: 20;
  background: var(--tinta); color: #fff; box-shadow: 0 2px 8px rgba(0, 0, 0, .15);
}
.barra-in, .pasos, main {
  max-width: 1180px; margin: 0 auto;
  padding-left: max(16px, env(safe-area-inset-left, 0px));
  padding-right: max(16px, env(safe-area-inset-right, 0px));
}
.barra-in { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-block: 10px; }
.marca { display: flex; align-items: center; gap: 10px; min-width: 0; }
.logo { width: 38px; height: 24px; flex-shrink: 0; }
.marca-txt { display: flex; flex-direction: column; min-width: 0; }
.marca-txt strong { font: 800 1.2rem/1.1 var(--f-titulo); letter-spacing: .01em; }
.lema { font: 600 .72rem var(--f-texto); letter-spacing: .08em; text-transform: uppercase; opacity: .7; margin-left: 4px; }
.sub { font-size: .82rem; opacity: .8; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.acciones { position: relative; display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.guardado { font-size: .78rem; opacity: .75; }
.barra .btn-ghost { color: #fff; border-color: rgba(255, 255, 255, .45); }
.menu {
  position: absolute; right: 0; top: calc(100% + 6px); min-width: 270px; max-width: calc(100vw - 32px);
  background: var(--papel); color: var(--texto); border: 1px solid var(--linea); border-radius: var(--r);
  box-shadow: var(--sombra); padding: 6px; display: flex; flex-direction: column;
}
.menu button, .menu a {
  text-align: left; background: none; border: 0; padding: 10px 12px; border-radius: 4px; cursor: pointer;
  color: var(--texto); text-decoration: none; font-size: .95rem;
}
.menu button:hover, .menu a:hover { background: var(--celeste); }
.pasos { display: flex; gap: 2px; overflow-x: auto; scrollbar-width: none; }
.paso {
  flex: 1 0 auto; background: none; border: 0; color: rgba(255, 255, 255, .72); cursor: pointer;
  padding: 10px 12px 12px; border-bottom: 3px solid transparent; font-weight: 600; white-space: nowrap;
}
.paso b {
  display: inline-grid; place-items: center; width: 1.4em; height: 1.4em; border-radius: 50%;
  border: 1.5px solid currentColor; font-size: .78em; margin-right: 4px;
}
.paso[aria-current="page"] { color: #fff; border-bottom-color: #FFD966; }
.chip {
  display: inline-block; min-width: 1.6em; padding: 0 6px; border-radius: 999px; font-size: .75rem;
  background: rgba(255, 255, 255, .18); text-align: center;
}
.chip:empty { display: none; }

/* ---------- general */
main { padding-block: 20px 60px; }
.vista { display: flex; flex-direction: column; gap: 18px; }
.vista-cab { display: flex; flex-direction: column; gap: 6px; max-width: 70ch; }
.leyenda { margin: 0; color: var(--suave); font-size: .95rem; }
.m-in { color: var(--dato); background: var(--celda); padding: 0 4px; border-radius: 3px; }
.btn, .btn-ghost {
  border-radius: var(--r); padding: 9px 14px; cursor: pointer; font-weight: 600; white-space: nowrap;
}
.btn { background: var(--azul); color: #fff; border: 1px solid var(--azul); }
:root[data-theme="dark"] .btn { color: #0F1520; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .btn { color: #0F1520; } }
.btn:hover { filter: brightness(1.08); }
.btn:disabled { opacity: .55; cursor: progress; }
.btn-ghost { background: transparent; border: 1px solid var(--linea); color: var(--texto); }
.btn-ghost:hover { background: var(--celeste); }
.btn-chico { padding: 5px 10px; font-size: .88rem; }
.btn-peligro { color: var(--error); border-color: transparent; }
.btn-peligro.confirmar { background: var(--error); color: #fff; }
.aviso { padding: 12px 14px; border-radius: var(--r); background: var(--alerta-fondo); color: var(--texto); border-left: 4px solid var(--alerta); }
.aviso.error { background: var(--error-fondo); border-left-color: var(--error); }
.aviso.ok { background: var(--ok-fondo); border-left-color: var(--ok); }

input[type="text"], input[type="search"], input[type="date"], input:not([type]), select {
  width: 100%; min-width: 0; padding: 8px 10px; border: 1px solid var(--linea); border-radius: 4px;
  background: var(--papel);
}
.in {  /* celda para diligenciar, como en el Excel */
  background: var(--celda) !important; color: var(--dato) !important; font-variant-numeric: tabular-nums;
}
.num { text-align: right; font-variant-numeric: tabular-nums; }
.cod { font-family: var(--f-codigo); font-size: .86em; }
.calc { color: var(--texto); font-variant-numeric: tabular-nums; }

/* ---------- datos */
.datos { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 460px), 1fr)); gap: 16px; align-items: start; }
.grupo { background: var(--papel); border: 1px solid var(--linea); border-radius: var(--r); overflow: hidden; }
.grupo > h2 {
  background: var(--azul); color: #fff; font-size: .82rem; letter-spacing: .07em; text-transform: uppercase;
  padding: 8px 14px;
}
:root[data-theme="dark"] .grupo > h2 { color: #0F1520; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .grupo > h2 { color: #0F1520; } }
.campo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 4px 12px; padding: 9px 14px; border-top: 1px solid var(--linea); align-items: center; }
.campo:first-of-type { border-top: 0; }
.campo label { font-size: .93rem; }
.campo .nota { grid-column: 1 / -1; font-size: .78rem; color: var(--suave); font-style: italic; }
.campo .con-unidad { display: flex; align-items: center; gap: 6px; }
.campo .con-unidad span { color: var(--suave); font-size: .9rem; }
@media (max-width: 560px) { .campo { grid-template-columns: 1fr; } }

/* ---------- items */
#capitulos { display: flex; flex-direction: column; gap: 16px; }
.capitulo { background: var(--papel); border: 1px solid var(--linea); border-radius: var(--r); overflow: hidden; }
.cap-cab {
  display: flex; align-items: center; gap: 10px; background: var(--tinta); color: #fff; padding: 8px 12px;
}
.cap-num { font: 800 .9rem var(--f-titulo); opacity: .8; }
.cap-cab input {
  flex: 1; background: transparent; border: 1px solid transparent; color: #fff; font: 700 1rem var(--f-titulo);
  text-transform: uppercase; letter-spacing: .03em; padding: 4px 6px;
}
.cap-cab input:hover, .cap-cab input:focus { border-color: rgba(255, 255, 255, .4); }
.cap-cab .btn-ghost { color: #fff; border-color: rgba(255, 255, 255, .35); }
.tabla-items { width: 100%; border-collapse: collapse; }
.tabla-items th {
  text-align: left; font-size: .74rem; letter-spacing: .05em; text-transform: uppercase; color: var(--suave);
  padding: 8px 8px; border-bottom: 1px solid var(--linea); background: var(--celeste); font-weight: 700;
}
.tabla-items td { padding: 6px 8px; border-bottom: 1px solid var(--linea); vertical-align: middle; }
.tabla-items tr:last-child td { border-bottom: 0; }
.tabla-items input, .tabla-items select { padding: 6px 8px; }
.c-id { width: 76px; } .c-cant { width: 130px; } .c-cuad { width: 76px; } .c-pred { width: 104px; } .c-desf { width: 76px; } .c-acc { width: 92px; }
.apu-cel { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.apu-btn {
  text-align: left; background: none; border: 1px dashed transparent; border-radius: 4px; padding: 4px 6px;
  cursor: pointer; color: var(--texto);
}
.apu-btn:hover { border-color: var(--azul); background: var(--celeste); }
.apu-btn .cod { color: var(--dato); margin-right: 6px; }
.apu-btn .und { color: var(--suave); font-size: .85em; margin-left: 4px; }
.de-memoria { display: flex; flex-direction: column; align-items: flex-end; gap: 1px; }
.de-memoria b { font-variant-numeric: tabular-nums; }
.de-memoria button { background: none; border: 0; padding: 0; color: var(--vinculo); font-size: .78rem; cursor: pointer; text-decoration: underline; }
.mal { outline: 2px solid var(--error); outline-offset: -2px; }
.cap-pie { padding: 10px 12px; display: flex; gap: 8px; flex-wrap: wrap; }
.vacio { padding: 28px 16px; text-align: center; color: var(--suave); background: var(--papel); border: 1px dashed var(--linea); border-radius: var(--r); }
.nuevo-cap { display: flex; flex-direction: column; gap: 6px; max-width: 560px; }
.nuevo-cap label { font-weight: 600; font-size: .92rem; }
.fila-in { display: flex; gap: 8px; }

/* Items en celular: cada fila se vuelve una ficha */
@media (max-width: 760px) {
  .tabla-items thead { display: none; }
  .tabla-items, .tabla-items tbody, .tabla-items tr, .tabla-items td { display: block; width: auto; }
  .tabla-items tr {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px 10px; padding: 12px;
    border-bottom: 1px solid var(--linea);
  }
  .tabla-items td { padding: 0; border: 0; }
  .tabla-items td[data-et]::before {
    content: attr(data-et); display: block; font-size: .7rem; letter-spacing: .05em; text-transform: uppercase;
    color: var(--suave); margin-bottom: 2px;
  }
  .tabla-items td.t-apu { grid-column: 1 / -1; order: -1; }
  .tabla-items td.t-acc { grid-column: 1 / -1; display: flex; justify-content: flex-end; }
}

/* ---------- memoria */
.memoria { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 16px; align-items: start; }
.mem-lista { background: var(--papel); border: 1px solid var(--linea); border-radius: var(--r); padding: 10px; display: flex; flex-direction: column; gap: 8px; position: sticky; top: 130px; max-height: calc(100vh - 150px); }
.mem-lista ul { list-style: none; margin: 0; padding: 0; overflow-y: auto; }
.mem-lista li button {
  width: 100%; text-align: left; background: none; border: 0; border-radius: 4px; padding: 8px; cursor: pointer;
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px; align-items: baseline;
}
.mem-lista li button:hover { background: var(--celeste); }
.mem-lista li button[aria-current="true"] { background: var(--celeste); box-shadow: inset 3px 0 0 var(--azul); }
.mem-lista .desc { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .9rem; }
.mem-lista .n { font-size: .78rem; color: var(--suave); }
.mem-detalle { background: var(--papel); border: 1px solid var(--linea); border-radius: var(--r); min-width: 0; }
.mem-cab { padding: 12px 14px; border-bottom: 1px solid var(--linea); display: flex; flex-direction: column; gap: 2px; }
.mem-cab .sub2 { color: var(--suave); font-size: .9rem; }
.tabla-scroll { overflow-x: auto; }
.tabla-mem { width: 100%; border-collapse: collapse; min-width: 640px; }
.tabla-mem th { font-size: .74rem; letter-spacing: .05em; text-transform: uppercase; color: var(--suave); background: var(--celeste); padding: 8px; text-align: right; }
.tabla-mem th:first-child { text-align: left; }
.tabla-mem td { padding: 5px 6px; border-bottom: 1px solid var(--linea); }
.tabla-mem td input { padding: 6px 8px; }
.tabla-mem .c-n { width: 88px; }
.tabla-mem td:first-child { min-width: 240px; }
.tabla-mem tfoot td { background: var(--total); font-weight: 700; padding: 10px 8px; }
.mem-pie { padding: 12px 14px; display: flex; gap: 8px; flex-wrap: wrap; }
/* Memoria en celular: cada medida es una ficha (descripción arriba, medidas en 4 columnas) */
@media (max-width: 640px) {
  .tabla-mem { min-width: 0; }
  .tabla-mem thead { display: none; }
  .tabla-mem, .tabla-mem tbody, .tabla-mem tfoot { display: block; }
  .tabla-mem tbody tr {
    display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px 8px; padding: 12px 14px;
    border-bottom: 1px solid var(--linea);
  }
  .tabla-mem tbody td, .tabla-mem tbody td.c-n { display: block; padding: 0; border: 0; width: auto; min-width: 0; }
  .tabla-mem tbody td:first-child { grid-column: 1 / -1; min-width: 0; }
  .tabla-mem tbody td[data-et]::before {
    content: attr(data-et); display: block; font-size: .7rem; letter-spacing: .05em; text-transform: uppercase;
    color: var(--suave); margin-bottom: 2px;
  }
  .tabla-mem tbody td[data-parcial] { grid-column: 1 / 4; text-align: left; align-self: center; font-weight: 600; }
  .tabla-mem tbody td[data-parcial]::before { content: "Parcial: "; color: var(--suave); font-weight: 400; }
  .tabla-mem tbody td:last-child { grid-column: 4; display: flex; justify-content: flex-end; }
  .tabla-mem tfoot tr { display: flex; justify-content: space-between; gap: 8px; }
  .tabla-mem tfoot td { display: block; border: 0; }
}
@media (max-width: 520px) {
  .guardado, .lema { display: none; }
  .marca-txt strong { white-space: nowrap; font-size: .95rem; }
  .paso { flex: 1 1 0; padding: 10px 4px 12px; font-size: .9rem; text-align: center; }
  .paso b { margin-right: 2px; }
  .chip { display: none; }
}
@media (max-width: 860px) {
  .memoria { grid-template-columns: 1fr; }
  .mem-lista { position: static; max-height: 260px; }
}

/* ---------- generar */
.revision { background: var(--papel); border: 1px solid var(--linea); border-radius: var(--r); padding: 14px 16px; display: flex; flex-direction: column; gap: 10px; }
.checks { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.checks li { display: grid; grid-template-columns: 1.4em minmax(0, 1fr); gap: 6px; }
.checks li::before { font-weight: 800; }
.checks .bien::before { content: "✓"; color: var(--ok); }
.checks .ojo::before { content: "!"; color: var(--alerta); text-align: center; }
.checks .malo::before { content: "✕"; color: var(--error); }
.generar-zona { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.btn-grande { font-size: 1.08rem; padding: 14px 22px; }
.progreso { display: flex; align-items: center; gap: 10px; margin: 0; color: var(--suave); }
.giro { width: 18px; height: 18px; border-radius: 50%; border: 3px solid var(--celeste); border-top-color: var(--azul); animation: giro 0.9s linear infinite; }
@keyframes giro { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .giro { animation-duration: 3s; } }
#resultado { display: flex; flex-direction: column; gap: 16px; }
.totales { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 12px; }
.total {
  background: var(--papel); border: 1px solid var(--linea); border-radius: var(--r); padding: 14px 16px;
  display: flex; flex-direction: column; gap: 4px;
}
.total .et { font-size: .74rem; letter-spacing: .06em; text-transform: uppercase; color: var(--suave); font-weight: 700; }
.total .v { font: 700 1.35rem var(--f-titulo); font-variant-numeric: tabular-nums; }
.total .d { font-size: .82rem; color: var(--suave); }
.total.principal { background: var(--total); border-color: transparent; }
.descargas { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 10px; }
.descarga {
  display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: var(--r);
  border: 1px solid var(--linea); background: var(--papel); color: var(--texto); text-decoration: none;
}
.descarga:hover { border-color: var(--azul); background: var(--celeste); }
.descarga .ico { font: 800 .7rem var(--f-titulo); color: #fff; background: #1D6F42; padding: 6px 5px; border-radius: 3px; }
.descarga span { display: flex; flex-direction: column; min-width: 0; }
.descarga small { color: var(--suave); }
.lista-msj { margin: 0; padding-left: 1.2em; display: flex; flex-direction: column; gap: 4px; }
.nota-ref { font-size: .85rem; color: var(--suave); max-width: 75ch; margin: 0; }

/* ---------- fecha de corte de precios */
.corte { display: grid; grid-template-columns: auto 180px; gap: 6px 12px; align-items: center; background: var(--papel); border: 1px solid var(--linea); border-radius: var(--r); padding: 12px 16px; }
.corte label { font-weight: 600; }
.corte .leyenda { grid-column: 1 / -1; font-size: .86rem; }
@media (max-width: 520px) { .corte { grid-template-columns: 1fr; } }

/* ---------- base de precios */
.pasos-sep { flex: 0 0 1px; background: rgba(255, 255, 255, .25); margin: 10px 6px; }
.paso-base { font-weight: 700; }
.vista-cab-fila { max-width: none; flex-direction: row; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; }
.vista-cab-fila > div:first-child { max-width: 70ch; display: flex; flex-direction: column; gap: 6px; }
.acciones-base { display: flex; gap: 8px; flex-wrap: wrap; }
.acciones-base a { text-decoration: none; }
.tipos { display: flex; gap: 4px; border-bottom: 2px solid var(--linea); overflow-x: auto; }
.tipos button {
  background: none; border: 0; padding: 10px 14px; font-weight: 600; color: var(--suave); cursor: pointer;
  border-bottom: 3px solid transparent; margin-bottom: -2px; white-space: nowrap;
}
.tipos button[aria-selected="true"] { color: var(--texto); border-bottom-color: var(--azul); }
.estado-fuentes { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.filtros-base { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) auto; gap: 8px; }
@media (max-width: 640px) { .filtros-base { grid-template-columns: 1fr; } }
.tarjeta { background: var(--papel); border: 1px solid var(--linea); border-radius: var(--r); }
.tabla-base { width: 100%; border-collapse: collapse; min-width: 860px; }
.tabla-base th { text-align: left; font-size: .74rem; letter-spacing: .05em; text-transform: uppercase; color: var(--suave); background: var(--celeste); padding: 8px 10px; position: sticky; top: 0; }
.tabla-base td { padding: 8px 10px; border-bottom: 1px solid var(--linea); vertical-align: middle; }
.tabla-base tbody tr { cursor: pointer; }
.tabla-base tbody tr:hover, .tabla-base tbody tr:focus-visible { background: var(--celeste); }
.tabla-base .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.tabla-base .falta { color: var(--error); font-weight: 600; }
.peq { font-size: .86rem; color: var(--suave); }

/* fuente del precio: el color dice qué tan firme es */
:root { --f-cot: #1E7B3A; --f-cat: #2E75B6; --f-ref: #9A6400; --f-norma: #5B6577; --f-ind: #B42318; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { --f-cot: #6FCF8A; --f-cat: #8DB4FF; --f-ref: #F0B44C; --f-norma: #9AA5B8; --f-ind: #FF8A80; } }
:root[data-theme="dark"] { --f-cot: #6FCF8A; --f-cat: #8DB4FF; --f-ref: #F0B44C; --f-norma: #9AA5B8; --f-ind: #FF8A80; }
.fuente {
  --c: var(--suave);
  display: inline-flex; align-items: center; gap: 6px; padding: 2px 9px; border-radius: 999px; font-size: .78rem; font-weight: 600;
  color: var(--c); border: 1px solid var(--c); background: transparent; white-space: nowrap; font-family: inherit;
}
button.fuente { cursor: pointer; padding: 5px 11px; }
button.fuente.activo { background: var(--c); color: var(--papel); }
.f-contrato { --c: var(--tinta); }
:root[data-theme="dark"] .f-contrato { --c: #FFD966; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .f-contrato { --c: #FFD966; } }
.f-cotizacion { --c: var(--f-cot); } .f-catalogo { --c: var(--f-cat); } .f-referencial { --c: var(--f-ref); }
.f-norma { --c: var(--f-norma); } .f-por_indicar { --c: var(--f-ind); }

.factor { font-size: .72rem; font-weight: 700; letter-spacing: .03em; padding: 1px 6px; border-radius: 3px; white-space: nowrap; }
.factor.con { color: var(--suave); background: var(--celeste); }
.factor.sin { color: var(--f-cot); border: 1px dashed var(--f-cot); }
.casilla { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px; align-items: start; padding: 10px 12px; background: var(--celeste); border-radius: var(--r); }
.casilla input { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--azul); }
.casilla .peq { display: block; margin-top: 2px; }

/* solo consulta: quien no tiene permiso de precios ve la base pero no los controles para cambiarla */
.nota-lectura { display: none; }
.solo-lectura .nota-lectura { display: block; }
.solo-lectura #btn-nuevo-base, .solo-lectura #btn-importar-base, .solo-lectura #form-precio .rejilla,
.solo-lectura #form-precio .dlg-acciones, .solo-lectura [data-borrar-precio], .solo-lectura #form-apu .dlg-acciones,
.solo-lectura [data-quitar-linea] { display: none !important; }
.solo-lectura #form-apu input, .solo-lectura #form-apu select { pointer-events: none; background: transparent !important; }
.no-admin #btn-importar-base { display: none !important; }
.solo-lectura .filtros-base { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }

/* ingreso */
body.sin-sesion { overflow: hidden; }
.acceso {
  position: fixed; inset: 0; z-index: 50; overflow-y: auto; background: var(--tinta);
  display: grid; place-items: center;
  padding: max(24px, env(safe-area-inset-top, 0px)) max(16px, env(safe-area-inset-right, 0px)) max(24px, env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px));
}
.acceso-caja { width: min(420px, 100%); display: flex; flex-direction: column; gap: 18px; }
.acceso-marca { display: flex; align-items: center; gap: 14px; color: #fff; }
.logo-grande { width: 64px; height: 40px; color: #fff; }
.acceso-marca strong { display: block; font: 800 2rem/1 var(--f-titulo); }
.acceso-marca span { font-size: .8rem; letter-spacing: .1em; text-transform: uppercase; opacity: .75; }
.acceso-form { background: var(--papel); border-radius: 10px; padding: 22px 20px; display: flex; flex-direction: column; gap: 8px; box-shadow: 0 20px 50px rgba(0, 0, 0, .3); }
.acceso-form h1 { font-size: 1.3rem; margin-bottom: 4px; }
.acceso-form label { font-size: .88rem; font-weight: 600; margin-top: 4px; }
.acceso-form input[type="password"] { width: 100%; padding: 8px 10px; border: 1px solid var(--linea); border-radius: 4px; }
.acceso-form .btn-grande { margin-top: 10px; }
.ver-clave { display: flex; align-items: center; gap: 8px; font-weight: 400 !important; font-size: .9rem !important; cursor: pointer; }
.ver-clave input { width: 18px; height: 18px; accent-color: var(--azul); }
.acceso-form .leyenda { font-size: .86rem; }
.menu-usuario { margin: 0; padding: 8px 12px 10px; font-size: .88rem; border-bottom: 1px solid var(--linea); }
.menu-usuario span { color: var(--suave); font-size: .8rem; }
.menu hr { border: 0; border-top: 1px solid var(--linea); margin: 4px 0; }

/* equipo */
.tabla-equipo { min-width: 760px; }
.tabla-equipo tbody tr { cursor: default; }
.tabla-equipo tbody tr:hover { background: transparent; }
.tabla-equipo select { padding: 5px 8px; max-width: 220px; }
.acciones-fila { display: flex; gap: 6px; justify-content: flex-end; flex-wrap: wrap; }
.fila-clave td { background: var(--celeste); }
.clave-inline { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.clave-inline input { max-width: 220px; }
.form-usuario, .respaldo { padding: 16px; display: flex; flex-direction: column; gap: 10px; }
.rejilla-usuario { grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); }
.respaldo p { margin: 4px 0; }

/* proyectos */
.lista-proyectos { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 12px; }
.proyecto { padding: 14px 16px; display: flex; flex-direction: column; gap: 4px; }
.proyecto.actual { border-color: var(--azul); box-shadow: inset 0 0 0 1px var(--azul); }
.proyecto-cab { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.proyecto h2 { font-size: 1.02rem; }
.proyecto p { margin: 0; }
.proyecto-acc { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; }
.ver-archivados { display: flex; align-items: center; gap: 8px; font-size: .9rem; color: var(--suave); cursor: pointer; }
.acciones-aviso { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 10px; }
.versiones { padding: 16px; display: flex; flex-direction: column; gap: 10px; }
.lista-versiones { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.lista-versiones li { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 8px 0; border-top: 1px solid var(--linea); }
.lista-versiones li:first-child { border-top: 0; }
.v-num { font: 700 .9rem var(--f-codigo); color: var(--azul); }
.v-txt { display: flex; flex-direction: column; min-width: 0; }
.v-txt small { color: var(--suave); }
@media (max-width: 520px) { .lista-versiones li { grid-template-columns: 36px minmax(0, 1fr); } .lista-versiones li button { grid-column: 2; justify-self: start; } }
.paso .corto { display: none; }
@media (max-width: 640px) { .paso .ancho { display: none; } .paso .corto { display: inline; } }
@media (max-width: 520px) { .paso b, .pasos-sep { display: none; } .paso { padding-inline: 6px; font-size: .86rem; } }

/* subcapítulos e hitos (paso 2) */
.fila-sub td { background: var(--celeste); font-weight: 700; font-size: .86rem; padding: 6px 10px !important; letter-spacing: .02em; }
.sub-in { border: 0 !important; border-bottom: 1px dashed var(--linea) !important; background: transparent !important; font-size: .8rem; padding: 2px 6px !important; color: var(--suave); width: 100%; }
.sub-in:focus { color: var(--texto); }
.caja-hitos { padding: 14px 16px; display: flex; flex-direction: column; gap: 10px; }
.hitos-cab { display: flex; flex-direction: column; gap: 4px; }
.tabla-hitos { width: 100%; border-collapse: collapse; min-width: 640px; }
.tabla-hitos th { font-size: .74rem; letter-spacing: .05em; text-transform: uppercase; color: var(--suave); background: var(--total); padding: 6px 8px; text-align: left; }
.tabla-hitos th.num { text-align: right; }
.tabla-hitos td { padding: 4px 6px; border-bottom: 1px solid var(--linea); }
.tabla-hitos td:nth-child(1) { width: 80px; } .tabla-hitos td:nth-child(3) { width: 120px; }
.tabla-hitos td:nth-child(4), .tabla-hitos td:nth-child(5) { width: 110px; }

/* avance (paso 5) */
.avance-apagado { padding: 18px; display: flex; flex-direction: column; gap: 10px; align-items: flex-start; }
#avance-activo { display: flex; flex-direction: column; gap: 16px; }
#avance-activo[hidden] { display: none; }
.tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr)); gap: 10px; }
.tile { background: var(--papel); border: 1px solid var(--linea); border-radius: var(--r); padding: 12px 14px; display: flex; flex-direction: column; gap: 3px; }
.tile.principal { background: var(--total); border-color: transparent; }
.tile .et { font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; color: var(--suave); font-weight: 700; }
.tile .v { font: 700 1.4rem var(--f-titulo); font-variant-numeric: tabular-nums; }
.tile .v.malo { color: var(--error); }
.tile .d { font-size: .8rem; color: var(--suave); }
.nota-avance { grid-column: 1 / -1; margin: 0; font-size: .85rem; }
.curva { padding: 12px 14px; }
.curva svg { width: 100%; height: auto; max-height: 260px; display: block; }
.curva .grid { stroke: var(--linea); stroke-width: 1; }
.curva .eje { fill: var(--suave); font: 11px var(--f-texto); }
.curva .corte { stroke: var(--alerta); stroke-dasharray: 4 3; stroke-width: 1.5; }
.curva .prog { fill: none; stroke: var(--azul); stroke-width: 2.5; }
.curva .real { fill: none; stroke: var(--error); stroke-width: 2.5; }
.curva .punto-real { fill: var(--error); }
.leyenda-curva { display: flex; gap: 16px; font-size: .82rem; color: var(--suave); padding-top: 4px; }
.leyenda-curva span::before { content: ""; display: inline-block; width: 18px; height: 3px; margin-right: 6px; vertical-align: middle; }
.l-prog::before { background: var(--azul); } .l-real::before { background: var(--error); }
.tabla-avance { min-width: 820px; }
.tabla-avance tbody tr { cursor: default; }
.tabla-avance td input { width: 90px; padding: 5px 8px; }
.avance-hitos { padding: 14px 16px; display: flex; flex-direction: column; gap: 8px; }
.lista-hitos { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.lista-hitos li { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 8px 0; border-top: 1px solid var(--linea); }
.lista-hitos li:first-child { border-top: 0; }
.hito-check { display: flex; gap: 10px; align-items: flex-start; cursor: pointer; }
.hito-check input { width: 18px; height: 18px; margin-top: 2px; accent-color: var(--azul); }
.hito-check small { display: block; color: var(--suave); }
.hito-der { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.hito-fecha { width: 150px; padding: 4px 8px; }
@media (max-width: 560px) { .lista-hitos li { flex-direction: column; align-items: flex-start; } }

/* diario (paso 6) */
.diario { display: flex; flex-direction: column; gap: 14px; }
.diario[hidden] { display: none; }
.diario-barra { padding: 12px 14px; display: flex; flex-direction: column; gap: 10px; position: sticky; top: calc(env(safe-area-inset-top, 0px) + 104px); z-index: 5; }
.diario-fecha { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.diario-fecha input { width: auto; font-weight: 700; }
.diario-acciones { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.diario-acciones .peq { margin-right: auto; }
.diario-lista { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 2px; scrollbar-width: thin; }
.dia-chip { flex: 0 0 auto; display: grid; grid-template-columns: auto auto; column-gap: 6px; align-items: center; text-align: left;
  background: var(--fondo); border: 1px solid var(--linea); border-radius: 8px; padding: 6px 10px; cursor: pointer; color: var(--texto); }
.dia-chip span { grid-row: span 2; font-size: 1.1rem; }
.dia-chip small { color: var(--suave); font-size: .72rem; }
.dia-chip.activo { border-color: var(--azul); box-shadow: inset 0 0 0 1px var(--azul); }
.diario-form { border: 0; margin: 0; padding: 0; min-width: 0; display: flex; flex-direction: column; gap: 14px; }
.diario-form:disabled { opacity: .75; }
.bloque-d { padding: 14px 16px; display: flex; flex-direction: column; gap: 10px; }
.bloque-d > label { font-size: .86rem; font-weight: 600; }
.bloque-d textarea { width: 100%; padding: 8px 10px; border: 1px solid var(--linea); border-radius: 4px; resize: vertical; font: inherit; }
.bloque-cab { display: flex; justify-content: space-between; align-items: baseline; }
.clima-botones { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.clima { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 12px 6px; border-radius: 10px; cursor: pointer;
  border: 2px solid var(--linea); background: var(--papel); color: var(--texto); font-weight: 600; font-size: .9rem; }
.clima span { font-size: 1.8rem; line-height: 1.1; }
.clima[aria-pressed="true"] { border-color: var(--azul); background: var(--celeste); }
.horas-dia { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; }
@media (min-width: 761px) { .horas-dia { grid-template-columns: repeat(12, minmax(0, 1fr)); } }
.hora-d { display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 6px 2px; border-radius: 8px; cursor: pointer;
  border: 2px solid var(--linea); background: var(--papel); color: var(--texto); min-height: 52px; }
.hora-d span { font-size: 1.25rem; line-height: 1.1; }
.hora-d small { font-size: .72rem; color: var(--suave); font-weight: 600; }
.hora-d.seca { border-color: #d9a400; background: #fff6d6; color: #3a2c00; }
.hora-d.lluvia { border-color: var(--azul); background: var(--celeste); }
.diario-form:disabled .hora-d { cursor: default; }
.resumen-horas { display: flex; flex-wrap: wrap; gap: 8px 16px; font-size: .92rem; }
.rh.seca b { color: #8a6500; }
.rh.lluvia b { color: var(--azul); }
.fila-in-d { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-weight: 600; font-size: .9rem; }
.corto { width: 90px !important; }
.rapidos { display: flex; gap: 6px; flex-wrap: wrap; }
.chip-d { border: 1px dashed var(--azul); background: transparent; color: var(--azul); border-radius: 999px; padding: 5px 12px; cursor: pointer; font-weight: 600; font-size: .85rem; }
.filas-d { display: flex; flex-direction: column; gap: 8px; }
.filas-d:empty { display: none; }
.fila-d { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 8px; align-items: center; }
.act-d { display: flex; flex-direction: column; gap: 6px; padding: 10px; border: 1px solid var(--linea); border-radius: var(--r); background: var(--fondo); }
.act-fila1 { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.act-fila2 { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.act-fila2 label { display: flex; align-items: center; gap: 6px; font-size: .82rem; color: var(--suave); }
.act-fila2 input { width: 100px; }
.und-d { font-size: .85rem; font-weight: 600; }
.acum-d { color: var(--vinculo); font-size: .8rem; }
.mat-d { display: grid; grid-template-columns: minmax(0, 2fr) 80px 64px minmax(0, 1fr) minmax(0, 1fr) auto; gap: 6px; align-items: center; }
@media (max-width: 640px) { .mat-d { grid-template-columns: minmax(0, 1fr) 90px auto; } .mat-d input[data-k="unidad"] { grid-column: 2; } }
.subir-fotos { align-self: flex-start; cursor: pointer; }
.fotos-d { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); gap: 10px; }
.foto-d { margin: 0; border: 1px solid var(--linea); border-radius: var(--r); overflow: hidden; background: var(--fondo); }
.foto-d img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; max-width: 100%; }
.foto-d figcaption { padding: 8px; display: flex; flex-direction: column; gap: 6px; }
.firmas-d { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); gap: 12px; }
.firmas-d > div { display: flex; flex-direction: column; gap: 4px; }

.aviso-conexion { position: sticky; top: calc(env(safe-area-inset-top, 0px) + 104px); z-index: 15; background: var(--alerta-fondo);
  border-bottom: 2px solid var(--alerta); padding: 10px max(16px, env(safe-area-inset-right, 0px)) 10px max(16px, env(safe-area-inset-left, 0px));
  font-size: .9rem; color: var(--texto); }
@media (max-width: 520px) { .aviso-conexion { top: calc(env(safe-area-inset-top, 0px) + 92px); } }

/* diálogos de la base */
.dlg { display: flex; flex-direction: column; max-height: min(88vh, 900px); }
.dlg-cuerpo { padding: 14px 16px 18px; overflow-y: auto; display: flex; flex-direction: column; gap: 12px; }
.dlg-cuerpo h3 { font-size: .95rem; margin-top: 6px; }
.dp-insumo { margin: 0; line-height: 1.7; }
.rejilla { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 12px; }
.rejilla-apu { grid-template-columns: 1fr 1fr 1fr; }
.rejilla .ancho { grid-column: 1 / -1; }
@media (max-width: 560px) { .rejilla, .rejilla-apu { grid-template-columns: 1fr; } }
.campo-v { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.campo-v label { font-size: .86rem; font-weight: 600; }
input[type="url"] { width: 100%; padding: 8px 10px; border: 1px solid var(--linea); border-radius: 4px; }
.dlg-acciones { display: flex; justify-content: flex-end; gap: 8px; }
.dlg-acciones.izq { justify-content: flex-start; }
.historial { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; border: 1px solid var(--linea); border-radius: var(--r); }
.historial li { display: grid; grid-template-columns: 92px 120px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 8px 10px; border-top: 1px solid var(--linea); font-size: .9rem; }
.historial li:first-child { border-top: 0; }
.historial li.vigente { background: var(--total); }
.historial .h-valor { font-weight: 700; text-align: right; font-variant-numeric: tabular-nums; }
.historial .h-fuente { display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: center; min-width: 0; }
.historial small { color: var(--suave); flex-basis: 100%; }
@media (max-width: 560px) { .historial li { grid-template-columns: 1fr auto; } .historial .h-fuente { grid-column: 1 / -1; } .historial .h-valor { text-align: left; } }
dialog.dlg-ancho { width: min(980px, calc(100vw - 24px)); }
.tabla-apu { width: 100%; border-collapse: collapse; min-width: 620px; }
.tabla-apu th { font-size: .74rem; letter-spacing: .05em; text-transform: uppercase; color: var(--suave); background: var(--celeste); padding: 6px 8px; text-align: left; }
.tabla-apu th.num { text-align: right; }
.tabla-apu td { padding: 4px 6px; border-bottom: 1px solid var(--linea); vertical-align: top; }
.tabla-apu td:nth-child(1) { width: 86px; } .tabla-apu td:nth-child(3), .tabla-apu td:nth-child(4) { width: 110px; } .tabla-apu td:nth-child(5) { width: 44px; }
.l-insumo small { display: block; color: var(--suave); font-size: .8rem; padding: 2px 2px 0; }
.tabla-apu input:disabled { opacity: .45; }

/* ---------- selector de APU */
dialog {
  width: min(760px, calc(100vw - 24px)); max-height: min(86vh, 900px); padding: 0; border: 0;
  border-radius: 10px; background: var(--papel); color: var(--texto); box-shadow: 0 20px 60px rgba(0, 0, 0, .35);
}
dialog::backdrop { background: rgba(15, 21, 32, .55); }
.sel { display: flex; flex-direction: column; max-height: min(86vh, 900px); }
.sel-cab { display: flex; justify-content: space-between; align-items: center; padding: 14px 16px; border-bottom: 1px solid var(--linea); }
.sel-filtros { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 8px; padding: 12px 16px; }
@media (max-width: 560px) { .sel-filtros { grid-template-columns: 1fr; } }
.sel-lista { list-style: none; margin: 0; padding: 0 8px 12px; overflow-y: auto; }
.sel-lista button {
  width: 100%; display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; gap: 10px; align-items: baseline;
  text-align: left; background: none; border: 0; border-radius: 6px; padding: 10px 8px; cursor: pointer;
}
.sel-lista button:hover, .sel-lista button:focus-visible { background: var(--celeste); }
.sel-lista .cod { color: var(--dato); }
.sel-lista .cap { display: block; font-size: .76rem; color: var(--suave); }
.sel-lista .und { color: var(--suave); font-size: .85rem; }
.sel-grupo { font-size: .72rem; letter-spacing: .07em; text-transform: uppercase; color: var(--suave); padding: 12px 8px 4px; font-weight: 700; }

@media (max-width: 760px) { .diario-barra { position: static; } }