/* =============================================================================
   PRODUCCIÓN DEL DÍA EN EL TELÉFONO — etapa 3j del teléfono
   docs/movil/lamina-12-azucar-produccion-dia.html: ganó la B (08/10/2026),
   «lo que se hace ahora», y el teléfono devuelve azúcar.

   La pantalla la arma ENTERA `produccion-dia-movil.js` (la portada de la PC no
   se monta en el teléfono). Scope por id `#mobile-data-container #pdv-ui`.
   Las piezas comunes (hoja, botones, chips, kilos) son las del Pase de Depósito
   con otro prefijo: el mismo dibujo, sin compartir clases entre pantallas.

         ● Abierto · 93.940 kg hoy ·            faltan 3 para cerrar ›
         [ Lotes 7 | Azúcar 3 | Máquinas 6 ]
         ┌──────┬──────────────────────────────────────────┐
         │CARTEL│ 12101 · Azúcar 1kg Azucel    14.560/27.600 │
         │  A2  │ ▓▓▓▓▓▓▓▓░░░░░░░                           │
         │      │ 12101-260917-M-04 · 10x12       en curso  │
         └──────┴──────────────────────────────────────────┘
         93.940 kg · 12101 90.190            [ Nuevo lote ]   pegado abajo
   ========================================================================== */
