/* ==========================================================================
   Estilos por pantalla
   ========================================================================== */

/* ---------- Ingresar ---------- */
.pagina-ingreso {
  display: grid; place-items: center; min-height: 100vh; padding: var(--e5) var(--e4);
  background:
    radial-gradient(1200px 500px at 50% -10%, #FFFFFF 0%, transparent 60%),
    var(--fondo);
}
.pagina-ingreso .contenido { width: 100%; max-width: 400px; padding: 0; margin: 0 auto; }
.ingreso-marca { display: flex; align-items: center; justify-content: center; gap: 10px; margin-bottom: var(--e5); }
.ingreso-sello {
  width: 40px; height: 40px; border-radius: 10px; display: grid; place-items: center;
  background: var(--grafito); color: #fff; box-shadow: var(--sombra-2);
}
.ingreso-sello .icono { width: 22px; height: 22px; }
.ingreso-marca-texto { display: flex; flex-direction: column; line-height: 1.15; }
.ingreso-marca-texto strong { font-size: var(--t-l); font-weight: 700; }
.ingreso-marca-texto span { font-size: var(--t-xs); color: var(--texto-2); letter-spacing: .04em; }
.ingreso-card {
  background: var(--superficie); border: 1px solid var(--borde); border-radius: 14px;
  padding: var(--e6) var(--e6) var(--e5); box-shadow: var(--sombra-2);
}
.ingreso-card h1 { font-size: var(--t-xl); margin-bottom: var(--e1); }
.ingreso-card .subtitulo { color: var(--texto-2); font-size: 14px; margin-bottom: var(--e5); }
.ingreso-card .btn { margin-top: var(--e2); }
.ingreso-pie { margin-top: var(--e5); text-align: center; font-size: var(--t-xs); color: var(--texto-3); }
@media (max-width: 640px) {
  .ingreso-card { padding: var(--e5) var(--e4); }
}

/* ---------- Solo lectura ---------- */
.solo-lectura { max-width: 560px; margin: var(--e6) auto; }

/* ---------- Tablero de planta ---------- */
.tablero-cabeza { align-items: center; }
.tablero-botones { display: flex; gap: var(--e2); align-items: center; }
.avisos .aviso-icono { font-size: 13px; line-height: 1; }
.avisos-mas { flex-basis: 100%; }
.avisos-mas > summary {
  display: inline-flex; align-items: center; min-height: 32px; margin: 0;
  font-size: var(--t-s); font-weight: 600; color: var(--acento-tinta);
}
.avisos-mas > .avisos { margin: var(--e2) 0 0; }

.centro-bloque { margin-bottom: var(--e5); }
.centro-cabeza { display: flex; align-items: center; gap: var(--e3); flex-wrap: wrap; margin-bottom: var(--e3); }
.centro-cabeza h2 {
  margin: 0; font-size: var(--t-xs); font-weight: 700; color: var(--texto-2);
  text-transform: uppercase; letter-spacing: .08em;
}
.centro-bloque .maquinas { margin-bottom: 0; }
.maquina-cifras { display: block; }
.maquina-estado { margin-top: 2px; }
.maquina-estado .estado-icono, .centro-cabeza .estado-icono, .maquina-estados .estado-icono { font-size: 12px; }
.abreviatura { display: none; }
.estado-azul { background: var(--azul-fondo); color: var(--azul-tinta); border-color: var(--azul-borde); }
/* Servicios externos: sin semáforo de saturación; tarjeta con borde punteado */
.maquina-externa { border-style: dashed; box-shadow: none; }
.maquina-externa .maquina-iniciales { background: linear-gradient(135deg, #6B7280, #3B3F48); }
.maquina-externa .maquina-proveedor { color: var(--texto); font-weight: 500; }
.maquina-externa.maquina-rojo { border-color: var(--rojo-borde); }

/* ---------- Detalle de máquina ---------- */
.maquina-cabecera { align-items: center; }
.maquina-titulo { display: flex; align-items: center; gap: var(--e4); min-width: 0; }
.maquina-titulo .maquina-foto, .maquina-titulo .maquina-iniciales {
  width: 72px; height: 56px; flex: none; border-radius: var(--r); font-size: 20px;
}
.maquina-estados { display: flex; gap: var(--e2); flex-wrap: wrap; align-items: center; }
.grupo-ots h2 { font-size: var(--t-m); margin: var(--e5) 0 var(--e3); }
.grupo-ots:first-of-type h2 { margin-top: var(--e2); }
.grupo-vacio {
  padding: var(--e3) var(--e4); border: 1px dashed var(--borde-fuerte); border-radius: var(--r-l);
  color: var(--texto-2); font-size: 14px; background: var(--superficie-2);
}

/* ---------- Tabla de OTs (detalle de máquina y OTs abiertas) ---------- */
.tabla-ots td { vertical-align: middle; }
.tabla-ots .celda-ot a { font-weight: 600; white-space: nowrap; }
.tabla-ots .tabla-vacia { color: var(--texto-2); text-align: center; }
.ot-acciones { display: flex; flex-wrap: wrap; gap: var(--e2); align-items: center; }
.ot-acciones form { margin: 0; }
.ot-acciones .btn { min-height: 40px; }
.otra-fecha { margin-top: var(--e2); }
.otra-fecha > summary { display: inline-flex; align-items: center; min-height: 28px; margin: 0; font-size: var(--t-s); color: var(--texto-2); }
.otra-fecha[open] > summary { color: var(--texto); font-weight: 600; }
.otra-fecha form {
  display: grid; grid-template-columns: 1fr; gap: var(--e2);
  min-width: 220px; margin-top: var(--e2); padding: var(--e3);
  background: var(--superficie-2); border: 1px solid var(--borde); border-radius: var(--r);
}
.otra-fecha .campo { margin: 0; gap: 4px; }
.otra-fecha .campo > span { font-size: var(--t-xs); font-weight: 600; color: var(--texto-2); }
.otra-fecha .btn { min-height: 40px; }
/* Servicios externos: enviar / recibir con fechas */
.accion-externa { margin-top: var(--e3); }
.accion-externa > summary.btn { display: inline-flex; min-height: 40px; margin: 0; color: var(--acento-texto); }
.accion-externa[open] > summary.btn { color: var(--acento-texto); font-weight: inherit; }
.accion-externa form { max-width: 320px; }
.accion-externa-proveedor { margin: 0; font-weight: 600; }
.ot-proveedor { display: block; margin-top: 4px; font-size: var(--t-xs); color: var(--texto-2); }
.ot-proveedor .estado { margin-left: 4px; }

/* Celular: máquinas como lista con borde izquierdo del color del semáforo; OTs con botones grandes */
@media (max-width: 640px) {
  .tablero-cabeza { margin-bottom: var(--e3); }
  .tablero-nuevo { display: none; }
  /* En celular se ve la abreviatura; el texto completo queda solo para lectores de pantalla */
  .abreviatura { display: inline; }
  .texto-completo {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
  }
  .kpis-fila { gap: var(--e2); margin-bottom: var(--e3); }
  .kpi { padding: 10px var(--e3); }
  .kpi-valor { font-size: 22px; }
  .kpi-detalle { display: none; }
  .avisos { flex-direction: column; gap: 6px; }
  .avisos .aviso { border-radius: var(--r); padding: 8px 12px; }

  .maquinas { grid-template-columns: 1fr; gap: var(--e2); }
  .maquina {
    flex-direction: row; align-items: center; gap: var(--e3);
    padding: 10px var(--e3) 10px 10px; border-left-width: 4px;
  }
  .maquina-verde { border-left-color: var(--verde); }
  .maquina-amarillo { border-left-color: var(--amarillo); }
  .maquina-rojo { border-left-color: var(--rojo); }
  .maquina-gris { border-left-color: var(--gris); }
  .maquina-externa { border-left-style: solid; border-left-color: var(--borde-fuerte); }
  .maquina-externa.maquina-rojo { border-left-color: var(--rojo); }
  a.maquina:hover { transform: none; }
  .maquina .maquina-foto, .maquina .maquina-iniciales { width: 48px; height: 40px; flex: none; border-radius: var(--r-s); font-size: 15px; }
  .maquina .maquina-cuerpo {
    flex: 1; min-width: 0; padding: 0;
    display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: var(--e2); row-gap: 1px; align-items: center;
  }
  .maquina .maquina-nombre, .maquina .maquina-cifras { grid-column: 1; }
  .maquina .maquina-nombre { font-size: 14px; }
  .maquina .maquina-cifras { font-size: var(--t-xs); }
  .maquina .maquina-estado { grid-column: 2; grid-row: 1 / span 3; margin: 0; }
  .maquina .maquina-estado .estado { padding: 2px 8px; }

  .maquina-cabecera { gap: var(--e3); }
  .maquina-titulo .maquina-foto, .maquina-titulo .maquina-iniciales { width: 56px; height: 44px; font-size: 16px; }

  .tabla-ots td.celda-ot { font-size: var(--t-m); }
  .tabla.tabla-ots td.celda-acciones { display: block; padding-top: var(--e3); text-align: left; }
  .ot-acciones { display: grid; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); }
  .ot-acciones .btn { width: 100%; min-height: 48px; font-size: var(--t-m); }
  .otra-fecha > summary { min-height: 44px; }
  .otra-fecha form { min-width: 0; }
  .accion-externa > summary.btn { display: flex; justify-content: center; width: 100%; min-height: 48px; font-size: var(--t-m); }
  .accion-externa form { max-width: none; }
  .otra-fecha .btn { min-height: 48px; }
}

/* ---------- Utilidades de visibilidad ---------- */
.mostrar-cel { display: none; }
.cabecera-botones { display: flex; gap: var(--e2); align-items: center; flex-wrap: wrap; }
.cabecera-botones form { margin: 0; }

/* ---------- Lista de trabajos ---------- */
.filtros {
  display: flex; flex-wrap: wrap; align-items: center; gap: var(--e2);
  padding: var(--e3); margin-bottom: var(--e4);
  background: var(--superficie); border: 1px solid var(--borde); border-radius: var(--r-l); box-shadow: var(--sombra-1);
}
.filtros-buscar { position: relative; flex: 1 1 280px; min-width: 0; }
.filtros-buscar .icono { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); width: 18px; height: 18px; color: var(--texto-3); pointer-events: none; }
.filtros .filtros-buscar input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]) { padding-left: 38px; }
.filtros-mas { flex: 2 1 460px; min-width: 0; }
.filtros-mas > summary {
  display: inline-flex; align-items: center; gap: 6px; min-height: 40px; margin: 0; padding: 0 12px;
  border: 1px solid var(--borde-fuerte); border-radius: var(--r); background: var(--superficie);
  font-size: 14px; font-weight: 600; color: var(--texto); list-style: none;
}
.filtros-mas > summary .icono { width: 16px; height: 16px; }
.filtros-extra { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e2); }
.filtros-extra > label:not(.check) { flex: 1 1 180px; min-width: 0; }
.filtros-extra .check { white-space: nowrap; font-size: 14px; padding: 0 var(--e1); }
.filtros-botones { display: flex; gap: var(--e2); }
.filtros-botones .btn { min-height: 40px; }
@media (min-width: 641px) {
  .filtros-mas > summary { display: none; }
  /* Sin JS los filtros extra quedan visibles igual en PC */
  .filtros-mas::details-content { content-visibility: visible; display: contents; }
}

