/* Cotizaciones · Respuestas, Qué falta y Seguimiento. Solo variables y clases de estilos.css; las clases propias llevan el prefijo cot-. */

/* Cada pestaña responde al ancho de SU área, no al de la ventana */
.cot-resp, .cot-falt, .cot-seg { container: cotresp / inline-size; min-width: 0; }

/* ---------- Maestro y detalle ---------- */
.cot-resp-rejilla, .cot-falt-rejilla { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--e4); align-items: start; }
@container cotresp (min-width: 62rem) {
  .cot-resp-rejilla, .cot-falt-rejilla { grid-template-columns: minmax(15rem, 17.5rem) minmax(0, 1fr); }
  .cot-resp-lista, .cot-falt-lista { position: sticky; top: var(--e4); max-height: calc(100dvh - 2 * var(--e4)); overflow-y: auto; padding: 2px; margin: -2px; }
}
.cot-resp-lista, .cot-falt-lista { gap: var(--e3); min-width: 0; }
.cot-falt-titulo { margin: 0; font-size: var(--paso-1); font-weight: 700; }
.cot-prov { display: flex; flex-direction: column; gap: var(--e3); padding: var(--e3) var(--e4); border: 1px solid var(--ln); border-radius: 1rem; min-width: 0; transition: border-color 0.2s var(--salida); }
.cot-prov[data-actual="true"] { border-color: var(--bd); }
.cot-prov > header { align-items: flex-start; gap: var(--e2); }
.cot-prov > header strong { overflow-wrap: anywhere; }
.cot-versiones { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--e2); }
.cot-version, .cot-prov-boton {
  width: 100%; display: flex; flex-direction: column; align-items: flex-start; gap: 0.25rem; min-width: 0; text-align: left; cursor: pointer;
  padding: 0.6rem 0.85rem; background: transparent; color: var(--tx); border: 1px solid var(--ln); border-radius: 0.9rem; transition: border-color 0.2s var(--salida), background-color 0.2s var(--salida);
}
.cot-version > *, .cot-prov-boton > * { min-width: 0; overflow-wrap: anywhere; }
.cot-version:hover, .cot-prov-boton:hover { border-color: var(--tx); }
.cot-version[aria-pressed="true"], .cot-prov-boton[aria-pressed="true"] { border-color: var(--tx); background: var(--r2); box-shadow: inset 4px 0 0 var(--amarillo); }
.cot-version .icono { width: 1em; height: 1em; vertical-align: -0.12em; }

/* ---------- Carga de una respuesta ---------- */
.cot-cargar { border-color: var(--tx); }
.cot-cargar [role="tablist"] { margin-bottom: var(--e2); }
.cot-comunes { border: 1px solid var(--ln); border-radius: 1rem; padding: var(--e3) var(--e4); min-width: 0; margin: 0; }
.cot-comunes legend { padding: 0 var(--e2); }
.cot-tabla-manual input, .cot-tabla-manual select { min-height: 2.25rem; padding: 0.25rem 0.55rem; font-size: var(--paso--1); min-width: 0; }
.cot-tabla-manual select { padding-right: 1.9rem; }
.cot-tabla-manual td { vertical-align: top; }
.cot-simulado { display: flex; align-items: flex-start; gap: var(--e2); padding: var(--e2) var(--e3); border: 1px dashed var(--bd); border-radius: 0.8rem; font-size: var(--paso--1); line-height: 1.45; }
.cot-simulado .chip { flex: none; }

/* ---------- Filtros y búsqueda ---------- */
.cot-filtros { gap: var(--e2); }
.pestana.chica { padding: 0.3rem 0.85rem; font-size: var(--paso--1); border-color: var(--ln); }
.pestana.chica:hover { border-color: var(--tx); }
.cot-r-buscar { flex: 1 1 14rem; max-width: 22rem; margin-left: auto; }
.cot-filtro-prov { flex: 0 1 16rem; margin-left: auto; }