@media (max-width: 767px) {
    #mobile-data-container #pdv-ui {
        display: flex; flex-direction: column; min-height: 100%;
        background: var(--canvas); color: var(--ink); font-size: 14px; line-height: 1.45;
    }
    #mobile-data-container #pdv-ui .pdv-zona { flex: 1; padding-bottom: 18px; }

    /* ── La línea de estado: abierto, lo producido, lo que falta ───────── */
    #mobile-data-container #pdv-ui .pdv-ctx { margin: 8px 14px 0; font-size: 12.5px; color: var(--muted); }
    #mobile-data-container #pdv-ui .pdv-ctx:empty { display: none; }
    #mobile-data-container #pdv-ui .pdv-linea {
        display: flex; align-items: center; gap: 5px; width: 100%; padding: 4px 0; border: 0; background: none;
        font: inherit; color: inherit; text-align: left; cursor: pointer;
    }
    #mobile-data-container #pdv-ui .pdv-linea[disabled] { cursor: default; }
    #mobile-data-container #pdv-ui .pdv-linea b.ok { color: var(--ok); }
    #mobile-data-container #pdv-ui .pdv-linea b.cer { color: var(--muted); }
    #mobile-data-container #pdv-ui .pdv-linea .q { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
    #mobile-data-container #pdv-ui .pdv-linea .fl { margin-left: auto; display: inline-flex; align-items: center; color: var(--warn); font-weight: 600; white-space: nowrap; }
    #mobile-data-container #pdv-ui .pdv-linea .fl .material-symbols-outlined { font-size: 17px; }
    #mobile-data-container #pdv-ui .pdv-est { flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--faint); }
    #mobile-data-container #pdv-ui .pdv-est.ok { background: var(--ok); box-shadow: 0 0 0 3px var(--ok-050); animation: pdvLate 2s ease infinite; }

    /* ── La píldora (el indicador que viaja lo pone mobile-gestos.js) ──── */
    #mobile-data-container #pdv-ui .pdv-seg {
        position: relative; isolation: isolate; display: grid; grid-template-columns: repeat(3, 1fr);
        margin: 8px 12px 0; padding: 3px; border-radius: 11px; background: #e3e7ef;
    }
    #mobile-data-container #pdv-ui .pdv-seg[hidden] { display: none; }
    #mobile-data-container #pdv-ui .pdv-seg > button {
        position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; gap: 5px;
        min-height: 38px; border: 0; border-radius: 8px; background: none;
        font: inherit; font-size: 13px; font-weight: 600; color: var(--muted); transition: color .24s;
    }
    #mobile-data-container #pdv-ui .pdv-seg > button.on { color: var(--navy); }
    #mobile-data-container #pdv-ui .pdv-seg:not(.mv-con-ind) > button.on { background: #fff; box-shadow: var(--e1); }
    #mobile-data-container #pdv-ui .pdv-seg > button:focus-visible { outline: 2px solid var(--navy-300); outline-offset: -2px; }
    #mobile-data-container #pdv-ui .pdv-cnt {
        min-width: 18px; padding: 0 6px; border-radius: 999px; background: var(--navy-500); color: #fff;
        font-size: 10.5px; font-weight: 700; line-height: 17px; text-align: center;
    }

    /* ── Rótulos, listas, vacíos ───────────────────────────────────────── */
    #mobile-data-container #pdv-ui .pdv-hh {
        display: flex; align-items: center; gap: 8px; padding: 14px 16px 6px;
        font-size: 11px; letter-spacing: .07em; text-transform: uppercase; color: var(--faint); font-weight: 700;
    }
    #mobile-data-container #pdv-ui .pdv-hh .der { margin-left: auto; text-transform: none; letter-spacing: 0; font-weight: 500; }
    #mobile-data-container #pdv-ui .pdv-n {
        text-transform: none; letter-spacing: 0; font-size: 11.5px; font-weight: 600; color: var(--faint);
        background: #f4f5f8; border: 1px solid var(--hair-strong); border-radius: 999px; padding: 0 8px; line-height: 1.6;
    }
    #mobile-data-container #pdv-ui .pdv-lista { margin: 0 12px 4px; background: #fff; border: 1px solid var(--hair); border-radius: 14px; box-shadow: var(--e1); overflow: hidden; }
    #mobile-data-container #pdv-ui .pdv-vacio {
        margin: 14px 12px; padding: 22px 18px; text-align: center; color: var(--muted); font-size: 13px; line-height: 1.45;
        background: #fff; border: 1px solid var(--hair); border-radius: 14px;
        display: flex; flex-direction: column; align-items: center; gap: 4px;
    }
    #mobile-data-container #pdv-ui .pdv-vacio > .material-symbols-outlined { font-size: 30px; color: var(--faint); }
    #mobile-data-container #pdv-ui .pdv-vacio b { color: var(--ink); font-size: 14.5px; }
    #mobile-data-container #pdv-ui .pdv-vacio.mal { color: var(--crit); }
    #mobile-data-container #pdv-ui .pdv-vacio.chico { margin: 10px 0; border: 0; }
    #mobile-data-container #pdv-ui .pdv-nota { margin: 10px 16px 0; font-size: 12px; color: var(--muted); line-height: 1.45; }

    /* ── Los renglones ─────────────────────────────────────────────────── */
    #mobile-data-container #pdv-ui .pdv-r {
        display: grid; gap: 2px 10px; padding: 10px 12px; border-bottom: 1px solid var(--hair); cursor: pointer;
        transition: background .12s ease, transform .12s ease;
        animation: pdvEntra .3s cubic-bezier(.2, .8, .2, 1) both;
    }
    #mobile-data-container #pdv-ui .pdv-r:last-child { border-bottom: 0; }
    #mobile-data-container #pdv-ui .pdv-r:active, #mobile-data-container #pdv-ui .pdv-r.pdv-toc { background: var(--navy-050); transform: scale(.985); }
    #mobile-data-container #pdv-ui .pdv-r .nm { font-weight: 600; font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
    #mobile-data-container #pdv-ui .pdv-r .val { font-weight: 700; font-size: 14px; font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
    #mobile-data-container #pdv-ui .pdv-r .val small { font-weight: 500; color: var(--faint); font-size: 11px; }
    /* el lote: el cartel grande a la izquierda, porque por ahí se lo busca en la playa */
    #mobile-data-container #pdv-ui .pdv-r.lp { grid-template-columns: 50px minmax(0, 1fr) auto; }
    #mobile-data-container #pdv-ui .pdv-r.lp .cart {
        grid-row: 1 / 4; align-self: center; display: flex; flex-direction: column; align-items: center; justify-content: center;
        min-height: 46px; border: 1.5px solid var(--navy-300); border-radius: 10px;
        font-weight: 800; font-size: 16px; color: var(--navy); line-height: 1.1;
    }
    #mobile-data-container #pdv-ui .pdv-r.lp .cart small { font-size: 8.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--faint); font-weight: 700; }
    #mobile-data-container #pdv-ui .pdv-r.lp .cart.sin { border-style: dashed; border-color: var(--hair-strong); color: var(--muted); }
    #mobile-data-container #pdv-ui .pdv-r.lp .cart .material-symbols-outlined { font-size: 18px; }
    #mobile-data-container #pdv-ui .pdv-r.lp .l2 { grid-column: 2 / -1; align-self: center; min-height: 6px; display: flex; align-items: center; gap: 8px; }
    #mobile-data-container #pdv-ui .pdv-r.lp .l2 .pdv-bar { flex: 1; }
    #mobile-data-container #pdv-ui .pdv-r.lp .cc { flex: none; font-size: 11px; color: var(--faint); font-variant-numeric: tabular-nums; }
    #mobile-data-container #pdv-ui .pdv-r.lp .l3 { grid-column: 2 / -1; display: flex; align-items: center; justify-content: space-between; gap: 6px; }
    #mobile-data-container #pdv-ui .pdv-r.lp .cd { font-size: 11.5px; color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
    #mobile-data-container #pdv-ui .pdv-r.lp.cerr { opacity: .6; }
    #mobile-data-container #pdv-ui .pdv-r.lp.cerr .cart { border-color: var(--hair-strong); color: var(--muted); }
    /* el azúcar */
    #mobile-data-container #pdv-ui .pdv-r.az { grid-template-columns: minmax(0, 1fr) auto; }
    #mobile-data-container #pdv-ui .pdv-r.az .nm { font-weight: 700; font-variant-numeric: tabular-nums; }
    #mobile-data-container #pdv-ui .pdv-r.az .l2 { grid-column: 1 / -1; font-size: 12px; color: var(--muted); }
    #mobile-data-container #pdv-ui .pdv-r.az .l3 { grid-column: 1 / -1; margin-top: 2px; }
    #mobile-data-container #pdv-ui .pdv-r.az.agot { opacity: .6; }
    /* la máquina */
    #mobile-data-container #pdv-ui .pdv-r.mq { grid-template-columns: 30px minmax(0, 1fr); gap: 1px 10px; }
    #mobile-data-container #pdv-ui .pdv-r.mq .num {
        grid-row: 1 / 3; align-self: center; width: 28px; height: 28px; border-radius: 8px;
        background: var(--navy); color: #fff; font-weight: 800; font-size: 14px;
        display: flex; align-items: center; justify-content: center;
    }
    #mobile-data-container #pdv-ui .pdv-r.mq .nm { color: var(--ok); }
    #mobile-data-container #pdv-ui .pdv-r.mq .nm b { color: var(--ink); }
    #mobile-data-container #pdv-ui .pdv-r.mq .l2 { font-size: 12px; color: var(--muted); }
    #mobile-data-container #pdv-ui .pdv-r.mq .l3 { grid-column: 2; display: flex; gap: 6px; flex-wrap: wrap; margin-top: 3px; }
    #mobile-data-container #pdv-ui .pdv-r.mq.det .num { background: var(--warn); }
    #mobile-data-container #pdv-ui .pdv-r.mq.det .nm { color: var(--warn); }
    #mobile-data-container #pdv-ui .pdv-r.mq.fs .num { background: var(--crit); }
    #mobile-data-container #pdv-ui .pdv-r.mq.fs .nm { color: var(--crit); }
    #mobile-data-container #pdv-ui .pdv-r.mq.off .num { background: #c9d1de; }
    #mobile-data-container #pdv-ui .pdv-r.mq.off .nm { color: var(--faint); font-style: italic; font-weight: 500; }

    /* la barra contra el objetivo del cartel */
    #mobile-data-container #pdv-ui .pdv-bar { display: block; height: 6px; border-radius: 999px; background: #e8ecf3; overflow: hidden; }
    #mobile-data-container #pdv-ui .pdv-bar i { display: block; height: 100%; border-radius: 999px; background: var(--navy-300); transition: width .5s cubic-bezier(.2, .8, .2, 1); }
    #mobile-data-container #pdv-ui .pdv-bar.llena i { background: var(--ok); }

    /* ── El pie: pegado abajo ──────────────────────────────────────────── */
    #mobile-data-container #pdv-ui .pdv-pie {
        position: sticky; bottom: 0; z-index: 5; display: flex; gap: 10px; align-items: center;
        padding: 10px 12px 14px; background: var(--surface); border-top: 1px solid var(--hair);
        box-shadow: 0 -4px 14px rgba(16, 32, 64, .05);
    }
    #mobile-data-container #pdv-ui .pdv-pie[hidden] { display: none; }
    #mobile-data-container #pdv-ui .pdv-pie .cuenta { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.2; }
    #mobile-data-container #pdv-ui .pdv-pie .cuenta b { font-size: 17px; color: var(--navy); font-variant-numeric: tabular-nums; }
    #mobile-data-container #pdv-ui .pdv-pie .cuenta small { font-size: 12px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    #mobile-data-container #pdv-ui .pdv-pie .cuenta.vac { font-size: 12.5px; color: var(--faint); padding: 10px 0; }

    /* ── Las piezas comunes: las del Pase de Depósito, con otro prefijo ── */
    #mobile-data-container #pdv-ui .pdv-btn {
        min-height: 44px; padding: 0 18px; border-radius: 11px; border: 1px solid var(--navy);
        background: var(--navy); color: #fff; font: inherit; font-weight: 600; font-size: 14px; cursor: pointer;
        display: inline-flex; align-items: center; justify-content: center; gap: 6px;
        transition: transform .12s ease, background .12s ease;
    }
    #mobile-data-container #pdv-ui .pdv-btn:active { transform: scale(.96); background: var(--navy-700); }
    #mobile-data-container #pdv-ui .pdv-btn[disabled] { opacity: .45; pointer-events: none; }
    #mobile-data-container #pdv-ui .pdv-btn.sec { background: #fff; color: var(--ink); border-color: var(--hair-strong); }
    #mobile-data-container #pdv-ui .pdv-btn .material-symbols-outlined { font-size: 18px; }
    #mobile-data-container #pdv-ui .pdv-btn .gs-spin { width: 14px; height: 14px; }

    /* ── Las consecuencias ─────────────────────────────────────────────── */
    #mobile-data-container #pdv-ui .pdv-chip {
        display: inline-flex; align-items: center; gap: 3px; font-size: 11.5px; font-weight: 600; line-height: 1.4;
        padding: 2px 8px; border-radius: 9px; border: 1px solid var(--hair-strong); background: #fff; color: var(--muted);
    }
    #mobile-data-container #pdv-ui .pdv-chip .material-symbols-outlined { font-size: 14px; }
    #mobile-data-container #pdv-ui .pdv-chip.ok { color: var(--ok); background: var(--ok-050); border-color: var(--ok-hair); }
    #mobile-data-container #pdv-ui .pdv-chip.warn { color: var(--warn); background: var(--warn-050); border-color: var(--warn-hair); }
    #mobile-data-container #pdv-ui .pdv-chip.mal { color: var(--crit); background: var(--crit-050); border-color: var(--crit-hair); }

    /* ── Escanear: lo primero, lo más grande ───────────────────────────── */
    #mobile-data-container #pdv-ui .pdv-scan {
        display: flex; align-items: center; gap: 12px; width: calc(100% - 24px); margin: 8px 12px 0;
        padding: 14px 12px; border: 0; border-radius: 16px; background: var(--navy); color: #fff;
        text-align: left; font: inherit; cursor: pointer; box-shadow: var(--e2);
        transition: transform .12s ease;
    }
    #mobile-data-container #pdv-ui .pdv-scan:active { transform: scale(.98); }
    #mobile-data-container #pdv-ui .pdv-scan .ic2 {
        width: 46px; height: 46px; border-radius: 12px; background: rgba(255, 255, 255, .12);
        display: flex; align-items: center; justify-content: center; flex: none;
    }
    #mobile-data-container #pdv-ui .pdv-scan .ic2 .material-symbols-outlined { font-size: 26px; }
    #mobile-data-container #pdv-ui .pdv-scan .tx { flex: 1; min-width: 0; }
    #mobile-data-container #pdv-ui .pdv-scan b { display: block; font-size: 15.5px; }
    #mobile-data-container #pdv-ui .pdv-scan small { display: block; font-size: 12px; color: #c4d3ec; line-height: 1.35; margin-top: 2px; }
    #mobile-data-container #pdv-ui .pdv-scan > .material-symbols-outlined { color: #9fb6dc; }

    /* ── El velo y las hojas ───────────────────────────────────────────── */
    #mobile-data-container #pdv-ui .pdv-velo {
        position: fixed; inset: 0; z-index: 184; background: rgba(10, 20, 40, .38);
        opacity: 0; pointer-events: none; transition: opacity .25s ease;
    }
    #mobile-data-container #pdv-ui.pdv-con-hoja .pdv-velo { opacity: 1; pointer-events: auto; }
    #mobile-data-container #pdv-ui .pdv-hoja[hidden] { display: none; }
    #mobile-data-container #pdv-ui .pdv-hoja {
        position: fixed; left: 0; right: 0; bottom: 0; z-index: 185; max-height: 88vh;
        display: flex; flex-direction: column; background: var(--surface);
        border-radius: 20px 20px 0 0; box-shadow: 0 -10px 30px rgba(16, 32, 64, .18);
        animation: mvHojaSube .28s cubic-bezier(.2, .8, .2, 1) both; will-change: transform;
    }
    #mobile-data-container #pdv-ui .pdv-hoja .asa { flex: none; align-self: center; width: 40px; height: 5px; margin: 8px 0 4px; border-radius: 9px; background: var(--hair-strong); }
    #mobile-data-container #pdv-ui .pdv-hoja .h-cab { padding: 4px 18px 10px; border-bottom: 1px solid var(--hair); flex: none; }
    #mobile-data-container #pdv-ui .pdv-hoja .h-cab .lb { font-size: 12px; color: var(--muted); }
    #mobile-data-container #pdv-ui .pdv-hoja .h-cab h4 { margin: 2px 0 2px; font-size: 18px; line-height: 1.25; font-variant-numeric: tabular-nums; }
    #mobile-data-container #pdv-ui .pdv-hoja .h-cab .sub { font-size: 12px; color: var(--muted); display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
    #mobile-data-container #pdv-ui .pdv-hoja .h-cab .sub .material-symbols-outlined { font-size: 15px; }
    #mobile-data-container #pdv-ui .pdv-hoja .h-cab .mono { font-family: Consolas, "SF Mono", monospace; color: var(--navy); }
    #mobile-data-container #pdv-ui .pdv-hoja .h-cuerpo { padding: 4px 18px 14px; overflow: auto; overscroll-behavior: contain; flex: 1; font-size: 13.5px; }
    #mobile-data-container #pdv-ui .pdv-hoja .h-pie { flex: none; display: flex; flex-wrap: wrap; gap: 8px; padding: 10px 14px 16px; border-top: 1px solid var(--hair); }
    #mobile-data-container #pdv-ui .pdv-hoja .h-pie .pdv-btn { flex: 1 1 30%; padding: 0 10px; }
    #mobile-data-container #pdv-ui .pdv-hoja .h-pie .pdv-btn.ancho { flex: 1 1 100%; }
    #mobile-data-container #pdv-ui .pdv-hoja.mv-arrastra { animation: none; transition: none; }
    #mobile-data-container #pdv-ui .pdv-hoja.mv-baja { transition: transform .22s ease-in; transform: translateY(105%) !important; }
    #mobile-data-container #pdv-ui .pdv-hoja.mv-vuelve { transition: transform .2s ease; }
    #mobile-data-container #pdv-ui .nota { margin: 10px 0 0; font-size: 12px; color: var(--muted); line-height: 1.45; }

    /* las listas de las hojas (depósitos, artículos) */
    #mobile-data-container #pdv-ui .pdv-hl {
        display: flex; justify-content: space-between; align-items: center; gap: 8px; padding: 11px 0;
        border-bottom: 1px solid var(--hair); cursor: pointer; font-size: 14px; transition: transform .12s ease;
    }
    #mobile-data-container #pdv-ui .pdv-hl:last-child { border-bottom: 0; }
    #mobile-data-container #pdv-ui .pdv-hl:active { transform: scale(.985); }
    #mobile-data-container #pdv-ui .pdv-hl .nm { font-weight: 600; min-width: 0; }
    #mobile-data-container #pdv-ui .pdv-hl .nm small { display: block; color: var(--muted); font-size: 12px; font-weight: 400; }
    #mobile-data-container #pdv-ui .pdv-hl > .material-symbols-outlined { color: var(--faint); flex: none; }
    #mobile-data-container #pdv-ui .pdv-hl.marcada .nm, #mobile-data-container #pdv-ui .pdv-hl.marcada > .material-symbols-outlined { color: var(--navy); }

    /* la hoja de los kilos */
    #mobile-data-container #pdv-ui .pdv-kgin {
        display: flex; align-items: baseline; gap: 8px; margin-top: 10px; padding: 6px 14px;
        border: 1px solid var(--hair-strong); border-radius: 12px; background: #fff;
    }
    #mobile-data-container #pdv-ui .pdv-kgin:focus-within { border-color: var(--navy-300); outline: 2px solid var(--navy-300); }
    #mobile-data-container #pdv-ui .pdv-kgin input {
        flex: 1; min-width: 0; border: 0; outline: 0; background: none; font: inherit;
        font-size: 30px; font-weight: 800; color: var(--navy); text-align: right; font-variant-numeric: tabular-nums;
    }
    #mobile-data-container #pdv-ui .pdv-kgin span { font-size: 15px; color: var(--muted); font-weight: 600; }
    #mobile-data-container #pdv-ui .pdv-kgbs { display: flex; gap: 8px; margin-top: 10px; }
    #mobile-data-container #pdv-ui .pdv-kgbs .pdv-btn { flex: 1; }
    #mobile-data-container #pdv-ui .pdv-qq { margin-top: 12px; }

    /* el paso 2 */
    #mobile-data-container #pdv-ui .pdv-sec { margin-top: 14px; }
    #mobile-data-container #pdv-ui .pdv-sec > b { display: block; font-size: 11px; letter-spacing: .07em; text-transform: uppercase; color: var(--faint); margin-bottom: 6px; }
    #mobile-data-container #pdv-ui .pdv-sec > b i { color: var(--crit); font-style: normal; }
    #mobile-data-container #pdv-ui .pdv-cps { display: flex; flex-wrap: wrap; gap: 6px; }
    #mobile-data-container #pdv-ui .pdv-cp {
        border: 1px solid var(--hair-strong); background: #fff; border-radius: 999px; padding: 7px 12px;
        font: inherit; font-size: 13px; font-weight: 600; color: var(--ink); cursor: pointer; transition: transform .12s ease;
    }
    #mobile-data-container #pdv-ui .pdv-cp:active { transform: scale(.95); }
    #mobile-data-container #pdv-ui .pdv-cp[aria-pressed="true"] { background: var(--navy); border-color: var(--navy); color: #fff; }
    #mobile-data-container #pdv-ui .pdv-fecha {
        position: relative; display: flex; align-items: center; justify-content: space-between; gap: 8px;
        padding: 9px 0; border-bottom: 1px solid var(--hair); font-weight: 600;
    }
    /* El calendario nativo, invisible encima de la línea: tocarla lo abre. */
    #mobile-data-container #pdv-ui .pdv-fecha input { position: absolute; inset: 0; opacity: 0; width: 100%; cursor: pointer; }
    #mobile-data-container #pdv-ui .pdv-fecha .lnk { color: var(--navy); font-size: 12.5px; text-decoration: underline; text-underline-offset: 2px; }
    #mobile-data-container #pdv-ui .pdv-obs {
        display: block; width: 100%; min-height: 60px; padding: 10px 12px; border: 1px solid var(--hair-strong); border-radius: 11px;
        font: inherit; font-size: 14px; color: var(--ink); background: #fff; resize: vertical;
    }
    #mobile-data-container #pdv-ui .pdv-p2l { display: grid; grid-template-columns: 1fr auto; gap: 4px 10px; padding: 8px 0; border-bottom: 1px solid var(--hair); }
    #mobile-data-container #pdv-ui .pdv-p2l:last-child { border-bottom: 0; }
    #mobile-data-container #pdv-ui .pdv-p2l b, #mobile-data-container #pdv-ui .pdv-p2l .k2 { font-variant-numeric: tabular-nums; }
    #mobile-data-container #pdv-ui .pdv-p2l .k2 { font-weight: 700; }
    #mobile-data-container #pdv-ui .pdv-p2l .pdv-chip { grid-column: 1 / -1; justify-self: start; }
    #mobile-data-container #pdv-ui .pdv-av, #mobile-data-container #pdv-ui .pdv-nota, #mobile-data-container #pdv-ui .pdv-prob {
        display: flex; gap: 9px; border: 1px solid; border-radius: 10px; padding: 9px 11px; font-size: 12.5px; line-height: 1.45; margin-top: 12px;
    }
    #mobile-data-container #pdv-ui .pdv-av .material-symbols-outlined, #mobile-data-container #pdv-ui .pdv-nota .material-symbols-outlined,
    #mobile-data-container #pdv-ui .pdv-prob > .material-symbols-outlined { font-size: 18px; flex: none; }
    #mobile-data-container #pdv-ui .pdv-av { background: var(--warn-050); border-color: var(--warn-hair); color: #7a4100; }
    #mobile-data-container #pdv-ui .pdv-nota { background: var(--navy-050); border-color: #cfdcf1; color: var(--navy-500); }
    #mobile-data-container #pdv-ui .pdv-nota b { color: var(--navy); }
    #mobile-data-container #pdv-ui .pdv-prob { background: var(--crit-050); border-color: var(--crit-hair); color: var(--crit); margin: 8px 0 2px; }
    #mobile-data-container #pdv-ui .pdv-prob ul { margin: 4px 0 0; padding-left: 16px; }
    #mobile-data-container #pdv-ui .pdv-prob li { margin: 2px 0; color: #8f1d1d; }


    /* ── Lo propio de las hojas de esta pantalla ───────────────────────── */
    #mobile-data-container #pdv-ui .pdv-chip.nav { color: var(--navy-500); background: var(--navy-050); border-color: #d3dff0; }
    #mobile-data-container #pdv-ui .pdv-chip.mut { color: var(--faint); background: #f4f5f8; }
    #mobile-data-container #pdv-ui .pdv-r .pdv-chip { white-space: nowrap; flex: none; }
    #mobile-data-container #pdv-ui .pdv-btn.chico { min-height: 36px; font-size: 13px; padding: 0 12px; flex: none; }
    #mobile-data-container #pdv-ui .pdv-btn.warn { background: var(--warn-050); color: var(--warn); border-color: var(--warn-hair); }
    #mobile-data-container #pdv-ui .pdv-hoja .pdv-scan { width: 100%; margin: 6px 0 4px; }
    #mobile-data-container #pdv-ui .pdv-hoja .pdv-nota { display: flex; gap: 9px; margin: 12px 0 0; padding: 9px 11px; border: 1px solid #cfdcf1; border-radius: 10px; background: var(--navy-050); color: var(--navy-500); font-size: 12.5px; }
    #mobile-data-container #pdv-ui .pdv-hoja .pdv-nota .material-symbols-outlined { font-size: 18px; flex: none; }
    #mobile-data-container #pdv-ui .pdv-hoja .pdv-nota b { color: var(--navy); }
    #mobile-data-container #pdv-ui .pdv-hoja .pdv-av { display: flex; gap: 9px; margin: 12px 0 0; padding: 9px 11px; border: 1px solid var(--warn-hair); border-radius: 10px; background: var(--warn-050); color: #7a4100; font-size: 12.5px; }
    #mobile-data-container #pdv-ui .pdv-hoja .pdv-av .material-symbols-outlined { font-size: 18px; flex: none; }
    #mobile-data-container #pdv-ui .pdv-dl { display: grid; grid-template-columns: auto 1fr; gap: 4px 12px; margin: 12px 0 0; font-size: 13.5px; }
    #mobile-data-container #pdv-ui .pdv-dl dt { color: var(--muted); }
    #mobile-data-container #pdv-ui .pdv-dl dd { margin: 0; text-align: right; font-weight: 500; font-variant-numeric: tabular-nums; }
    #mobile-data-container #pdv-ui .pdv-lh { margin-top: 10px; }
    #mobile-data-container #pdv-ui .pdv-lh .pdv-bar { height: 10px; }
    #mobile-data-container #pdv-ui .pdv-lh .lh2 { display: flex; justify-content: space-between; margin-top: 6px; font-size: 13px; color: var(--muted); font-variant-numeric: tabular-nums; }
    #mobile-data-container #pdv-ui .pdv-lh .lh2 b { color: var(--ink); }
    #mobile-data-container #pdv-ui .pdv-hoja .lh3 { margin-top: 8px; font-size: 12.5px; color: var(--navy-500); }
    #mobile-data-container #pdv-ui .pdv-kgbs { flex-wrap: wrap; align-items: center; }
    #mobile-data-container #pdv-ui .pdv-kgbs .pdv-btn { flex: none; }
    #mobile-data-container #pdv-ui .pdv-equiv { font-size: 12.5px; color: var(--muted); font-variant-numeric: tabular-nums; }
    #mobile-data-container #pdv-ui .pdv-mps { display: grid; gap: 8px; }
    #mobile-data-container #pdv-ui .pdv-mpf { display: grid; grid-template-columns: 1fr auto; gap: 4px 8px; border: 1px solid var(--hair); border-radius: 12px; padding: 8px 10px; }
    #mobile-data-container #pdv-ui .pdv-mpf.hab { border-color: var(--ok-hair); background: #f7fbf9; }
    #mobile-data-container #pdv-ui .pdv-mpf .mp1 { grid-column: 1 / -1; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
    #mobile-data-container #pdv-ui .pdv-mpf .mp1 b { font-size: 13.5px; font-variant-numeric: tabular-nums; }
    #mobile-data-container #pdv-ui .pdv-mpf .mp2 { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 11.5px; color: var(--muted); min-width: 0; }
    #mobile-data-container #pdv-ui .pdv-mpin { display: flex; align-items: baseline; gap: 4px; border: 1px solid var(--hair-strong); border-radius: 10px; padding: 4px 8px; width: 112px; flex: none; background: #fff; }
    #mobile-data-container #pdv-ui .pdv-mpin input { width: 100%; min-width: 0; border: 0; outline: 0; background: none; font: inherit; font-size: 16px; font-weight: 700; text-align: right; color: var(--navy); font-variant-numeric: tabular-nums; }
    #mobile-data-container #pdv-ui .pdv-mpin span { font-size: 12px; }
    #mobile-data-container #pdv-ui .pdv-todo { align-self: center; border: 0; background: none; color: var(--navy-500); font: inherit; font-size: 12px; font-weight: 600; text-decoration: underline; text-underline-offset: 2px; cursor: pointer; padding: 6px 0 6px 4px; }
    #mobile-data-container #pdv-ui .pdv-cuadra { margin-top: 10px; font-size: 12.5px; line-height: 1.45; border-radius: 10px; padding: 8px 10px; border: 1px solid; }
    #mobile-data-container #pdv-ui .pdv-cuadra.mut { color: var(--muted); border-color: var(--hair); background: #fafbfc; }
    #mobile-data-container #pdv-ui .pdv-cuadra.warn { color: var(--warn); border-color: var(--warn-hair); background: var(--warn-050); }
    #mobile-data-container #pdv-ui .pdv-cuadra.ok { color: var(--ok); border-color: var(--ok-hair); background: var(--ok-050); }
    #mobile-data-container #pdv-ui .pdv-cuadra.mal { color: var(--crit); border-color: var(--crit-hair); background: var(--crit-050); }
    #mobile-data-container #pdv-ui .pdv-in {
        display: block; width: 100%; min-height: 44px; padding: 9px 12px; border: 1px solid var(--hair-strong); border-radius: 11px;
        font: inherit; font-size: 15px; color: var(--ink); background: #fff; font-variant-numeric: tabular-nums;
    }
    #mobile-data-container #pdv-ui .pdv-in:focus { outline: 2px solid var(--navy-300); border-color: var(--navy-300); }
    #mobile-data-container #pdv-ui .pdv-in.mal { border-color: var(--crit); }
    #mobile-data-container #pdv-ui .nota.mal { color: var(--crit); font-weight: 600; }
    #mobile-data-container #pdv-ui .pdv-busca { display: flex; align-items: center; gap: 8px; margin: 8px 0; padding: 0 12px; border: 1px solid var(--hair-strong); border-radius: 11px; background: #fff; color: var(--faint); }
    #mobile-data-container #pdv-ui .pdv-busca input { flex: 1; min-width: 0; min-height: 42px; border: 0; outline: 0; background: none; font: inherit; font-size: 14px; color: var(--ink); }
    #mobile-data-container #pdv-ui .pdv-cp.cart { display: inline-flex; flex-direction: column; align-items: center; min-width: 64px; padding: 5px 10px; border-radius: 12px; line-height: 1.2; }
    #mobile-data-container #pdv-ui .pdv-cp.cart b { font-size: 15px; }
    #mobile-data-container #pdv-ui .pdv-cp.cart small { font-size: 10.5px; font-weight: 500; color: var(--muted); white-space: nowrap; }
    #mobile-data-container #pdv-ui .pdv-cp.cart[aria-pressed="true"] small { color: #c4d3ec; }
    #mobile-data-container #pdv-ui .pdv-cp[disabled] { opacity: .4; pointer-events: none; }
    #mobile-data-container #pdv-ui .pdv-fal { display: flex; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--hair); }
    #mobile-data-container #pdv-ui .pdv-fal:last-child { border-bottom: 0; }
    #mobile-data-container #pdv-ui .pdv-fal > .material-symbols-outlined { font-size: 22px; color: var(--navy-500); flex: none; }
    #mobile-data-container #pdv-ui .pdv-fal b { display: block; font-size: 14px; }
    #mobile-data-container #pdv-ui .pdv-fal.crit b { color: var(--crit); }
    #mobile-data-container #pdv-ui .pdv-fal i { display: block; font-style: normal; font-size: 12px; color: var(--muted); margin-top: 2px; }
    #mobile-data-container #pdv-ui .pdv-fal .lts { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
    #mobile-data-container #pdv-ui .pdv-fal .lts .pdv-cp { font-size: 12px; padding: 5px 10px; font-variant-numeric: tabular-nums; }
    #mobile-data-container #pdv-ui .pdv-hoja input[type=number]::-webkit-inner-spin-button, #mobile-data-container #pdv-ui .pdv-hoja input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
    #mobile-data-container #pdv-ui .pdv-hoja input[type=number] { -moz-appearance: textfield; }

    /* Los avisos del sistema salen abajo a la derecha: acá taparían el pie
       (y un aviso se toca para cerrarlo: se comía el toque). Encima del pie;
       con una hoja abierta, arriba. Lo mismo que el Pase (etapa 3i). */
    body:has(#mobile-data-container #pdv-ui) #gs-toasts { left: 12px; right: 12px; bottom: 84px; align-items: center; }
    body:has(#mobile-data-container #pdv-ui.pdv-con-hoja) #gs-toasts { bottom: auto; top: 70px; flex-direction: column; }
}
/* Sólo `from`: el final es el valor propio del renglón (los cerrados van al 60 %). */
@keyframes pdvEntra { from { opacity: 0; transform: translateY(10px); } }
@keyframes pdvLate { 50% { box-shadow: 0 0 0 5px var(--ok-050); } }
@media (prefers-reduced-motion: reduce) {
    #mobile-data-container #pdv-ui .pdv-r, #mobile-data-container #pdv-ui .pdv-hoja, #mobile-data-container #pdv-ui .pdv-est.ok { animation: none; }
}