/* /Layout/AdscomerNav.razor.rz.scp.css */
.navbar-toggler[b-r7253uh7cm] {
    background-color: rgba(255, 255, 255, 0.1);
}

.top-row[b-r7253uh7cm] {
    min-height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-r7253uh7cm] {
    font-size: 1.1rem;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.container-fluid[b-r7253uh7cm] {
    gap: .35rem;
}

.sidebar-collapse-toggle[b-r7253uh7cm] {
    align-items: center;
    background: rgba(255, 255, 255, .12);
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 8px;
    color: #fff;
    display: none;
    font-size: 1rem;
    font-weight: 900;
    height: 36px;
    justify-content: center;
    line-height: 1;
    min-width: 36px;
}

.bi[b-r7253uh7cm] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-r7253uh7cm] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-r7253uh7cm] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-r7253uh7cm] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.nav-item[b-r7253uh7cm] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-r7253uh7cm] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-r7253uh7cm] {
        padding-bottom: 1rem;
    }

    .nav-item[b-r7253uh7cm]  a {
        color: #d7d7d7;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
        white-space: nowrap;
    }

.nav-item[b-r7253uh7cm]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-r7253uh7cm]  a:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

@media (min-width: 641px) {
    .navbar-toggler[b-r7253uh7cm] {
        display: none;
    }

    .sidebar-collapse-toggle[b-r7253uh7cm] {
        display: inline-flex;
    }

    .collapse[b-r7253uh7cm] {
        /* Never collapse the sidebar for wide screens */
        display: block;
    }

    .nav-scrollable[b-r7253uh7cm] {
        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }

    .top-row.collapsed[b-r7253uh7cm] {
        padding-left: .4rem !important;
        padding-right: .4rem !important;
    }

    .top-row.collapsed .container-fluid[b-r7253uh7cm] {
        justify-content: center;
        padding-left: 0;
        padding-right: 0;
    }

    .top-row.collapsed .navbar-brand[b-r7253uh7cm],
    .top-row.collapsed .nav-text[b-r7253uh7cm] {
        display: none;
    }

    .top-row.collapsed + .nav-scrollable .nav-item[b-r7253uh7cm] {
        padding-left: .55rem !important;
        padding-right: .55rem !important;
    }

    .top-row.collapsed + .nav-scrollable .nav-text[b-r7253uh7cm] {
        display: none;
    }

    .top-row.collapsed + .nav-scrollable .nav-item[b-r7253uh7cm]  a {
        justify-content: center;
        padding-left: 0;
        padding-right: 0;
    }

    .top-row.collapsed + .nav-scrollable .bi[b-r7253uh7cm] {
        margin-right: 0;
    }
}
/* /Layout/MainLayout.razor.rz.scp.css */
.page[b-qm4m3tirl3] {
    position: relative;
    display: flex;
    flex-direction: column;
}

main[b-qm4m3tirl3] {
    flex: 1;
    min-width: 0;
}