.tabla-trabajos td { vertical-align: middle; }
.tabla-trabajos .celda-codigo a { font-weight: 600; white-space: nowrap; }
.tabla-trabajos .celda-elemento { font-weight: 500; }
.tabla-vacia { color: var(--texto-2); text-align: center; }

/* ---------- Ficha de trabajo ---------- */
.ficha-cabecera { align-items: flex-end; }
.ficha-titulo h1 { margin-bottom: var(--e2); }
.ficha-codigo {
  display: block; margin-bottom: 2px;
  font-size: var(--t-s); font-weight: 600; letter-spacing: .04em; color: var(--texto-2); font-variant-numeric: tabular-nums;
}
.ficha-sub { display: flex; align-items: center; gap: var(--e3); flex-wrap: wrap; }
.ficha-sub .subtitulo { margin: 0; font-size: 14px; color: var(--texto-2); }

.datos {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: var(--e3) var(--e5);
  margin: 0 0 var(--e4);
}
.datos dt { font-size: 11px; font-weight: 600; color: var(--texto-2); text-transform: uppercase; letter-spacing: .06em; }
.datos dd { margin: 2px 0 0; font-weight: 500; }
.datos .datos-ancho { grid-column: 1 / -1; padding-top: var(--e3); border-top: 1px solid var(--borde); }
.datos .datos-ancho dd { font-weight: 400; }

