:root {
  --fondo: #f5f6f8;
  --superficie: #ffffff;
  --texto: #1d2330;
  --texto-suave: #5b6476;
  --borde: #dfe3ea;
  --primario: #1f5fbf;
  --primario-hover: #184c99;
  --primario-suave: #e8f0fc;
  --ok: #1e7a46;
  --ok-suave: #e5f5ec;
  --error: #b42318;
  --error-suave: #fdecea;
  --aviso: #8a5a00;
  --radio: 8px;
  --sombra: 0 1px 2px rgba(16, 24, 40, .06), 0 1px 3px rgba(16, 24, 40, .08);
  --fuente: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mono: ui-monospace, "Cascadia Mono", Consolas, monospace;
}

/* Tema oscuro: elegido por el usuario, o automático según el sistema operativo */
:root[data-tema="oscuro"] {
  --fondo: #12151c;
  --superficie: #1b2029;
  --texto: #e7eaf0;
  --texto-suave: #a0a8b8;
  --borde: #2e3542;
  --primario: #5b95f0;
  --primario-hover: #7aa9f3;
  --primario-suave: #1d2b44;
  --ok: #4cc283;
  --ok-suave: #16301f;
  --error: #f2786d;
  --error-suave: #3a1b19;
  --aviso: #e0b04c;
  color-scheme: dark;
}
@media (prefers-color-scheme: dark) {
  :root[data-tema="auto"] {
    --fondo: #12151c;
    --superficie: #1b2029;
    --texto: #e7eaf0;
    --texto-suave: #a0a8b8;
    --borde: #2e3542;
    --primario: #5b95f0;
    --primario-hover: #7aa9f3;
    --primario-suave: #1d2b44;
    --ok: #4cc283;
    --ok-suave: #16301f;
    --error: #f2786d;
    --error-suave: #3a1b19;
    --aviso: #e0b04c;
    color-scheme: dark;
  }
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { font-size: 15px; }
body { margin: 0; font-family: var(--fuente); background: var(--fondo); color: var(--texto); line-height: 1.5; }
a { color: var(--primario); text-decoration: none; }
a:hover { text-decoration: underline; }
h1 { font-size: 1.6rem; margin: 0; line-height: 1.25; }
h2 { font-size: 1.15rem; margin: 0 0 .5rem; }
code, .mono { font-family: var(--mono); font-size: .92em; }
small { color: var(--texto-suave); }
abbr { color: var(--error); text-decoration: none; }

/* Estructura: menú lateral + barra superior fina + contenido */
body.con-menu { display: grid; grid-template-columns: 15.5rem minmax(0, 1fr); grid-template-rows: auto 1fr;
  grid-template-areas: "lateral superior" "lateral contenido"; min-height: 100vh; }
.lateral { grid-area: lateral; background: var(--superficie); border-right: 1px solid var(--borde); position: sticky; top: 0;
  height: 100vh; overflow-y: auto; padding: 1rem .75rem 2rem; }
.marca { display: flex; align-items: center; min-height: 2.6rem; font-weight: 700; font-size: 1.15rem; color: var(--texto);
  padding: 0 .5rem .9rem; border-bottom: 1px solid var(--borde); margin-bottom: .75rem; }
.marca:hover { text-decoration: none; }
.marca span, .login h1 span { color: var(--primario); }
.marca span { margin-left: .3rem; }
.marca-logo { max-width: 100%; max-height: 3.2rem; object-fit: contain; }
.navegacion > summary { display: none; }
.navegacion nav { display: flex; flex-direction: column; gap: .15rem; }
.nav-inicio, .nav-grupo > summary { display: block; padding: .45rem .6rem; border-radius: 6px; color: var(--texto); font-weight: 600;
  cursor: pointer; list-style: none; }
.nav-grupo > summary::-webkit-details-marker { display: none; }
.nav-grupo > summary::after { content: "›"; float: right; color: var(--texto-suave); transition: transform .15s; }
.nav-grupo[open] > summary::after { transform: rotate(90deg); }
.nav-inicio:hover, .nav-grupo > summary:hover { background: var(--fondo); text-decoration: none; }
.nav-inicio.activo, .nav-grupo.activo > summary { color: var(--primario); }
.nav-grupo a, .nav-pronto { display: block; padding: .35rem .6rem .35rem 1.3rem; border-radius: 6px; color: var(--texto-suave);
  font-size: .92rem; }
.nav-grupo a:hover { background: var(--primario-suave); color: var(--primario); text-decoration: none; }
.nav-grupo a.actual { background: var(--primario-suave); color: var(--primario); font-weight: 600; }
.nav-pronto { cursor: default; opacity: .7; }
.nav-pronto small { font-size: .68rem; border: 1px solid var(--borde); border-radius: 99px; padding: 0 .35rem; }
.superior { grid-area: superior; display: flex; justify-content: space-between; align-items: center; gap: 1rem;
  padding: .55rem 1.5rem; background: var(--superficie); border-bottom: 1px solid var(--borde); position: sticky; top: 0; z-index: 10; }
.empresa-activa { font-weight: 600; color: var(--texto); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.empresa-activa::before { content: ""; display: inline-block; width: .55rem; height: .55rem; border-radius: 50%; background: var(--ok);
  margin-right: .5rem; vertical-align: middle; }
.empresa-activa.sin-empresa::before { background: var(--aviso); }
.usuario { display: flex; align-items: center; gap: 1rem; color: var(--texto-suave); font-size: .9rem; white-space: nowrap; }
.usuario form { margin: 0; }
.usuario .tema { color: var(--texto-suave); }
.con-menu > main { grid-area: contenido; }

/* Contenido */
.contenido { width: 100%; max-width: 1240px; margin: 0 auto; padding: 1.5rem 1.75rem 4rem; }
.encabezado { display: flex; justify-content: space-between; align-items: flex-end; gap: 1rem; margin-bottom: 1.25rem; flex-wrap: wrap; }
.sub { color: var(--texto-suave); margin: .25rem 0 0; }
.nota { color: var(--texto-suave); font-size: .88rem; margin-top: 1.5rem; }
.opcional { color: var(--texto-suave); font-weight: 400; font-size: .85em; }

.tarjeta { background: var(--superficie); border: 1px solid var(--borde); border-radius: var(--radio); box-shadow: var(--sombra);
  padding: 1.25rem 1.5rem; margin-bottom: 1.25rem; }
.tarjeta.vacio { text-align: center; padding: 2.5rem 1.5rem; }
.tarjeta.vacio p { color: var(--texto-suave); max-width: 520px; margin: .5rem auto 1.25rem; }

/* Avisos */
.aviso { padding: .7rem 1rem; border-radius: var(--radio); margin-bottom: 1rem; border: 1px solid transparent; }
.aviso-ok { background: var(--ok-suave); color: var(--ok); border-color: color-mix(in srgb, var(--ok) 25%, transparent); }
.aviso-error { background: var(--error-suave); color: var(--error); border-color: color-mix(in srgb, var(--error) 25%, transparent); }
.pasos-estado { list-style: none; margin: .5rem 0 1rem; padding: 0; display: grid; gap: .5rem;
  grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); }
.pasos-estado li { display: flex; gap: .75rem; align-items: flex-start; padding: .75rem; border: 1px solid var(--borde);
  border-radius: 10px; opacity: .75; }
.pasos-estado li.actual { opacity: 1; border-color: var(--primario); box-shadow: 0 0 0 1px var(--primario) inset; background: var(--primario-suave); }
.pasos-estado .numero-paso { flex: none; width: 1.8rem; height: 1.8rem; border-radius: 50%; display: grid; place-items: center;
  font-weight: 700; background: var(--borde); }
.pasos-estado li.actual .numero-paso { background: var(--primario); color: #fff; }
.pasos-estado .nota { margin: .25rem 0 0; }
.aviso-alerta { background: color-mix(in srgb, var(--aviso) 14%, transparent); color: var(--aviso); border-color: color-mix(in srgb, var(--aviso) 30%, transparent); }

/* Botones */
.boton { display: inline-flex; align-items: center; justify-content: center; gap: .35rem; padding: .5rem 1rem; border-radius: var(--radio);
  border: 1px solid var(--borde); background: var(--superficie); color: var(--texto); font: inherit; font-weight: 500;
  cursor: pointer; white-space: nowrap; }
.boton:hover { background: var(--fondo); text-decoration: none; }
.boton.primario { background: var(--primario); border-color: var(--primario); color: #fff; }
.boton.primario:hover { background: var(--primario-hover); }
.boton.chico { padding: .25rem .6rem; font-size: .85rem; }
.boton.ancho { width: 100%; }
.enlace { background: none; border: 0; padding: 0; color: var(--primario); font: inherit; cursor: pointer; }
.botones { display: flex; gap: .5rem; justify-content: flex-end; align-items: center; flex-wrap: wrap; }
.botones form { margin: 0; }
.acciones-rapidas { display: flex; gap: .5rem; flex-wrap: wrap; }

/* Formularios */
.formulario fieldset, fieldset.direccion { border: 0; padding: 0; margin: 0 0 1.25rem; min-width: 0; }
legend { font-weight: 600; font-size: 1rem; margin-bottom: .75rem; padding: 0; }
.rejilla { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .9rem 1.1rem; }
.ancho-2 { grid-column: span 2; }
.ancho-3 { grid-column: 1 / -1; }
.campo { display: flex; flex-direction: column; gap: .3rem; min-width: 0; }
.campo label { font-weight: 500; font-size: .9rem; }
input, select, textarea { font: inherit; color: var(--texto); background: var(--superficie); border: 1px solid var(--borde);
  border-radius: 6px; padding: .5rem .65rem; width: 100%; }
input:focus, select:focus, textarea:focus { outline: 2px solid color-mix(in srgb, var(--primario) 35%, transparent);
  border-color: var(--primario); }
.con-error input, .con-error select, .con-error textarea { border-color: var(--error); }
.error { color: var(--error); font-size: .85rem; margin: 0; }
.ayuda { color: var(--texto-suave); font-size: .82rem; margin: 0; min-height: 1em; }
.check { display: inline-flex; align-items: center; gap: .4rem; font-size: .9rem; }
.check input { width: auto; }
.lista-checks { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .35rem 1rem; margin-top: .75rem; }

details.agregar { margin-top: 1rem; border-top: 1px dashed var(--borde); padding-top: 1rem; }
details.agregar summary { cursor: pointer; color: var(--primario); font-weight: 600; margin-bottom: .75rem; }

/* Búsqueda y tablas */
.busqueda { display: flex; gap: .5rem; align-items: center; margin-bottom: 1rem; flex-wrap: wrap; }
.busqueda input[type=search] { max-width: 420px; flex: 1; }
.tabla-contenedor { overflow-x: auto; background: var(--superficie); border: 1px solid var(--borde); border-radius: var(--radio); box-shadow: var(--sombra); }
.tabla { width: 100%; border-collapse: collapse; font-size: .92rem; }
.tabla th { text-align: left; font-weight: 600; color: var(--texto-suave); font-size: .8rem; text-transform: uppercase;
  letter-spacing: .03em; padding: .7rem .9rem; border-bottom: 1px solid var(--borde); background: var(--fondo); }
.tabla td { padding: .65rem .9rem; border-bottom: 1px solid var(--borde); vertical-align: middle; }
.tabla tr:last-child td { border-bottom: 0; }
.tabla .num { text-align: right; }
.tabla .acciones { text-align: right; white-space: nowrap; }
.tabla .acciones form { display: inline; margin: 0; }
tr.inactivo td, .inactivo { opacity: .55; }
tr.fila-activa td { background: var(--primario-suave); }
.paginacion { display: flex; justify-content: space-between; margin-top: .75rem; }

.etiqueta { display: inline-block; font-size: .75rem; padding: .1rem .5rem; border-radius: 99px; background: var(--fondo);
  border: 1px solid var(--borde); color: var(--texto-suave); white-space: nowrap; }
.etiqueta-ok { background: var(--ok-suave); color: var(--ok); border-color: transparent; }
.etiqueta-prod { background: var(--error-suave); color: var(--error); border-color: transparent; }
.etiqueta-alerta { background: color-mix(in srgb, var(--aviso) 16%, transparent); color: var(--aviso); border-color: transparent; }
.etiqueta-inactivo { background: var(--fondo); }

/* Inicio */
.indicadores { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; margin-bottom: 1.25rem; }
.indicador { background: var(--superficie); border: 1px solid var(--borde); border-radius: var(--radio); box-shadow: var(--sombra);
  padding: 1.1rem 1.25rem; display: flex; flex-direction: column; color: var(--texto-suave); }
.indicador:hover { border-color: var(--primario); text-decoration: none; }
.indicador .numero { font-size: 1.9rem; font-weight: 700; color: var(--texto); line-height: 1.1; }

/* Detalle de emisor */
.datos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .9rem 1.25rem; margin: 0; }
.datos dt { font-size: .8rem; color: var(--texto-suave); text-transform: uppercase; letter-spacing: .03em; }
.datos dd { margin: .15rem 0 0; }
.establecimiento { border: 1px solid var(--borde); border-radius: var(--radio); padding: .8rem 1rem; margin-top: .75rem; }
.establecimiento-cabeza { display: flex; justify-content: space-between; align-items: center; gap: 1rem; flex-wrap: wrap; }
.establecimiento-cabeza form { margin: 0; }
.puntos { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin-top: .6rem; }
.punto { display: inline-flex; align-items: center; gap: .4rem; margin: 0; padding: .2rem .6rem; border-radius: 99px;
  background: var(--primario-suave); color: var(--primario); }
.nuevo-punto { display: inline-flex; gap: .35rem; margin: 0 0 0 auto; }
.nuevo-punto input { width: 6.5rem; padding: .25rem .5rem; font-size: .85rem; }

/* Documentos */
.pestanas { display: flex; gap: .25rem; background: var(--superficie); border: 1px solid var(--borde); border-radius: var(--radio); padding: .25rem; }
.pestanas a { padding: .35rem .9rem; border-radius: 6px; color: var(--texto-suave); }
.pestanas a.activo { background: var(--primario); color: #fff; text-decoration: none; }
.lista-errores { margin: .35rem 0 0 1.1rem; padding: 0; }
.tabla.lineas td { padding: .45rem .6rem; }
.tabla.lineas select { min-width: 200px; }
.tabla.lineas input[name=detalle] { min-width: 190px; }
input.corto { width: 6.5rem; text-align: right; }
#agregar-linea { margin-top: .6rem; }
.totales { display: grid; grid-template-columns: max-content max-content; justify-content: end; gap: .3rem 1.5rem; margin: 1rem 0 0; }
.totales div { display: contents; }
.totales dt { color: var(--texto-suave); text-align: right; }
.totales dd { margin: 0; text-align: right; font-family: var(--mono); }
.totales .total dt, .totales .total dd { font-weight: 700; color: var(--texto); font-size: 1.1rem; }
.estado-procesado { background: var(--ok-suave); color: var(--ok); border-color: transparent; }
.estado-rechazado, .estado-invalidado { background: var(--error-suave); color: var(--error); border-color: transparent; }
.estado-generado, .estado-firmado, .estado-contingencia { background: var(--primario-suave); color: var(--primario); border-color: transparent; }
section.estado-documento { background: var(--superficie); color: var(--texto); }
.estado-cabeza { display: flex; gap: .5rem; margin-bottom: .5rem; }

/* Compras y libros */
.opciones-carga { display: grid; grid-template-columns: 2fr 1fr; gap: 1.25rem; align-items: start; }
.verificaciones { list-style: none; padding: 0; margin: 0; display: grid; gap: .35rem; }
.verificaciones li { padding: .45rem .7rem; border-radius: 6px; border: 1px solid var(--borde); }
.verificaciones li.ok { background: var(--ok-suave); color: var(--ok); border-color: transparent; }
.verificaciones li.falla { background: var(--error-suave); color: var(--error); border-color: transparent; }
.verificaciones li.pendiente { color: var(--texto-suave); }
details.proveedor { padding: .8rem 1.1rem; }
details.proveedor summary { cursor: pointer; display: flex; gap: .75rem; align-items: center; flex-wrap: wrap; }
details.proveedor form { margin-top: 1rem; }
.pestanas-libros { flex-wrap: wrap; margin-bottom: 1rem; }
.tabla-compacta { font-size: .8rem; }
.tabla-compacta th, .tabla-compacta td { padding: .45rem .55rem; white-space: nowrap; }
.totales-anexo { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: .75rem; }
@media (max-width: 860px) { .opciones-carga { grid-template-columns: 1fr; } .totales-anexo { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.negativo { color: var(--error); }

/* Login */
.pantalla-login { min-height: 100vh; display: grid; place-items: center; padding: 1.5rem; }
.login { width: 100%; max-width: 380px; padding: 2rem; }
.login h1 { text-align: center; }
.login .sub { text-align: center; margin-bottom: 1.25rem; }
.login .campo { margin-bottom: 1rem; }

/* Logo de la empresa */
.logo-empresa { display: flex; gap: 1.25rem; align-items: flex-start; flex-wrap: wrap; }
.logo-muestra { width: 15rem; min-height: 5rem; display: flex; align-items: center; justify-content: center; padding: .75rem;
  border: 1px dashed var(--borde); border-radius: var(--radio); background: var(--fondo); }
.logo-muestra img { max-width: 100%; max-height: 6rem; object-fit: contain; }
.logo-empresa > div:last-child { flex: 1; min-width: 16rem; }
.fila-formulario { display: flex; gap: .5rem; align-items: center; flex-wrap: wrap; margin-top: .6rem; }
.fila-formulario input[type=file] { width: auto; flex: 1; }

/* Reportes */
.reportes { display: grid; grid-template-columns: repeat(auto-fill, minmax(22rem, 1fr)); gap: 1rem; }
.reportes h2 { font-size: 1.05rem; margin: 0 0 .5rem; }
.lista-reportes { list-style: none; margin: 0; padding: 0; }
.lista-reportes li { padding: .6rem 0; border-top: 1px solid var(--borde); }
.lista-reportes li:first-child { border-top: 0; }
.lista-reportes .sub { margin: .15rem 0; font-size: .85rem; }
.descargas { font-size: .85rem; }

/* Tablero de inicio */
.kpis { display: grid; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); gap: 1rem; margin: 1rem 0 1.25rem; }
.kpi { display: flex; flex-direction: column; gap: .3rem; background: var(--superficie); border: 1px solid var(--borde);
       border-radius: var(--radio); box-shadow: var(--sombra); padding: 1rem 1.1rem; color: var(--texto); }
.kpi:hover { border-color: var(--primario); text-decoration: none; }
.kpi-titulo { font-size: .82rem; color: var(--texto-suave); text-transform: uppercase; letter-spacing: .03em; }
.kpi-valor { font-size: 1.6rem; font-weight: 700; line-height: 1.15; font-variant-numeric: tabular-nums; }
.kpi-detalle { font-size: .82rem; color: var(--texto-suave); }
.kpi-alerta { border-left: 4px solid var(--aviso); }
.variacion { font-weight: 600; }
.variacion.sube { color: var(--ok); }
.variacion.baja { color: var(--error); }
.paneles { display: grid; grid-template-columns: 2fr 1fr; gap: 1rem; align-items: start; }
.paneles h2 { font-size: 1rem; margin: 0 0 .6rem; }
.paneles h2 + .tabla, .paneles .tabla + h2 { margin-top: .4rem; }
.paneles .tabla + h2 { margin-top: 1.2rem; }
.grafico { width: 100%; height: auto; display: block; }
.grafico .barra { fill: var(--primario); opacity: .55; }
.grafico .barra-actual { opacity: 1; }
.grafico .eje { stroke: var(--borde); stroke-width: 1; }
.grafico .etiqueta { fill: var(--texto-suave); font-size: 11px; }
.tabla.compacta td { padding: .4rem .5rem; }
@media (max-width: 860px) { .paneles { grid-template-columns: 1fr; } }

/* Cuentas por cobrar y pagar */
.botones-encabezado { display: flex; gap: .5rem; flex-wrap: wrap; }
div.indicador:hover { border-color: var(--borde); }
.indicador .numero { overflow-wrap: anywhere; }
.indicadores .indicador .numero { font-size: 1.5rem; }
.indicador.alerta { border-left: 4px solid var(--error); }
.indicador.alerta .numero { color: var(--error); }
.encabezado-seccion { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; margin-top: 1.5rem; }
.tabla tfoot th { border-top: 2px solid var(--borde); }
details.anular summary { list-style: none; cursor: pointer; display: inline-block; }
details.anular form { display: flex; gap: .4rem; margin-top: .4rem; flex-wrap: wrap; }
.boton.peligro { color: var(--error); border-color: var(--error); }

/* Emisión: buscador de productos por línea */
.producto-linea { min-width: 20rem; }
.producto-linea .buscar-producto { width: 100%; }
.info-linea { display: block; margin-top: .25rem; color: var(--texto-suave); font-size: .8rem; }
.info-linea.negativo { color: var(--error); font-weight: 600; }
/* Factura de Sujeto Excluido */
#lineas-fse td:first-child input { min-width: 16rem; width: 100%; }
#lineas-fse select[name=uni_medida] { max-width: 9rem; }

/* Crear productos desde una compra */
.crear-productos input:not([type=checkbox]) { width: 100%; min-width: 6rem; }
.crear-productos td:nth-child(2) { min-width: 15rem; }
.crear-productos td:nth-child(3) input { min-width: 8rem; }
.crear-productos td:nth-child(4) input { min-width: 14rem; }

/* Usuarios: permisos agrupados por módulo */
.permisos { display: grid; grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr)); gap: 1rem; margin-top: 1rem; }
.permisos-modulo { border: 1px solid var(--borde); border-radius: var(--radio); padding: .75rem 1rem; }
.permisos-modulo h3 { margin: 0 0 .5rem; font-size: .95rem; }
.permisos-modulo .check { display: flex; gap: .5rem; align-items: flex-start; margin: .35rem 0; font-size: .9rem; }

@media (max-width: 960px) {
  /* El menú lateral pasa arriba y se despliega con el botón «Menú» */
  body.con-menu { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto auto 1fr;
    grid-template-areas: "lateral" "superior" "contenido"; }
  .lateral { position: relative; height: auto; border-right: 0; border-bottom: 1px solid var(--borde); padding: .6rem 1rem;
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem; }
  .marca { border-bottom: 0; margin: 0; padding: 0; min-height: 0; }
  .navegacion { flex-basis: 100%; }
  .navegacion > summary { display: inline-block; position: absolute; right: 1rem; top: .75rem; cursor: pointer;
    padding: .3rem .8rem; border: 1px solid var(--borde); border-radius: var(--radio); list-style: none; }
  .navegacion > summary::-webkit-details-marker { display: none; }
  .navegacion[open] nav { margin-top: .6rem; }
  .superior { position: static; }
}
@media (max-width: 860px) {
  .rejilla, .datos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .indicadores { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lista-checks { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .contenido { padding: 1.25rem 1rem 3rem; }
  .superior { padding: .5rem 1rem; flex-wrap: wrap; }
  .usuario { gap: .7rem; }
  .rejilla, .datos { grid-template-columns: 1fr; }
  .ancho-2 { grid-column: auto; }
  .nuevo-punto { margin-left: 0; }
}

/* Menú desplegable "Otros documentos" (details/summary, sin JS) */
.menu-mas { position: relative; display: inline-block; }
.menu-mas > summary { list-style: none; cursor: pointer; }
.menu-mas > summary::-webkit-details-marker { display: none; }
.menu-mas-lista { position: absolute; right: 0; top: calc(100% + 4px); z-index: 20; min-width: 240px; background: var(--superficie);
  border: 1px solid var(--borde); border-radius: var(--radio); box-shadow: var(--sombra); padding: .3rem 0; display: flex; flex-direction: column; }
.menu-mas-lista a { padding: .45rem .9rem; color: var(--texto); text-decoration: none; }
.menu-mas-lista a:hover { background: var(--primario-suave); color: var(--primario); }

/* Caja rápida */
.caja { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(18rem, 1fr); gap: 1rem; align-items: start; margin-bottom: 1rem; }
.caja-etiqueta { display: block; font-weight: 600; margin-bottom: .35rem; }
.caja-buscar { width: 100%; font-size: 1.2rem; padding: .7rem .8rem; }
.caja-lineas td .corto { width: 5rem; }
.vacio-caja { color: var(--texto-suave); text-align: center; padding: 1rem 0; margin: 0; }
.caja-cliente { margin-top: 1rem; }
.caja-cobro { position: sticky; top: 1rem; }
.caja-total { display: flex; justify-content: space-between; align-items: baseline; border-bottom: 1px solid var(--borde); padding-bottom: .6rem; margin-bottom: .8rem; }
.caja-total strong { font-size: 2.2rem; font-family: var(--mono); }
.caja-desglose { margin: 0 0 .4rem; color: var(--texto-suave); }
.caja-desglose div { display: flex; justify-content: space-between; }
.caja-desglose dt { font-weight: normal; }
.caja-desglose dd { margin: 0; font-family: var(--mono); }
.caja-formas { border: 0; padding: 0; margin: 0 0 .8rem; display: flex; flex-wrap: wrap; gap: .4rem; }
.caja-formas legend { font-weight: 600; margin-bottom: .35rem; }
.caja-forma { display: inline-flex; align-items: center; gap: .4rem; border: 1px solid var(--borde); border-radius: var(--radio);
  padding: .45rem .7rem; cursor: pointer; }
.caja-forma input { width: auto; margin: 0; }
.caja-forma:has(input:checked) { border-color: var(--primario); background: var(--primario-suave); color: var(--primario); }
.caja-monto { width: 100%; font-size: 1.6rem; padding: .5rem .7rem; font-family: var(--mono); text-align: right; }
.caja-billetes { display: flex; flex-wrap: wrap; gap: .35rem; margin: .5rem 0; }
.caja-cambio { display: flex; justify-content: space-between; align-items: baseline; margin: .6rem 0 1rem; }
.caja-cambio strong { font-size: 1.8rem; font-family: var(--mono); color: var(--ok); }
.caja-cambio strong.negativo { color: var(--error); }
.caja-cobrar { width: 100%; font-size: 1.15rem; padding: .8rem; margin-top: .4rem; }
.caja-listo { max-width: 34rem; margin: 2rem auto; text-align: center; }
.caja-listo-titulo { font-size: 1.4rem; font-weight: 700; color: var(--ok); margin: 0; }
.caja-resumen { display: grid; gap: .4rem; margin: 1.2rem 0; }
.caja-resumen div { display: flex; justify-content: space-between; border-bottom: 1px solid var(--borde); padding: .3rem 0; }
.caja-resumen dd { margin: 0; font-family: var(--mono); font-weight: 600; }
.caja-resumen-cambio dd { font-size: 2rem; color: var(--ok); }
.botones.centro { justify-content: center; }
form.en-linea { display: inline-flex; gap: .4rem; align-items: center; }
@media (max-width: 860px) { .caja { grid-template-columns: 1fr; } .caja-cobro { position: static; } }

/* Recursos Humanos */
.linea-tiempo { list-style: none; padding: 0; margin: .8rem 0 0; border-left: 2px solid var(--borde); }
.linea-tiempo li { padding: .35rem 0 .35rem .9rem; position: relative; }
.linea-tiempo li::before { content: ""; position: absolute; left: -6px; top: .75rem; width: 10px; height: 10px; border-radius: 50%;
  background: var(--primario); }
.etapas { display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: 1rem; }
.etapa h2 { font-size: 1rem; }
.candidato { border: 1px solid var(--borde); border-radius: var(--radio); padding: .55rem .7rem; margin-bottom: .6rem; display: grid; gap: .25rem; }
.formulario.compacto { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: .3rem; }
.formulario.compacto select, .formulario.compacto input { flex: 1 1 8rem; }
.tabla.planilla td .corto { width: 5.5rem; }
tr.anulada td { opacity: .55; text-decoration: line-through; }

.paneles.iguales { grid-template-columns: repeat(auto-fit, minmax(22rem, 1fr)); }

/* Catálogo de cuentas */
.catalogo tr.resumen td { font-weight: 600; }
.catalogo tr.nivel-2 td:nth-child(2) { padding-left: 1.2rem; }
.catalogo tr.nivel-4 td:nth-child(2) { padding-left: 2.2rem; }
.catalogo tr.nivel-6 td:nth-child(2) { padding-left: 3.2rem; }