/* Existencias, kárdex y valoración (3-nov-2026): lo que agrega modulos78.js. Usa los colores del tema (claro y oscuro) y se acomoda del reloj al escritorio. */

/* tablas anchas: se desplazan por dentro de su caja, nunca la página */
.alm78-scroll { overflow-x: auto; max-width: 100%; -webkit-overflow-scrolling: touch; }
.alm78-tabla td, .alm78-tabla th { vertical-align: middle; }
.alm78-tabla td.nombre { overflow-wrap: break-word; word-break: normal; min-width: 7ch; }

/* Existencias */
.alm78-leyenda { margin: 4px 0 10px; }
.alm78-sin td { background: color-mix(in srgb, var(--papel-2) 55%, transparent); }
.alm78-sin td.nombre { color: var(--tinta-suave); }
.alm78-chip-sin { background: var(--ambar-fondo, #fff3d6); color: var(--ambar, #8a6100); border: 1px dashed currentColor; }
.alm78-prom { padding: 8px 12px; border-left: 4px solid var(--ambar, #b7791f); background: var(--ambar-fondo, #fff3d6); border-radius: 6px; color: var(--tinta); }

/* Ajustes dentro de Existencias */
.alm78-ajustes { margin: 0 0 12px; }
.alm78-ajustes summary { cursor: pointer; min-height: 40px; display: flex; align-items: center; }
.alm78-ajustes-cuerpo { display: grid; gap: 4px; padding-top: 6px; }
.alm78-ajustes .alm78-casilla { align-items: flex-start; padding: 6px 0; }
.alm78-ajustes .alm78-casilla input { flex: none; margin-top: 2px; }
.alm78-ajustes .alm78-casilla small { display: block; color: var(--tinta-suave); font-weight: 400; }

/* Kárdex */
.alm78-filtros { align-items: flex-end; }
.alm78-filtros .campo { min-width: 0; }
.alm78-filtros input[type=date], .alm78-filtros select, .alm78-filtros input[type=text], .alm78-filtros input[type=search] { min-height: 44px; box-sizing: border-box; }
.alm78-filtros select { min-width: 150px; }
.alm78-filtros .btn { min-height: 40px; }
.alm78-casilla { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; cursor: pointer; }
.alm78-casilla input { width: 20px; height: 20px; }
.alm78-tipo { font-weight: 700; }
.alm78-saldo { font-weight: 700; white-space: nowrap; }
.alm78-enlace { background: none; border: 0; padding: 4px 0; margin: 0; font: inherit; font-size: inherit; color: var(--etiqueta, var(--tinta)); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; text-align: left; min-height: 32px; }
.alm78-enlace:hover, .alm78-enlace:focus-visible { color: var(--tinta); text-decoration-thickness: 2px; }

@media (max-width: 760px) {
  /* lo que se toca en estas pantallas mide 40 px o más (los botones chicos de la lista, de la barra de la lista y de los ajustes) */
  #inv-cuerpo .btn.chico, #rep-cuerpo .btn.chico, #inv-cuerpo .kit-barra .btn, #rep-cuerpo .kit-barra .btn, #inv-cuerpo .filtros button, #rep-cuerpo .filtros button { min-height: 40px; }
  .alm78-filtros > .campo, .alm78-filtros > .filtros, .alm78-filtros > .alm78-casilla { flex: 1 1 100%; max-width: 100%; }
  .alm78-filtros input[type=date], .alm78-filtros select, .alm78-filtros input[type=text], .alm78-filtros input[type=search] { width: 100%; max-width: none; min-width: 0; }
  .alm78-filtros .btn { flex: 1 1 100%; min-height: 44px; }
  .alm78-enlace { min-height: 40px; }
  .alm78-tabla th, .alm78-tabla td { padding: 8px 6px; }
}
@media (min-width: 340px) and (max-width: 760px) {
  #inv-cuerpo .alm78-filtros > .campo:nth-child(1), #inv-cuerpo .alm78-filtros > .campo:nth-child(2), #val-filtros > .campo:nth-child(2), #val-filtros > .campo:nth-child(3) { flex: 1 1 calc(50% - 8px); min-width: 0; }      /* «Del» y «Al» lado a lado */
}
@media (max-width: 300px) {
  .alm78-tabla { font-size: .82rem; }
  .alm78-tabla td.nombre small { overflow-wrap: anywhere; }
}
