/* =============================================================================
   STOCK DE POLVOS — lo que hay y de qué lotes
   docs/RUNBOOK-IDENTIDAD-POLVOS.md, sub-etapa 4a (lámina 19, ganó la A, 04/10/2026)
   =============================================================================
   La pantalla de `stock-lista.js` (ids `ps-`) se viste con las clases del Stock
   General de Azúcar (`stock-ui.css`, `.stk-ui`): barra de secciones, buscador,
   caja, pie, diálogo. El verde lo pone el token del navy bajo
   `theme-endulzantes`. Acá sólo lo propio de Polvos: los anchos de una tabla
   que dice estuches y plata (la de Azúcar dice lotes, bultos y kg), los
   renglones de título de los insumos agrupados, la línea y la categoría en la
   barra, y las marcas de la caja abierta y del saldo negativo.
   Los selectores llevan `.ps-t` / `.ps-l` SUMADO a la clase de Azúcar para
   ganarle en especificidad sin depender del orden de las hojas.
   ============================================================================= */
/* Entre 768 y 640 px la tabla no se encoge hasta mentir: scrollea de costado.
   Debajo de 768 (el teléfono) cada renglón se apila: ver el final de la hoja. */
.ed-ui .ps-t.stk-d { min-width: 620px; }
.ed-ui .ps-t.stk-d th:nth-child(1) { width: 46%; }
.ed-ui .ps-t.stk-d th:nth-child(2) { width: 20%; }
.ed-ui .ps-t.stk-d th:nth-child(3) { width: 12%; }
.ed-ui .ps-t.stk-d th:nth-child(4) { width: 16%; }
.ed-ui .ps-t.stk-d th:nth-child(5) { width: 6%; }
.ed-ui .ps-t.stk-d tr.ps-g td { background: var(--canvas); font-weight: 700; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; color: var(--ink); padding-top: 10px; }
.ed-ui .ps-t.stk-d tr.ps-gc td { font-weight: 700; font-size: 11.5px; color: var(--muted); padding-top: 8px; }
.ed-ui .ps-t.stk-d tr.ps-g, .ed-ui .ps-t.stk-d tr.ps-gc { cursor: default; pointer-events: none; }
.ed-ui .ps-t.stk-d tr.ps-cero td { color: var(--faint); }
.ed-ui .ps-t.stk-d tr.ps-fneg td:first-child { border-left-color: var(--crit); }
.ed-ui .ps-gn { font-weight: 600; color: var(--faint); margin-left: 4px; letter-spacing: 0; }
.ed-ui .ps-dim { color: var(--faint); }
.ed-ui .ps-neg { color: var(--crit); }
.ed-ui .ps-wrn, .ed-ui .ps-l.stk-l .sub.ps-wrn { color: var(--warn); font-weight: 600; }
.ed-ui .ps-sp { flex: 1; }
.ed-ui .ps-lin { display: inline-flex; align-items: center; gap: 8px; font-size: 11.5px; color: var(--muted); }
.ed-ui .ps-cat { font: inherit; font-size: 12px; border: 1px solid var(--hair-strong); border-radius: 8px; padding: 5px 8px; background: var(--surface); color: var(--ink); }
.ed-ui .ps-l.stk-l th:nth-child(1) { width: 24%; }
.ed-ui .ps-l.stk-l th:nth-child(2) { width: 18%; }
.ed-ui .ps-l.stk-l th:nth-child(3) { width: 13%; }
.ed-ui .ps-l.stk-l th:nth-child(4) { width: 13%; }
.ed-ui .ps-l.stk-l th:nth-child(5) { width: 18%; }
.ed-ui .ps-l.stk-l th:nth-child(6) { width: 14%; }
.ed-ui .ps-l.stk-l tr.ps-abierta td:first-child { border-left-color: var(--warn); }
.ed-ui .ps-chico { padding: 3px 10px; font-size: 11.5px; }

/* El renglón de la barra, repetido para el teléfono (allá la barra no se ve). */
.ed-ui .ps-resumen { display: none; }

/* =============================================================================
   EN EL TELÉFONO — cada renglón se apila (etapa 2 del teléfono, lámina 2: ganó
   la B, 05/10/2026). Debajo de 768 px, el umbral con el que `mobile-router.js`
   elige el mundo. Sin columnas y sin nada de costado:

       11001 - EP AZUCEL CLASICO x 100            2.916 estuches
       Edulcorante clásico                              162 cajas
       2 lotes · 1 caja abierta                      $ 3.218.010

   La tabla deja de ser tabla (grilla por renglón), el encabezado se va —cada
   dato dice qué es con su unidad— y el chevrón también: toda la fila es el
   botón. La franja de la izquierda (ámbar, rojo) queda, como en la PC.
   ============================================================================= */