.sidebar[b-qm4m3tirl3] {
    background-image: linear-gradient(180deg, rgb(5, 39, 103) 0%, #3a0647 70%);
    transition: width .18s ease;
}

.top-row[b-qm4m3tirl3] {
    background-color: #fff;
    border-bottom: 1px solid #d6d5d5;
    justify-content: space-between;
    height: 3.5rem;
    display: flex;
    align-items: center;
}

.app-topbar[b-qm4m3tirl3] {
    gap: 1rem;
}

.company-identity[b-qm4m3tirl3] {
    display: flex;
    flex-direction: column;
    line-height: 1.1;
    min-width: 0;
}

.company-identity span[b-qm4m3tirl3] {
    color: #64748b;
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.company-identity strong[b-qm4m3tirl3] {
    color: #172033;
    font-size: .95rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.user-menu[b-qm4m3tirl3] {
    margin-left: auto;
    position: relative;
}

.user-menu details[b-qm4m3tirl3] {
    position: relative;
}

.user-menu summary[b-qm4m3tirl3] {
    align-items: center;
    background: #fff;
    border: 1px solid #cbd5e1;
    border-radius: 999px;
    color: #172033;
    display: inline-flex;
    gap: .55rem;
    font-size: .86rem;
    font-weight: 700;
    min-height: 38px;
    list-style: none;
    padding: .3rem .75rem .3rem .35rem;
    user-select: none;
}

.user-menu summary[b-qm4m3tirl3]::-webkit-details-marker {
    display: none;
}

.user-menu summary span[b-qm4m3tirl3] {
    align-items: center;
    background: #1454d4;
    border-radius: 999px;
    color: #fff;
    display: inline-flex;
    font-size: .78rem;
    height: 30px;
    justify-content: center;
    width: 30px;
}

.user-menu-popover[b-qm4m3tirl3] {
    background: #fff;
    border: 1px solid #d7dde6;
    border-radius: 8px;
    box-shadow: 0 14px 30px rgba(15, 23, 42, .16);
    min-width: 180px;
    padding: .4rem;
    position: absolute;
    right: 0;
    top: calc(100% + .4rem);
    z-index: 10;
}

.user-menu-popover button[b-qm4m3tirl3] {
    background: transparent;
    border: 0;
    border-radius: 6px;
    color: #991b1b;
    font-weight: 800;
    min-height: 36px;
    padding: .45rem .65rem;
    text-align: left;
    width: 100%;
}

.user-menu-popover button:hover[b-qm4m3tirl3] {
    background: #fef2f2;
}

    .top-row[b-qm4m3tirl3]  a, .top-row[b-qm4m3tirl3]  .btn-link {
        white-space: nowrap;
        margin-left: 1.5rem;
        text-decoration: none;
    }

    .top-row[b-qm4m3tirl3]  a:hover, .top-row[b-qm4m3tirl3]  .btn-link:hover {
        text-decoration: underline;
    }

    .top-row[b-qm4m3tirl3]  a:first-child {
        overflow: hidden;
        text-overflow: ellipsis;
    }

@media (max-width: 640.98px) {
    .top-row[b-qm4m3tirl3] {
        justify-content: space-between;
    }

    .top-row[b-qm4m3tirl3]  a, .top-row[b-qm4m3tirl3]  .btn-link {
        margin-left: 0;
    }
}

@media (min-width: 641px) {
    .page[b-qm4m3tirl3] {
        flex-direction: row;
    }

    .sidebar[b-qm4m3tirl3] {
        width: 250px;
        height: 100vh;
        position: sticky;
        top: 0;
    }

    .page.nav-collapsed .sidebar[b-qm4m3tirl3] {
        width: 72px;
    }

    .top-row[b-qm4m3tirl3] {
        position: sticky;
        top: 0;
        z-index: 1;
    }

    .top-row.auth[b-qm4m3tirl3]  a:first-child {
        flex: 1;
        text-align: right;
        width: 0;
    }

    .top-row[b-qm4m3tirl3], article[b-qm4m3tirl3] {
        padding-left: 2rem !important;
        padding-right: 1.5rem !important;
    }
}

/* P0.2 / P0.3 — estado de conexion y pendientes en el topbar */
.topbar-status[b-qm4m3tirl3] {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-left: auto;
}

.status-pill[b-qm4m3tirl3] {
    display: inline-flex;
    align-items: center;
    gap: .4rem;
    border: 1px solid transparent;
    border-radius: 999px;
    padding: .25rem .6rem;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .02em;
    white-space: nowrap;
}

.status-pill .dot[b-qm4m3tirl3] {
    width: .55rem;
    height: .55rem;
    border-radius: 50%;
    background: currentColor;
    flex: 0 0 auto;
}

.status-pill.conn.ok[b-qm4m3tirl3] {
    color: #0f7b4f;
    background: #e7f7ee;
    border-color: #bfe8d2;
}

.status-pill.conn.warn[b-qm4m3tirl3] {
    color: #a15c00;
    background: #fdf3e2;
    border-color: #f2ddb5;
}

.status-pill.conn.down[b-qm4m3tirl3] {
    color: #b42318;
    background: #fdeceb;
    border-color: #f4c9c5;
}

.status-pill.pending[b-qm4m3tirl3] {
    color: #4a3aff;
    background: #eceaff;
    border-color: #d3ccff;
    cursor: pointer;
}

.status-pill.pending:hover[b-qm4m3tirl3] {
    background: #e0dbff;
}
/* /Layout/RestauranteNav.razor.rz.scp.css */
.navbar-toggler[b-lhlzdt9xee] {
    background-color: rgba(255, 255, 255, 0.1);
}

.top-row[b-lhlzdt9xee] {
    min-height: 3.5rem;
    background-color: rgba(0,0,0,0.4);
}

.navbar-brand[b-lhlzdt9xee] {
    font-size: 1.1rem;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.container-fluid[b-lhlzdt9xee] {
    gap: .35rem;
}

.sidebar-collapse-toggle[b-lhlzdt9xee] {
    align-items: center;
    background: rgba(255, 255, 255, .12);
    border: 1px solid rgba(255, 255, 255, .18);
    border-radius: 8px;
    color: #fff;
    display: none;
    font-size: 1rem;
    font-weight: 900;
    height: 36px;
    justify-content: center;
    line-height: 1;
    min-width: 36px;
}

.bi[b-lhlzdt9xee] {
    display: inline-block;
    position: relative;
    width: 1.25rem;
    height: 1.25rem;
    margin-right: 0.75rem;
    top: -1px;
    background-size: cover;
}

.bi-house-door-fill-nav-menu[b-lhlzdt9xee] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-house-door-fill' viewBox='0 0 16 16'%3E%3Cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5Z'/%3E%3C/svg%3E");
}

.bi-plus-square-fill-nav-menu[b-lhlzdt9xee] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-plus-square-fill' viewBox='0 0 16 16'%3E%3Cpath d='M2 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V2a2 2 0 0 0-2-2H2zm6.5 4.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3a.5.5 0 0 1 1 0z'/%3E%3C/svg%3E");
}

.bi-list-nested-nav-menu[b-lhlzdt9xee] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='white' class='bi bi-list-nested' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M4.5 11.5A.5.5 0 0 1 5 11h10a.5.5 0 0 1 0 1H5a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 3 7h10a.5.5 0 0 1 0 1H3a.5.5 0 0 1-.5-.5zm-2-4A.5.5 0 0 1 1 3h10a.5.5 0 0 1 0 1H1a.5.5 0 0 1-.5-.5z'/%3E%3C/svg%3E");
}

.nav-item[b-lhlzdt9xee] {
    font-size: 0.9rem;
    padding-bottom: 0.5rem;
}

    .nav-item:first-of-type[b-lhlzdt9xee] {
        padding-top: 1rem;
    }

    .nav-item:last-of-type[b-lhlzdt9xee] {
        padding-bottom: 1rem;
    }

    .nav-item[b-lhlzdt9xee]  a {
        color: #d7d7d7;
        border-radius: 4px;
        height: 3rem;
        display: flex;
        align-items: center;
        line-height: 3rem;
        white-space: nowrap;
    }

.nav-item[b-lhlzdt9xee]  a.active {
    background-color: rgba(255,255,255,0.37);
    color: white;
}

.nav-item[b-lhlzdt9xee]  a:hover {
    background-color: rgba(255,255,255,0.1);
    color: white;
}

@media (min-width: 641px) {
    .navbar-toggler[b-lhlzdt9xee] {
        display: none;
    }

    .sidebar-collapse-toggle[b-lhlzdt9xee] {
        display: inline-flex;
    }

    .collapse[b-lhlzdt9xee] {
        /* Never collapse the sidebar for wide screens */
        display: block;
    }

    .nav-scrollable[b-lhlzdt9xee] {
        /* Allow sidebar to scroll for tall menus */
        height: calc(100vh - 3.5rem);
        overflow-y: auto;
    }

    .top-row.collapsed[b-lhlzdt9xee] {
        padding-left: .4rem !important;
        padding-right: .4rem !important;
    }

    .top-row.collapsed .container-fluid[b-lhlzdt9xee] {
        justify-content: center;
        padding-left: 0;
        padding-right: 0;
    }

    .top-row.collapsed .navbar-brand[b-lhlzdt9xee],
    .top-row.collapsed .nav-text[b-lhlzdt9xee] {
        display: none;
    }

    .top-row.collapsed + .nav-scrollable .nav-item[b-lhlzdt9xee] {
        padding-left: .55rem !important;
        padding-right: .55rem !important;
    }

    .top-row.collapsed + .nav-scrollable .nav-text[b-lhlzdt9xee] {
        display: none;
    }

    .top-row.collapsed + .nav-scrollable .nav-item[b-lhlzdt9xee]  a {
        justify-content: center;
        padding-left: 0;
        padding-right: 0;
    }

    .top-row.collapsed + .nav-scrollable .bi[b-lhlzdt9xee] {
        margin-right: 0;
    }
}
/* /Pages/Adscomer/Caja.razor.rz.scp.css */
/* CAJA-2. La Caja en una tablet (maqueta docs/maquetas/caja-en-tablet.html): táctil, nada que se toque mide menos de
   48 px y el texto base es de 16 px. Horizontal: catálogo a la izquierda y ticket a la derecha; vertical: ticket abajo
   con «Cobrar» a la vista. Los colores salen del tema (--mud-palette-*), como en la maqueta. */
.caja[b-tdl86r4c2k] {
    --bg: var(--mud-palette-background); --surface: var(--mud-palette-surface); --surface-2: var(--mud-palette-background-gray);
    --line: var(--mud-palette-lines-default); --fg: var(--mud-palette-text-primary); --fg-2: var(--mud-palette-text-secondary);
    --fg-3: var(--mud-palette-text-disabled); --accent: var(--mud-palette-primary); --on-accent: var(--mud-palette-primary-text);
    --band: color-mix(in srgb, var(--mud-palette-primary) 8%, var(--mud-palette-surface));
    --ink: var(--mud-palette-appbar-background); --ok: var(--mud-palette-success); --warn: var(--mud-palette-warning); --crit: var(--mud-palette-error);
    --ok-soft: color-mix(in srgb, var(--mud-palette-success) 13%, var(--mud-palette-surface));
    --warn-soft: color-mix(in srgb, var(--mud-palette-warning) 14%, var(--mud-palette-surface));
    --crit-soft: color-mix(in srgb, var(--mud-palette-error) 12%, var(--mud-palette-surface));
    --nuevo: var(--mud-palette-primary);
    --mono: "JetBrains Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;
    --r: 10px; --toque: 48px;
    position: fixed; inset: 0; display: grid; grid-template-rows: 60px minmax(0, 1fr); grid-template-columns: minmax(0, 1fr);
    background: var(--bg); color: var(--fg); font-size: 16px; line-height: 1.45; overflow: hidden;
}
/* Con :where no pesan: el CSS aislado le suma un atributo a cada parte del selector, y «.caja button» le ganaba el color
   a «.btn-cobrar» (texto oscuro sobre el primario). */
:where(.caja) :where(button, input)[b-tdl86r4c2k] { font: inherit; color: inherit; }
:where(.caja) :where(button)[b-tdl86r4c2k] { cursor: pointer; }
.caja button[disabled][b-tdl86r4c2k] { opacity: .4; cursor: not-allowed; }
.caja :focus-visible[b-tdl86r4c2k] { outline: 3px solid var(--accent); outline-offset: 2px; border-radius: 6px; }
.num[b-tdl86r4c2k] { font-variant-numeric: tabular-nums; }

/* Encabezado: negocio, red, lo que falta por enviar y la cajera con su turno. */
/* CAJA-TEMA: la barra del tema, como en la maqueta; era el color del texto. */
.cab[b-tdl86r4c2k] { display: flex; align-items: center; gap: 14px; padding: 0 14px; background: var(--ink); color: var(--mud-palette-appbar-text); }
.cab .negocio[b-tdl86r4c2k] { min-width: 0; line-height: 1.15; }
.cab .negocio b[b-tdl86r4c2k] { display: block; font-size: 16px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cab .negocio small[b-tdl86r4c2k] { font-size: 12.5px; opacity: .75; }
.cab .sp[b-tdl86r4c2k] { flex: 1; }
.red[b-tdl86r4c2k] { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 14px; border-radius: 99px; font-size: 14px; font-weight: 600; white-space: nowrap; }
.red[b-tdl86r4c2k]::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: currentColor; }
.red.en-linea[b-tdl86r4c2k] { background: color-mix(in srgb, var(--ok) 25%, transparent); color: color-mix(in srgb, var(--ok) 40%, var(--mud-palette-surface)); }
.red.sin-red[b-tdl86r4c2k] { background: color-mix(in srgb, var(--warn) 30%, transparent); color: color-mix(in srgb, var(--warn) 40%, var(--mud-palette-surface)); }
.por-enviar[b-tdl86r4c2k] { display: inline-grid; place-items: center; min-height: 32px; padding: 0 12px; border-radius: 99px; background: var(--warn); color: var(--mud-palette-surface); font-size: 13px; font-weight: 700; white-space: nowrap; }
.cajero[b-tdl86r4c2k] { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; opacity: .9; }
.cajero i[b-tdl86r4c2k] { width: 34px; height: 34px; border-radius: 50%; background: color-mix(in srgb, var(--mud-palette-surface) 16%, transparent); display: grid; place-items: center; font-style: normal; font-weight: 700; }
.salir[b-tdl86r4c2k] { min-height: 44px; padding: 0 14px; border: 1px solid color-mix(in srgb, var(--mud-palette-surface) 30%, transparent); border-radius: var(--r); background: none; color: var(--mud-palette-surface); font-weight: 600; }

/* Vender: catálogo y ticket. */
.vender[b-tdl86r4c2k] { display: grid; grid-template-columns: minmax(0, 1fr) 470px; min-height: 0; }
.catalogo[b-tdl86r4c2k] { display: grid; grid-template-rows: auto auto minmax(0, 1fr); gap: 12px; padding: 14px; min-height: 0; }
.arriba[b-tdl86r4c2k] { display: grid; gap: 8px; }
.buscar[b-tdl86r4c2k] { display: flex; gap: 10px; }
/* CAJA-TECLADO: el código que el lector de mano leyó y no está; la caja ya quedó vacía para la siguiente lectura. */
.no-esta[b-tdl86r4c2k] { margin: 0; padding: 8px 14px; border-radius: var(--r); background: var(--warn-soft); color: var(--fg); font-weight: 600; }
.caja-buscar[b-tdl86r4c2k] { flex: 1; display: flex; align-items: center; gap: 10px; height: 56px; padding: 0 16px; background: var(--surface); border: 2px solid var(--line); border-radius: var(--r); }
.caja-buscar:focus-within[b-tdl86r4c2k] { border-color: var(--accent); }
.caja-buscar svg[b-tdl86r4c2k] { flex: none; color: var(--fg-3); }
.caja-buscar input[b-tdl86r4c2k] { flex: 1; border: 0; outline: 0; background: none; font-size: 18px; min-width: 0; }
/* AD-LECTOR. «Escanear» junto a la búsqueda y el visor de la cámara, como en la maqueta. El visor es lo único oscuro en los
   dos temas, como el de cualquier teléfono: enseña video, y sobre él lo claro se lee. */
.btn-escanear[b-tdl86r4c2k] { flex: none; display: inline-flex; align-items: center; gap: 10px; height: 56px; padding: 0 20px; border: 0; border-radius: var(--r); background: var(--accent); color: var(--on-accent); font-size: 16px; font-weight: 700; }
.camara[b-tdl86r4c2k] { --camara: #05070c; --camara-fg: #f3f6fb; position: absolute; inset: 60px 0 0; z-index: 6; display: grid; grid-template-rows: minmax(0, 1fr) auto; background: var(--camara); color: var(--camara-fg); }
.visor-cam[b-tdl86r4c2k] { position: relative; display: grid; place-items: center; overflow: hidden; }
.visor-cam video[b-tdl86r4c2k] { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.guia[b-tdl86r4c2k] { position: relative; width: min(70%, 520px); aspect-ratio: 2.4; border: 3px solid rgba(255, 255, 255, .85); border-radius: 14px; box-shadow: 0 0 0 2000px rgba(0, 0, 0, .35); }
.guia[b-tdl86r4c2k]::after { content: ""; position: absolute; left: 6%; right: 6%; top: 50%; height: 2px; background: #f87185; animation: barrer-b-tdl86r4c2k 1.6s ease-in-out infinite alternate; }
@keyframes barrer-b-tdl86r4c2k { from { transform: translateY(-38px); } to { transform: translateY(38px); } }
.visor-cam p[b-tdl86r4c2k] { position: absolute; bottom: 20px; left: 16px; right: 16px; margin: 0; text-align: center; font-size: 17px; text-shadow: 0 1px 3px #000; }
.leido[b-tdl86r4c2k] { position: absolute; top: 20px; left: 50%; transform: translateX(-50%); z-index: 1; max-width: calc(100% - 32px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 10px 18px; border-radius: 99px; background: rgba(21, 128, 61, .92); color: #fff; font-size: 16px; font-weight: 600; }
.leido.desconocido[b-tdl86r4c2k] { background: rgba(180, 83, 9, .94); }
.camara-pie[b-tdl86r4c2k] { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; padding: 14px; background: #0b0e14; }
:where(.camara-pie) button[b-tdl86r4c2k] { min-height: 56px; padding: 0 22px; border: 1px solid rgba(255, 255, 255, .25); border-radius: 12px; background: rgba(255, 255, 255, .08); color: var(--camara-fg); font-size: 16px; font-weight: 600; }
.camara-pie .btn-listo[b-tdl86r4c2k] { background: var(--camara-fg); color: var(--camara); border-color: transparent; }
.camara-pie [aria-pressed="true"][b-tdl86r4c2k] { background: var(--camara-fg); color: var(--camara); }
.cat-fila[b-tdl86r4c2k] { display: flex; align-items: center; gap: 10px; min-width: 0; }
.categorias[b-tdl86r4c2k] { flex: 1; min-width: 0; display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; }
.categorias button[b-tdl86r4c2k] { flex: none; min-height: 44px; padding: 0 18px; border: 1px solid var(--line); border-radius: 99px; background: var(--surface); font-size: 15px; font-weight: 500; }
.categorias button[aria-pressed="true"][b-tdl86r4c2k] { background: var(--band); border-color: var(--accent); color: var(--accent); font-weight: 700; }
.vista-cat[b-tdl86r4c2k] { flex: none; display: inline-flex; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: var(--surface); }
.vista-cat button[b-tdl86r4c2k] { width: 48px; height: 44px; border: 0; background: none; color: var(--fg-2); display: grid; place-items: center; }
.vista-cat button + button[b-tdl86r4c2k] { border-left: 1px solid var(--line); }
.vista-cat button[aria-pressed="true"][b-tdl86r4c2k] { background: var(--band); color: var(--accent); }

.rejilla[b-tdl86r4c2k] { display: grid; grid-template-columns: repeat(auto-fill, minmax(176px, 1fr)); grid-auto-rows: max-content; gap: 10px; overflow-y: auto; min-height: 0; padding-bottom: 6px; }
.producto-wrap[b-tdl86r4c2k] { position: relative; display: grid; }
.ver-fotos[b-tdl86r4c2k] { position: absolute; top: 8px; left: 8px; min-width: 44px; height: 44px; padding: 0 10px; border: 0; border-radius: 99px; background: color-mix(in srgb, var(--surface) 90%, transparent); color: var(--fg); display: inline-flex; align-items: center; justify-content: center; gap: 5px; font-size: 13px; font-weight: 700; box-shadow: 0 2px 8px color-mix(in srgb, var(--ink) 18%, transparent); }
.producto[b-tdl86r4c2k] { display: grid; grid-template-rows: 104px auto 1fr auto; gap: 5px; text-align: left; padding: 0 0 12px; overflow: hidden; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); position: relative; }
.producto > span:not(.foto):not(.en-ticket)[b-tdl86r4c2k] { padding-inline: 12px; }
.producto:active[b-tdl86r4c2k] { transform: scale(.98); border-color: var(--accent); }
.foto[b-tdl86r4c2k] { height: 104px; display: grid; place-items: center; overflow: hidden; background: var(--band); color: var(--accent); border-bottom: 1px solid var(--line); }
.foto img[b-tdl86r4c2k], .mini img[b-tdl86r4c2k] { width: 100%; height: 100%; object-fit: cover; }
.inicial[b-tdl86r4c2k] { font-weight: 700; line-height: 1; }
.producto .clave[b-tdl86r4c2k], .fila-p .clave[b-tdl86r4c2k] { font-family: var(--mono); font-size: 11.5px; color: var(--fg-3); }
.producto .clave[b-tdl86r4c2k] { margin-top: 4px; }
.producto .nombre[b-tdl86r4c2k] { font-size: 15.5px; font-weight: 600; line-height: 1.25; }
.producto .pie[b-tdl86r4c2k] { display: flex; align-items: baseline; justify-content: space-between; gap: 6px; }
.producto .precio[b-tdl86r4c2k] { font-size: 19px; font-weight: 700; }
.producto .exist[b-tdl86r4c2k], .fila-p .exist[b-tdl86r4c2k] { font-size: 12.5px; color: var(--fg-2); }
.exist.agotado[b-tdl86r4c2k] { color: var(--warn); font-weight: 600; }
.en-ticket[b-tdl86r4c2k] { min-width: 28px; height: 28px; padding: 0 8px; border-radius: 99px; background: var(--accent); color: var(--on-accent); font-size: 14px; font-weight: 700; display: inline-grid; place-items: center; }
.producto .en-ticket[b-tdl86r4c2k] { position: absolute; top: 8px; right: 8px; }

.lista-p[b-tdl86r4c2k] { overflow-y: auto; min-height: 0; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r); align-self: start; max-height: 100%; display: grid; }
/* CAJA-4b. La miniatura abre las fotos y el resto del renglón agrega: van lado a lado, no un botón dentro del otro. */
.fila-wrap[b-tdl86r4c2k] { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; border-top: 1px solid var(--line); }
.fila-wrap:first-child[b-tdl86r4c2k] { border-top: 0; }
.fila-p[b-tdl86r4c2k] { display: grid; grid-template-columns: minmax(0, 1fr) 84px 96px 36px; align-items: center; gap: 10px; min-height: 56px; padding: 4px 12px 4px 10px; border: 0; background: none; text-align: left; }
.fila-p:active[b-tdl86r4c2k] { background: var(--band); }
.mini[b-tdl86r4c2k] { width: 48px; height: 48px; margin: 4px 0 4px 10px; padding: 0; border: 0; border-radius: 8px; overflow: hidden; background: var(--band); color: var(--accent); display: grid; place-items: center; }
.fila-p .que[b-tdl86r4c2k] { min-width: 0; display: grid; line-height: 1.2; }
.fila-p .nombre[b-tdl86r4c2k] { font-size: 15.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fila-p .exist[b-tdl86r4c2k] { text-align: right; font-size: 14px; }
.fila-p .precio[b-tdl86r4c2k] { text-align: right; font-size: 17px; font-weight: 700; }

/* El ticket: siempre visible, un renglón por partida y «Cobrar» del tamaño de un pulgar. */
.ticket[b-tdl86r4c2k] { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; background: var(--surface); border-left: 1px solid var(--line); min-height: 0; }
.t-cab[b-tdl86r4c2k] { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-bottom: 1px solid var(--line); background: var(--band); }
.t-cab .cliente[b-tdl86r4c2k] { flex: 1; min-width: 0; }
.t-cab .cliente small[b-tdl86r4c2k] { display: block; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--accent); }
.t-cab .cliente b[b-tdl86r4c2k] { font-size: 16px; }
.t-cab .cliente em[b-tdl86r4c2k] { display: block; font-style: normal; font-size: 12.5px; color: var(--ok); font-weight: 600; }
.btn-sec[b-tdl86r4c2k] { min-height: var(--toque); padding: 0 16px; border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); font-size: 15px; font-weight: 600; }
.partidas[b-tdl86r4c2k] { overflow-y: auto; min-height: 0; }
.partida[b-tdl86r4c2k] { display: grid; grid-template-columns: minmax(0, 1fr) auto 76px auto; align-items: center; gap: 8px; padding: 5px 10px 5px 14px; border-bottom: 1px solid var(--line); }
.partida .que[b-tdl86r4c2k] { min-width: 0; line-height: 1.2; }
.partida .nombre[b-tdl86r4c2k] { font-weight: 600; font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.partida .unit[b-tdl86r4c2k] { font-size: 12.5px; color: var(--fg-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.partida .unit.aviso[b-tdl86r4c2k] { color: var(--warn); font-weight: 600; }
.partida .importe[b-tdl86r4c2k] { font-size: 14px; font-weight: 600; text-align: right; }
.paso[b-tdl86r4c2k] { display: inline-flex; align-items: center; border: 1px solid var(--line); border-radius: var(--r); overflow: hidden; }
.paso button[b-tdl86r4c2k] { width: 44px; height: var(--toque); border: 0; background: var(--surface-2); font-size: 20px; font-weight: 600; line-height: 1; }
.paso input[b-tdl86r4c2k] { width: 46px; height: var(--toque); border: 0; border-inline: 1px solid var(--line); text-align: center; font-size: 14px; font-weight: 600; background: var(--surface); }
.quitar[b-tdl86r4c2k] { width: var(--toque); height: var(--toque); border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); color: var(--crit); display: grid; place-items: center; }
.vacio[b-tdl86r4c2k] { display: grid; place-items: center; align-content: center; gap: 6px; height: 100%; padding: 24px; text-align: center; color: var(--fg-2); margin: 0; }
.vacio b[b-tdl86r4c2k] { font-size: 17px; color: var(--fg); }
.sin-catalogo[b-tdl86r4c2k] { gap: 14px; } .sin-catalogo span[b-tdl86r4c2k] { max-width: 420px; } .sin-catalogo .btn-prim:disabled[b-tdl86r4c2k] { opacity: .55; } /* CAMPO-SESION */
.totales[b-tdl86r4c2k] { padding: 12px 14px 14px; border-top: 1px solid var(--line); display: grid; gap: 4px; }
.renglon[b-tdl86r4c2k] { display: flex; justify-content: space-between; font-size: 15px; color: var(--fg-2); }
.renglon.total[b-tdl86r4c2k] { font-size: 22px; font-weight: 700; color: var(--fg); margin-top: 2px; }
.acciones[b-tdl86r4c2k] { display: flex; gap: 10px; margin-top: 10px; }
.btn-cobrar[b-tdl86r4c2k] { flex: 1; min-height: 68px; border: 0; border-radius: 12px; background: var(--accent); color: var(--on-accent); font-size: 21px; font-weight: 700; display: flex; align-items: center; justify-content: center; gap: 12px; }

/* Capas: elegir cliente y cobrar. */
.capa[b-tdl86r4c2k] { position: absolute; inset: 60px 0 0; background: color-mix(in srgb, var(--ink) 55%, transparent); display: grid; place-items: center; padding: 20px; z-index: 5; }
.cobro[b-tdl86r4c2k] { width: min(880px, 100%); max-height: 100%; overflow: auto; background: var(--bg); border-radius: 16px; display: grid; grid-template-columns: minmax(0, 1fr) 340px; box-shadow: 0 30px 60px rgba(0, 0, 0, .35); }
.cobro-izq[b-tdl86r4c2k] { padding: 20px; display: grid; gap: 16px; align-content: start; }
.cobro-izq h2[b-tdl86r4c2k] { margin: 0; font-size: 14px; letter-spacing: .06em; text-transform: uppercase; color: var(--fg-2); }
.grande[b-tdl86r4c2k] { font-size: 46px; font-weight: 700; letter-spacing: -.02em; line-height: 1; }
.formas[b-tdl86r4c2k] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.formas button[b-tdl86r4c2k] { min-height: 64px; border: 2px solid var(--line); border-radius: 12px; background: var(--surface); font-size: 16px; font-weight: 600; display: grid; place-items: center; gap: 2px; }
.formas button small[b-tdl86r4c2k] { font-size: 11.5px; font-weight: 500; color: var(--fg-2); }
.formas button[aria-pressed="true"][b-tdl86r4c2k] { border-color: var(--accent); background: var(--band); color: var(--accent); }
.cifras[b-tdl86r4c2k] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.cifra[b-tdl86r4c2k] { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; }
.cifra small[b-tdl86r4c2k] { display: block; font-size: 11.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--fg-2); }
.cifra b[b-tdl86r4c2k] { font-size: 24px; font-weight: 700; }
.cifra.cambio b[b-tdl86r4c2k] { color: var(--nuevo); }
.cifra.falta b[b-tdl86r4c2k] { color: var(--warn); }
.rapidos[b-tdl86r4c2k] { display: flex; flex-wrap: wrap; gap: 8px; }
.rapidos button[b-tdl86r4c2k] { min-height: var(--toque); padding: 0 18px; border: 1px solid var(--line); border-radius: 99px; background: var(--surface); font-size: 16px; font-weight: 600; }
.nota[b-tdl86r4c2k] { font-size: 13.5px; color: var(--fg-2); margin: 0; }
.nota.error[b-tdl86r4c2k] { color: var(--crit); font-weight: 600; }
/* CAMPO-PERSIST: lo guardado sin red que el navegador puede borrar. */
.nota.sin-garantia[b-tdl86r4c2k] { color: color-mix(in srgb, var(--warn) 55%, var(--fg)); background: var(--warn-soft); border-radius: 8px; font-weight: 600; padding: 8px 12px; }
.ref[b-tdl86r4c2k] { display: grid; gap: 4px; }
.ref label[b-tdl86r4c2k] { font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--fg-2); }
.ref input[b-tdl86r4c2k] { height: 52px; border: 2px solid var(--line); border-radius: var(--r); padding: 0 14px; font-size: 18px; background: var(--surface); }
.cobro-der[b-tdl86r4c2k] { background: var(--surface); border-left: 1px solid var(--line); padding: 16px; display: grid; gap: 10px; align-content: start; }
.teclado[b-tdl86r4c2k] { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.teclado button[b-tdl86r4c2k] { height: 64px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-2); font-size: 26px; font-weight: 600; }
.pagos[b-tdl86r4c2k] { display: grid; gap: 6px; }
.pago[b-tdl86r4c2k] { display: flex; align-items: center; gap: 10px; padding: 8px 8px 8px 14px; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; font-size: 16px; }
.pago b[b-tdl86r4c2k] { margin-left: auto; font-size: 18px; }
.ref-pago[b-tdl86r4c2k] { color: var(--fg-2); }
.captura[b-tdl86r4c2k] { display: grid; gap: 8px; padding: 12px 14px; border: 2px solid var(--accent); border-radius: 12px; background: var(--band); }
.captura small[b-tdl86r4c2k] { font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--accent); }
.captura .monto[b-tdl86r4c2k] { font-size: 32px; font-weight: 700; }
.captura .monto.vacio-m[b-tdl86r4c2k] { color: var(--fg-3); }
.btn-agregar[b-tdl86r4c2k] { min-height: 56px; border: 2px solid var(--accent); border-radius: 12px; background: var(--surface); color: var(--accent); font-size: 17px; font-weight: 700; }
.btn-terminar[b-tdl86r4c2k] { min-height: 68px; border: 0; border-radius: 12px; background: var(--ok); color: var(--mud-palette-surface); font-size: 20px; font-weight: 700; }
.btn-volver[b-tdl86r4c2k] { min-height: var(--toque); border: 1px solid var(--line); border-radius: 12px; background: var(--surface); font-size: 16px; font-weight: 600; }

.clientes[b-tdl86r4c2k] { width: min(760px, 100%); max-height: 100%; overflow: auto; background: var(--bg); border-radius: 16px; padding: 20px; display: grid; gap: 14px; box-shadow: 0 30px 60px rgba(0, 0, 0, .35); }
.clientes h2[b-tdl86r4c2k] { margin: 0; font-size: 20px; }
.cli-lista[b-tdl86r4c2k] { display: grid; gap: 8px; }
.cli[b-tdl86r4c2k] { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 16px; align-items: center; text-align: left; min-height: 68px; padding: 10px 16px; background: var(--surface); border: 2px solid var(--line); border-radius: 12px; }
.cli[aria-pressed="true"][b-tdl86r4c2k] { border-color: var(--accent); background: var(--band); }
.cli > b[b-tdl86r4c2k] { font-size: 17px; }
.cli small[b-tdl86r4c2k] { font-size: 13px; color: var(--fg-2); }
.cli .cred[b-tdl86r4c2k] { grid-row: 1 / 3; grid-column: 2; text-align: right; font-size: 13px; color: var(--fg-2); }
.cli .cred b[b-tdl86r4c2k] { display: block; font-size: 17px; color: var(--ok); }

/* Abrir el turno: el mismo teclado que el cobro. */
.abrir[b-tdl86r4c2k] { display: grid; place-items: center; padding: 24px; overflow: auto; }

/* La venta terminada: el ticket como saldría en papel y qué pasó con el envío. */
.hecha[b-tdl86r4c2k] { display: grid; grid-template-columns: 360px minmax(0, 1fr); gap: 24px; padding: 24px; min-height: 0; overflow: auto; align-content: start; }
.papel[b-tdl86r4c2k] { background: var(--mud-palette-surface); color: var(--fg); border: 1px solid var(--line); border-radius: 4px; padding: 18px 16px; font-family: var(--mono); font-size: 12.5px; line-height: 1.5; box-shadow: 0 10px 28px color-mix(in srgb, var(--ink) 18%, transparent); justify-self: center; width: 320px; }
.papel h3[b-tdl86r4c2k] { margin: 0; font-size: 15px; text-align: center; }
.papel .c[b-tdl86r4c2k] { text-align: center; }
.papel hr[b-tdl86r4c2k] { border: 0; border-top: 1px dashed var(--fg-3); margin: 8px 0; }
.papel .r[b-tdl86r4c2k] { display: flex; justify-content: space-between; gap: 8px; }
.papel .r.t[b-tdl86r4c2k] { font-weight: 700; font-size: 14px; }
.papel .pagare[b-tdl86r4c2k] { white-space: pre-line; font-size: 11.5px; text-align: justify; } /* CAMPO-PAGARE: los renglones los pone PagareDelTicket. */
.entrega[b-tdl86r4c2k] { display: grid; gap: 16px; align-content: start; }
.estado[b-tdl86r4c2k] { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border-radius: 12px; border: 1px solid var(--line); background: var(--surface); }
.estado.guardada[b-tdl86r4c2k] { background: var(--warn-soft); border-color: color-mix(in srgb, var(--warn) 40%, transparent); }
.estado.enviada[b-tdl86r4c2k] { background: var(--ok-soft); border-color: color-mix(in srgb, var(--ok) 40%, transparent); }
.estado.marcada[b-tdl86r4c2k] { background: var(--crit-soft); border-color: color-mix(in srgb, var(--crit) 40%, transparent); }
.estado b[b-tdl86r4c2k] { display: block; font-size: 17px; }
.estado span[b-tdl86r4c2k] { font-size: 14px; color: var(--fg-2); }
.botones[b-tdl86r4c2k] { display: flex; flex-wrap: wrap; gap: 10px; }
/* CAJA-4a. El QR trae su propio blanco y su margen (el SVG de QRCoder): no cambia con el tema, porque el lector lo pide. */
.qr-caja[b-tdl86r4c2k] { display: flex; gap: 20px; align-items: center; flex-wrap: wrap; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; padding: 16px; }
.qr-caja .qr[b-tdl86r4c2k] { width: 232px; height: 232px; border-radius: 6px; overflow: hidden; flex: none; }
.qr-caja .qr[b-tdl86r4c2k]  svg { display: block; width: 100%; height: 100%; }
.qr-caja .txt[b-tdl86r4c2k] { flex: 1; min-width: 200px; display: grid; gap: 6px; }
.qr-caja .txt b[b-tdl86r4c2k] { font-size: 18px; }
.qr-caja .txt span[b-tdl86r4c2k] { font-size: 14px; color: var(--fg-2); }
.btn-prim[b-tdl86r4c2k] { min-height: 64px; padding: 0 28px; border: 0; border-radius: 12px; background: var(--accent); color: var(--on-accent); font-size: 19px; font-weight: 700; }

/* CAJA-3. El turno (decidido: C, completo, con conteo a ciegas): se abre con fondo, se mueve el cajón y se cierra contando.
   Vive en la tablet porque ahí está el dinero; el corte se envía después de las ventas. */
.vista-cab[b-tdl86r4c2k] { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px; border: 0; border-radius: 10px; background: none; color: var(--mud-palette-surface); font-size: 15px; font-weight: 600; opacity: .8; }
.vista-cab[aria-pressed="true"][b-tdl86r4c2k] { background: color-mix(in srgb, var(--mud-palette-surface) 16%, transparent); opacity: 1; }
/* CAJA-4c. Los cuatro documentos comparten catálogo y ticket; cambia el pie. */
.vistas[b-tdl86r4c2k] { display: inline-flex; gap: 2px; }
.extra[b-tdl86r4c2k] { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 6px; font-size: 14px; color: var(--fg-2); }
.chips[b-tdl86r4c2k] { display: inline-flex; gap: 6px; flex-wrap: wrap; }
.chips button[b-tdl86r4c2k] { min-height: 44px; padding: 0 14px; border: 1px solid var(--line); border-radius: 99px; background: var(--surface); font-size: 14px; font-weight: 600; }
.chips button[aria-pressed="true"][b-tdl86r4c2k] { border-color: var(--accent); background: var(--band); color: var(--accent); }
.fiscal[b-tdl86r4c2k] { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px 12px; margin: 6px 0 0; padding: 8px 12px; border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); font-size: 13.5px; }
.fiscal dt[b-tdl86r4c2k] { color: var(--fg-2); }
.fiscal dd[b-tdl86r4c2k] { margin: 0; font-weight: 600; }
.btn-cobrar.sec[b-tdl86r4c2k] { flex: 0 0 auto; padding: 0 18px; background: var(--surface); color: var(--accent); border: 2px solid var(--accent); font-size: 17px; flex-direction: column; gap: 0; }
.btn-cobrar.sec small[b-tdl86r4c2k] { display: block; font-size: 11.5px; font-weight: 600; opacity: .8; }
.papel .doc[b-tdl86r4c2k] { text-align: center; font-weight: 700; letter-spacing: .08em; margin-top: 4px; }
button.cajero[b-tdl86r4c2k] { border: 0; background: none; color: var(--mud-palette-surface); min-height: 44px; padding: 0 10px 0 4px; border-radius: 10px; }
button.cajero[aria-pressed="true"][b-tdl86r4c2k] { background: color-mix(in srgb, var(--mud-palette-surface) 16%, transparent); }
button.cajero[disabled][b-tdl86r4c2k] { opacity: .9; cursor: default; }
.turno[b-tdl86r4c2k] { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 14px; padding: 18px 22px; overflow: auto; align-content: start; }
.turno .span[b-tdl86r4c2k] { grid-column: 1 / -1; }
.columna-cierre[b-tdl86r4c2k] { display: grid; gap: 14px; align-content: start; }
.tt[b-tdl86r4c2k] { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; min-width: 0; }
.tt h3[b-tdl86r4c2k] { margin: 0; padding: 10px 16px; font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--accent); background: var(--band); border-bottom: 1px solid var(--line); border-radius: 12px 12px 0 0; }
.tt .filas[b-tdl86r4c2k] { padding: 8px 16px 12px; display: grid; gap: 4px; }
.fila[b-tdl86r4c2k] { display: flex; justify-content: space-between; gap: 12px; font-size: 15px; }
.fila span:first-child[b-tdl86r4c2k] { color: var(--fg-2); }
.movs[b-tdl86r4c2k] { display: grid; }
.mov[b-tdl86r4c2k] { display: grid; grid-template-columns: 56px 90px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 16px; border-top: 1px solid var(--line); font-size: 15px; }
.mov:first-child[b-tdl86r4c2k] { border-top: 0; }
.mov .hora[b-tdl86r4c2k] { font-family: var(--mono); font-size: 13px; color: var(--fg-2); }
.mov .motivo[b-tdl86r4c2k] { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.mov .vacio-mov[b-tdl86r4c2k] { color: var(--fg-2); }
.mov b[b-tdl86r4c2k] { text-align: right; }
.mov-botones[b-tdl86r4c2k] { display: flex; flex-wrap: wrap; gap: 10px; padding: 12px 16px; border-top: 1px solid var(--line); }
.acciones-t[b-tdl86r4c2k] { display: flex; justify-content: flex-end; gap: 10px; }
.chip[b-tdl86r4c2k] { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 700; padding: 3px 10px; border-radius: 99px; }
.chip.retiro[b-tdl86r4c2k], .chip.gasto[b-tdl86r4c2k], .chip.rechazada[b-tdl86r4c2k] { background: var(--crit-soft); color: var(--crit); }
.chip.entrada[b-tdl86r4c2k], .chip.enviada[b-tdl86r4c2k] { background: var(--ok-soft); color: var(--ok); }
.chip.por-enviar[b-tdl86r4c2k], .chip.marcada[b-tdl86r4c2k] { background: var(--warn-soft); color: var(--warn); }
.denoms[b-tdl86r4c2k] { display: grid; }
.denom[b-tdl86r4c2k] { display: grid; grid-template-columns: minmax(0, 1fr) auto 104px; gap: 12px; align-items: center; padding: 4px 16px; border-top: 1px solid var(--line); font-size: 15px; }
.denom:first-child[b-tdl86r4c2k] { border-top: 0; }
.denom b[b-tdl86r4c2k] { text-align: right; font-size: 15px; }
.denom.bloqueado .paso[b-tdl86r4c2k] { opacity: .45; }
.dif[b-tdl86r4c2k] { font-size: 28px; font-weight: 700; }
.dif.chica[b-tdl86r4c2k] { font-size: 20px; }
.dif.cuadra[b-tdl86r4c2k] { color: var(--ok); }
.dif.no-cuadra[b-tdl86r4c2k] { color: var(--warn); }
.campo-t[b-tdl86r4c2k] { display: grid; gap: 4px; padding: 12px 16px; }
.campo-t label[b-tdl86r4c2k] { font-size: 12px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--fg-2); }
.campo-t input[b-tdl86r4c2k] { height: 52px; border: 2px solid var(--line); border-radius: var(--r); padding: 0 14px; font-size: 17px; background: var(--surface); min-width: 0; }
/* CAJA-TABLETS: el número de la tablet va dentro del panel de abrir turno, que ya tiene su propio aire. */
.campo-t.sin-aire[b-tdl86r4c2k] { padding: 0; }
.enlace[b-tdl86r4c2k] { border: 0; background: none; padding: 0 0 0 4px; color: var(--accent); font-weight: 600; text-decoration: underline; min-height: 0; }
.bloqueo[b-tdl86r4c2k] { padding: 12px 14px; border-radius: var(--r); background: var(--warn-soft); border: 1px solid color-mix(in srgb, var(--warn) 40%, transparent); font-size: 14px; display: grid; gap: 8px; }
.bloqueo b[b-tdl86r4c2k] { color: var(--warn); font-size: 15px; }

/* Lo que hay en la tablet: por enviar, enviada o marcada para revisar en Adscomer. */
.pendientes[b-tdl86r4c2k] { padding: 20px 24px; overflow: auto; display: grid; gap: 14px; align-content: start; }
.p-cab[b-tdl86r4c2k] { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.p-cab h2[b-tdl86r4c2k] { margin: 0; font-size: 22px; flex: 1; }
.lista[b-tdl86r4c2k] { display: grid; gap: 8px; }
.venta[b-tdl86r4c2k] { display: grid; grid-template-columns: 150px minmax(0, 1fr) auto; gap: 4px 16px; align-items: center; padding: 14px 16px; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; }
.venta .no[b-tdl86r4c2k] { font-family: var(--mono); font-size: 14px; font-weight: 600; }
.venta .no small[b-tdl86r4c2k] { display: block; font-family: inherit; font-size: 12.5px; font-weight: 400; color: var(--fg-2); }
.venta .det[b-tdl86r4c2k] { min-width: 0; font-size: 14.5px; }
.venta .det em[b-tdl86r4c2k] { display: block; font-style: normal; font-size: 13px; color: var(--fg-2); }
.venta .det .marca[b-tdl86r4c2k] { color: var(--warn); font-weight: 600; }
.venta .monto[b-tdl86r4c2k] { font-size: 18px; font-weight: 700; text-align: right; }
/* CAJA-CORTE-PAPEL: el chip de crédito, debajo del monto. */
.venta .monto .chip.credito[b-tdl86r4c2k] { display: flex; width: fit-content; margin: 4px 0 0 auto; font-size: 11.5px; background: var(--band); color: var(--accent); }

/* Vertical (800 px de ancho): el ticket abajo, con «Cobrar» a la vista; cobro y ticket hecho en una columna. */
/* CAJA-4b. El visor de fotos: grande, con flechas del tamaño de un dedo y miniaturas; a un lado lo que hace falta para vender. */
.visor-p[b-tdl86r4c2k] { width: min(1040px, 100%); max-height: 100%; overflow: auto; background: var(--bg); border-radius: 16px; display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); box-shadow: 0 30px 60px color-mix(in srgb, var(--ink) 35%, transparent); }
.galeria[b-tdl86r4c2k] { display: grid; gap: 10px; padding: 16px; background: var(--surface); border-radius: 16px 0 0 16px; align-content: start; }
.foto-grande[b-tdl86r4c2k] { position: relative; display: grid; place-items: center; overflow: hidden; aspect-ratio: 1 / 1; max-height: 540px; width: 100%; border-radius: 12px; background: var(--band); color: var(--fg-2); }
.foto-grande img[b-tdl86r4c2k] { width: 100%; height: 100%; object-fit: contain; }
.foto-grande .sin-foto[b-tdl86r4c2k] { padding: 24px; text-align: center; font-size: 15px; }
.foto-grande .cuenta-f[b-tdl86r4c2k] { position: absolute; right: 12px; bottom: 12px; padding: 4px 12px; border-radius: 99px; background: color-mix(in srgb, var(--ink) 70%, transparent); color: var(--on-accent); font-size: 13px; font-weight: 600; }
.nav-foto[b-tdl86r4c2k] { position: absolute; top: 50%; transform: translateY(-50%); width: 56px; height: 56px; border-radius: 50%; border: 0; background: color-mix(in srgb, var(--surface) 92%, transparent); color: var(--fg); font-size: 28px; line-height: 1; box-shadow: 0 4px 12px color-mix(in srgb, var(--ink) 20%, transparent); }
.nav-foto.prev[b-tdl86r4c2k] { left: 12px; }
.nav-foto.next[b-tdl86r4c2k] { right: 12px; }
.miniaturas[b-tdl86r4c2k] { display: flex; gap: 8px; flex-wrap: wrap; }
.miniaturas button[b-tdl86r4c2k] { width: 76px; height: 76px; padding: 0; border-radius: 10px; border: 2px solid var(--line); background: var(--band); color: var(--fg-2); display: grid; place-items: center; overflow: hidden; }
.miniaturas button img[b-tdl86r4c2k] { width: 100%; height: 100%; object-fit: cover; }
.miniaturas button[aria-pressed="true"][b-tdl86r4c2k] { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent); }
.ficha-p[b-tdl86r4c2k] { padding: 22px; display: grid; gap: 14px; align-content: start; }
.ficha-p .clave[b-tdl86r4c2k] { font-family: var(--mono); font-size: 13px; color: var(--fg-2); }
.ficha-p h2[b-tdl86r4c2k] { margin: 0; font-size: 24px; line-height: 1.2; text-wrap: balance; }
.ficha-p .precio-g[b-tdl86r4c2k] { font-size: 36px; font-weight: 700; }
.ficha-p .precio-g small[b-tdl86r4c2k] { display: block; font-size: 13px; font-weight: 500; color: var(--fg-2); }
.ficha-p .datos[b-tdl86r4c2k] { display: grid; grid-template-columns: auto 1fr; gap: 4px 14px; font-size: 15px; margin: 0; }
.ficha-p .datos dt[b-tdl86r4c2k] { color: var(--fg-2); }
.ficha-p .datos dd[b-tdl86r4c2k] { margin: 0; font-weight: 600; }
.ficha-p .datos dd.agotado[b-tdl86r4c2k] { color: var(--warn); }
.ficha-p .btn-cobrar[b-tdl86r4c2k] { flex: none; min-height: 56px; font-size: 18px; }

/* CAMPO. Sólo en vertical se apila: la MatePad en horizontal da 826×495 px CSS, y el ticket de 520 px abajo se comía el
   catálogo entero y dejaba «Cobrar» fuera de la pantalla. */
@media (orientation: portrait) {
    .vender[b-tdl86r4c2k] { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) 520px; }
    .ticket[b-tdl86r4c2k] { border-left: 0; border-top: 1px solid var(--line); box-shadow: 0 -8px 24px color-mix(in srgb, var(--ink) 10%, transparent); }
    .cobro[b-tdl86r4c2k], .hecha[b-tdl86r4c2k], .visor-p[b-tdl86r4c2k] { grid-template-columns: minmax(0, 1fr); }
    .galeria[b-tdl86r4c2k] { border-radius: 16px 16px 0 0; }
    .cobro-der[b-tdl86r4c2k] { border-left: 0; border-top: 1px solid var(--line); }
    .cab .negocio[b-tdl86r4c2k], .cajero span[b-tdl86r4c2k] { display: none; }
    .vistas .vista-cab[b-tdl86r4c2k] { padding: 0 10px; font-size: 14px; }
    .turno[b-tdl86r4c2k] { grid-template-columns: minmax(0, 1fr); }
    /* El cierre cabe sin desplazarse: las once denominaciones en dos columnas, sin el importe de cada una (el contado
       se ve en «Efectivo»). */
    .denoms[b-tdl86r4c2k] { grid-template-columns: 1fr 1fr; }
    .denom[b-tdl86r4c2k] { grid-template-columns: minmax(0, 1fr) auto; padding: 4px 12px; }
    .denom:nth-child(even)[b-tdl86r4c2k] { border-left: 1px solid var(--line); }
    .denom:nth-child(2)[b-tdl86r4c2k] { border-top: 0; }
    .denom b[b-tdl86r4c2k] { display: none; }
}