/* Ruta visual: pasos conectados, uno por OT */
.ruta-card { margin-bottom: var(--e4); }
.ruta-card h2 { margin: 0 0 var(--e4); font-size: var(--t-m); }
.ruta { display: flex; margin: 0; padding: 0; list-style: none; overflow-x: auto; }
.ruta-paso { position: relative; flex: 1 1 0; min-width: 190px; display: flex; flex-direction: column; gap: var(--e2); padding-right: var(--e4); }
.ruta-paso:not(:last-child)::after {
  content: ""; position: absolute; left: 40px; right: 8px; top: 15px; height: 2px; border-radius: 2px; background: var(--borde-fuerte);
}
.ruta-paso.ruta-terminada:not(:last-child)::after { background: var(--verde); }
.ruta-num {
  position: relative; z-index: 1;
  width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center;
  background: var(--superficie); border: 2px solid var(--borde-fuerte); color: var(--texto-2);
  font-size: 14px; font-weight: 700; font-variant-numeric: tabular-nums;
}
.ruta-terminada .ruta-num { background: var(--verde); border-color: var(--verde); color: #fff; }
.ruta-en_proceso .ruta-num { background: var(--verde-fondo); border-color: var(--verde); color: var(--verde-tinta); }
.ruta-pausada .ruta-num { background: var(--amarillo-fondo); border-color: var(--amarillo); color: var(--amarillo-tinta); }
.ruta-en_cola .ruta-num { background: var(--azul-fondo); border-color: var(--azul-tinta); color: var(--azul-tinta); }
.ruta-en_proveedor .ruta-num { background: var(--azul-fondo); border-color: var(--azul-tinta); border-style: dashed; color: var(--azul-tinta); }
.ruta-anulada .ruta-num { background: var(--gris-fondo); border-style: dashed; }
.ruta-anulada .ruta-centro { text-decoration: line-through; color: var(--texto-2); }
.ruta-cuerpo { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.ruta-centro { font-weight: 700; }
.ruta-ops { margin: 0; padding: 0; list-style: none; font-size: var(--t-s); color: var(--texto); }
.ruta-ops span { color: var(--texto-2); }
.ruta-pie { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 2px; }
.ruta-codigo { font-size: var(--t-xs); font-weight: 600; color: var(--texto-2); font-variant-numeric: tabular-nums; }

.ficha-columnas { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: var(--e5); align-items: start; }
.ficha-columnas > section > h2 { margin-top: 0; font-size: var(--t-m); }
.ot-card { padding: var(--e4); }
.ot-card + .ot-card { margin-top: var(--e3); }
.ot-card-cabeza { display: flex; align-items: flex-start; gap: var(--e3); }
.ot-num {
  flex: none; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center;
  background: var(--grafito); color: #fff; font-size: 13px; font-weight: 700;
}
.ot-card-titulo { flex: 1; min-width: 0; }
.ot-card-titulo h3 { margin: 0; font-size: var(--t-m); font-weight: 700; font-variant-numeric: tabular-nums; }
.ot-card-titulo p { margin: 0; font-size: var(--t-s); color: var(--texto-2); }
.ot-cifras { display: flex; flex-wrap: wrap; gap: var(--e2) var(--e5); margin: var(--e3) 0; padding: var(--e2) 0; border-top: 1px solid var(--borde); border-bottom: 1px solid var(--borde); }
.ot-cifras dt { font-size: 11px; font-weight: 600; color: var(--texto-2); text-transform: uppercase; letter-spacing: .06em; }
.ot-cifras dd { margin: 0; font-weight: 600; font-variant-numeric: tabular-nums; }
.ot-desplegables { display: flex; flex-direction: column; gap: var(--e1); margin-top: var(--e3); }
.desplegable { border-top: 1px dashed var(--borde); padding-top: var(--e1); }
.desplegable > summary {
  display: flex; align-items: center; gap: 6px; min-height: 32px; margin: 0; list-style: none;
  font-size: var(--t-s); font-weight: 600; color: var(--texto-2);
}
.contenido .desplegable > summary::after { margin-left: auto; }
.desplegable[open] > summary { color: var(--texto); }
.desplegable-marca { font-weight: 500; color: var(--acento-tinta); }
.desplegable form {
  display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--e2);
  margin: var(--e1) 0 var(--e2); padding: var(--e3);
  background: var(--superficie-2); border: 1px solid var(--borde); border-radius: var(--r);
}
.desplegable .campo { flex: 1 1 220px; margin: 0; gap: 4px; }
.desplegable .campo > span { font-size: var(--t-xs); font-weight: 600; color: var(--texto-2); }
.desplegable textarea { min-height: 64px; }
.ot-obs { margin: 0; font-size: 14px; }

.linea-tiempo { margin: 0; padding: 0; list-style: none; }
.evento { position: relative; display: flex; gap: var(--e3); padding-bottom: var(--e4); }
.evento:last-child { padding-bottom: 0; }
.evento:not(:last-child)::before {
  content: ""; position: absolute; left: 5px; top: 16px; bottom: 0; width: 2px; background: var(--borde);
}
.evento-punto { flex: none; width: 12px; height: 12px; margin-top: 5px; border-radius: 50%; background: var(--gris); box-shadow: 0 0 0 3px var(--superficie); position: relative; }
.evento-terminada .evento-punto, .evento-en_proceso .evento-punto { background: var(--verde); }
.evento-pausada .evento-punto { background: var(--amarillo); }
.evento-en_cola .evento-punto, .evento-en_proveedor .evento-punto { background: var(--azul-tinta); }
.evento-anulada .evento-punto { background: var(--rojo); }
.evento-cuerpo { min-width: 0; }
.evento-titulo { font-size: 14px; }
.evento-titulo .pill { margin-left: 4px; padding: 0 8px; }
.evento-meta { font-size: var(--t-xs); color: var(--texto-2); font-variant-numeric: tabular-nums; }

@media (max-width: 1100px) {
  .ficha-columnas { grid-template-columns: 1fr; }
}

/* ---------- Asistente de nuevo trabajo y edición de líneas ---------- */
.asistente { margin: 0; }
.grupo-form { margin: 0 0 var(--e4); padding: var(--e5); min-width: 0; }
.grupo-form > legend {
  float: left; width: 100%; padding: 0; margin: 0 0 var(--e4);
  font-size: var(--t-m); font-weight: 700;
}
.grupo-form > legend + * { clear: both; }
.legend-nota { margin-left: var(--e2); font-size: var(--t-xs); font-weight: 600; color: var(--texto-2); text-transform: uppercase; letter-spacing: .06em; }
.form-2col { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--e5); }
.form-2col .campo-ancho { grid-column: 1 / -1; }
.requerido { color: var(--rojo-tinta); }

.acciones-pie {
  position: sticky; bottom: 0; z-index: 5;
  display: flex; align-items: center; gap: var(--e2); flex-wrap: wrap;
  margin-top: var(--e4); padding: var(--e3) var(--e4);
  background: rgba(255, 255, 255, .94); backdrop-filter: blur(6px);
  border: 1px solid var(--borde); border-radius: var(--r-l); box-shadow: var(--sombra-2);
}
.acciones-pie-espacio { flex: 1; }
.acciones-pie .btn { min-height: 40px; }

/* Paso 2: ruta */
.ruta-grid { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: var(--e4); align-items: start; }
.ruta-grid .card + .card { margin-top: 0; }
.ruta-grid h2 { margin: 0 0 var(--e3); font-size: var(--t-m); }
.ruta-preview { position: sticky; top: var(--e4); }
.etapas { margin: 0 0 var(--e3); padding: 0; list-style: none; }
.etapa {
  display: grid; grid-template-columns: 32px minmax(0, 1fr) minmax(0, 1fr) 40px; gap: var(--e3); align-items: end;
  padding: var(--e3) 0; border-bottom: 1px solid var(--borde);
}
.etapa:first-child { padding-top: 0; }
.etapa-num {
  width: 32px; height: 32px; margin-bottom: 4px; border-radius: 50%; display: grid; place-items: center;
  background: var(--grafito); color: #fff; font-size: 14px; font-weight: 700;
}
.etapa-campo { margin: 0; gap: 4px; }
.etapa-campo label { font-size: var(--t-xs); font-weight: 600; color: var(--texto-2); }
.etapa .quitar { width: 40px; min-height: 40px; padding: 0; color: var(--texto-2); }
.etapa .quitar:hover { color: var(--rojo-tinta); background: var(--rojo-fondo); }
.etapa-error { grid-column: 2 / -1; }
.etapa-con-error select { border-color: var(--rojo); }
.btn-agregar { width: 100%; border-style: dashed; color: var(--texto-2); background: var(--superficie-2); }
.btn-agregar:hover { color: var(--texto); }