/* ---------- Tablas de revisión: la fila abierta muestra cada dato con su estado ---------- */
.cot-tabla-filas td, .cot-tabla-cambios td { vertical-align: top; }
.cot-tabla-filas tr[data-incluida="no"] > td { opacity: 0.62; }
.cot-conteos { gap: 0.3rem var(--e2); }
.cot-fila-detalle > td { padding: var(--e4); background: var(--r1); border-radius: 0.9rem; border-bottom: 0; opacity: 1; }
.tabla tbody tr.cot-fila-detalle:hover td { background: var(--r1); }
.cot-celdas { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 14.5rem), 1fr)); gap: var(--e3); min-width: 0; }
.cot-campo { display: flex; flex-direction: column; gap: 0.35rem; padding: var(--e3); min-width: 0; border: 1px solid var(--ln); border-radius: 0.85rem; background: var(--fondo); }
.cot-campo label, .cot-campo .etiqueta { font-size: var(--paso--1); font-weight: 700; color: var(--tx-2); letter-spacing: 0.02em; }
.cot-campo[data-estado="requiere_revision"] { border-color: var(--tx-2); box-shadow: inset 4px 0 0 var(--amarillo); }
.cot-campo[data-estado="inferido"] { border-color: var(--tx-2); box-shadow: inset 4px 0 0 var(--celeste); }
.cot-campo[data-estado="no_determinado"] { border-style: dashed; }
.cot-campo-estado { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem var(--e2); }
.cot-valor { font-weight: 600; overflow-wrap: anywhere; }
.cot-doble { display: grid; grid-template-columns: minmax(0, 1fr) 6.5rem; gap: var(--e2); }
.cot-evidencia, .cot-formula { display: flex; flex-direction: column; gap: var(--e2); padding: var(--e3) var(--e4); border: 1px solid var(--ln); border-radius: 0.85rem; background: var(--fondo); min-width: 0; }
.cot-evidencia p, .cot-formula p { margin: 0; }
.cot-r-pasos { margin: 0; padding-left: 1.25rem; display: flex; flex-direction: column; gap: 0.3rem; overflow-wrap: anywhere; }
.cot-r-mensaje { white-space: pre-wrap; overflow-wrap: anywhere; margin: 0; padding: var(--e3) var(--e4); background: var(--r2); border: 1px solid var(--ln); border-radius: 0.8rem; font: inherit; font-size: var(--paso--1); line-height: 1.5; max-height: 22rem; overflow: auto; }
.cot-sinleer { max-height: 14rem; overflow-y: auto; }
.cot-comparar { align-items: flex-end; }
.cot-comparar .campo { min-width: 7rem; }
.cot-pendiente { padding: var(--e2) var(--e3); border: 1px solid var(--tx-2); border-radius: 0.8rem; box-shadow: inset 4px 0 0 var(--amarillo); }

/* ---------- Confirmar: la barra queda a la vista mientras se revisa una lectura larga ---------- */
.cot-barra-confirmar { position: sticky; bottom: var(--e3); z-index: 3; padding: var(--e4); background: var(--fondo); border: 1px solid var(--tx-2); border-radius: 1rem; box-shadow: 0 -10px 26px rgb(0 0 0 / 0.22); }
.cot-barra-confirmar h3 { margin: 0; }
.cot-excluir { padding-top: var(--e3); border-top: 1px solid var(--ln); }

/* ---------- Qué falta ---------- */
.cot-falt-items .sellos { justify-content: flex-end; }
.cot-falt-items > li { align-items: flex-start; }
.cot-falt-datos { margin: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); gap: var(--e2) var(--e4); }
.cot-falt-datos > div { min-width: 0; }
.cot-falt-datos dt { font-size: var(--paso--1); font-weight: 700; color: var(--tx-2); }
.cot-falt-datos dd { margin: 0; overflow-wrap: anywhere; }
.cot-resultado { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e3); padding: var(--e3) var(--e4); border: 1px solid var(--tx-2); border-radius: 0.9rem; box-shadow: inset 4px 0 0 var(--celeste); }
.cot-resultado p { margin: 0; flex: 1 1 14rem; }

/* ---------- Seguimiento ---------- */
.cot-seg-sim { align-items: flex-end; }
.cot-seg-sim .campo { min-width: 15rem; }
.cot-seg-resultado { padding: var(--e3) var(--e4); border: 1px solid var(--tx-2); border-radius: 0.9rem; box-shadow: inset 4px 0 0 var(--celeste); }
.cot-seg-resultado h3, .cot-seg-resultado p { margin: 0; }
.cot-seg-razones > li { align-items: flex-start; }
.cot-seg-prov > li { align-items: flex-start; }
.cot-seg-prov-dato { gap: var(--e2); }
.cot-seg-pausa { align-items: flex-end; }
.cot-seg-pausa .campo { flex: 1 1 14rem; }
.cot-seg-prov-acc { justify-content: flex-end; }
.cot-tabla-pasos td { vertical-align: top; }
.cot-contenido { margin-top: var(--e2); }
.cot-contenido > summary { min-height: 2.1rem; font-size: var(--paso--1); }
.cot-seg-plan > summary { min-height: 2.75rem; }
.cot-seg-plan > summary h2, .cot-seg-ejemplos > summary h2 { display: inline; margin: 0; }
.cot-seg-pasos { border: 1px solid var(--ln); border-radius: 1rem; padding: var(--e3) var(--e4); margin: 0; min-width: 0; }
.cot-seg-paso { justify-content: space-between; padding: var(--e1) 0; }
.cot-seg-paso .opcion { flex: 1 1 14rem; align-items: center; }
.cot-seg-paso .campo { width: 6rem; }
details.mini.hoja > summary { padding-block: 0.2rem; }
details.mini.hoja[open] > summary { margin-bottom: var(--e3); }

