:root {
  --bg: #f3f5f7;
  --card: #ffffff;
  --text: #1c2630;
  --muted: #5d6b78;
  --line: #d5dce2;
  --accent: #1f6f43;
  --accent-text: #ffffff;
  --danger: #b3261e;
}
/* Tema: sigue al sistema, salvo que el usuario elija Claro u Oscuro con el botón de la barra (data-theme en <html>) */
:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #12171c;
  --card: #1b232b;
  --text: #e6ebf0;
  --muted: #9aa7b3;
  --line: #2c3945;
  --accent: #3fa874;
  --accent-text: #0b1a12;
  --danger: #ff8a80;
}
:root[data-theme="light"] { color-scheme: light; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: #12171c;
    --card: #1b232b;
    --text: #e6ebf0;
    --muted: #9aa7b3;
    --line: #2c3945;
    --accent: #3fa874;
    --accent-text: #0b1a12;
    --danger: #ff8a80;
  }
}
* { box-sizing: border-box; }
body {
  margin: 0;
  min-height: 100vh;
  background: var(--bg);
  color: var(--text);
  font: 16px/1.5 system-ui, -apple-system, "Segoe UI", sans-serif;
}
[hidden] { display: none !important; }
.card {
  width: calc(100% - 32px);
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 24px;
}
.card.angosta { max-width: 420px; margin: 12vh auto 0; }
h1 { font-size: 1.25rem; margin: 0 0 16px; }
h1 small { color: var(--muted); font-weight: 400; }
label { display: block; margin: 12px 0 4px; font-weight: 600; }
input {
  width: 100%;
  padding: 10px 12px;
  font: inherit;
  color: var(--text);
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: 8px;
}
input:focus-visible, button:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
button {
  margin-top: 16px;
  width: 100%;
  padding: 10px 16px;
  font: inherit;
  font-weight: 600;
  color: var(--accent-text);
  background: var(--accent);
  border: 0;
  border-radius: 8px;
  cursor: pointer;
}
button:disabled { opacity: .6; cursor: progress; }
button.secundario {
  width: auto;
  margin: 0;
  color: var(--text);
  background: transparent;
  border: 1px solid var(--line);
}
.error { margin: 12px 0 0; color: var(--danger); }
dl { display: grid; grid-template-columns: max-content 1fr; gap: 6px 16px; margin: 0 0 16px; }
dt { color: var(--muted); }
dd { margin: 0; }
.nota { color: var(--muted); margin: 0 0 12px; }
h2 { font-size: 1.05rem; margin: 24px 0 8px; padding-top: 16px; border-top: 1px solid var(--line); }
h2 small { color: var(--muted); font-weight: 400; }
select {
  width: 100%; padding: 10px 12px; font: inherit; color: var(--text);
  background: var(--bg); border: 1px solid var(--line); border-radius: 8px;
}
.tarjetas { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 8px; margin: 12px 0; }
.tarjeta { padding: 10px 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--bg); }
.tarjeta b { display: block; font-size: 1.4rem; line-height: 1.2; }
.tarjeta span { color: var(--muted); font-size: .85rem; }
.avisos { margin: 8px 0 12px; }
.avisos p { margin: 4px 0; padding: 8px 10px; border-left: 3px solid #b26a00; background: var(--bg); border-radius: 4px; font-size: .9rem; }
.tabla-scroll { overflow-x: auto; margin: 8px 0; border: 1px solid var(--line); border-radius: 8px; max-height: 60vh; }
table { border-collapse: collapse; width: 100%; font-size: .875rem; }
th, td { padding: 6px 10px; text-align: left; border-bottom: 1px solid var(--line); vertical-align: top; }
th { position: sticky; top: 0; background: var(--card); white-space: nowrap; }
td.num, th.num { text-align: right; font-variant-numeric: tabular-nums; }
.badge { display: inline-block; padding: 1px 8px; border-radius: 999px; font-size: .8rem; font-weight: 600; border: 1px solid currentColor; white-space: nowrap; }
.badge.nueva { color: var(--accent); }
.badge.descarga, .badge.posicion { color: #1a5fb4; }
.badge.sin_cambios { color: var(--muted); }
.badge.omitida { color: var(--danger); }
.badge.desactualizada { color: #b26a00; }
:root[data-theme="dark"] .badge.desactualizada { color: #f2b45a; }
:root[data-theme="dark"] .badge.descarga, :root[data-theme="dark"] .badge.posicion { color: #8ab4f8; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .badge.desactualizada { color: #f2b45a; }
  :root:not([data-theme="light"]) .badge.descarga, :root:not([data-theme="light"]) .badge.posicion { color: #8ab4f8; }
}
.obs { color: var(--muted); font-size: .8rem; }
.obs.err { color: var(--danger); }
#archivo { padding: 8px; }

/* ---------- Estructura de la aplicación ---------- */
.barra {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px;
  padding: 10px 16px; background: var(--card); border-bottom: 1px solid var(--line);
}
.marca { display: flex; flex-direction: column; line-height: 1.3; }
.puerto { color: var(--muted); font-size: .9rem; }
#nav { display: flex; flex-wrap: wrap; gap: 4px; flex: 1; }
#nav a {
  padding: 6px 12px; border-radius: 8px; color: var(--text); text-decoration: none; font-weight: 600;
}
#nav a:hover { background: var(--bg); }
#nav a[aria-current="page"] { background: var(--accent); color: var(--accent-text); }
#nav a:focus-visible, .acceso:focus-visible, tr:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.sesion { display: flex; align-items: center; gap: 12px; margin-left: auto; }
.sesion .puerto { font-size: .82rem; }
.sesion #btn-tema, .sesion #btn-salir { width: auto; margin: 0; padding: 4px 14px; font-size: .85rem; }
.contenido { padding: 16px; max-width: 1800px; margin: 0 auto; }
.contenido h1 { margin-top: 0; }

/* ---------- Inicio ---------- */
.paneles { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; max-width: 900px; margin: 0 auto; }
.panel { display: grid; gap: 12px; padding: 16px; border-radius: 12px; border: 1px solid var(--line); align-content: start; }
.panel.izq { background: color-mix(in srgb, #3b82f6 14%, var(--card)); }
.panel.der { background: color-mix(in srgb, var(--accent) 14%, var(--card)); }
.acceso {
  display: flex; align-items: center; gap: 12px; padding: 14px 16px; min-height: 64px;
  background: var(--card); color: var(--text); border: 1px solid var(--line); border-radius: 10px;
  font-weight: 700; text-decoration: none;
}
a.acceso:hover { border-color: var(--accent); }
.acceso .ico { font-size: 1.6rem; }
.acceso small { margin-left: auto; font-weight: 400; color: var(--muted); }
.acceso.deshabilitado { opacity: .6; }

/* ---------- Grilla ---------- */
.filtros { background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 12px 16px 16px; margin-bottom: 12px; }
.campos { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 0 12px; }
.campos label { font-weight: 600; font-size: .85rem; margin: 8px 0 0; }
.campos input { margin-top: 2px; padding: 7px 10px; }
.campos label.check { display: flex; align-items: center; gap: 8px; font-weight: 400; align-self: end; }
.campos label.check input { width: auto; margin: 0; }
/* Buscador por código o nombre */
.buscadores { margin-top: 4px; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
.buscador { position: relative; }
.buscador > label { font-weight: 600; font-size: .85rem; margin: 8px 0 0; }
.buscador-caja { position: relative; }
.buscador-caja input { margin-top: 2px; padding: 7px 28px 7px 10px; }
.buscador-caja input.resuelto { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 8%, var(--bg)); }
.limpiar {
  position: absolute; right: 4px; top: 4px; width: 24px; height: 28px; margin: 0; padding: 0;
  background: transparent; color: var(--muted); border: 0; font-size: 1.1rem; line-height: 1;
}
.sugerencias {
  position: absolute; z-index: 20; left: 0; right: 0; top: 100%; margin: 2px 0 0; padding: 4px;
  max-height: 260px; overflow: auto; list-style: none;
  background: var(--card); border: 1px solid var(--line); border-radius: 8px; box-shadow: 0 6px 18px rgb(0 0 0 / .18);
}
.sugerencias li { padding: 6px 8px; border-radius: 6px; cursor: pointer; font-size: .9rem; }
.sugerencias li b { display: inline-block; min-width: 3.2em; color: var(--accent); }
.sugerencias li[aria-selected="true"], .sugerencias li:hover { background: color-mix(in srgb, var(--accent) 16%, transparent); }
.sugerencias li.vacio { color: var(--muted); cursor: default; }
.sugerencias li.vacio:hover { background: transparent; }

/* Títulos ordenables de la grilla */
#tabla-grilla th { padding: 0; }
#tabla-grilla th button.orden {
  display: inline-flex; align-items: center; gap: 4px; width: 100%; margin: 0; padding: 6px 10px;
  color: inherit; background: transparent; border: 0; border-radius: 0; font: inherit; font-weight: 700; text-align: left; cursor: pointer;
}
#tabla-grilla th.num button.orden { justify-content: flex-end; }
#tabla-grilla th button.orden:hover { background: color-mix(in srgb, var(--accent) 12%, transparent); }
#tabla-grilla th button.orden:focus-visible { outline: 3px solid var(--accent); outline-offset: -3px; }
#tabla-grilla th button.orden.activo { color: var(--accent); }
#tabla-grilla th .flecha { display: inline-block; min-width: .8em; font-size: .7rem; }
@media print {
  #tabla-grilla th button.orden { padding: 2px 4px; color: #000; } #tabla-grilla th .flecha { display: none; }
  /* al imprimir el texto sale completo (en pantalla se recorta a 25 caracteres) */
  #tabla-grilla td.trunc { font-size: 0; }
  #tabla-grilla td.trunc::after { content: attr(data-completo); font-size: 7.5pt; }
}
#tabla-grilla td.trunc { cursor: default; }
#tabla-grilla td, #tabla-grilla th button.orden { padding-inline: 8px; } /* un poco más angosto para que entren más columnas */
.largo-texto { display: flex; justify-content: space-between; margin: 0 0 8px; padding: 0 4px 8px; border-bottom: 1px solid var(--line); }

/* Barra de herramientas de la tabla */
.barra-grilla { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px 16px; margin: 8px 0; }
.herramientas { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.herramientas button { margin: 0; padding: 6px 14px; width: auto; }
label.inline { display: inline-flex; align-items: center; gap: 6px; margin: 0; font-weight: 500; font-size: .9rem; }
label.inline select { width: auto; padding: 6px 8px; }
.menu-columnas { position: relative; }
.menu-columnas summary {
  list-style: none; cursor: pointer; padding: 6px 14px; border: 1px solid var(--line); border-radius: 8px; font-weight: 600; font-size: .95rem;
}
.menu-columnas summary::-webkit-details-marker { display: none; }
.menu-columnas[open] summary { background: var(--bg); }
.menu-panel {
  position: absolute; z-index: 30; right: 0; top: calc(100% + 4px); width: 300px; max-height: 70vh; overflow: auto;
  background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: 8px; box-shadow: 0 8px 24px rgb(0 0 0 / .22);
}
.menu-panel ul { list-style: none; margin: 0 0 8px; padding: 0; }
.menu-panel li { display: flex; align-items: center; gap: 2px; padding: 1px 0; }
.menu-panel li label { flex: 1; display: flex; align-items: center; gap: 8px; margin: 0; font-weight: 400; font-size: .9rem; cursor: pointer; }
.menu-panel li input { width: auto; margin: 0; }
.mov { width: 26px; height: 24px; margin: 0; padding: 0; background: transparent; color: var(--muted); border: 1px solid transparent; border-radius: 4px; font-size: .7rem; }
.mov:hover:not(:disabled) { border-color: var(--line); color: var(--text); }
.mov:disabled { opacity: .3; cursor: default; }
.menu-panel .secundario { width: 100%; margin: 0; }

/* Acciones sobre la carta seleccionada */
.acciones { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 0 0 8px; padding: 8px 12px; background: var(--card); border: 1px solid var(--line); border-radius: 12px; }
.acciones-titulo { font-weight: 600; font-size: .9rem; }
#g-acciones-botones { display: flex; flex-wrap: wrap; gap: 6px; }
button.accion { margin: 0; width: auto; padding: 4px 10px; font-size: .85rem; font-weight: 600; color: var(--text); background: transparent; border: 1px solid var(--line); }
button.accion:hover { border-color: var(--accent); }
button.accion kbd { margin-left: 6px; padding: 0 4px; font: inherit; font-size: .72rem; color: var(--muted); border: 1px solid var(--line); border-radius: 4px; }
.mensaje { margin: 0 0 8px; padding: 8px 12px; border-radius: 8px; border-left: 4px solid var(--accent); background: var(--card); font-size: .92rem; }
.mensaje.simulado { border-left-color: #b26a00; }
.mensaje.err { border-left-color: var(--danger); color: var(--danger); }

/* Panel de la carta elegida: pegado abajo, siempre a la vista junto a la tabla */
.tabla-scroll.alta { max-height: 62vh; }
/* --- Compactar la grilla: estados + Buscar en una línea; total y actualizar en la fila de pestañas --- */
.tabs { align-items: center; padding-block: 4px; }
.tabs a { padding: 5px 9px; }
.herramientas-grilla .obs { font-size: .75rem; white-space: nowrap; }
.herramientas-grilla { margin-left: auto; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; }
.herramientas-grilla .resumen-grilla { margin: 0; gap: 4px 8px; font-size: .9rem; }
.herramientas-grilla .resumen-grilla b { font-size: 1.05rem; }
.herramientas-grilla .herramientas { gap: 6px; }
.herramientas-grilla button, .herramientas-grilla .menu-columnas summary { padding: 4px 10px; font-size: .85rem; }
.herramientas-grilla label.inline { font-size: .85rem; }
.herramientas-grilla select { padding: 3px 6px; font-size: .85rem; }
#vista-grilla .filtros { padding: 6px 12px 10px; margin-bottom: 8px; }
#vista-grilla .fila-estados { flex-wrap: nowrap; align-items: center; gap: 12px; margin-top: 8px; }
#vista-grilla .fila-estados .estados {
  flex: 1 1 auto; min-width: 0; margin: 0; padding: 0; border: 0;
  display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px;
}
#vista-grilla .estados legend { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } /* sigue disponible para lectores de pantalla */
#vista-grilla #chips-estados { gap: 4px 6px; flex: 0 1 auto; }
#vista-grilla .nuevas-aut { white-space: nowrap; flex: 0 0 auto; }
#vista-grilla .chip { padding: 2px 8px 2px 5px; font-size: .78rem; gap: 4px; }
#vista-grilla .nuevas-aut { margin: 0; font-size: .85rem; }
#vista-grilla #g-buscar { width: 100%; margin: 0; padding: 7px 12px; font-size: .9rem; align-self: end; }
/* Filtros más bajos: menos relleno en etiquetas y cajas para que entren más camiones en la tabla */
#vista-grilla .filtros { padding: 3px 12px 6px; margin-bottom: 6px; }
#vista-grilla .filtros .campos label, #vista-grilla .filtros .buscador > label, #vista-grilla #buscadores > label { margin: 3px 0 0; font-size: .78rem; line-height: 1.15; }
#vista-grilla .filtros .campos input, #vista-grilla .filtros .buscador-caja input { margin-top: 1px; padding: 3px 8px; font-size: .85rem; }
#vista-grilla .filtros .campos label.check { margin: 0 0 4px; }
#vista-grilla #buscadores { margin-top: 0; }
#vista-grilla .fila-estados { margin-top: 5px; }
#vista-grilla #g-buscar { padding: 4px 12px; }
/* Resumen compacto: siempre visible pero ocupando poco alto */
#vista-grilla .detalle { padding: 4px 12px; margin-bottom: 6px; gap: 2px 20px; min-height: 104px; }
#vista-grilla .detalle-col { gap: 0; }
#vista-grilla .detalle-col.pesos { column-gap: 44px; }
#vista-grilla .detalle .dato { font-size: .82rem; padding: 0; line-height: 1.25; }
#vista-grilla .detalle table.rubros { font-size: .76rem; }
#vista-grilla .detalle table.rubros th, #vista-grilla .detalle table.rubros td { padding: 0 6px; }
#vista-grilla .tabla-scroll.alta { max-height: 56vh; }
/* Los rubros nunca se cortan: ocupan su propia fila en pantallas angostas y dos columnas en las anchas */
.rubros-col { min-width: 0; grid-column: 1 / -1; }
@media (min-width: 1100px) {
  .rubros-col { grid-column: span 2; }
}
#vista-grilla .detalle table.rubros { table-layout: auto; width: 100%; }
#vista-grilla .detalle table.rubros th { white-space: nowrap; }
.acciones { padding: 5px 10px; gap: 4px 8px; margin-bottom: 8px; }
.acciones-titulo { font-size: .82rem; }
button.accion { padding: 3px 8px; font-size: .8rem; }
button.accion kbd { margin-left: 4px; font-size: .68rem; }
#g-acciones-botones { gap: 4px; }

/* Pantallas anchas: los 5 buscadores y Vagón (angosto) quedan en una sola fila */
@media (min-width: 1100px) {
  #buscadores { grid-template-columns: repeat(5, minmax(0, 1fr)) 120px; align-items: end; }
}
#buscadores > label { margin: 8px 0 0; }
#buscadores > label input { margin-top: 2px; padding: 7px 10px; }

/* Cuadro de rubros del detalle */
.rubros-col { grid-column: span 1; }
table.rubros { width: 100%; font-size: .8rem; }
table.rubros th, table.rubros td { padding: 2px 6px; }
table.rubros th { position: static; font-weight: 600; color: var(--muted); }

/* Diálogo de motivo */
dialog { width: min(420px, calc(100% - 32px)); padding: 20px; color: var(--text); background: var(--card); border: 1px solid var(--line); border-radius: 12px; }
dialog::backdrop { background: rgb(0 0 0 / .45); }
dialog h2 { margin: 0 0 4px; padding: 0; border: 0; font-size: 1.05rem; }
.dlg-botones { display: flex; justify-content: flex-end; gap: 8px; margin-top: 16px; }
.dlg-botones button { margin: 0; width: auto; padding: 8px 18px; }

/* Encabezado sólo para impresión */
.solo-impresion { display: none; }

@media print {
  @page { size: A4 landscape; margin: 8mm; }
  body { background: #fff; color: #000; font-size: 9pt; }
  .barra, .tabs, .filtros, .detalle, .acciones, .mensaje, .barra-grilla, .panel-carta, .aut-caja, #vista-inicio, #vista-importar, #vista-autorizaciones, dialog { display: none !important; }
  .contenido { padding: 0; max-width: none; }
  .solo-impresion { display: block; margin-bottom: 6px; }
  .solo-impresion h1 { font-size: 14pt; margin: 0 0 2px; }
  .solo-impresion p { margin: 0; font-size: 9pt; color: #333; }
  .tabla-scroll, .tabla-scroll.alta { max-height: none; overflow: visible; border: 0; }
  table { font-size: 7.5pt; }
  th { position: static; background: #eee !important; }
  th, td { padding: 2px 4px; border-bottom: 1px solid #bbb; }
  tr { break-inside: avoid; }
  .grupo-lp { break-inside: auto; margin-bottom: 8px; }
  .grupo-lp header { break-after: avoid; }
  .grupo-lp .alternar, .grupo-lp .mas-filas, .resumen-grilla, #lg-mas, #lg-aviso { display: none !important; }
  thead { display: table-header-group; }
  #tabla-grilla tbody tr.sel { background: transparent !important; }
  .punto, tr.dup td, tr.vieja td { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* Marcas de fila de la grilla (como entrega.exe) */
#tabla-grilla tbody tr.vieja td { background: color-mix(in srgb, #c0c0c0 40%, transparent); }
#tabla-grilla tbody tr.dup td { border-bottom: 3px solid #e00000; }
/* Barra de menús (como entrega.exe) y pestañas de secciones */
.menubar { display: flex; flex-wrap: wrap; gap: 2px; }
.menu-top { position: relative; }
.menu-boton {
  margin: 0; width: auto; padding: 6px 12px; color: var(--text); background: transparent; border: 1px solid transparent;
  border-radius: 6px; font-weight: 600; font-size: .95rem;
}
.menu-boton:hover, .menu-boton[aria-expanded="true"] { background: var(--bg); border-color: var(--line); }
.menu-boton:focus-visible, .menu-lista [role="menuitem"]:focus-visible { outline: 3px solid var(--accent); outline-offset: -2px; }
.menu-lista {
  position: absolute; z-index: 40; left: 0; top: calc(100% + 2px); min-width: 290px; margin: 0; padding: 4px; list-style: none;
  background: var(--card); border: 1px solid var(--line); border-radius: 8px; box-shadow: 0 8px 24px rgb(0 0 0 / .22);
}
.menu-lista [role="menuitem"] {
  display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 7px 12px; border-radius: 6px;
  color: var(--text); text-decoration: none; font-size: .92rem; cursor: pointer;
}
.menu-lista a[role="menuitem"]:hover, .menu-lista a[role="menuitem"]:focus { background: color-mix(in srgb, var(--accent) 16%, transparent); }
.menu-lista .menu-deshabilitado { color: var(--muted); cursor: default; }
.menu-lista .menu-deshabilitado small { font-size: .72rem; opacity: .8; }
.menu-sep { height: 1px; margin: 4px 6px; background: var(--line); }
.menu-encabezado { padding: 4px 12px; font-size: .78rem; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .04em; }
.tabs { display: flex; flex-wrap: wrap; gap: 4px; padding: 6px 16px; background: var(--card); border-bottom: 1px solid var(--line); }
.tabs a { padding: 6px 12px; border-radius: 8px; color: var(--text); text-decoration: none; font-weight: 600; font-size: .92rem; }
.tabs a:hover { background: var(--bg); }
.tabs a[aria-current="page"] { background: var(--accent); color: var(--accent-text); }
.tabs a:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.aut-n-tab { display: inline-block; min-width: 1.4em; padding: 0 6px; margin-left: 4px; border-radius: 999px; background: #d4380d; color: #fff; font-size: .75rem; text-align: center; }

/* Contador de autorizaciones */
.aut-chip, .aut-caja {
  display: inline-flex; align-items: center; gap: 6px; padding: 5px 14px; border-radius: 999px; text-decoration: none; font-weight: 700;
  color: #1e3a8a; background: #cfe3fb; border: 1px solid #9dbfe8;
}
.aut-chip b, .aut-caja b { text-decoration: underline; }
.aut-chip.hay, .aut-caja.hay { background: #ffd9a8; border-color: #e0953a; color: #7a2e00; }
.aut-caja { margin: 0 0 12px auto; display: flex; width: fit-content; }
:root[data-theme="dark"] .aut-chip, :root[data-theme="dark"] .aut-caja { color: #cfe3fb; background: #1f3a5f; border-color: #36598a; }
:root[data-theme="dark"] .aut-chip.hay, :root[data-theme="dark"] .aut-caja.hay { color: #ffd9a8; background: #5c3410; border-color: #a36a2c; }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .aut-chip, :root:not([data-theme="light"]) .aut-caja { color: #cfe3fb; background: #1f3a5f; border-color: #36598a; }
  :root:not([data-theme="light"]) .aut-chip.hay, :root:not([data-theme="light"]) .aut-caja.hay { color: #ffd9a8; background: #5c3410; border-color: #a36a2c; }
}
.nuevas-aut { display: inline-block; margin-left: 12px; color: #e00000; font-weight: 700; text-decoration: none; }
:root[data-theme="dark"] .nuevas-aut { color: #ff7a70; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .nuevas-aut { color: #ff7a70; } }
.estados .nuevas-aut { margin-top: 4px; }

#lp-buscar, #l-buscar { width: auto; margin: 0; padding-inline: 36px; }
.fila-estados .secundario { margin: 0; width: auto; padding: 10px 22px; }
#vista-tablas .fila-estados button { margin: 0; width: auto; padding: 10px 22px; }
#vista-tablas .fila-estados { align-items: center; }

/* Listado General */
.lg-grid { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
.lg-grupos { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; margin-top: 8px; }
fieldset.grupo-filtro, fieldset.tipo-lg { margin: 8px 0 0; padding: 4px 12px 10px; border: 1px solid var(--line); border-radius: 8px; }
fieldset.grupo-filtro legend, fieldset.tipo-lg legend { padding: 0 6px; font-weight: 600; font-size: .85rem; }
fieldset.tipo-lg { display: flex; gap: 16px; align-items: center; padding-bottom: 6px; }
fieldset.tipo-lg label { display: flex; align-items: center; gap: 6px; margin: 0; font-weight: 400; }
fieldset.tipo-lg input { width: auto; margin: 0; }
fieldset.grupo-filtro > label { margin: 6px 0 0; font-size: .85rem; }
/* el título del recuadro ya dice qué es: la etiqueta del buscador queda sólo para lectores de pantalla */
fieldset.grupo-filtro .buscador > label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
#lg-buscar { width: auto; margin: 0; padding-inline: 36px; }
.resumen-lg { margin: 10px 0 6px; font-size: .95rem; }
#tabla-lg td { white-space: nowrap; }
#lg-mas { margin-top: 8px; }
#lg-buscar, #te-buscar, #td-buscar { width: auto; margin: 0; padding-inline: 36px; }
#tabla-td td { white-space: nowrap; }
#tabla-td .te-ent td { font-weight: 700; background: var(--panel-2, rgba(128,128,128,.12)); border-top: 1px solid var(--line); }
#tabla-td .te-pto td:first-child { padding-left: 24px; font-weight: 600; }
#tabla-td .te-mer td:first-child { padding-left: 44px; font-style: italic; }
#tabla-td .td-tipo td:first-child { padding-left: 64px; }
#tabla-td .td-sub td { font-weight: 600; border-top: 1px dashed var(--line); }
#tabla-td .td-sub-ent td { font-weight: 700; border-top: 1px solid var(--line); }
#tabla-td .te-total td { font-weight: 700; border-top: 2px solid var(--line); }
#tabla-te td { white-space: nowrap; }
#tabla-te .te-ent td { font-weight: 700; background: var(--panel-2, rgba(128,128,128,.12)); border-top: 1px solid var(--line); }
#tabla-te .te-pto td:first-child { padding-left: 24px; font-weight: 600; }
#tabla-te .te-mer td:first-child { padding-left: 48px; }
#tabla-te .te-total td { font-weight: 700; border-top: 2px solid var(--line); }

/* Listado Posición: grupos por estado de posición */
.grupo-lp { margin: 0 0 16px; }
.grupo-lp header { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 16px; margin: 0 0 6px; }
.grupo-lp h2 { margin: 0; padding: 0; border: 0; font-size: 1.05rem; }
.grupo-lp .alternar, .grupo-lp .mas-filas { margin: 0; width: auto; padding: 3px 12px; font-size: .85rem; }
.grupo-lp .mas-filas { margin-top: 8px; }
.tabla-lp td { white-space: nowrap; }
.totales-lp { margin: 8px 0 24px; padding: 10px 14px; background: var(--card); border: 1px solid var(--line); border-radius: 10px; }

/* Tablas de autorizaciones */
.comentario { white-space: normal; min-width: 220px; max-width: 420px; }
.vacio-tabla { text-align: center; color: var(--muted); padding: 18px; }
.badge.pedido-4 { color: var(--accent); }
.badge.pedido-7 { color: #c0007a; }
.badge.pedido-8 { color: var(--muted); }
#tabla-pendientes button.accion { margin: 0; }

.mas-filtros { margin-top: 8px; }
.mas-filtros summary { cursor: pointer; font-weight: 600; font-size: .85rem; padding: 4px 0; }
.estados { border: 1px solid var(--line); border-radius: 8px; margin: 12px 0 0; padding: 6px 12px 10px; }
.estados legend { padding: 0 6px; font-weight: 600; font-size: .85rem; }
#chips-estados { display: flex; flex-wrap: wrap; gap: 6px 14px; }
/* Cada estado es una pastilla del color del estado (como en entrega.exe) con su casilla adentro */
.chip {
  display: inline-flex; align-items: center; gap: 6px; margin: 0; padding: 3px 12px 3px 8px;
  font-weight: 500; font-size: .9rem; cursor: pointer; border-radius: 999px;
  background: color-mix(in srgb, var(--color-estado, transparent) 26%, var(--card));
  border: 1px solid color-mix(in srgb, var(--color-estado, var(--line)) 65%, var(--text) 20%);
}
.chip input { width: auto; margin: 0; }
.chip:has(input:focus-visible) { outline: 3px solid var(--accent); outline-offset: 2px; }
.chip.todos { font-weight: 700; background: transparent; border-color: var(--line); }
.punto {
  display: inline-block; width: 12px; height: 12px; margin-right: 6px; border-radius: 3px;
  background: var(--color-estado, transparent); border: 1px solid color-mix(in srgb, var(--text) 45%, transparent);
  vertical-align: -1px;
}
.chip .punto { margin: 0; }
/* Buscar queda al lado de los estados para no tener que bajar */
.fila-estados { display: flex; flex-wrap: wrap; gap: 12px; align-items: stretch; margin-top: 12px; }
.fila-estados .estados { flex: 1 1 520px; margin: 0; }
#g-buscar { width: auto; margin: 0; padding-inline: 36px; flex: 0 0 auto; }
.resumen-grilla { display: flex; gap: 16px; align-items: baseline; margin: 8px 0; }
.resumen-grilla b { font-size: 1.2rem; }
.tabla-scroll.alta { max-height: 62vh; }
#tabla-grilla tbody tr { cursor: pointer; }
#tabla-grilla tbody tr:hover { background: color-mix(in srgb, var(--accent) 8%, transparent); }
#tabla-grilla tbody tr.sel { background: color-mix(in srgb, #3b82f6 22%, transparent); }
#tabla-grilla td { white-space: nowrap; }
.visto { color: var(--accent); font-weight: 700; }
.detalle {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 8px 24px;
  background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 12px 16px; margin-bottom: 12px;
}
.detalle-col { display: grid; gap: 2px; align-content: start; }
/* Procedencia (P) en la primera columna y descarga (D) en la segunda, bien separadas */
.detalle-col.pesos { grid-template-rows: repeat(3, auto); grid-auto-flow: column; grid-auto-columns: 1fr; gap: 2px 40px; }
.dato { display: flex; justify-content: space-between; gap: 8px; font-size: .88rem; border-bottom: 1px dotted var(--line); padding: 1px 0; }
.dato span { color: var(--muted); }
.dato b { text-align: right; font-weight: 600; word-break: break-word; }

/* Menú Tablas (sólo consulta) */
#vista-tablas .titulo-tabla { margin: 4px 0 2px; font-size: 1.15rem; }
.barra-tabla { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; margin: 8px 0 12px; }
.barra-tabla input[type="search"] { width: min(420px, 100%); }
.barra-tabla button { width: auto; margin: 0; padding: 8px 22px; }
.barra-tabla .campo-corto { width: 90px; }
.barra-tabla label { margin: 0; font-size: .85rem; }
#vista-tablas tr.clic { cursor: pointer; }
#vista-tablas tr.clic:hover, #vista-tablas tr.clic:focus { background: rgba(128,128,128,.14); outline: none; }
#vista-tablas td { white-space: nowrap; }
.ficha h3 { margin: 14px 0 6px; } .ficha h3 small { font-weight: 400; opacity: .7; }
.ficha h4 { margin: 14px 0 6px; font-size: .95rem; }
.ficha-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px 16px; }
.ficha-campo { display: flex; flex-direction: column; font-size: .9rem; padding: 4px 0; border-bottom: 1px solid var(--line); }
.ficha-campo span { font-size: .75rem; opacity: .7; }
.form-noticia { display: grid; gap: 8px; max-width: 640px; margin-bottom: 10px; }
.form-noticia label { display: grid; gap: 4px; font-size: .85rem; }
.form-noticia textarea { width: 100%; resize: vertical; font: inherit; padding: 8px; }
.form-noticia button { width: auto; justify-self: start; padding: 8px 26px; }
#vista-tablas td.texto-largo { white-space: normal; min-width: 260px; max-width: 520px; }
label.check { display: flex; gap: 8px; align-items: flex-start; margin: 6px 0; font-weight: 400; font-size: .9rem; }
label.check input { width: auto; margin-top: 3px; }
#confirmar { width: auto; margin: 10px 0 0; padding-inline: 28px; }

/* Carga manual de posición */
.form-carga { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px 14px; margin: 10px 0; }
.form-carga label { display: grid; gap: 3px; margin: 0; font-size: .85rem; }
.form-carga label.ancho { grid-column: 1 / -1; }
.form-carga label.check { display: flex; align-items: center; gap: 8px; align-self: end; font-weight: 400; }
.form-carga label.check input { width: auto; }
.form-carga select, .form-carga input:not([type="checkbox"]) { width: 100%; }
.panel-analisis { margin-top: 18px; padding-top: 6px; border-top: 1px solid var(--line); }
#vista-tablas h3 small { font-weight: 400; opacity: .7; font-size: .8rem; }

/* Aviso de conexión (latido): fijo arriba, no tapa la barra de menús */
.aviso-conexion { position: fixed; top: 0; left: 50%; transform: translateX(-50%); z-index: 1000; padding: 8px 18px; border-radius: 0 0 8px 8px; font-size: .9rem; font-weight: 600; box-shadow: 0 2px 8px rgba(0,0,0,.25); }
.aviso-conexion.aviso-error { background: #b3261e; color: #fff; }
.aviso-conexion.aviso-ok { background: #1b6e3c; color: #fff; }

/* ---------- Pantalla de ingreso: fondo azul noche con detalles ámbar ---------- */
body:has(#login:not([hidden])) { background: #1e2a3d; }
#login.card {
  --bg: #1b2335; --text: #f1f5fb; --muted: #9db0cc; --line: #3b4963; --accent: #f59e0b; --accent-text: #1b2335; --danger: #ff9b8f;
  background: transparent; border: 0; padding: 8px 4px; max-width: 400px; margin: 9vh auto 0;
}
#login .login-marca { color: #f5c518; font-weight: 800; font-size: 1.35rem; letter-spacing: .04em; text-transform: uppercase; margin-bottom: 28px; }
#login h1 { color: var(--accent); font-size: 2.1rem; font-weight: 800; margin: 0 0 12px; letter-spacing: -.01em; }
#login .login-sub { color: var(--muted); font-size: 1.05rem; margin: 0 0 6px; }
#login .login-ayuda { color: #6f82a3; font-size: .85rem; margin: 0 0 24px; }
#login label { color: #fff; font-size: .95rem; margin: 18px 0 8px; }
#login label span { margin-left: 2px; }
#login input { background: var(--bg); border: 1px solid var(--line); border-radius: 10px; padding: 14px 16px; color: #fff; }
#login input:focus-visible { outline: 0; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(245,158,11,.3); }
#login .campo-clave { position: relative; }
#login .campo-clave input { padding-right: 52px; }
#login .ojo { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); width: 40px; height: 40px; margin: 0; padding: 0; background: transparent; color: #8a9bb8; display: grid; place-items: center; border-radius: 8px; }
#login .ojo[aria-pressed="true"] { color: var(--accent); }
#login .entrar { margin-top: 30px; padding: 16px; border-radius: 999px; font-size: 1.05rem; font-weight: 600; background: var(--accent); color: var(--accent-text); }
#login .entrar:hover { filter: brightness(1.08); }

/* Editar C.P. más compacto: cabe mejor en la pantalla */
.edicion-cp h3 { margin: 6px 0 2px; font-size: 1.05rem; }
.edicion-cp h4 { margin: 8px 0 2px; font-size: .88rem; }
.edicion-cp .nota { margin: 0 0 4px; font-size: .78rem; }
.edicion-cp .form-carga { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 4px 10px; margin: 4px 0; }
.edicion-cp .form-carga label { font-size: .76rem; gap: 1px; }
.edicion-cp input:not([type="checkbox"]):not([type="radio"]), .edicion-cp select { padding: 3px 7px; font-size: .84rem; }
.edicion-cp .buscadores { grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); margin-top: 0; gap: 0 10px; }
.edicion-cp .buscador > label { margin: 3px 0 0; font-size: .76rem; }
.edicion-cp .buscador-caja input { padding: 3px 24px 3px 7px; margin-top: 1px; }
.edicion-cp .fila-estados { margin-top: 4px; gap: 4px 14px; flex-wrap: wrap; }
.edicion-cp .fila-estados button { padding: 5px 14px; font-size: .85rem; }
.edicion-cp label.check { font-size: .84rem; margin: 0; }

/* Acciones de la carta: Eliminar en rojo y separado; ventanita de Duplicar */
button.accion.peligro { color: var(--danger); border-color: var(--danger); margin-left: 18px; }
.dlg-duplicar { border: 1px solid var(--line); border-radius: 12px; background: var(--card); color: var(--text); padding: 16px 20px; width: min(520px, calc(100% - 32px)); }
.dlg-duplicar::backdrop { background: rgba(0, 0, 0, .5); }
.dlg-duplicar h2 { margin: 0 0 4px; padding: 0; border: 0; font-size: 1.1rem; }
.dlg-duplicar .fila-estados { margin-top: 14px; }
.dlg-duplicar .fila-estados button { width: auto; margin: 0; padding: 8px 22px; }

/* Ventana CPE (CP electrónica) */
.dlg-cpe { border: 1px solid var(--line); border-radius: 12px; background: var(--card); color: var(--text); padding: 12px 18px; width: min(880px, calc(100% - 24px)); max-height: calc(100vh - 24px); }
.dlg-cpe::backdrop { background: rgba(0, 0, 0, .5); }
.dlg-cpe h2 { margin: 0 0 6px; padding: 0; border: 0; font-size: 1.15rem; }
.dlg-cpe h2 small { color: var(--muted); font-weight: 400; font-size: .85rem; }
.cpe-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 4px 14px; }
.cpe-grid label { display: grid; gap: 1px; margin: 3px 0 0; font-size: .78rem; }
.cpe-grid input, .cpe-grid select { padding: 3px 7px; font-size: .85rem; width: 100%; }
.cpe-grid .cpe-ancho { grid-column: span 2; }
.cpe-cuit { display: grid; grid-column: span 2; grid-template-columns: 210px 1fr; gap: 0 10px; align-items: end; }
.cpe-razon { font-size: .8rem; color: var(--muted); padding-bottom: 5px; min-height: 1.4em; }
.cpe-razon.err { color: var(--danger); }
.dlg-cpe .fila-estados { margin-top: 8px; }
.dlg-cpe .fila-estados button { width: auto; margin: 0; padding: 7px 22px; }