/* Cotizador Geométrica Modular — hoja de estilos propia.
   Estética industrial: papel cálido, grafito, retícula modular, filetes finos. */

@font-face { font-family: "Plex"; src: url("../fonts/plex-sans-400.0ceb759015a6.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Plex"; src: url("../fonts/plex-sans-500.767677e47513.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Plex"; src: url("../fonts/plex-sans-600.e78568807d10.woff2") format("woff2"); font-weight: 600 700; font-display: swap; }
@font-face { font-family: "PlexMono"; src: url("../fonts/plex-mono-400.4cc7b4398540.woff2") format("woff2"); font-weight: 400; font-display: swap; }

:root {
  --papel: #F4F2EC;
  --superficie: #FBFAF6;
  --linea: #DDD8CD;
  --linea-fuerte: #B8B2A5;
  --grafito: #23262A;
  --grafito-2: #3E434A;
  --texto-2: #5D5A53;
  --tenue: #807B71;
  --ok: #2E6E45;      --ok-fondo: #E4EFE6;   --ok-linea: #9CC3A7;
  --adv: #8F5A00;     --adv-fondo: #FAEFD6;  --adv-linea: #E2B866;  --adv-boton: #B87A0E;
  --error: #A8261D;   --error-fondo: #F7E2DF; --error-linea: #E0A39C;
  --info: #2C5578;    --info-fondo: #E3EAF1; --info-linea: #A5BBD0;
  --radio: 3px;
  --ancho: 1220px;
  --sans: "Plex", "Segoe UI", system-ui, -apple-system, sans-serif;
  --mono: "PlexMono", ui-monospace, "Cascadia Mono", Consolas, monospace;
  --sombra-foco: 0 0 0 3px rgba(44, 85, 120, .28);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--papel); color: var(--grafito);
  font: 400 16px/1.5 var(--sans); min-height: 100vh; display: flex; flex-direction: column;
  font-feature-settings: "tnum" 1;
}
h1, h2, h3 { font-weight: 600; letter-spacing: -.01em; margin: 0; line-height: 1.2; }
h1 { font-size: clamp(1.55rem, 1.2rem + 1.2vw, 2.05rem); }
h2 { font-size: 1.12rem; }
h3 { font-size: 1rem; }
p { margin: 0 0 .5rem; }
a { color: var(--grafito); text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: #000; }
small { font-size: .82rem; }
strong { font-weight: 600; }
.mono { font-family: var(--mono); font-size: .92em; letter-spacing: -.01em; }
.tenue { color: var(--tenue); }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.i { width: 1.15em; height: 1.15em; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: square; stroke-linejoin: miter; flex: none; vertical-align: -.2em; }
.i-grande { width: 2rem; height: 2rem; stroke-width: 1.3; }
:focus-visible { outline: none; box-shadow: var(--sombra-foco); }
[hidden] { display: none !important; }

/* --- Barra superior ------------------------------------------------------------ */
.barra { background: var(--superficie); border-bottom: 3px solid var(--grafito); position: sticky; top: 0; z-index: 20; }
.barra__interior { max-width: var(--ancho); margin: 0 auto; padding: 0 24px; min-height: 64px; display: flex; align-items: center; gap: 24px; }
.marca { display: flex; align-items: center; gap: 12px; text-decoration: none; color: var(--grafito); }
.marca__simbolo { width: 32px; height: 32px; color: var(--grafito); }
.marca__texto { font-size: .95rem; letter-spacing: .14em; line-height: 1.1; display: flex; flex-direction: column; }
.marca__texto strong { font-weight: 600; }
.marca__texto small { letter-spacing: .08em; font-size: .68rem; color: var(--tenue); text-transform: uppercase; margin-top: 3px; }
.marca__texto { flex-direction: row; flex-wrap: wrap; column-gap: .35em; max-width: 220px; }
.marca__texto small { flex-basis: 100%; }
.menu__boton { display: none; }
.menu__lista { margin-left: auto; display: flex; align-items: stretch; gap: 4px; }
.menu__lista > a { display: flex; align-items: center; padding: 0 14px; min-height: 64px; text-decoration: none; font-size: .92rem; font-weight: 500; color: var(--grafito-2); border-bottom: 3px solid transparent; margin-bottom: -3px; }
.menu__lista > a:hover { color: var(--grafito); background: var(--papel); }
.menu__lista > a.activo { color: var(--grafito); border-bottom-color: var(--adv-boton); }
.menu__usuario { display: flex; align-items: center; gap: 14px; margin-left: 14px; padding-left: 18px; border-left: 1px solid var(--linea); }
.menu__nombre { display: flex; flex-direction: column; font-size: .88rem; font-weight: 500; line-height: 1.15; }
.menu__nombre small { color: var(--tenue); font-weight: 400; font-size: .74rem; text-transform: uppercase; letter-spacing: .06em; }
.menu__sec { font-size: .82rem; color: var(--texto-2); }
.menu__usuario form { margin: 0; }
.enlace-salir { display: inline-flex; align-items: center; gap: 6px; background: none; border: 1px solid var(--linea-fuerte); border-radius: var(--radio); padding: 7px 12px; font: 500 .85rem var(--sans); color: var(--grafito); cursor: pointer; }
.enlace-salir:hover { border-color: var(--grafito); }

/* --- Estructura -------------------------------------------------------------- */
.contenido { width: 100%; max-width: var(--ancho); margin: 0 auto; padding: 32px 24px 56px; flex: 1; }
.pie { border-top: 1px solid var(--linea); padding: 18px 24px; text-align: center; font-size: .78rem; color: var(--tenue); letter-spacing: .04em; }
.angosto { max-width: 620px; }
.rotulo { font-size: .74rem; letter-spacing: .12em; text-transform: uppercase; color: var(--tenue); font-weight: 500; margin-bottom: 6px; }
.intro { color: var(--texto-2); max-width: 70ch; margin: 8px 0 24px; }
.encabezado { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; flex-wrap: wrap; padding-bottom: 22px; border-bottom: 1px solid var(--linea); margin-bottom: 22px; }
.resumen-linea { display: flex; gap: 8px; margin: 12px 0 0; flex-wrap: wrap; }

.seccion { border-top: 1px solid var(--linea-fuerte); padding: 22px 0 28px; }
.seccion--suave { border-top-style: dashed; }
.seccion__titulo { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 18px; }
.seccion__titulo p { color: var(--texto-2); margin: 4px 0 0; font-size: .93rem; max-width: 72ch; }
.seccion__num { flex: none; width: 30px; height: 30px; display: grid; place-items: center; border: 1.5px solid var(--grafito); font: 500 .85rem var(--mono); }
.dos-columnas { display: grid; grid-template-columns: 1fr 1fr; gap: 0 48px; align-items: start; }
.dos-columnas--ancha { grid-template-columns: minmax(0, 1.7fr) minmax(280px, 1fr); }
.revision-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 48px; }

/* --- Pasos del asistente --------------------------------------------------------- */
.cabecera-cot { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 18px; }
.cabecera-cot h1 { margin-top: 2px; }
.cabecera-cot__estados { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
.estado--precio { color: var(--grafito); background: var(--superficie); border-color: var(--grafito); }
.estado--precio::before { background: var(--adv-boton); }
.angosto-medio { max-width: 760px; }
.opciones-precio { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.opcion-precio { position: relative; display: flex; gap: 12px; align-items: flex-start; padding: 18px 16px; border: 1.5px solid var(--linea-fuerte); background: var(--superficie); cursor: pointer; min-height: 96px; }
.opcion-precio:hover { border-color: var(--grafito); background: #fff; }
.opcion-precio input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.opcion-precio__marca { flex: none; width: 22px; height: 22px; border: 1.5px solid var(--grafito-2); border-radius: 50%; background: #fff; display: grid; place-items: center; margin-top: 1px; }
.opcion-precio input:checked ~ .opcion-precio__marca::after { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--grafito); }
.opcion-precio input:focus-visible ~ .opcion-precio__marca { box-shadow: var(--sombra-foco); }
.opcion-precio:has(input:checked) { border-color: var(--grafito); background: #fff; box-shadow: inset 0 -3px 0 var(--adv-boton); }
.opcion-precio__texto { display: flex; flex-direction: column; gap: 3px; }
.opcion-precio__texto strong { font-size: 1.05rem; }
.opcion-precio__texto small { color: var(--texto-2); }
.pasos { margin: 0 0 28px; }
.pasos__movil { display: none; font-size: .9rem; color: var(--texto-2); margin: 0 0 8px; }
.pasos ol { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, 1fr); border: 1px solid var(--linea-fuerte); background: var(--superficie); }
.pasos li { position: relative; }
.pasos li + li { border-left: 1px solid var(--linea); }
.pasos a, .pasos span { display: flex; align-items: center; gap: 10px; padding: 12px 14px; text-decoration: none; color: var(--texto-2); min-height: 54px; }
.pasos a:hover { background: var(--papel); color: var(--grafito); }
.pasos b { flex: none; width: 26px; height: 26px; display: grid; place-items: center; border: 1.5px solid var(--linea-fuerte); font: 500 .8rem var(--mono); }
.pasos em { font-style: normal; font-weight: 500; font-size: .92rem; }
.pasos li.hecho b { border-color: var(--ok); color: var(--ok); }
.pasos li.actual { background: var(--grafito); }
.pasos li.actual a, .pasos li.actual span { color: #fff; }
.pasos li.actual a:hover { background: var(--grafito); }
.pasos li.actual b { border-color: #fff; background: #fff; color: var(--grafito); }
.pasos li.actual::after { content: ""; position: absolute; left: 0; right: 0; bottom: -4px; height: 3px; background: var(--adv-boton); }

/* --- Botones ----------------------------------------------------------------------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 9px; min-height: 46px; padding: 0 20px; border: 1.5px solid var(--grafito); border-radius: var(--radio); background: transparent; color: var(--grafito); font: 500 .95rem var(--sans); text-decoration: none; cursor: pointer; white-space: nowrap; transition: background .12s, color .12s, border-color .12s; }
.btn:hover { background: var(--grafito); color: #fff; }
.btn-primario { background: var(--grafito); color: #fff; }
.btn-primario:hover { background: #000; border-color: #000; }
.btn-secundario { background: var(--superficie); border-color: var(--linea-fuerte); }
.btn-secundario:hover { border-color: var(--grafito); background: var(--superficie); color: var(--grafito); }
.btn-peligro { color: var(--error); border-color: var(--error-linea); background: var(--superficie); }
.btn-peligro:hover { background: var(--error); border-color: var(--error); color: #fff; }
.btn-advertencia { color: var(--adv); border-color: var(--adv-linea); background: var(--superficie); }
.btn-advertencia:hover { background: var(--adv-boton); border-color: var(--adv-boton); color: #fff; }
.btn-grande { min-height: 54px; padding: 0 26px; font-size: 1.02rem; }
.btn-sm { min-height: 36px; padding: 0 12px; font-size: .85rem; gap: 6px; }
.btn-bloque { width: 100%; }
.btn[disabled], .btn[aria-disabled="true"] { opacity: .38; cursor: not-allowed; pointer-events: none; }
.btn.esperando { position: relative; color: transparent !important; pointer-events: none; }
.btn.esperando::after { content: attr(data-texto-espera); position: absolute; inset: 0; display: grid; place-items: center; color: #fff; font-size: .9rem; }
.enlace { font-size: .92rem; color: var(--grafito-2); }
.enlace-icono { display: grid; place-items: center; width: 40px; height: 40px; color: var(--texto-2); border-radius: var(--radio); }
.enlace-icono:hover { background: var(--papel); color: var(--grafito); }
.acciones { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 16px; }
.acciones form { margin: 0; }
.acciones--fin { justify-content: flex-end; }
.barra-acciones { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; justify-content: flex-end; padding: 20px 0 0; margin-top: 8px; border-top: 1px solid var(--linea); }
.barra-acciones form { margin: 0; }
.barra-acciones > :first-child { margin-right: auto; }

/* --- Formularios ------------------------------------------------------------------- */
.formulario { display: flex; flex-direction: column; gap: 16px; }
.formulario--ancho { max-width: none; }
.campo { display: flex; flex-direction: column; gap: 6px; }
.campo > label, .campo > span:not(.sr) { font-weight: 500; font-size: .92rem; }
.campo label em { font-style: normal; color: var(--tenue); font-weight: 400; }
input[type=text], input[type=password], input[type=email], input[type=search], input[type=date], input[type=number], select, textarea {
  width: 100%; min-height: 46px; padding: 10px 12px; border: 1.5px solid var(--linea-fuerte); border-radius: var(--radio);
  background: #fff; color: var(--grafito); font: 400 1rem var(--sans);
}
textarea { min-height: 90px; resize: vertical; }
input:focus, select:focus, textarea:focus { border-color: var(--info); outline: none; box-shadow: var(--sombra-foco); }
.campo--error input, .campo--error select, .campo--error textarea { border-color: var(--error); }
.campo__error { color: var(--error); display: flex; gap: 6px; align-items: center; font-size: .86rem; }
.ayuda { color: var(--tenue); font-size: .84rem; }
.campo--check label { display: flex; align-items: center; gap: 10px; font-weight: 500; cursor: pointer; }
.campo--check input { width: 20px; height: 20px; accent-color: var(--grafito); }
.campo--buscar { position: relative; flex: 1 1 260px; }
.campo--buscar .i { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--tenue); }
.campo--buscar input { padding-left: 40px; }
.filtros { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 20px; }
.filtros .campo { flex-direction: row; align-items: center; gap: 8px; }
.filtros select { min-width: 190px; }
.etiqueta-corta { font-size: .85rem; color: var(--texto-2); }
input[type=file] { font: 400 .9rem var(--sans); max-width: 100%; }

/* --- Listas con casillas ------------------------------------------------------------- */
.lista-check { display: flex; flex-direction: column; border: 1px solid var(--linea-fuerte); background: var(--superficie); }
.item-check { display: flex; align-items: center; gap: 14px; padding: 12px 14px; cursor: pointer; position: relative; }
.item-check + .item-check { border-top: 1px solid var(--linea); }
.item-check:hover { background: #fff; }
.item-check input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.item-check__caja { flex: none; width: 22px; height: 22px; border: 1.5px solid var(--grafito-2); background: #fff; display: grid; place-items: center; }
.item-check input:checked + .item-check__caja { background: var(--grafito); border-color: var(--grafito); }
.item-check input:checked + .item-check__caja::after { content: ""; width: 10px; height: 6px; border: solid #fff; border-width: 0 0 2px 2px; transform: rotate(-45deg) translate(1px, -1px); }
.item-check input:focus-visible + .item-check__caja { box-shadow: var(--sombra-foco); }
.item-check:has(input:checked) { background: #fff; box-shadow: inset 3px 0 0 var(--grafito); }
.item-check__texto { display: flex; flex-direction: column; gap: 1px; flex: 1; min-width: 0; }
.item-check__texto small { color: var(--texto-2); overflow-wrap: anywhere; }
.item-check__texto small.mono { color: var(--tenue); font-size: .76rem; }

/* --- Carga de archivos ------------------------------------------------------------------ */
.zona-carga { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; text-align: center; padding: 34px 20px; border: 1.5px dashed var(--linea-fuerte); background: var(--superficie); cursor: pointer; transition: border-color .12s, background .12s; }
.zona-carga:hover, .zona-carga.sobre { border-color: var(--grafito); background: #fff; }
.zona-carga small { color: var(--tenue); }
.zona-carga input[type=file] { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; }
.zona-carga--compacta { flex-direction: row; padding: 14px 18px; gap: 10px; }
.lista-elegidos { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.lista-elegidos li { display: flex; align-items: center; gap: 8px; font-size: .9rem; padding: 6px 10px; background: #fff; border: 1px solid var(--linea); }
.lista-elegidos li .tenue { margin-left: auto; font-family: var(--mono); font-size: .8rem; }
.carga--linea { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-start; }
.carga--linea .zona-carga { flex: 1 1 260px; }
.carga--linea .lista-elegidos { flex-basis: 100%; order: 3; margin: 0; }

/* --- Tablas --------------------------------------------------------------------------------- */
.tabla-envoltura { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.tabla { width: 100%; border-collapse: collapse; font-size: .92rem; background: var(--superficie); }
.tabla th { text-align: left; font-weight: 500; font-size: .74rem; letter-spacing: .08em; text-transform: uppercase; color: var(--texto-2); padding: 10px 12px; border-bottom: 1.5px solid var(--grafito); white-space: nowrap; background: var(--papel); }
.tabla td { padding: 10px 12px; border-bottom: 1px solid var(--linea); vertical-align: middle; }
.tabla tbody tr:hover td { background: #fff; }
.tabla .der { text-align: right; }
.tabla .cen { text-align: center; }
.tabla tfoot td { font-weight: 600; border-bottom: 1px solid var(--linea); background: var(--papel); }
.tabla tfoot tr.total td { border-top: 1.5px solid var(--grafito); border-bottom: 1.5px solid var(--grafito); background: #EAE6DC; font-size: 1rem; }
.tabla--mini { font-size: .85rem; }
.tabla--mini th, .tabla--mini td { padding: 7px 10px; }
.acciones-fila { white-space: nowrap; }
.acciones-fila > form, .acciones-fila > details { display: inline-block; vertical-align: middle; margin: 2px 0 2px 4px; }
.acciones-fila > a.btn { display: inline-flex; vertical-align: middle; margin: 2px 0 2px 4px; }
.archivo-nombre { display: inline-flex; gap: 6px; align-items: center; font-weight: 500; overflow-wrap: anywhere; }
.archivo-nombre a { text-decoration: none; }
.archivo-nombre a:hover { text-decoration: underline; }
.tabla td small.tenue { display: block; }
.fila--excluida td { color: var(--tenue); background: #EFECE5; }
.fila--error td:first-child { box-shadow: inset 3px 0 0 var(--error); }
.fila-detalle > td { background: var(--papel) !important; padding: 8px 12px 14px; }
.fila-detalle .aviso { margin: 6px 0; }
.origen { display: block; font-size: .74rem; margin-top: 2px; }
.reemplazo { position: relative; }
.reemplazo summary { list-style: none; }
.reemplazo summary::-webkit-details-marker { display: none; }
.reemplazo__form { position: absolute; right: 0; top: calc(100% + 6px); z-index: 5; width: min(360px, 82vw); background: #fff; border: 1.5px solid var(--grafito); padding: 14px; display: flex; flex-direction: column; gap: 10px; text-align: left; white-space: normal; box-shadow: 0 10px 24px rgba(35, 38, 42, .14); }
.detalle-lectura summary, .historial summary { cursor: pointer; font-size: .88rem; font-weight: 500; color: var(--grafito-2); padding: 6px 0; }
.detalle-lectura .tabla-envoltura { margin-top: 8px; }

/* --- Estados ------------------------------------------------------------------------------- */
.estado { display: inline-flex; align-items: center; gap: 6px; padding: 3px 9px 3px 8px; font-size: .78rem; font-weight: 500; border: 1px solid; border-radius: 2px; white-space: nowrap; line-height: 1.4; margin: 1px 4px 1px 0; }
a.estado { text-decoration: none; }
.estado::before { content: ""; width: 7px; height: 7px; background: currentColor; flex: none; }
.estado--ok, .estado--finalizada { color: var(--ok); background: var(--ok-fondo); border-color: var(--ok-linea); }
.estado--adv { color: var(--adv); background: var(--adv-fondo); border-color: var(--adv-linea); }
.estado--error { color: var(--error); background: var(--error-fondo); border-color: var(--error-linea); }
.estado--info, .estado--elaboracion { color: var(--info); background: var(--info-fondo); border-color: var(--info-linea); }
.estado--excluido { color: var(--texto-2); background: #ECE9E2; border-color: var(--linea-fuerte); }

/* --- Avisos --------------------------------------------------------------------------------- */
.avisos { display: flex; flex-direction: column; gap: 10px; margin-bottom: 22px; }
.aviso { display: flex; gap: 12px; align-items: flex-start; padding: 13px 16px; border: 1px solid; border-left-width: 4px; position: relative; font-size: .93rem; background: var(--superficie); }
.aviso + .aviso { margin-top: 8px; }
.avisos .aviso + .aviso { margin-top: 0; }
.aviso__icono { width: 22px; height: 22px; margin-top: 1px; }
.aviso__cuerpo { flex: 1; min-width: 0; }
.aviso__titulo { font-weight: 600; margin: 0; overflow-wrap: anywhere; }
.aviso__linea { margin: 3px 0 0; color: var(--grafito-2); overflow-wrap: anywhere; }
.aviso__linea span { font-weight: 600; }
.aviso__cerrar { background: none; border: 0; font-size: 1.3rem; line-height: 1; cursor: pointer; color: inherit; opacity: .55; padding: 0 2px; }
.aviso__cerrar:hover { opacity: 1; }
.aviso--ok { border-color: var(--ok-linea); border-left-color: var(--ok); background: var(--ok-fondo); }
.aviso--ok .aviso__icono { color: var(--ok); }
.aviso--adv { border-color: var(--adv-linea); border-left-color: var(--adv-boton); background: var(--adv-fondo); }
.aviso--adv .aviso__icono { color: var(--adv); }
.aviso--error { border-color: var(--error-linea); border-left-color: var(--error); background: var(--error-fondo); }
.aviso--error .aviso__icono { color: var(--error); }
.aviso--info { border-color: var(--info-linea); border-left-color: var(--info); background: var(--info-fondo); }
.aviso--info .aviso__icono { color: var(--info); }
.seccion > .aviso, form > .aviso { margin-bottom: 14px; }

/* --- Duplicados ------------------------------------------------------------------------------ */
.duplicado { border: 1px solid var(--adv-linea); border-left: 4px solid var(--adv-boton); background: var(--adv-fondo); padding: 16px; margin-bottom: 14px; }
.duplicado > header { display: flex; gap: 12px; align-items: flex-start; margin-bottom: 12px; }
.duplicado > header .i { width: 22px; height: 22px; color: var(--adv); margin-top: 1px; }
.duplicado h3 { overflow-wrap: anywhere; }
.duplicado header p { margin: 4px 0 0; color: var(--grafito-2); font-size: .92rem; }
.duplicado .tabla { background: #fff; }
.duplicado--revisado { border-color: var(--ok-linea); border-left-color: var(--ok); background: var(--ok-fondo); }
.duplicado--revisado > header .i { color: var(--ok); }
.precio-bloque, .ubicacion { display: block; white-space: nowrap; }
.totales-archivo span { display: block; white-space: nowrap; }
.totales-archivo em { font-style: normal; font-family: var(--sans); font-size: .76rem; color: var(--tenue); text-transform: capitalize; margin-right: 4px; }
.subtitulo-bloque { font-weight: 600; font-size: .85rem; margin: 12px 0 4px; }
.opcion-precio--total { flex-direction: column; gap: 10px; }
.opcion-precio__cabeza { display: flex; gap: 12px; align-items: flex-start; }
.opcion-precio__cifras { width: 100%; border-top: 1px solid var(--linea); padding-top: 8px; display: grid; grid-template-columns: auto 1fr; gap: 2px 10px; font-size: .88rem; }
.opcion-precio__cifras dt { color: var(--texto-2); }
.opcion-precio__cifras dd { margin: 0; text-align: right; font-family: var(--mono); }
.opcion-precio__cifras .total { font-weight: 600; font-size: 1.02rem; color: var(--grafito); }
.opcion-precio--deshabilitada { opacity: .6; cursor: not-allowed; background: #EFECE5; }
.opcion-precio--deshabilitada:hover { border-color: var(--linea-fuerte); background: #EFECE5; }
.opcion-precio__problema { color: var(--error); font-size: .82rem; }
.ubicacion { white-space: normal; overflow-wrap: anywhere; }

.cierre-paso { margin-top: 10px; }
.bloqueos { margin-bottom: 8px; }
.bloqueos .aviso { margin-top: 8px; }

/* --- Fichas ---------------------------------------------------------------------------------- */
.orden-fichas { list-style: none; margin: 0; padding: 0; counter-reset: ficha; border: 1px solid var(--linea-fuerte); background: var(--superficie); }
.orden-fichas li { display: flex; align-items: center; gap: 12px; padding: 10px 12px; counter-increment: ficha; }
.orden-fichas li + li { border-top: 1px solid var(--linea); }
.orden-fichas li:not(.vacio)::before { content: counter(ficha, decimal-leading-zero); font: 500 .85rem var(--mono); color: var(--tenue); width: 24px; }
.orden-fichas li span { flex: 1; font-weight: 500; overflow-wrap: anywhere; }
.orden-fichas li.vacio { color: var(--tenue); font-size: .92rem; }
.orden-fichas .btn { min-height: 34px; padding: 0 8px; }
.fichas .campo--buscar { margin-bottom: 12px; }

/* --- Revisión -------------------------------------------------------------------------------- */
.lista-simple { margin: 0 0 10px; padding-left: 0; list-style: none; }
.lista-simple li { display: flex; gap: 8px; align-items: baseline; padding: 7px 0; border-bottom: 1px solid var(--linea); overflow-wrap: anywhere; flex-wrap: wrap; }
ol.lista-simple { counter-reset: n; }
ol.lista-simple li::before { counter-increment: n; content: counter(n) "."; font: .85rem var(--mono); color: var(--tenue); width: 22px; }
.tabla-precios { margin-bottom: 26px; }
.tabla-precios h3 { margin-bottom: 8px; font-size: 1rem; letter-spacing: .02em; }
.resultado { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; border: 1.5px solid var(--ok); background: var(--ok-fondo); padding: 20px 22px; margin-bottom: 26px; }
.resultado > .i { color: var(--ok); }
.resultado > div:nth-child(2) { flex: 1 1 280px; }
.resultado h2 { font-family: var(--mono); font-weight: 400; font-size: 1.05rem; overflow-wrap: anywhere; }
.resultado__acciones { display: flex; gap: 10px; flex-wrap: wrap; }
.resultado__acciones form { margin: 0; }

/* --- Inicio ---------------------------------------------------------------------------------- */
.vacio { border: 1px dashed var(--linea-fuerte); padding: 28px; text-align: center; color: var(--texto-2); background: var(--superficie); }
.vacio p { margin: 0 0 4px; }
.vacio--filtro { margin-top: 10px; padding: 14px; }
.como-funciona { margin-top: 40px; }
.pasos-guia { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, 1fr); border-top: 1.5px solid var(--grafito); }
.pasos-guia li { padding: 14px 16px 0 0; font-size: .9rem; color: var(--texto-2); }
.pasos-guia span { display: block; font: 500 1.4rem var(--mono); color: var(--grafito); margin-bottom: 6px; }
.paginacion { display: flex; gap: 14px; align-items: center; justify-content: center; margin-top: 18px; font-size: .88rem; }

/* --- Administración ------------------------------------------------------------------------------ */
.pestanas { display: flex; gap: 0; border-bottom: 1.5px solid var(--grafito); margin-bottom: 26px; overflow-x: auto; }
.pestanas a { display: inline-flex; align-items: center; gap: 8px; padding: 12px 18px; text-decoration: none; font-weight: 500; font-size: .93rem; color: var(--texto-2); border: 1px solid transparent; border-bottom: 0; white-space: nowrap; }
.pestanas a:hover { color: var(--grafito); }
.pestanas a.activa { background: var(--grafito); color: #fff; }
.filtro-ver { display: flex; gap: 14px; font-size: .88rem; margin-bottom: 12px; color: var(--tenue); }
.filtro-ver a { color: var(--texto-2); text-decoration: none; }
.filtro-ver a.activo { color: var(--grafito); font-weight: 600; text-decoration: underline; }
.bloques-lectura { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.bloque-lectura { border: 1px solid var(--linea-fuerte); background: var(--superficie); padding: 14px; margin: 0; min-width: 0; }
.bloque-lectura legend { font-weight: 600; padding: 0 6px; }
.rejilla-campos { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.campo--corto label { font-size: .82rem; }
.campo--corto input { min-height: 40px; font-family: var(--mono); text-transform: uppercase; }
.accion { font-weight: 500; }
.accion--ingreso_fallido, .accion--excel_eliminado { color: var(--error); }
.accion--word_generado { color: var(--ok); }
.pagina-error { max-width: 640px; padding-top: 20px; }
.pagina-error h1 { margin-bottom: 18px; }

/* --- Ingreso ---------------------------------------------------------------------------------- */
.pagina-ingreso { background: var(--superficie); }
.ingreso { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); min-height: 100vh; }
.ingreso__lado { background: var(--grafito); color: #F4F2EC; padding: 44px 48px; display: flex; flex-direction: column; justify-content: space-between; position: relative; overflow: hidden; }
.ingreso__marca { display: flex; align-items: center; gap: 12px; letter-spacing: .16em; font-size: .95rem; position: relative; z-index: 1; }
.ingreso__marca .marca__simbolo { color: #F4F2EC; width: 36px; height: 36px; }
.ingreso__trama { position: absolute; inset: 0; width: 100%; height: 100%; color: #F4F2EC; }
.ingreso__lema { position: relative; z-index: 1; font-size: 1.15rem; max-width: 32ch; line-height: 1.45; color: #DAD6CC; border-top: 1px solid rgba(244,242,236,.3); padding-top: 16px; margin: 0; }
.ingreso__form { display: grid; place-items: center; padding: 40px 24px; }
.ingreso__caja { width: 100%; max-width: 400px; }
.ingreso__caja h1 { margin-bottom: 22px; }
.ingreso__caja .aviso { margin-bottom: 16px; }

/* --- Diálogo de confirmación -------------------------------------------------------------------- */
.dialogo { border: 1.5px solid var(--grafito); border-radius: var(--radio); padding: 24px; width: min(480px, calc(100vw - 32px)); background: var(--superficie); color: var(--grafito); box-shadow: 0 20px 50px rgba(0,0,0,.25); }
.dialogo::backdrop { background: rgba(35, 38, 42, .55); }
.dialogo h2 { margin-bottom: 10px; }
.dialogo p { color: var(--grafito-2); }

/* --- Adaptación a pantallas pequeñas ---------------------------------------------------------- */
@media (max-width: 1080px) {
  .menu__boton { display: inline-flex; align-items: center; gap: 8px; margin-left: auto; min-height: 44px; padding: 0 14px; background: var(--superficie); border: 1.5px solid var(--grafito); border-radius: var(--radio); font: 500 .95rem var(--sans); color: var(--grafito); cursor: pointer; }
  .menu__lista { display: none; position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; background: var(--superficie); border-bottom: 3px solid var(--grafito); padding: 8px 16px 16px; gap: 0; box-shadow: 0 14px 30px rgba(0,0,0,.12); }
  .barra--abierta .menu__lista { display: flex; }
  .menu__lista > a { min-height: 50px; border-bottom: 1px solid var(--linea); margin: 0; }
  .menu__lista > a.activo { border-bottom-color: var(--linea); box-shadow: inset 3px 0 0 var(--adv-boton); }
  .menu__usuario { margin: 12px 0 0; padding: 0; border: 0; flex-wrap: wrap; }
  .bloques-lectura { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .dos-columnas, .dos-columnas--ancha, .revision-grid, .opciones-precio { grid-template-columns: 1fr; }
  .pasos-guia { grid-template-columns: 1fr; }
  .pasos-guia li { display: flex; gap: 14px; align-items: baseline; padding: 10px 0; border-bottom: 1px solid var(--linea); }
  .pasos-guia span { margin: 0; font-size: 1rem; }
  .pasos ol { grid-template-columns: repeat(6, minmax(0, 1fr)); }
  .pasos em { display: none; }
  .pasos li.actual em { display: inline; }
  .pasos li.actual { grid-column: span 1; }
  .pasos a, .pasos span { justify-content: center; padding: 10px 6px; }
  .pasos__movil { display: block; }
  .pasos li.actual em { display: none; }
}
@media (max-width: 640px) {
  body { font-size: 15.5px; }
  .barra__interior { padding: 0 16px; gap: 12px; }
  .marca__texto { font-size: .82rem; }
  .contenido { padding: 22px 16px 44px; }
  .cabecera-cot { flex-direction: column; gap: 8px; }
  .cabecera-cot__estados { justify-content: flex-start; }
  .encabezado .btn-grande { width: 100%; }
  .filtros > * { flex: 1 1 100%; }
  .filtros select { min-width: 0; }
  .barra-acciones { flex-direction: column-reverse; align-items: stretch; }
  .barra-acciones > :first-child { margin-right: 0; }
  .barra-acciones .btn, .barra-acciones form, .barra-acciones form .btn { width: 100%; }
  .acciones .btn { flex: 1 1 auto; }
  .ingreso { grid-template-columns: 1fr; }
  .ingreso__lado { min-height: 190px; padding: 26px 20px; }
  .ingreso__lema { font-size: .98rem; }
  .ingreso__form { place-items: start center; padding: 28px 16px; }
  .aviso { padding: 12px; }
  /* Tablas apilables: cada fila se convierte en un bloque. */
  .tabla--apilable thead { display: none; }
  .tabla--apilable, .tabla--apilable tbody, .tabla--apilable tr, .tabla--apilable td { display: block; width: 100%; }
  .tabla--apilable tr { border: 1px solid var(--linea-fuerte); margin-bottom: 10px; background: var(--superficie); }
  .tabla--apilable td { border: 0; border-bottom: 1px solid var(--linea); padding: 8px 12px; text-align: left !important; }
  .tabla--apilable td[data-etiqueta]::before { content: attr(data-etiqueta); display: block; font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; color: var(--tenue); margin-bottom: 2px; }
  .tabla--apilable td:last-child { border-bottom: 0; }
  .tabla--archivos .acciones-fila { white-space: normal; }
  .tabla--apilable .fila-detalle { border-top: 0; margin-top: -11px; }
  .tabla--apilable td.der:empty { display: none; }
  .duplicado { padding: 12px; }
  .duplicado .tabla--apilable tr { background: #fff; }
  .acciones-fila > form, .acciones-fila > details, .acciones-fila > a { margin: 3px 4px 3px 0; }
  .reemplazo__form { position: static; width: auto; margin-top: 8px; box-shadow: none; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }
@media print { .barra, .pie, .barra-acciones, .pasos, .acciones { display: none !important; } body { background: #fff; } }
/* --- Ajustes oct-2026: selección de precio, filtros, administración y marca -------------- */

/* Tipo de precio: la opción elegida queda rellena en grafito. */
.opcion-precio:has(input:checked) { background: var(--grafito); border-color: var(--grafito); color: #fff; box-shadow: inset 0 -4px 0 var(--adv-boton); }
.opcion-precio:has(input:checked) .opcion-precio__texto small,
.opcion-precio:has(input:checked) .opcion-precio__cifras dt,
.opcion-precio:has(input:checked) .opcion-precio__cifras dd { color: #fff; }
.opcion-precio:has(input:checked) .opcion-precio__cifras { border-top-color: rgba(255, 255, 255, .28); }
.opcion-precio:has(input:checked) .opcion-precio__marca { border-color: #fff; background: #fff; }
.opcion-precio:has(input:checked) .opcion-precio__marca::after { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--adv-boton); }
.opcion-precio:has(input:checked):hover { background: #000; border-color: #000; }
.opcion-precio__sello { display: none; font-size: .78rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: #F2D29B; }
.opcion-precio:has(input:checked) .opcion-precio__sello { display: inline; }

/* Panel de filtros del historial y de la actividad. */
.panel-filtros { display: grid; grid-template-columns: minmax(240px, 2.2fr) repeat(4, minmax(130px, 1fr)) auto; gap: 12px; align-items: end; padding: 16px; background: var(--superficie); border: 1px solid var(--linea-fuerte); margin-bottom: 14px; }
.panel-filtros .campo { gap: 5px; min-width: 0; }
.etiqueta-filtro { font-size: .74rem; letter-spacing: .08em; text-transform: uppercase; color: var(--texto-2); font-weight: 500; }
.campo--buscar__caja { position: relative; display: block; }
.campo--buscar__caja .i { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--tenue); }
.campo--buscar__caja input { padding-left: 40px; }
.panel-filtros__acciones { display: flex; gap: 8px; }
.conteo-resultados { font-size: .88rem; color: var(--texto-2); margin: 0 0 10px; }
#tabla-historial td small, .tabla-adm td small { display: block; }

/* Administración: encabezado, paneles y formularios en rejilla. */
.adm-encabezado { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; margin-bottom: 16px; }
.adm-encabezado h1 { font-size: 1.55rem; margin-top: 4px; }
.adm-encabezado p { color: var(--texto-2); margin: 6px 0 0; max-width: 80ch; line-height: 1.7; }
.enlace-volver { display: inline-flex; align-items: center; gap: 6px; font-size: .88rem; color: var(--texto-2); text-decoration: none; }
.enlace-volver:hover { color: var(--grafito); text-decoration: underline; }
.panel { background: var(--superficie); border: 1px solid var(--linea-fuerte); padding: 22px 24px; display: flex; flex-direction: column; gap: 14px; }
.panel__titulo { display: flex; align-items: center; gap: 8px; font-size: 1.08rem; padding-bottom: 10px; border-bottom: 1px solid var(--linea); }
.panel__ayuda { color: var(--texto-2); font-size: .9rem; margin: -4px 0 0; }
.panel__acciones { display: flex; gap: 10px; justify-content: flex-end; flex-wrap: wrap; border-top: 1px solid var(--linea); margin-top: 4px; padding-top: 14px; }
.panel__acciones--inicio { justify-content: flex-start; border-top: 0; padding-top: 0; margin-top: 0; }
.panel__acciones form { margin: 0; }
.panel .aviso { margin: 0; }
.form-rejilla { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 20px; }
.form-rejilla .campo--ancho { grid-column: 1 / -1; }
.campo__etiqueta { font-weight: 500; font-size: .92rem; }
.campo__etiqueta em { font-style: normal; color: var(--tenue); font-weight: 400; }
.panel-alta { margin-bottom: 18px; }
.panel-alta > summary { list-style: none; width: max-content; }
.panel-alta > summary::-webkit-details-marker { display: none; }
.panel-alta[open] > summary { background: var(--superficie); color: var(--grafito); border-color: var(--linea-fuerte); }
.panel-alta[open] > summary .i { transform: rotate(45deg); }
.panel-alta > .panel { margin-top: 12px; border-color: var(--grafito); max-width: 860px; }
.columna-paneles { display: flex; flex-direction: column; gap: 18px; max-width: 860px; }
.tabla-adm .acciones-fila { white-space: nowrap; width: 1%; }
.celda-archivo { min-width: 260px; }
.archivo-meta { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; font-size: .82rem; color: var(--texto-2); text-decoration: none; margin-top: 4px; }
.archivo-meta span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 46ch; }
.archivo-meta:hover { color: var(--grafito); text-decoration: underline; }
.archivo-actual { display: flex; gap: 12px; align-items: center; padding: 12px 14px; background: #fff; border: 1px solid var(--linea); }
.archivo-actual .rotulo { display: block; margin-bottom: 2px; }
.archivo-actual a { font-weight: 500; overflow-wrap: anywhere; }
.filtro-ver { gap: 0; border: 1px solid var(--linea-fuerte); width: max-content; background: var(--superficie); margin-bottom: 12px; }
.filtro-ver a { padding: 7px 14px; }
.filtro-ver a + a { border-left: 1px solid var(--linea); }
.filtro-ver a.activo { background: var(--grafito); color: #fff; text-decoration: none; }

/* Logotipo y fondo. */
.rejilla-apariencia { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; align-items: start; }
.rejilla-apariencia form { display: flex; flex-direction: column; gap: 10px; }
.vista-previa { border: 1px dashed var(--linea-fuerte); background: #fff; min-height: 120px; display: grid; place-items: center; padding: 16px; text-align: center; }
.vista-previa--logo img { max-height: 80px; max-width: 100%; }
.vista-previa--fondo { min-height: 190px; background-size: cover; background-position: center; }
.marca__logo { height: 38px; width: auto; max-width: 200px; object-fit: contain; }
.marca__texto--solo { border-left: 1px solid var(--linea); padding-left: 12px; }
.ingreso__lado--foto { background-size: cover; background-position: center; }
.ingreso__lado--foto::before { content: ""; position: absolute; inset: 0; background: rgba(28, 30, 33, .58); }
.ingreso__marca--logo img { max-height: 64px; max-width: 260px; background: rgba(255, 255, 255, .92); padding: 10px 14px; }

/* Validación: acciones por archivo dentro de un posible duplicado. */
.acciones-duplicado { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }
.acciones-duplicado__archivo { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; background: #fff; border: 1px solid var(--adv-linea); padding: 10px 12px; }
.acciones-duplicado__archivo .acciones { margin: 0; }
.reemplazo__titulo { font-weight: 600; font-size: .88rem; margin: 0; }

@media (max-width: 1080px) {
  .panel-filtros { grid-template-columns: 1fr 1fr 1fr; }
  .panel-filtros__buscar { grid-column: 1 / -1; }
}
@media (max-width: 900px) {
  .rejilla-apariencia { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .panel-filtros { grid-template-columns: 1fr 1fr; }
  .panel-filtros__acciones { grid-column: 1 / -1; }
  .panel-filtros__acciones .btn { flex: 1; }
  .form-rejilla { grid-template-columns: 1fr; }
  .panel { padding: 16px; }
  .adm-encabezado { flex-direction: column; align-items: flex-start; }
  .panel-alta > summary { width: 100%; }
  .tabla-adm .acciones-fila { white-space: normal; width: auto; }
  .celda-archivo { min-width: 0; }
  .archivo-meta span { max-width: 30ch; }
  .marca__logo { height: 30px; max-width: 140px; }
}