.preview-resumen { margin: 0 0 var(--e3); }
.preview-ots { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: var(--e2); }
.preview-ot { display: flex; gap: var(--e3); padding: var(--e3); border: 1px solid var(--borde); border-radius: var(--r); background: var(--superficie-2); }
.preview-num {
  flex: none; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center;
  background: var(--acento); color: var(--acento-texto); font-size: 12px; font-weight: 700;
}
.preview-cuerpo { min-width: 0; flex: 1; }
.preview-centro { display: flex; align-items: center; gap: var(--e2); font-weight: 600; margin-bottom: 4px; }
.preview-centro .pill { padding: 0 8px; font-variant-numeric: tabular-nums; }
.preview-maquinas { margin: 0; padding: 0; list-style: none; font-size: var(--t-s); }
.preview-maquinas li { display: flex; align-items: center; justify-content: space-between; gap: var(--e2); padding: 2px 0; }
.preview-vacia { margin: 0; color: var(--texto-2); font-size: 14px; }

/* Paso 3 y edición de líneas */
.ot-lineas { padding: 0; overflow: hidden; }
.ot-lineas + .ot-lineas { margin-top: var(--e4); }
.ot-lineas-cabeza {
  display: flex; align-items: flex-end; justify-content: space-between; gap: var(--e4); flex-wrap: wrap;
  padding: var(--e4) var(--e4) var(--e3);
}
.ot-lineas-titulo { display: flex; align-items: flex-start; gap: var(--e3); }
.ot-lineas-titulo .ot-num { margin-top: 1px; }
.ot-lineas-cabeza h2 { margin: 0; font-size: var(--t-m); }
.ot-lineas-cabeza p { margin: 0; font-size: var(--t-s); }
.campo-horas { margin: 0; gap: 4px; width: 200px; }
.campo-horas label { font-size: var(--t-xs); font-weight: 600; color: var(--texto-2); }
.ot-lineas > .mensaje { margin: 0 var(--e4) var(--e3); }
.tabla-lineas-caja { margin: 0; border: 0; border-top: 1px solid var(--borde); border-radius: 0; box-shadow: none; }
.tabla-lineas th { padding: 8px 4px; }
.tabla-lineas td { padding: 6px 4px; vertical-align: middle; }
.tabla-lineas input[type="number"] { -moz-appearance: textfield; appearance: textfield; }
.tabla-lineas input[type="number"]::-webkit-inner-spin-button, .tabla-lineas input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.tabla-lineas th:first-child, .tabla-lineas td:first-child { padding-left: var(--e4); }
.tabla-lineas th:last-child, .tabla-lineas td:last-child { padding-right: var(--e4); }
.tabla-lineas tbody tr:hover td { background: transparent; }
.tabla-lineas input:not([type="checkbox"]), .tabla-lineas select {
  min-height: 36px; padding: 6px 8px; font-size: 14px;
}
.tabla-lineas select { padding-right: 26px; background-position: right 8px center; }
.tabla-lineas .linea-n { width: 1%; color: var(--texto-2); font-weight: 600; font-variant-numeric: tabular-nums; }
.tabla-lineas .c-corto input { min-width: 56px; }
.tabla-lineas .c-dim input { min-width: 76px; }
.tabla-lineas .c-peso input { min-width: 84px; }
.tabla-lineas .c-tipo select { min-width: 124px; }
.tabla-lineas .c-medio select { min-width: 116px; }
.tabla-lineas .c-largo input { min-width: 120px; }
.tabla-lineas .c-extra input { min-width: 90px; }
.tabla-lineas .c-check { text-align: center; }
.tabla-lineas .c-check input { margin: 0; }
.tabla-lineas .linea-con-error td { background: var(--rojo-fondo); }
.tabla-lineas .linea-errores td { padding-top: 0; background: var(--rojo-fondo); border-bottom: 1px solid var(--rojo-borde); }
.btn-copiar { margin: var(--e3) var(--e4) var(--e4); }

/* Celular: ficha en una columna, ruta vertical, etapas y líneas como tarjetas, acciones fijas al pie */
@media (max-width: 640px) {
  .mostrar-cel { display: inline-flex; }
  .ocultar-cel { display: none !important; }

  .filtros { padding: var(--e2); gap: var(--e2); }
  .filtros-buscar { flex-basis: 100%; }
  .filtros-mas { flex: 1 1 auto; }
  .filtros-mas[open] { flex-basis: 100%; order: 3; }
  .filtros-mas[open] > summary { margin-bottom: var(--e2); }
  .filtros-extra { flex-direction: column; align-items: stretch; }
  .filtros-extra > label:not(.check) { flex: none; }
  .filtros-extra .check { min-height: 40px; }
  .filtros-botones { margin-left: auto; }

  .tabla.tabla-trabajos td.celda-codigo { justify-content: space-between; align-items: center; font-size: var(--t-m); padding-bottom: var(--e2); }
  .tabla.tabla-trabajos td.celda-elemento { font-weight: 600; }
  .tabla.tabla-trabajos td:nth-last-child(2) { border-bottom: 0; }

  .ficha-cabecera { align-items: stretch; }
  .ficha-cabecera .cabecera-botones { width: 100%; }
  .ficha-cabecera .cabecera-botones > * { flex: 1; }
  .ficha-cabecera .cabecera-botones .btn { width: 100%; min-height: 44px; }
  .datos { grid-template-columns: 1fr 1fr; gap: var(--e3); }

  .ruta { flex-direction: column; overflow: visible; }
  .ruta-paso { flex-direction: row; min-width: 0; gap: var(--e3); padding: 0 0 var(--e4); }
  .ruta-paso:last-child { padding-bottom: 0; }
  .ruta-paso:not(:last-child)::after { left: 15px; right: auto; top: 36px; bottom: 4px; width: 2px; height: auto; }
  .ruta-cuerpo { padding-top: 4px; }

  .ot-card-cabeza { flex-wrap: wrap; }
  .ot-card-cabeza > .estado { margin-left: 40px; }
  .ot-acciones { display: grid; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); }
  .ot-acciones .btn { width: 100%; min-height: 48px; font-size: var(--t-m); }
  .desplegable > summary { min-height: 44px; }
  .desplegable form .btn { width: 100%; min-height: 44px; }

  .grupo-form { padding: var(--e4); }
  .form-2col { grid-template-columns: minmax(0, 1fr); }

  .acciones-pie {
    bottom: calc(var(--alto-bottom) + env(safe-area-inset-bottom, 0px) + var(--e2));
    padding: var(--e2);
  }
  .acciones-pie-espacio { display: none; }
  .acciones-pie .btn { flex: 1 1 auto; min-height: 48px; }
  .acciones-pie .btn-fantasma { flex: none; }
  .acciones-pie .btn-primario { flex: 1 1 auto; }
  .acciones-pie:has(> :nth-child(4)) .btn-primario { flex-basis: 100%; order: 3; }

  .ruta-grid { grid-template-columns: 1fr; }
  .ruta-preview { position: static; }
  .etapa { grid-template-columns: 32px minmax(0, 1fr) 44px; align-items: start; row-gap: var(--e2); }
  .etapa-num { margin: 0; }
  .etapa-campo { grid-column: 2; }
  .etapa .quitar { grid-column: 3; grid-row: 1; width: 44px; min-height: 44px; }
  .etapa-error { grid-column: 2 / -1; }

  .ot-lineas { background: transparent; border: 0; box-shadow: none; overflow: visible; }
  .ot-lineas-cabeza {
    padding: var(--e3); margin-bottom: var(--e2);
    background: var(--superficie); border: 1px solid var(--borde); border-radius: var(--r-l);
  }
  .campo-horas { width: 100%; }
  .tabla-lineas-caja { border: 0; }
  .tabla.tabla-lineas tr.linea {
    display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--e2);
    padding: var(--e3);
  }
  .tabla.tabla-lineas td { display: flex; flex-direction: column; align-items: stretch; gap: 3px; padding: 0 !important; border: 0; text-align: left; }
  .tabla.tabla-lineas td[data-label]::before { padding: 0; font-size: 10px; }
  .tabla.tabla-lineas td.linea-n { grid-column: 1 / -1; flex-direction: row; justify-content: flex-start; font-size: 14px; color: var(--texto); padding-bottom: 6px !important; border-bottom: 1px solid var(--borde); }
  .tabla.tabla-lineas td.c-tipo { grid-column: span 3; }
  .tabla.tabla-lineas td.c-medio, .tabla.tabla-lineas td.c-peso, .tabla.tabla-lineas td.c-extra { grid-column: span 2; }
  .tabla.tabla-lineas td.c-largo { grid-column: 1 / -1; }
  .tabla.tabla-lineas td.c-check { flex-direction: row-reverse; justify-content: flex-end; align-items: center; gap: var(--e2); min-height: 44px; }
  .tabla.tabla-lineas td.c-check::before { font-size: 12px; text-transform: none; letter-spacing: 0; color: var(--texto); }
  .tabla-lineas .c-corto input, .tabla-lineas .c-dim input, .tabla-lineas .c-peso input,
  .tabla-lineas .c-tipo select, .tabla-lineas .c-medio select, .tabla-lineas .c-largo input, .tabla-lineas .c-extra input { width: 100%; min-width: 0; }
  .tabla-lineas input:not([type="checkbox"]), .tabla-lineas select { min-height: 44px; font-size: var(--t-m); }
  .tabla.tabla-lineas tr.linea-errores { margin-top: calc(-1 * var(--e2) - 1px); border-top: 0; border-radius: 0 0 var(--r-l) var(--r-l); background: var(--rojo-fondo); }
  .tabla-lineas .linea-con-error td { background: transparent; }
  .tabla.tabla-lineas tr.linea-con-error { border-color: var(--rojo-borde); }
  .btn-copiar { width: 100%; margin: 0 0 var(--e2); min-height: 48px; }
}

