/* Minimarket: c?scara D compartida. Entrar y Usuarios conservan sus estilos. */
body:has(.pantalla-app.activa) .nav-app :focus-visible{outline:3px solid var(--venta-acento-claro);outline-offset:3px}
body:has(.pantalla-app.activa) .nav-app{background:var(--venta-tinta);border:0;color:var(--venta-tinta)}
body:has(.pantalla-app.activa) .nav-app .nav-item,body:has(.pantalla-app.activa) .nav-app .nav-item-venta{color:var(--venta-suave);min-height:48px}
body:has(.pantalla-app.activa) .nav-app .nav-item.activo,body:has(.pantalla-app.activa) .nav-app .nav-item-venta.activo{background:var(--venta-tarjeta);color:var(--venta-tinta);border-radius:14px}
body:has(.pantalla-app.activa) .nav-app .etiqueta-venta{color:inherit}
body:has(.pantalla-app.activa) .nav-app .circulo-venta{background:var(--venta-tarjeta)!important;color:var(--venta-tinta);box-shadow:none;border:0}
@media(min-width:768px){body:has(.pantalla-app.activa) .encabezado-app{margin-right:calc(var(--venta-ancho) + 16px);max-width:none}
body:has(.pantalla-app.activa) .nav-app{top:0;bottom:0;left:0;right:auto;width:72px;height:100dvh;flex-direction:column;justify-content:flex-start;padding:16px 4px;box-sizing:border-box;gap:8px}
body:has(.pantalla-app.activa) .nav-app .nav-item,body:has(.pantalla-app.activa) .nav-item-venta-cont{width:100%;flex:0 0 auto}
body:has(.pantalla-app.activa) .nav-item-venta{margin-top:0;width:100%}
body:has(.pantalla-app.activa) .circulo-venta{width:auto;height:auto}
}
@media(prefers-reduced-motion:reduce){body:has(.pantalla-app.activa) .nav-app *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
body:has(.pantalla-app.activa) .nav-app{background:#fff;color:#76665c;border:1px solid #e7dcd3}
body:has(.pantalla-app.activa) .nav-app .nav-item{color:#76665c}
body:has(.pantalla-app.activa) .nav-app .activo,body:has(.pantalla-app.activa) .nav-app .circulo-venta{background:#a74725!important;color:#fff}
body:has(.pantalla-app.activa) .encabezado-app{background:#faf8f5;backdrop-filter:none;display:flex;flex-direction:row;align-items:center;flex-wrap:wrap;gap:8px;padding:8px 0}
body:has(.pantalla-app.activa) .fila-negocio{display:contents}
body:has(.pantalla-app.activa) .logo-negocio{width:36px;height:36px;min-width:36px;border-radius:10px;background:#a74725}
body:has(.pantalla-app.activa) .info-negocio{flex:1;min-width:40px}
body:has(.pantalla-app.activa) .nombre-negocio{font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body:has(.pantalla-app.activa) .nombre-equipo{display:none}
body:has(.pantalla-app.activa) .fila-estado-app{display:flex;gap:5px;order:2;width:auto;margin:0;flex-wrap:wrap}
body:has(.pantalla-app.activa) #indicadorSesion{order:3;border-radius:50%;width:48px;height:48px;min-width:48px;padding:0;justify-content:center;background:#f7e9df;border:1px solid #e7dcd3;color:#3b2b24}
body:has(.pantalla-app.activa) #nombreUsuarioPill,body:has(.pantalla-app.activa) #indicadorSesion .flecha-mini{display:none}
body:has(.pantalla-app.activa) #avatarUsuarioMini{background:transparent;color:#3b2b24;font-size:14px}
@media(max-width:767px){body:has(.pantalla-app.activa) .fila-estado-app{order:4;width:100%}
}
body:has(.pantalla-app.activa) .indicador-caja,body:has(.pantalla-app.activa) .pill-equipos{min-height:48px}
@media(max-width:767px){body:has(.pantalla-app.activa) .encabezado-app{flex-wrap:nowrap;gap:4px}
body:has(.pantalla-app.activa) .fila-estado-app{order:2;width:auto;flex-wrap:nowrap;gap:2px}
body:has(.pantalla-app.activa) .nombre-negocio{font-size:11px}
body:has(.pantalla-app.activa) .logo-negocio{width:28px;height:32px;min-width:28px;font-size:12px}
body:has(.pantalla-app.activa) .fila-estado-app button{font-size:10px;padding:4px;gap:3px;border:0;min-width:0}
body:has(.pantalla-app.activa) .indicador-caja .flecha-caja{display:none}
body:has(.pantalla-app.activa) #indicadorSesion{width:48px;flex:0 0 48px}
}
body:has(.pantalla-app.activa) #avatarUsuarioMini .avatar-habitual{display:none}
body:has(.pantalla-app.activa) #avatarUsuarioMini .avatar-iniciales-venta{display:inline}
@media(min-width:768px) and (max-width:1023px){body:has(.pantalla-app.activa) #indicadorSesion{order:1}
body:has(.pantalla-app.activa) .fila-estado-app{order:2;width:100%}
}
@media(min-width:768px){body:has(.pantalla-app.activa) .nav-app{justify-content:center}
}

/* Foto si existe; iniciales del nombre en todos los encabezados. */
body:has(.pantalla-app.activa, #pantallaVenta.activa) #avatarUsuarioMini .avatar-habitual{display:contents}
body:has(.pantalla-app.activa, #pantallaVenta.activa) #avatarUsuarioMini .avatar-iniciales-venta{display:none}
body:has(.pantalla-app.activa) #avatarUsuarioMini{width:36px;height:36px;overflow:hidden;border-radius:50%}
body:has(.pantalla-app.activa):not(:has(#pantallaVenta.activa)){background:#faf8f5;color:#3b2b24}
body:has(.pantalla-app.activa) .encabezado-app{max-width:none}
body:has(.pantalla-app.activa) .nav-app :focus-visible{outline:3px solid #a74725;outline-offset:2px}
@media(min-width:768px){
 body:has(.pantalla-app.activa):not(:has(#pantallaVenta.activa)){padding:16px 16px 100px 88px;max-width:none}
 body:has(.pantalla-app.activa):not(:has(#pantallaVenta.activa)) .encabezado-app{margin-right:0}
 body:has(.pantalla-app.activa) .nav-app{justify-content:center}
}
#pantallaInventario{--ih-naranja:#a74725;--ih-tinta:#3b2b24;--ih-fondo:#faf8f5;max-width:none;min-width:0;padding-bottom:100px;font-family:'Plus Jakarta Sans',sans-serif}
#pantallaInventario *{box-sizing:border-box}
#pantallaInventario button{min-height:48px;font-family:inherit;transition:background-color 180ms}
#pantallaInventario :focus-visible{outline:3px solid #a74725;outline-offset:2px}
#pantallaInventario .header-inventario{gap:12px;margin:12px 0 20px}
#pantallaInventario .header-inventario h1{font-size:24px}
#pantallaInventario .buscador-venta{min-height:56px;background:#fff;border:2px solid #e7dcd3;border-radius:14px;padding:4px;min-width:0}
#pantallaInventario .buscador-venta label{min-width:0;flex:1}
#pantallaInventario .buscador-venta input{min-width:0;width:100%;font-size:16px;color:#3b2b24}
#pantallaInventario .btn-escanear-venta{width:48px;height:48px;flex:0 0 48px;background:#f7e9df;color:#a74725;border-radius:10px}
#pantallaInventario .grid-acciones-inventario{gap:10px;margin:16px 0}
#pantallaInventario .btn-accion-inventario{min-width:0;background:#fff;color:#3b2b24;border:1px solid #e7dcd3;border-radius:12px;font-weight:700;justify-content:center}
#pantallaInventario .btn-accion-inventario.primaria{background:#a74725;color:#fff;border-color:#a74725}
#pantallaInventario .segmentado-inventario,#pantallaInventario .segmentado-vista-inv{background:#f1e9e2;border:1px solid #e7dcd3;border-radius:14px;padding:4px}
#pantallaInventario .segmentado-inventario button,#pantallaInventario .segmentado-vista-inv button{height:auto;min-height:48px;color:#76665c;border-radius:10px}
#pantallaInventario .segmentado-inventario button.activo,#pantallaInventario .segmentado-vista-inv button.activo{background:#fff;color:#a74725;box-shadow:none;font-weight:700}
#pantallaInventario .pill-reponer{min-height:48px;border:1px solid #e7dcd3;background:#f7e9df;color:#8a3b20;border-radius:12px;white-space:normal}
#pantallaInventario .fila-filtros-rapidos-inv{flex-wrap:wrap;gap:10px}
#pantallaInventario #chipsFiltroInventario{flex-wrap:wrap;overflow:visible;gap:6px;width:100%;flex:1 1 100%}
#pantallaInventario #chipsFiltroInventario button{background:#fff;color:#76665c;border:1px solid #e7dcd3;border-radius:999px;padding:8px 12px}
#pantallaInventario #chipsFiltroInventario button.elegido{background:#a74725;color:#fff;border-color:#a74725}
#pantallaInventario .btn-mas-inventario{width:48px;background:#fff;border:1px solid #e7dcd3;color:#3b2b24}
#pantallaInventario .menu-mas-inventario{max-width:calc(100vw - 32px);border:1px solid #e7dcd3}
#pantallaInventario .menu-mas-inventario button{margin:0;padding:10px}
#pantallaInventario .ayuda-precio-directo{color:#76665c;line-height:1.5}
#pantallaInventario #listaInventario.modo-lista{display:grid;grid-template-columns:minmax(0,1fr);background:transparent;padding:0;gap:10px}
#pantallaInventario .fila-inv{display:grid;grid-template-columns:48px minmax(0,1fr) 116px;gap:10px;padding:12px;background:#fff;border:1px solid #e7dcd3;border-radius:14px;min-width:0}
#pantallaInventario .fila-inv .foto-inv{width:48px;height:48px;border-radius:10px;overflow:hidden;background:#faf8f5}
#pantallaInventario .foto-inv img{width:100%;height:100%;object-fit:contain}
#pantallaInventario .foto-inv .sin-foto{width:48px;height:48px;background:#faf8f5!important;color:#76665c;display:flex;align-items:center;justify-content:center}
#pantallaInventario .fila-inv .info-inv{min-width:0}
#pantallaInventario .fila-inv .nombre-inv{font-size:14px;white-space:normal;overflow-wrap:anywhere;line-height:1.4}
#pantallaInventario .fila-inv .detalle-inv{font-size:12px;color:#76665c;line-height:1.5}
#pantallaInventario .stock-inv.medio,#pantallaInventario .stock-inv.bajo{color:#b02c25;background:#fbe9e7}
#pantallaInventario .fila-inv .precio-inv{width:116px;min-height:48px;padding:0 6px;border:1px solid #e7dcd3;background:#faf8f5;border-radius:10px}
#pantallaInventario .fila-inv .precio-inv input{font-family:inherit;min-height:46px;font-size:20px;padding:4px 0;color:#3b2b24}
#pantallaInventario .fila-inv .precio-inv span{font-size:12px;color:#76665c}
#pantallaInventario .fila-inv .precio-fijo-inv{width:116px;font-size:20px;color:#3b2b24}
#pantallaInventario .fila-inv.guardado{border-color:#286344}
#pantallaInventario #listaInventario:not(.modo-lista){grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
#pantallaInventario .tarjeta-producto-inventario{min-width:0;border:1px solid #e7dcd3;border-radius:18px;box-shadow:none;background:#fff}
#pantallaInventario .imagen-producto-inventario{height:140px;background:#fff}
#pantallaInventario .imagen-producto-inventario img{object-fit:contain;padding:8px}
#pantallaInventario .nombre-producto-inventario{max-height:none;overflow:visible;overflow-wrap:anywhere;font-size:14px;line-height:1.4}
#pantallaInventario .fila-precio-stock-inventario{flex-wrap:wrap}
#pantallaInventario .precio-inventario{font:700 22px 'Plus Jakarta Sans',sans-serif;overflow-wrap:anywhere}
#pantallaInventario .btn-pausar-tarjeta{width:48px;height:48px}
#pantallaInventario .ih-escanear-inventario{background:#a74725;color:#fff;width:48px;height:48px}
#pantallaInventario #chipsCategoriaInventario{position:relative;overflow:visible;margin:14px 0;z-index:5}
#pantallaInventario #selectorCategoriaInventario{background:#fff;color:#3b2b24;border:1px solid #e7dcd3;border-radius:10px;padding:10px 14px;max-width:100%;text-align:left;white-space:normal}
#pantallaInventario #listaCategoriasInventario{position:absolute;top:100%;left:0;width:360px;max-width:calc(100vw - 32px);max-height:360px;overflow:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;background:#fff;border:1px solid #e7dcd3;border-radius:14px;padding:8px;box-shadow:0 8px 24px #3b2b2420}
#pantallaInventario #listaCategoriasInventario[hidden]{display:none}
#pantallaInventario #listaCategoriasInventario button{display:flex;align-items:center;gap:8px;background:#fff;color:#3b2b24;border:1px solid transparent;border-radius:8px;padding:8px;text-align:left;white-space:normal;font-size:14px;overflow-wrap:anywhere}
#pantallaInventario #listaCategoriasInventario svg{flex-shrink:0;color:#a74725}
#pantallaInventario #listaCategoriasInventario small{margin-left:auto}
#pantallaInventario #listaCategoriasInventario button[aria-pressed=true]{background:#f7e9df;border-color:#a74725}
@media(max-width:767px){#pantallaInventario .grid-acciones-inventario{grid-template-columns:repeat(2,minmax(0,1fr))}#pantallaInventario #listaCategoriasInventario{position:fixed;top:auto;bottom:calc(84px + env(safe-area-inset-bottom,0px));left:12px;right:12px;width:auto;max-width:none;max-height:60dvh}#pantallaInventario .fila-filtro-inventario{flex-wrap:wrap}#pantallaInventario .fila-inv{gap:8px;padding:10px;grid-template-columns:48px minmax(0,1fr) 110px}#pantallaInventario .fila-inv .precio-inv,#pantallaInventario .fila-inv .precio-fijo-inv{width:110px}}
@media(min-width:768px){#pantallaInventario #listaInventario:not(.modo-lista){grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}}
:is(#modalProducto,#modalStockProducto,#modalAjusteStock,#modalConteo,#modalFactura,#modalEscanerFactura,#modalCombo,#modalPromos,#modalImportarExcel){--ih-naranja:#a74725;--ih-tinta:#3b2b24;--ih-fondo:#faf8f5;font-family:"Plus Jakarta Sans",sans-serif}
:is(#modalProducto,#modalStockProducto,#modalAjusteStock,#modalConteo,#modalFactura,#modalEscanerFactura,#modalCombo,#modalPromos,#modalImportarExcel) .caja{background:#faf8f5;color:#3b2b24;border-color:#e7dcd3;border-radius:18px;box-sizing:border-box}
:is(#modalProducto,#modalStockProducto,#modalAjusteStock,#modalConteo,#modalFactura,#modalEscanerFactura,#modalCombo,#modalPromos,#modalImportarExcel) button{min-height:48px;border-radius:10px;transition:background-color 180ms;font-family:inherit}
:is(#modalProducto,#modalStockProducto,#modalAjusteStock,#modalConteo,#modalFactura,#modalEscanerFactura,#modalCombo,#modalPromos,#modalImportarExcel) input:not([type=checkbox]):not([type=radio]),:is(#modalProducto,#modalStockProducto,#modalAjusteStock,#modalConteo,#modalFactura,#modalEscanerFactura,#modalCombo,#modalPromos,#modalImportarExcel) select{min-height:48px;background:#fff;color:#3b2b24;border:1px solid #e7dcd3;border-radius:10px;max-width:100%;box-sizing:border-box}
:is(#modalProducto,#modalStockProducto,#modalAjusteStock,#modalConteo,#modalFactura,#modalEscanerFactura,#modalCombo,#modalPromos,#modalImportarExcel) .btn-cerrar-modal{background:#a74725;color:#fff}
:is(#modalProducto,#modalStockProducto,#modalAjusteStock,#modalConteo,#modalFactura,#modalEscanerFactura,#modalCombo,#modalPromos,#modalImportarExcel) h3{color:#3b2b24;font-size:22px}
:is(#modalProducto,#modalStockProducto,#modalAjusteStock,#modalConteo,#modalFactura,#modalEscanerFactura,#modalCombo,#modalPromos,#modalImportarExcel) :focus-visible{outline:3px solid #a74725;outline-offset:2px}
@media(prefers-reduced-motion:reduce){#pantallaInventario *,body:has(.pantalla-app.activa) .nav-app *,body:has(.pantalla-app.activa) .encabezado-app *,:is(#modalProducto,#modalStockProducto,#modalAjusteStock,#modalConteo,#modalFactura,#modalEscanerFactura,#modalCombo,#modalPromos,#modalImportarExcel) *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* En celular se usa solo el escaner redondo inferior, igual que en Venta. */
@media(min-width:900px){#pantallaInventario .buscador-venta .btn-escanear-venta{display:flex;align-items:center;justify-content:center}}
#pantallaInventario .fila-inv .precio-inv input{font-size:20px!important}
@media(min-width:768px){body:has(.pantalla-app.activa) .nav-app .logo-nav-ancho{display:flex;width:40px;height:40px;min-height:40px;align-items:center;justify-content:center;border-radius:12px;background:#a74725;color:#fff;margin-bottom:auto;overflow:hidden}body:has(.pantalla-app.activa) .nav-app .avatar-nav-ancho{display:flex;width:40px;height:40px;align-items:center;justify-content:center;border-radius:50%;margin-top:auto;overflow:hidden}}

/* Acciones de las ventanas: primario y secundario conservan su funcion. */
#modalProducto .btn-guardar-ficha{min-height:48px;background:#a74725;color:#fff;border-radius:12px}
:is(#modalProducto,#modalStockProducto,#modalAjusteStock,#modalConteo,#modalFactura,#modalCombo,#modalPromos,#modalImportarExcel) .btn-secundario{background:#fff;color:#3b2b24;border:1px solid #e7dcd3}
:is(#modalProducto,#modalStockProducto,#modalAjusteStock,#modalConteo,#modalFactura,#modalCombo,#modalPromos) :is(.btn-volver-ficha,.btn-volver-mercaderia){min-width:48px;min-height:48px;background:#fff;color:#3b2b24;border:1px solid #e7dcd3}
#modalProducto .btn-eliminar-ficha{min-height:48px;color:#b02c25;background:#fff;border:1px solid #e7dcd3}
#pantallaInventario .imagen-producto-inventario .sin-foto{background:#faf8f5;color:#76665c;font-size:32px;font-weight:700}

/* Activo con texto blanco, tambien en el destino Venta. */
body:has(.pantalla-app.activa, #pantallaVenta.activa) .nav-app .nav-item.activo,body:has(.pantalla-app.activa, #pantallaVenta.activa) .nav-app .nav-item-venta.activo{background:#a74725;color:#fff}
#pantallaInventario .badge-stock-inventario.medio,#pantallaInventario .badge-stock-inventario.bajo{background:#fbe9e7;color:#b02c25}

/* Tablet vertical: el encabezado tambien cabe en una sola linea. */
@media(min-width:768px) and (max-width:1023px){
 body:has(.pantalla-app.activa) .encabezado-app{flex-wrap:nowrap;gap:4px}
 body:has(.pantalla-app.activa) .fila-estado-app{order:2;width:auto;flex-wrap:nowrap;gap:2px}
 body:has(.pantalla-app.activa) #indicadorSesion{order:3;flex:0 0 48px}
 body:has(.pantalla-app.activa) .nombre-negocio{font-size:11px}
 body:has(.pantalla-app.activa) .logo-negocio{width:28px;min-width:28px;height:32px;font-size:12px}
 body:has(.pantalla-app.activa) .fila-estado-app button{font-size:10px;padding:4px;gap:3px;border:0;min-width:0}
 body:has(.pantalla-app.activa) .indicador-caja .flecha-caja{display:none}
}
/* Revision de Claude: en productos por kilo el "/kg" se salia del cuadro del precio. */
#pantallaInventario .fila-inv .precio-inv span{flex-shrink:0}#pantallaInventario .fila-inv .precio-inv input{min-width:0}#pantallaInventario .fila-inv .precio-inv:has(span:last-child:not(:empty)){width:132px}
#pantallaInventario .fila-inv{grid-template-columns:48px minmax(0,1fr) auto}
/* Revision de Claude: entre 768 y 899 px el usuario de la barra lateral salia sin su circulo. */
@media(min-width:768px){body:has(.pantalla-app.activa) .nav-app .avatar-nav-ancho{width:40px;height:40px;min-height:40px;border-radius:50%;background:#a74725;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;overflow:hidden;flex-shrink:0;margin-top:auto}}
/* Revision de Claude (21-oct): en celular el aviso "Hay cajas olvidadas" empujaba el encabezado y la pagina medía mas que el telefono (este achicaba toda la caja). El aviso baja a su propia linea. */
@media(max-width:767px){body:has(.pantalla-app.activa) .encabezado-app{flex-wrap:wrap}body:has(.pantalla-app.activa) .info-negocio{flex:1 1 0;min-width:0}body:has(.pantalla-app.activa) #franjaCajaOlvidada{order:9;flex:1 0 100%;margin:0;max-width:100%}}
/* 21-oct (aviso del chat Minimarket): en Venta la regla de diseno-venta.css (nowrap, con #pantallaVenta) le ganaba a la de arriba y el aviso de cajas olvidadas ensanchaba la pagina a 714 px. Misma correccion con el mismo peso. */
@media(max-width:767px){body:has(#pantallaVenta.activa) .encabezado-app{flex-wrap:wrap}body:has(#pantallaVenta.activa) .info-negocio{flex:1 1 0;min-width:0}body:has(#pantallaVenta.activa) #franjaCajaOlvidada{order:9;flex:1 0 100%;margin:0;max-width:100%}}

/* 23-oct-2026 (Nacho): nombre completo, logo grande y destinos parejos.
   Se aplica también a Venta, cuyas reglas anteriores usan el ID de pantalla. */
body:has(.pantalla-app.activa, #pantallaVenta.activa) .encabezado-app{flex-wrap:wrap;gap:8px}
body:has(.pantalla-app.activa, #pantallaVenta.activa) .logo-negocio{width:56px;min-width:56px;height:56px;font-size:22px}
body:has(.pantalla-app.activa, #pantallaVenta.activa) .info-negocio{flex:1 1 0;min-width:0}
body:has(.pantalla-app.activa, #pantallaVenta.activa) .nombre-negocio{font-size:17px;line-height:1.25;white-space:normal;overflow:visible;text-overflow:clip;overflow-wrap:anywhere}
body:has(.pantalla-app.activa, #pantallaVenta.activa) .fila-estado-app{order:4;flex:1 0 100%;width:100%;min-width:0;flex-wrap:wrap}
body:has(.pantalla-app.activa, #pantallaVenta.activa) .nav-app .nav-item-venta{margin-top:0;padding:4px 4px 8px;gap:4px}
body:has(.pantalla-app.activa, #pantallaVenta.activa) .nav-app .circulo-venta{width:24px;height:24px;background:none!important;box-shadow:none;border:0;border-radius:0;color:inherit}
body:has(.pantalla-app.activa, #pantallaVenta.activa) .nav-app .nav-item{background:none!important;color:#76665c}
body:has(.pantalla-app.activa, #pantallaVenta.activa) .nav-app .nav-item.activo{background:none!important;color:#a74725}
body:has(.pantalla-app.activa, #pantallaVenta.activa) .nav-app .etiqueta-venta{color:inherit;font-weight:600}
@media(min-width:768px){body:has(.pantalla-app.activa, #pantallaVenta.activa) .nav-app .nav-item-venta{padding:10px 2px 8px}}
/* Revision de Claude (23-oct): mismo orden en todos los anchos (en tablet el circulo del usuario
   quedaba solo en una linea y el estado de la caja era una barra ancha). Linea 1: logo, nombre y
   usuario; linea 2: estado de la caja (del tamano de su texto); abajo el aviso de cajas olvidadas. */
body:has(.pantalla-app.activa, #pantallaVenta.activa) #indicadorSesion{order:3;flex:0 0 48px}
body:has(.pantalla-app.activa, #pantallaVenta.activa) #franjaCajaOlvidada{order:9;flex:1 0 100%;margin:0;max-width:100%}
body:has(.pantalla-app.activa, #pantallaVenta.activa) .fila-estado-app button{flex:0 0 auto;width:auto;max-width:100%;min-height:40px;font-size:13px;padding:6px 14px;gap:6px}
@media(min-width:1024px){body:has(.pantalla-app.activa, #pantallaVenta.activa) .fila-estado-app{order:2;flex:0 0 auto;width:auto}}

/* 23-oct-2026: dos columnas; la caja conserva su acción y descripción sin texto visible. */
body:has(.pantalla-app.activa, #pantallaVenta.activa) .encabezado-app{display:grid;grid-template-columns:minmax(0,1fr) 48px;grid-template-rows:auto auto;align-items:start;gap:6px 12px;padding:10px 16px}
body:has(.pantalla-app.activa, #pantallaVenta.activa) :is(.fila-negocio,.fila-estado-app){display:contents}
body:has(.pantalla-app.activa, #pantallaVenta.activa) .logo-negocio{grid-column:1;grid-row:1;width:56px;height:56px;min-width:56px}
body:has(.pantalla-app.activa, #pantallaVenta.activa) .info-negocio{grid-column:1;grid-row:2;min-width:0;align-self:center}
body:has(.pantalla-app.activa, #pantallaVenta.activa) #indicadorSesion{grid-column:2;grid-row:1;margin:0;width:48px;height:48px;min-width:48px;padding:0;justify-self:end}
body:has(.pantalla-app.activa, #pantallaVenta.activa) #indicadorCaja{grid-column:2;grid-row:2;display:flex;align-items:center;justify-content:center;width:48px;height:48px;min-width:48px;min-height:48px;padding:6px;margin:0;box-sizing:border-box;border:0;border-radius:50%;background:#a74725;color:#fff}
body:has(.pantalla-app.activa, #pantallaVenta.activa) #indicadorCaja.abierta{background:#286344;color:#fff}
#indicadorCaja svg{display:block;width:32px;height:32px}
#indicadorCaja .texto-caja,#indicadorCaja .icono-caja-abierta,#indicadorCaja.abierta .icono-caja-cerrada{display:none}
#indicadorCaja.abierta .icono-caja-abierta{display:block}
body:has(.pantalla-app.activa, #pantallaVenta.activa) #franjaCajaOlvidada{grid-column:1 / -1;grid-row:3;width:100%;min-width:0;white-space:normal;box-sizing:border-box;overflow-wrap:anywhere}