/* WhatsApp simulado: las burbujas de la aplicación, con su pie que dice que no es real */
.cot-chat { list-style: none; margin: 0; padding: 0 var(--e1) 0 0; max-height: 34rem; }
.cot-burbuja { display: flex; flex-direction: column; gap: 0.3rem; min-width: 0; max-width: min(100%, 46ch); overflow-wrap: anywhere; white-space: normal; }
.cot-burbuja-cab { opacity: 0.9; }
.cot-burbuja-pie { opacity: 0.85; font-style: italic; }
.cot-adjunto { align-self: flex-start; color: inherit; border-color: currentColor; }

.cot-aviso { margin-top: 0; padding: var(--e2) var(--e3); border: 1px solid var(--ln); border-radius: 0.8rem; }

@media (max-width: 480px) {
  .cot-r-buscar, .cot-filtro-prov { flex-basis: 100%; max-width: none; margin-left: 0; }
  .cot-barra-confirmar { padding: var(--e3); }
  .cot-doble { grid-template-columns: minmax(0, 1fr) 5.5rem; }
  .cot-seg-sim .campo { min-width: 0; flex: 1 1 100%; }
}
@media (prefers-reduced-motion: reduce) { .cot-prov, .cot-version, .cot-prov-boton { transition: none; } }

/* ---------- Tablas propias: tabla con espacio, fichas apiladas cuando su caja es angosta ---------- */
.cot-tabla-caja { container: cottabla / inline-size; min-width: 0; overflow-x: auto; }
.cot-col-incluir { width: 4.5rem; }
.cot-r-tabla { table-layout: auto; }
.cot-r-tabla .num { white-space: nowrap; padding-right: var(--e3); }
.cot-r-tabla td, .cot-r-tabla th { min-width: 0; overflow-wrap: anywhere; }
.cot-r-tabla th { white-space: normal; overflow-wrap: normal; }
.cot-r-tabla th:last-child, .cot-r-tabla th.cot-col-incluir { white-space: nowrap; }
.cot-evid { color: var(--tx-3); }
@container cottabla (max-width: 699px) {
  .cot-r-tabla thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .cot-r-tabla, .cot-r-tabla tbody { display: block; }
  .cot-r-tabla tr { display: flex; flex-direction: column; gap: var(--e2); padding: var(--e4) 0; border-bottom: 1px solid var(--ln); }
  .cot-r-tabla td { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.2rem var(--e3); padding: 0; border: 0; min-width: 0; text-align: left; white-space: normal; }
  .cot-r-tabla tbody tr:hover td { background: transparent; }
  .cot-r-tabla td[data-etiqueta]::before { content: attr(data-etiqueta); flex: 0 0 6.5rem; color: var(--tx-2); font-size: var(--paso--1); font-weight: 700; }
  .cot-r-tabla td > * { min-width: 0; }
  .cot-r-tabla .num { text-align: left; padding-right: 0; }
  .cot-r-tabla tr.cot-fila-detalle { padding: 0; }
  .cot-r-tabla .cot-fila-detalle > td { display: block; padding: var(--e3); }
}
.cot-resp .pequeno > .icono, .cot-resp p > .icono, .cot-version .icono { display: inline-block; vertical-align: -0.18em; }

@container cottabla (min-width: 700px) { .cot-tabla-filas td[data-etiqueta="Detalle"], .cot-tabla-filas th:last-child { width: 1%; white-space: nowrap; } }
@container cottabla (max-width: 699px) { .cot-col-incluir { width: auto; } }

@media (max-height: 800px) { .cot-barra-confirmar { position: static; box-shadow: none; } }

/* La lista de proveedores: al lado en pantallas anchas; arriba y plegable en las angostas (así lo que se revisa se ve primero) */
.cot-maestro > summary { cursor: pointer; min-height: 2.75rem; display: flex; align-items: center; padding: 0.25rem var(--e4); border: 1px solid var(--ln); border-radius: 1rem; list-style: none; }
.cot-maestro > summary::-webkit-details-marker { display: none; }
.cot-maestro > summary::after { content: ""; flex: none; width: 0.5rem; height: 0.5rem; margin-left: auto; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; rotate: 45deg; translate: 0 -2px; transition: rotate 0.2s var(--salida); }
.cot-maestro[open] > summary::after { rotate: 225deg; translate: 0 1px; }
.cot-maestro > summary:hover { border-color: var(--tx); }
.cot-maestro-t { display: flex; flex-direction: column; min-width: 0; line-height: 1.3; }
.cot-maestro-t .pequeno { overflow-wrap: anywhere; }
.cot-maestro[open] > .apilar { margin-top: var(--e3); }
.cot-maestro-h { display: none; }
@container cotresp (min-width: 62rem) {
  .cot-maestro > summary { display: none; }
  .cot-maestro-h { display: block; }
  .cot-maestro[open] > .apilar { margin-top: 0; }
}
@media (prefers-reduced-motion: reduce) { .cot-maestro > summary::after { transition: none; } }

/* El título de una respuesta con sus sellos (estado y «Simulado»): en pantallas angostas los sellos se pasan a otra línea en vez de salirse de la hoja */
.hoja-titulo .sellos { max-width: 100%; min-width: 0; }