/* ---------- Modo TV: tablero a pantalla completa, tipografía mayor ---------- */
.modo-tv .contenido { max-width: none; padding: var(--e5) var(--e6); }
.modo-tv .tablero-cabeza h1 { font-size: 36px; }
.modo-tv .tablero-cabeza .subtitulo { font-size: var(--t-l); }
.modo-tv .kpis-fila { gap: var(--e4); margin-bottom: var(--e5); }
.modo-tv .kpi { padding: var(--e4) var(--e5); }
.modo-tv .kpi-etiqueta { font-size: 15px; }
.modo-tv .kpi-valor { font-size: 48px; }
.modo-tv .kpi-detalle { font-size: var(--t-m); }
.modo-tv .aviso { font-size: 18px; padding: 8px 18px; }
.modo-tv .avisos-mas > summary { font-size: 18px; }
.modo-tv .centro-cabeza h2 { font-size: 18px; }
.modo-tv .estado { font-size: 16px; padding: 3px 12px; }
.modo-tv .estado .estado-icono { font-size: 16px; }
.modo-tv .maquinas { grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: var(--e4); }
.modo-tv .maquina-foto, .modo-tv .maquina-iniciales { height: 130px; font-size: 44px; }
.modo-tv .maquina-cuerpo { padding: var(--e4); gap: var(--e2); }
.modo-tv .maquina-nombre { font-size: 22px; }
.modo-tv .maquina-cifras { font-size: 18px; }


/* ---------- Paginación (lista de trabajos) ---------- */
@media (max-width: 640px) {
  .paginacion { justify-content: space-between; gap: var(--e2); }
  .paginacion .btn { min-height: 44px; }
}

/* ---------- KPIs ---------- */
.filtros-kpis { align-items: flex-end; }
.filtro-campo { display: flex; flex-direction: column; gap: 4px; flex: 0 1 180px; min-width: 0; }
.filtro-campo > span { font-size: var(--t-xs); font-weight: 600; color: var(--texto-2); }
.filtros-kpis .btn { min-height: 40px; }
.kpi-valor-texto { font-size: var(--t-xl); line-height: 1.25; padding: 3px 0 2px; overflow-wrap: anywhere; }
.kpi-unidad { font-size: var(--t-m); font-weight: 600; color: var(--texto-2); }

.kpis-secciones { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e4); align-items: start; }
.kpis-secciones > .card + .card { margin-top: 0; }
.kpi-seccion-ancha { grid-column: 1 / -1; }
.kpi-seccion .card-titulo h2 { font-size: var(--t-m); }
.kpi-seccion .resumen { font-size: 14px; }
.tabla-caja-interna { box-shadow: none; margin-bottom: 0; }
.kpi-seccion .desplegable { margin-top: var(--e3); }
.kpi-seccion .desplegable .tabla-caja { margin-top: var(--e2); max-height: 320px; overflow-y: auto; }

/* Barras horizontales con el color de acento */
.tabla-barras { margin-bottom: 0; }
.tabla-barras td { vertical-align: middle; }
.tabla-barras th:first-child, .tabla-barras td:first-child { padding-left: 0; }
.tabla-barras th:last-child, .tabla-barras td:last-child { padding-right: 0; }
.tabla-barras th { background: transparent; }
.tabla-barras tbody tr:hover td { background: transparent; }
.tabla-barras .barra-nombre { font-weight: 600; }
.tabla-barras .col-barra { width: 40%; }
.barra-unidad, .barra-etiqueta { display: none; }
.barra-pista { height: 10px; border-radius: var(--r-pill); background: var(--gris-fondo); overflow: hidden; }
.barra { height: 100%; min-width: 3px; border-radius: var(--r-pill); background: var(--acento); }

/* Calendario de saturación */
.leyenda { display: flex; flex-wrap: wrap; gap: var(--e2) var(--e4); margin: 0 0 var(--e3); padding: 0; list-style: none; font-size: var(--t-s); color: var(--texto-2); }
.leyenda li { display: inline-flex; align-items: center; gap: 6px; }
.tabla-saturacion td { vertical-align: middle; }
.tabla-saturacion .celda-principal { font-weight: 600; white-space: nowrap; }
.calendario { display: flex; gap: 3px; flex-wrap: wrap; }
.dia { display: inline-block; flex: none; width: 12px; height: 12px; border-radius: 3px; background: var(--verde); }
.dia-amarillo { background: var(--amarillo); }
.dia-rojo { background: var(--rojo); }
.dia-gris { background: var(--superficie); box-shadow: inset 0 0 0 2px var(--gris); }