@media (max-width: 767px) {
    .ed-ui .ps-resumen {
        display: block; margin: 0 12px 10px; font-size: 12px; line-height: 1.4; color: var(--muted);
    }
    .ed-ui .ps-resumen:empty { display: none; }

    /* Las tres secciones en una sola fila, aunque «Producto terminado» sea largo. */
    .ed-ui #ps-secnav { overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; }
    .ed-ui #ps-secnav > button { flex: 0 0 auto; white-space: nowrap; }

    .ed-ui .ps-t.stk-d { min-width: 0; table-layout: auto; }
    .ed-ui .ps-t.stk-d, .ed-ui .ps-t.stk-d tbody { display: block; width: 100%; }
    .ed-ui .ps-t.stk-d thead { display: none; }
    .ed-ui .ps-t.stk-d tbody tr {
        display: grid; grid-template-columns: minmax(0, 1fr) auto;
        column-gap: 10px; row-gap: 2px; align-items: start;
        border-bottom: 1px solid var(--hair); border-left: 3px solid transparent;
        padding: 9px 12px 9px 9px;
    }
    .ed-ui .ps-t.stk-d tbody tr:last-child { border-bottom: 0; }
    .ed-ui .ps-t.stk-d tbody td {
        display: block; padding: 0; border: 0; overflow: visible; white-space: nowrap;
    }
    /* La franja pasa de la primera celda a la fila: la celda ya no es un borde. */
    .ed-ui .ps-t.stk-d tbody tr.trabado { border-left-color: var(--warn); }
    .ed-ui .ps-t.stk-d tbody tr.ps-fneg { border-left-color: var(--crit); }

    /* Arriba: quién es (izquierda) y cuánto hay (derecha, con su desglose).
       Abajo: los lotes y la caja abierta (izquierda), la plata (derecha). */
    .ed-ui .ps-t.stk-d td:nth-child(1) { grid-column: 1; grid-row: 1; white-space: normal; }
    .ed-ui .ps-t.stk-d td:nth-child(2) { grid-column: 2; grid-row: 1; }
    .ed-ui .ps-t.stk-d td:nth-child(2) .kg { font-size: 13.5px; }
    .ed-ui .ps-t.stk-d td:nth-child(3),
    .ed-ui .ps-t.stk-d td:nth-child(4) { grid-row: 2; font-size: 11.5px; color: var(--muted); }
    .ed-ui .ps-t.stk-d td:nth-child(3) { grid-column: 1; text-align: left; white-space: normal; }
    .ed-ui .ps-t.stk-d td:nth-child(3) .sub { display: inline; }
    .ed-ui .ps-t.stk-d td:nth-child(3) .sub::before { content: ' · '; color: var(--faint); }
    .ed-ui .ps-t.stk-d td:nth-child(4) { grid-column: 2; }
    .ed-ui .ps-t.stk-d td:nth-child(5) { display: none; }
    .ed-ui .ps-nl::after { content: ' ' attr(data-u); }

    /* Los títulos de grupo de los insumos: una línea entera, no una celda. */
    .ed-ui .ps-t.stk-d tbody tr.ps-g, .ed-ui .ps-t.stk-d tbody tr.ps-gc { display: block; padding: 0; border-left: 0; }
    .ed-ui .ps-t.stk-d tr.ps-g td, .ed-ui .ps-t.stk-d tr.ps-gc td { padding: 9px 12px 5px; }

    /* El diálogo de los lotes, igual: renglón apilado, sin «Trazabilidad» (tocar
       el lote abre la misma ficha; en el teléfono lo apaga mobile-ui.css). */
    .ed-ui .ps-l.stk-l, .ed-ui .ps-l.stk-l tbody { display: block; width: 100%; min-width: 0; }
    .ed-ui .ps-l.stk-l thead { display: none; }
    .ed-ui .ps-l.stk-l tbody tr {
        display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 10px; row-gap: 2px;
        padding: 10px 14px 10px 11px; border-bottom: 1px solid var(--hair); border-left: 3px solid transparent;
    }
    .ed-ui .ps-l.stk-l tbody tr.ps-abierta { border-left-color: var(--warn); }
    .ed-ui .ps-l.stk-l tbody td { display: block; padding: 0; border: 0; white-space: nowrap; }
    .ed-ui .ps-l.stk-l td:nth-child(1) { grid-column: 1; grid-row: 1; }
    .ed-ui .ps-l.stk-l td:nth-child(5) { grid-column: 2; grid-row: 1 / span 2; text-align: right; }
    .ed-ui .ps-l.stk-l td:nth-child(2),
    .ed-ui .ps-l.stk-l td:nth-child(3),
    .ed-ui .ps-l.stk-l td:nth-child(4) { grid-column: 1; font-size: 11.5px; color: var(--muted); white-space: normal; }
    .ed-ui .ps-l.stk-l td:nth-child(2) .sub { display: inline; margin-left: 4px; }
    .ed-ui .ps-l.stk-l td:nth-child(2)::before { content: 'Ingresó '; color: var(--faint); }
    .ed-ui .ps-l.stk-l td:nth-child(3)::before { content: 'Vence '; color: var(--faint); }
    .ed-ui .ps-l.stk-l td:nth-child(5) .kg { font-size: 13.5px; }
    .ed-ui .ps-l.stk-l td:nth-child(6) { display: none; }
    /* El título dice el artículo Y cuánto hay: que parta en dos líneas antes que cortarse. */
    .ed-ui #ps-dlg-t { white-space: normal; }
}