/* Vertical angosto (la tablet de 8" da 516 px): la barra no cabía en un renglón y ensanchaba la página entera; en dos, las
   vistas van abajo a lo ancho. El ticket baja a 360 px para que se vea un renglón entero de tarjetas. */
@media (orientation: portrait) and (max-width: 600px) {
    .caja[b-tdl86r4c2k] { grid-template-rows: auto minmax(0, 1fr); }
    .cab[b-tdl86r4c2k] { flex-wrap: wrap; gap: 4px 8px; padding: 6px 10px; min-height: 60px; }
    .vistas[b-tdl86r4c2k] { order: 1; flex-basis: 100%; display: grid; grid-template-columns: repeat(4, 1fr); }
    .vistas .vista-cab[b-tdl86r4c2k] { justify-content: center; }
    .capa[b-tdl86r4c2k] { inset: 0; }
    .camara[b-tdl86r4c2k] { inset: 0; }
    .btn-escanear[b-tdl86r4c2k] { padding: 0 14px; }
    .vender[b-tdl86r4c2k] { grid-template-rows: minmax(0, 1fr) 360px; }
    .producto[b-tdl86r4c2k] { grid-template-rows: 72px auto 1fr auto; }
    .foto[b-tdl86r4c2k] { height: 72px; }
    .catalogo[b-tdl86r4c2k] { padding: 10px; gap: 8px; }
    .hecha[b-tdl86r4c2k], .turno[b-tdl86r4c2k], .pendientes[b-tdl86r4c2k] { padding: 14px; }
    .papel[b-tdl86r4c2k] { width: 100%; max-width: 320px; }
    /* El cobro va en una columna (cifras arriba, teclado abajo): se recorta lo que no se toca para que «Terminar» quede
       lo más cerca posible del borde. */
    .capa[b-tdl86r4c2k] { padding: 10px; }
    .cobro-izq[b-tdl86r4c2k] { padding: 14px; gap: 10px; }
    .cobro-der[b-tdl86r4c2k] { padding: 12px; gap: 8px; }
    .grande[b-tdl86r4c2k] { font-size: 36px; }
    .cifra[b-tdl86r4c2k] { padding: 8px 12px; }
    .cifra b[b-tdl86r4c2k] { font-size: 20px; }
    .formas button[b-tdl86r4c2k] { min-height: 52px; }
    .captura .monto[b-tdl86r4c2k] { font-size: 24px; }
    .teclado[b-tdl86r4c2k] { gap: 6px; }
    .teclado button[b-tdl86r4c2k] { height: 52px; }
    .btn-terminar[b-tdl86r4c2k], .btn-agregar[b-tdl86r4c2k] { min-height: 52px; }
    .rapidos button[b-tdl86r4c2k] { padding: 0 12px; }
    /* En el cobro, «Agregar…» y «Volver» comparten renglón y «Terminar» va al final, a todo lo ancho. */
    .cobro-der:has(#volver)[b-tdl86r4c2k] { grid-template-columns: 1fr 1fr; }
    .cobro-der:has(#volver) > *[b-tdl86r4c2k] { grid-column: 1 / -1; }
    .cobro-der:has(#volver) > .btn-agregar[b-tdl86r4c2k] { grid-column: auto; order: 1; font-size: 14px; }
    .cobro-der:has(#volver) > .btn-volver[b-tdl86r4c2k] { grid-column: auto; order: 2; }
    .cobro-der:has(#volver) > .btn-terminar[b-tdl86r4c2k] { order: 3; }
}

/* Horizontal angosto (la tablet de 8"): catálogo y ticket lado a lado, con el ticket más angosto para que quepan dos
   tarjetas por renglón; el cobro conserva el teclado a la derecha. */
@media (orientation: landscape) and (max-width: 900px) {
    .vender[b-tdl86r4c2k] { grid-template-columns: minmax(0, 1fr) 400px; }
    .cobro[b-tdl86r4c2k] { grid-template-columns: minmax(0, 1fr) 300px; }
    .hecha[b-tdl86r4c2k] { grid-template-columns: 330px minmax(0, 1fr); gap: 16px; padding: 16px; }
    .cab .negocio[b-tdl86r4c2k], .cajero span[b-tdl86r4c2k] { display: none; }
    .vistas .vista-cab[b-tdl86r4c2k] { padding: 0 10px; font-size: 14px; }
    /* En 400 px al nombre le quedan unos 90: en un renglón se leía «Taladro p…»; en dos, hasta tres palabras. */
    .partida .nombre[b-tdl86r4c2k] { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
}

/* Horizontal bajo (495 px de alto en la tablet): se recorta lo que no se toca —márgenes, foto, cifras— para que abrir el
   turno, el ticket y «Cobrar» quepan sin desplazarse. Lo que se toca sigue en 48 px o más. */
@media (orientation: landscape) and (max-height: 560px) {
    .caja[b-tdl86r4c2k] { grid-template-rows: 52px minmax(0, 1fr); }
    .capa[b-tdl86r4c2k] { inset: 52px 0 0; padding: 10px; }
    .camara[b-tdl86r4c2k] { inset: 52px 0 0; }
    .btn-escanear[b-tdl86r4c2k] { height: 48px; }
    .camara-pie[b-tdl86r4c2k] { padding: 8px; }
    .camara-pie button[b-tdl86r4c2k] { min-height: 48px; }
    .abrir[b-tdl86r4c2k] { padding: 10px; }
    .catalogo[b-tdl86r4c2k] { padding: 10px; gap: 8px; }
    .caja-buscar[b-tdl86r4c2k] { height: 48px; }
    .producto[b-tdl86r4c2k] { grid-template-rows: 72px auto 1fr auto; }
    .foto[b-tdl86r4c2k] { height: 72px; }
    .t-cab[b-tdl86r4c2k] { padding: 6px 14px; }
    .totales[b-tdl86r4c2k] { padding: 8px 14px 10px; gap: 2px; }
    .renglon[b-tdl86r4c2k] { font-size: 14px; }
    .renglon.total[b-tdl86r4c2k] { font-size: 20px; }
    .acciones[b-tdl86r4c2k] { margin-top: 6px; }
    .btn-cobrar[b-tdl86r4c2k], .btn-terminar[b-tdl86r4c2k] { min-height: 56px; }
    .cobro-izq[b-tdl86r4c2k] { padding: 14px; gap: 10px; }
    .cobro-der[b-tdl86r4c2k] { padding: 12px; gap: 8px; }
    .captura .monto[b-tdl86r4c2k] { font-size: 26px; }
    .teclado[b-tdl86r4c2k] { gap: 6px; }
    .teclado button[b-tdl86r4c2k] { height: 52px; }
    .grande[b-tdl86r4c2k] { font-size: 36px; }
    .formas button[b-tdl86r4c2k] { min-height: 52px; }
}