@media (max-width: 1100px) {
  .kpis-secciones { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .filtros-kpis { display: grid; grid-template-columns: 1fr 1fr; }
  .filtro-campo:nth-child(3) { grid-column: 1 / -1; }
  .filtros-kpis .btn { grid-column: 1 / -1; min-height: 44px; }
  .kpi-valor-texto { font-size: var(--t-l); }

  /* Barras: nombre y valor arriba, barra a lo ancho debajo */
  .tabla.tabla-barras, .tabla-barras tbody { display: block; }
  .tabla-barras thead { display: none; }
  .tabla.tabla-barras tr {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: var(--e3); row-gap: 4px;
    padding: var(--e3) 0; border-bottom: 1px solid var(--borde);
  }
  .tabla.tabla-barras tr:last-child { border-bottom: 0; }
  .tabla.tabla-barras td { display: block; padding: 0; border: 0; }
  .tabla-barras .barra-nombre { grid-column: 1; }
  .tabla-barras .barra-valor { grid-column: 2; grid-row: 1; font-weight: 600; }
  .tabla-barras .barra-extra { grid-column: 1 / -1; text-align: left; font-size: var(--t-xs); color: var(--texto-2); }
  .tabla-barras .col-barra { grid-column: 1 / -1; width: auto; }
  .tabla.tabla-barras-clientes tr { grid-template-columns: auto auto minmax(0, 1fr) auto; }
  .tabla-barras-clientes .barra-nombre { grid-column: 1 / 4; }
  .tabla-barras-clientes .barra-valor { grid-column: 4; }
  .tabla-barras-clientes .barra-extra { grid-column: auto; grid-row: 2; padding-right: var(--e2); }
  .barra-unidad, .barra-etiqueta { display: inline; }

  .tabla.tabla-saturacion td.celda-calendario { display: block; }
  .tabla.tabla-saturacion td.celda-principal { font-size: var(--t-m); }
}

/* ---------- Configuración ---------- */
.config-grilla { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: var(--e3); }
.config-tarjeta {
  display: flex; align-items: flex-start; gap: var(--e3);
  padding: var(--e4); min-height: 96px;
  background: var(--superficie); border: 1px solid var(--borde); border-radius: var(--r-l); box-shadow: var(--sombra-1);
  color: var(--texto); text-decoration: none;
  transition: box-shadow .15s, border-color .15s, transform .15s;
}
.config-tarjeta:hover { color: var(--texto); border-color: var(--borde-fuerte); box-shadow: var(--sombra-2); transform: translateY(-1px); }
.config-icono {
  flex: none; width: 40px; height: 40px; border-radius: var(--r); display: grid; place-items: center;
  background: var(--grafito); color: #fff;
}
.config-icono .icono { width: 20px; height: 20px; }
.config-texto { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.config-texto strong { font-size: var(--t-m); }
.config-descripcion { font-size: var(--t-s); color: var(--texto-2); }

.tabla-config td { vertical-align: middle; }
.tabla-config .celda-principal a { font-weight: 600; }
.tabla-config .celda-acciones { width: 1%; text-align: right; }
.tabla-config .celda-acciones .btn { min-height: 32px; padding: 5px 12px; }

.color-fila { display: flex; align-items: center; gap: var(--e3); }
.color-fila input[type="color"] {
  width: 56px; height: 40px; padding: 3px; flex: none;
  border: 1px solid var(--borde-fuerte); border-radius: var(--r); background: var(--superficie); cursor: pointer;
}
.color-valor { font-size: 14px; font-weight: 600; color: var(--texto-2); }

/* Vista previa del acento: mini menú grafito + contenido claro */
.acento-muestra {
  grid-column: 1 / -1; display: grid; grid-template-columns: 180px minmax(0, 1fr);
  overflow: hidden; border: 1px solid var(--borde); border-radius: var(--r-l); margin-bottom: var(--e4);
}
.muestra-menu { display: flex; flex-direction: column; gap: 4px; padding: var(--e3); background: var(--grafito); color: var(--menu-texto); font-size: 13px; }
.muestra-marca { display: flex; align-items: center; gap: var(--e2); margin-bottom: var(--e2); color: #fff; font-weight: 700; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.muestra-sello {
  width: 22px; height: 22px; flex: none; border-radius: 5px; display: grid; place-items: center;
  background: var(--m-acento); color: var(--m-texto); font-size: 12px;
}
.muestra-item { padding: 6px 8px; border-left: 3px solid transparent; border-radius: 4px; }
.muestra-activo { background: var(--grafito-2); color: #fff; font-weight: 600; border-left-color: var(--m-claro); }
.muestra-contenido { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e3) var(--e4); padding: var(--e4); background: var(--fondo); }
.muestra-contenido .sobretitulo { flex-basis: 100%; }
.muestra-enlace { color: var(--m-tinta); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.muestra-btn {
  display: inline-flex; align-items: center; min-height: 36px; padding: 7px 14px; border-radius: var(--r);
  background: var(--m-acento); color: var(--m-texto); font-size: 14px; font-weight: 600;
}

@media (max-width: 640px) {
  .config-grilla { grid-template-columns: 1fr; gap: var(--e2); }
  .config-tarjeta { min-height: 0; padding: var(--e3); }
  .tabla.tabla-config td.celda-principal { font-size: var(--t-m); text-align: left; }
  .tabla.tabla-config td.celda-acciones { width: auto; display: block; padding-top: var(--e2); }
  .tabla.tabla-config td.celda-acciones .btn { width: 100%; min-height: 44px; }
  .acento-muestra { grid-template-columns: 1fr; }
  .muestra-menu { flex-direction: row; flex-wrap: wrap; align-items: center; }
  .muestra-marca { flex-basis: 100%; margin-bottom: 0; }
}

/* KPIs: tablas abiertas dentro de las tarjetas (sin caja dentro de caja) */
.filtro-campo input, .filtro-campo select { height: 40px; }
.kpi-seccion .tabla-caja-interna { border: 0; border-radius: 0; background: transparent; }
.kpi-seccion .tabla th { background: transparent; }
.kpi-seccion .tabla th:first-child, .kpi-seccion .tabla td:first-child { padding-left: 0; }
.kpi-seccion .tabla th:last-child, .kpi-seccion .tabla td:last-child { padding-right: 0; }
.kpi-seccion .desplegable .tabla-caja { border: 1px solid var(--borde); border-radius: var(--r); }
.kpi-seccion .desplegable .tabla th:first-child, .kpi-seccion .desplegable .tabla td:first-child { padding-left: 12px; }
.kpi-seccion .desplegable .tabla th:last-child, .kpi-seccion .desplegable .tabla td:last-child { padding-right: 12px; }
@media (max-width: 640px) {
  .kpi-seccion .tabla:has(td[data-label]) tr { box-shadow: none; background: var(--superficie-2); }
}

/* ---------- Cotizaciones ---------- */
.pestanas {
  display: flex; gap: 2px; margin: 0 0 var(--e4); border-bottom: 1px solid var(--borde-fuerte);
  overflow-x: auto; scrollbar-width: none;
}
.pestanas a {
  flex: none; padding: 10px var(--e4); margin-bottom: -1px; border-bottom: 2px solid transparent;
  color: var(--texto-2); font-weight: 600; font-size: 14px; text-decoration: none; white-space: nowrap;
}
.pestanas a:hover { color: var(--texto); }
.pestanas a[aria-current="page"] { color: var(--texto); border-bottom-color: var(--acento); }
.kpis-cotizacion .kpi-valor { font-size: 24px; white-space: nowrap; }
.seccion-cot { margin-bottom: var(--e5); }
.seccion-cabeza { display: flex; align-items: center; justify-content: space-between; gap: var(--e3); margin-bottom: var(--e2); }
.seccion-cabeza h2 { margin: 0; font-size: var(--t-m); }
.seccion-cabeza .btn { min-height: 32px; padding-top: 4px; padding-bottom: 4px; }
.ruta-cot { display: flex; flex-wrap: wrap; gap: var(--e2) var(--e4); margin: 0 0 var(--e3); padding: var(--e3) var(--e4); list-style: none; }
.ruta-cot li { display: flex; align-items: center; gap: var(--e2); font-size: 14px; }
.ruta-cot-num {
  flex: none; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center;
  background: var(--grafito); color: #fff; font-size: 12px; font-weight: 700;
}
.tabla-items-ficha .fila-grupo td { background: var(--superficie-2); font-weight: 700; }
.tabla-items-ficha .fila-subtotal td { font-weight: 600; color: var(--texto-2); }
.totales-cot { display: grid; grid-template-columns: auto auto; gap: 6px var(--e5); width: fit-content; margin: 0 0 0 auto; padding: var(--e3) var(--e4); }
.totales-cot > div { display: contents; }
.totales-cot dt { color: var(--texto-2); font-size: 14px; }
.totales-cot dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; font-weight: 600; }
.totales-cot .totales-cot-total dt, .totales-cot .totales-cot-total dd { font-size: var(--t-l); font-weight: 700; color: var(--texto); }
.cubicacion-totales { display: flex; gap: var(--e5); margin: 0; }
.cubicacion-totales dt { font-size: 11px; font-weight: 600; color: var(--texto-2); text-transform: uppercase; letter-spacing: .06em; }
.cubicacion-totales dd { margin: 0; font-size: var(--t-l); font-weight: 700; font-variant-numeric: tabular-nums; }
.fila-botones { display: flex; align-items: center; gap: var(--e3); margin-top: var(--e3); }
.fila-botones .btn-agregar { flex: 1; }
.ot-lineas .fila-botones { margin: 0; padding: var(--e3) var(--e4) var(--e4); }
.asistente + .asistente { margin-top: var(--e4); }
.tabla-items .c-total { white-space: nowrap; font-weight: 600; }
.tabla-items .linea-n .pill { margin-left: 6px; padding: 0 6px; font-size: 11px; }
.acciones-estado { margin-top: var(--e4); }
.acciones-estado p { margin: 0 0 var(--e3); }
.acciones-estado.desplegable { border-top: 1px solid var(--borde); padding: var(--e2) var(--e4); }
.subir-archivo { display: flex; align-items: flex-end; gap: var(--e3); flex-wrap: wrap; }
.subir-archivo .campo { flex: 1 1 320px; margin: 0; }
.filtro-fecha { display: flex; align-items: center; gap: var(--e2); font-size: 14px; color: var(--texto-2); white-space: nowrap; }
.filtros-extra > label.filtro-fecha { flex: 0 1 auto; }
.tabla-cotizaciones .num { white-space: nowrap; }
@media (max-width: 640px) {
  .pestanas { margin-left: calc(-1 * var(--e4)); margin-right: calc(-1 * var(--e4)); padding: 0 var(--e2); }
  .pestanas a { padding: 10px var(--e3); }
  .kpis-cotizacion .kpi-valor { font-size: 19px; }
  .totales-cot { width: 100%; }
  .cubicacion-totales { width: 100%; }
  .ot-lineas .fila-botones { padding: 0 0 var(--e3); }
  .fila-botones { flex-wrap: wrap; }
  .fila-botones .btn { min-height: 48px; }
  .fila-botones .acciones-pie-espacio { display: none; }
  .fila-botones .btn-primario { flex-basis: 100%; }
  .tabla.tabla-lineas td.c-desc, .tabla.tabla-lineas td.c-total { grid-column: 1 / -1; }
  .tabla.tabla-lineas.tabla-items td.c-total { flex-direction: row; justify-content: space-between; align-items: center; }
  .filtro-fecha { justify-content: space-between; }
  .filtro-fecha input { flex: 1; }
  .subir-archivo .btn { width: 100%; min-height: 48px; }
}
.tabla-cubicar .c-corto input { min-width: 52px; }
.tabla-cubicar .c-dim input { min-width: 68px; }
.tabla-cubicar .c-tipo select { min-width: 112px; }
.tabla-cubicar .c-medio select { min-width: 112px; max-width: 150px; }
.con-manual { display: flex; flex-direction: column; align-items: stretch; gap: 2px; }
.con-manual input[type="number"] { min-width: 80px; }
.check-mini { display: inline-flex; justify-content: flex-start; align-items: center; gap: 4px; font-size: 12px; color: var(--texto-2); white-space: nowrap; }
.check-mini input { margin: 0; }
.tabla-items .linea-n { white-space: nowrap; }
.tabla-items .c-medio input { min-width: 140px; }
.tabla-items .c-dim input { min-width: 96px; }
.tabla-items .c-corto input { min-width: 64px; }
.tabla-items .c-peso input { min-width: 116px; }
.tabla-items .c-desc { width: 100%; }
.tabla-items .c-desc input { min-width: 240px; }
@media (max-width: 640px) {
  .con-manual { width: 100%; flex-direction: row; align-items: center; gap: 8px; }
  .tabla-cubicar .c-medio select, .tabla-cubicar .c-dim input, .tabla-cubicar .c-corto input { max-width: none; min-width: 0; }
  .con-manual input[type="number"] { flex: 1; min-width: 0; }
  .check-mini { min-height: 44px; font-size: 13px; }
  .tabla-items .c-medio input, .tabla-items .c-dim input, .tabla-items .c-corto input, .tabla-items .c-peso input, .tabla-items .c-desc input { min-width: 0; }
  .tabla.tabla-lineas.tabla-items td.c-dim, .tabla.tabla-lineas.tabla-items td.c-corto { grid-column: span 2; }
}
.check-mini { align-self: flex-start; }
.check-mini input, .check-mini > span { flex: none; }
.tabla-cubicar .c-tipo select { min-width: 100px; }
.tabla-cubicar .c-medio select { max-width: 132px; }
.tabla-lineas .c-peso .check-mini input { min-width: 0; width: 16px; height: 16px; margin: 0; }

/* Paso 2: aviso de líneas cargadas que se borrarían al cambiar la ruta */
.aviso-ruta { flex-direction: column; align-items: flex-start; gap: var(--e2); }
.aviso-ruta p { margin: 0; }
.aviso-ruta label { display: flex; align-items: center; gap: var(--e2); font-weight: 600; cursor: pointer; }

/* ---------- Cierre: despacho, facturación y avisos ---------- */
.campana { position: relative; color: var(--menu-texto); }
.campana:hover { color: #fff; }
.topbar .campana { color: #fff; }
.campana-contador {
  position: absolute; top: 3px; right: 2px; min-width: 18px; height: 18px; padding: 0 5px;
  display: grid; place-items: center; border-radius: var(--r-pill);
  background: var(--rojo); color: #fff; font-size: 11px; font-weight: 700; line-height: 1;
  box-shadow: 0 0 0 2px var(--grafito);
}
.campana-contador-linea { position: static; display: inline-grid; box-shadow: none; margin-left: 4px; }
.sidebar-cabeza .campana-sidebar { margin-left: auto; }
.topbar-acciones { display: flex; align-items: center; gap: var(--e1); }
.pestana-n {
  display: inline-block; min-width: 22px; margin-left: 4px; padding: 0 6px; border-radius: var(--r-pill);
  background: var(--gris-fondo); color: var(--texto-2); font-size: 12px; text-align: center;
}
.pestanas a[aria-current="page"] .pestana-n { background: var(--acento); color: var(--acento-texto); }
.filtros-cierre { align-items: center; }
.pestanas-cierre .pestana-corta { display: none; }
.tabla-cierre td { vertical-align: top; }
.tabla-cierre .celda-codigo a { font-weight: 600; white-space: nowrap; }
.cierre-elemento, .cierre-obs { display: block; margin-top: 2px; font-size: var(--t-xs); color: var(--texto-2); font-weight: 400; }
.cierre-acciones { display: flex; flex-wrap: wrap; align-items: flex-start; gap: var(--e2); }
.cierre-acciones .accion-externa { margin-top: 0; }
.cierre-acciones .accion-externa > summary.btn:not(.btn-primario),
.cierre-acciones .accion-externa[open] > summary.btn:not(.btn-primario) { color: var(--texto); }
.cierre-card .datos-cierre { margin: 0 0 var(--e3); padding: 0; border: 0; box-shadow: none; }
.lista-avisos { list-style: none; margin: 0; padding: 0; overflow: hidden; }
.aviso-fila + .aviso-fila { border-top: 1px solid var(--borde); }
.aviso-fila a { display: flex; gap: var(--e3); align-items: flex-start; padding: var(--e3) var(--e4); color: var(--texto); text-decoration: none; }
.aviso-fila a:hover { background: var(--superficie-2); }
.aviso-marca { flex: none; width: 14px; margin-top: 2px; font-size: 11px; color: var(--texto-3); }
.aviso-no-leido .aviso-marca { color: var(--rojo); }
.aviso-no-leido .aviso-mensaje { font-weight: 600; }
.aviso-texto { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.aviso-meta { font-size: var(--t-xs); color: var(--texto-2); }
@media (max-width: 1023px) {
  .sidebar-cabeza .campana-sidebar { display: none; }
}
@media (max-width: 640px) {
  .cierre-acciones { flex-direction: column; align-items: stretch; width: 100%; }
  /* Pestañas de cierre: etiqueta corta y ajuste de línea; nunca quedan cortadas. */
  .pestanas-cierre { flex-wrap: wrap; overflow-x: visible; }
  .pestanas-cierre a { padding: 10px var(--e2); }
  .pestanas-cierre .pestana-larga { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .pestanas-cierre .pestana-corta { display: inline; }
  .tabla.tabla-cierre td.celda-acciones { display: block; text-align: left; }
}

/* ---------- KPIs v2: ¿qué máquina me frena?, comerciales y cierre ---------- */
.kpi-seccion .nota-arriba { margin: calc(-1 * var(--e2)) 0 var(--e3); font-size: var(--t-s); color: var(--texto-2); }
.frase-destacada {
  margin: 0 0 var(--e3); padding: var(--e3) var(--e4); border-radius: var(--r);
  background: var(--verde-fondo); color: var(--verde-tinta); font-weight: 600; font-size: var(--t-m);
}
.frase-destacada.frase-alerta { background: var(--amarillo-fondo); color: var(--amarillo-tinta); }
.carga-lista { list-style: none; margin: 0; padding: 0; }
.carga-fila {
  display: grid; grid-template-columns: minmax(120px, 200px) auto minmax(0, 1fr); align-items: center;
  column-gap: var(--e4); padding: var(--e2) 0; border-bottom: 1px solid var(--borde);
}
.carga-fila:last-child { border-bottom: 0; }
.carga-nombre { font-weight: 600; overflow-wrap: anywhere; }
.carga-valor { font-variant-numeric: tabular-nums; font-weight: 600; min-width: 4.5em; text-align: right; }
.carga-unidad { display: none; font-weight: 400; color: var(--texto-2); font-size: var(--t-xs); }
.carga-barra { display: flex; height: 14px; border-radius: var(--r-pill); overflow: hidden; background: var(--gris-fondo); }
.carga-seg { height: 100%; }
.seg-saturada { background: var(--rojo); }
.seg-alto { background: var(--amarillo); }
.seg-normal { background: var(--verde); }
.seg-fuera { background: repeating-linear-gradient(135deg, var(--gris-borde) 0 4px, var(--superficie) 4px 8px); }
.kpis-mini { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e3); margin-bottom: var(--e4); }
.kpi-mini { display: flex; flex-direction: column; gap: 2px; padding: var(--e3); border-radius: var(--r); background: var(--superficie-2); border: 1px solid var(--borde); }
.kpi-mini b { font-size: var(--t-xl); font-variant-numeric: tabular-nums; }
.kpi-mini small { font-size: var(--t-xs); color: var(--texto-2); }
.subtitulo-kpi { margin: var(--e4) 0 var(--e2); font-size: 14px; font-weight: 700; }
.barra.barra-verde { background: var(--verde); }
.barra.barra-roja { background: var(--rojo); }
.lista-sin-facturar { list-style: none; margin: 0; padding: 0; }
.lista-sin-facturar li {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--e3);
  padding: var(--e2) 0; border-bottom: 1px solid var(--borde); font-size: 14px;
}
.lista-sin-facturar li:last-child { border-bottom: 0; }
.sf-codigo { font-weight: 600; white-space: nowrap; }
.sf-detalle { color: var(--texto-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 640px) {
  .carga-fila { grid-template-columns: minmax(0, 1fr) auto; row-gap: 6px; }
  .carga-barra { grid-column: 1 / -1; }
  .carga-unidad { display: inline; }
  .kpis-mini { grid-template-columns: 1fr; gap: var(--e2); }
  .lista-sin-facturar li { grid-template-columns: auto minmax(0, 1fr); }
  .lista-sin-facturar .sf-detalle { grid-column: 1 / -1; grid-row: 2; white-space: normal; }
  .lista-sin-facturar .sf-estado { justify-self: end; }
}