/* ═══════════════════════════════════════════════════════════════════════ SELECCIÓN DE EXPERIENCIA (Device.IsMobileExperience) ═══════════════════════════════════════════════════════════════════════ Esta hoja se carga SIEMPRE, sin media query (ver App.razor) - a diferencia de erp-mobile.css, que solo se descarga con y por lo tanto NUNCA aplicaría a un Tablet ancho (ej. iPad Pro horizontal, 1366px), aunque DeviceExperienceService ya lo haya detectado correctamente como "mobile". Toda regla que decide QUÉ EXPERIENCIA usar (no cuánto espacio hay disponible) vive aquí, activada por las clases que DeviceExperienceService aplica en : html.device-experience-mobile html.device-experience-desktop Los ajustes puramente físicos (columnas, tipografía, wrapping) siguen en erp-mobile.css/responsive-polish.css/los .razor.css de cada página - esta hoja NO los duplica. IMPORTANTE (piloto, ver DeviceExperienceService.cs y el reporte del segundo piloto): el FAB (.mobile-fab-container y sus hijos) sigue siendo, en su forma "canónica", una regla ATADA AL ANCHO dentro de erp-mobile.css - migrar esa regla compartida de una sola vez afectaría a las ~85 páginas que la usan y que todavía no se migraron una por una (mostrarían FAB Y toolbar de escritorio a la vez en un Tablet ancho). Mientras se migra el resto de la app en lotes, cada página ya migrada agrega aquí su propia copia CON ÁMBITO (selector con la clase de la página) del FAB, en vez de tocar la regla compartida. Cuando la mayoría de las páginas con FAB estén migradas, esa regla compartida se convierte una sola vez aquí y todas estas copias con ámbito se retiran. */ /* ── Modal de filtros móvil — .modal-backdrop/.mobile-filter-modal* y su alias .erp-mobile-modal-backdrop/.erp-mobile-modal* (patrón compartido por decenas de páginas, ver comentario en erp-mobile.css ~línea 4179) ── Bug real encontrado en producción (Facturas se veía roto, Pedidos casi bien "por suerte" - ambas con el mismo bug de fondo): el posicionamiento position:fixed + centrado + fondo oscuro del backdrop, y el propio tamaño/borde/sombra de la caja del modal, viven ÚNICAMENTE dentro de erp-mobile.css, que solo se descarga con (ver intro de este archivo). Un iPad Pro horizontal mide 1366px de ancho CSS - por encima del umbral - así que ese ni siquiera se descarga ahí, aunque DeviceExperienceService ya haya resuelto IsMobileExperience=true (Tablet siempre es Mobile). Resultado: el modal se renderiza sin NINGÚN estilo propio - un
sin position:fixed cae en el flujo normal del documento, en el punto exacto del DOM donde esa página lo insertó, por eso Facturas (insertado entre las tarjetas de resumen) se veía "flotando" roto y Pedidos (insertado justo después del header) se veía casi aceptable por pura coincidencia de orden en el DOM - ninguna de las dos estaba realmente centrada, con fondo oscuro, ni con la tarjeta/bordes/sombra reales del modal. erp-design-system.css (sin media query, siempre cargado) solo aporta el color de fondo del backdrop (línea ~2337) - nunca el position:fixed que lo saca del flujo normal, así que por sí solo tampoco alcanza. CORRECCIÓN (encontrado con OpportunitiesKanban.razor): originalmente esto tenía ámbito html.device-experience-mobile, asumiendo que este modal (.erp-mobile-modal-backdrop/.erp-mobile-modal) es "solo móvil" - cierto para los modales de FILTROS (su
ni existe en el DOM salvo Device.IsMobileExperience=true, ver @if en Orders.razor/Invoices.razor), pero OpportunitiesKanban.razor usa este MISMO componente para el modal de detalle de tarjeta sin ningún @if por dispositivo - se abre igual en escritorio. Con el ámbito viejo, en escritorio ancho (sin Tablet, sin erp-mobile.css cargado) el modal se renderizaba totalmente sin estilo. Se quita el ámbito por dispositivo: esta caja/backdrop es un modal genérico, no una decisión de experiencia - debe verse igual sin importar el dispositivo. Se deja fuera a propósito la @media(max-width:768px) que solo repite border-radius/align-items ya heredados (no-op) y la @media(max-width:359px) que apila los botones del footer en teléfonos muy angostos (esa sí es un ajuste físico legítimo, se mantiene solo en erp-mobile.css). */ .modal-backdrop, .erp-mobile-modal-backdrop { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center; justify-content: center; padding: 1rem; background: rgba(15, 23, 42, 0.68); } .mobile-filter-modal, .erp-mobile-modal { background: var(--erp-surface); border: 1px solid var(--erp-border); border-radius: 20px; width: 100%; max-width: 440px; max-height: calc(100dvh - 1.5rem); display: flex; flex-direction: column; overflow: hidden; box-shadow: 0 24px 60px rgba(15, 23, 42, 0.28); padding: 0; } .mobile-filter-modal-header, .erp-mobile-modal-header { display: flex; align-items: center; justify-content: space-between; min-height: 64px; padding: 0.875rem 1.25rem; border-bottom: 1px solid var(--erp-border); flex-shrink: 0; margin: 0; } .mobile-filter-modal-header h3, .erp-mobile-modal-title { margin: 0; font-size: 1.25rem; font-weight: 700; color: var(--erp-text-primary); } .btn-close-modal, .erp-mobile-modal-close { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 36px; width: 36px; height: 36px; background: var(--erp-surface-subtle); border: 1px solid var(--erp-border); border-radius: 999px; font-size: 1rem; line-height: 1; color: var(--erp-text-muted); cursor: pointer; padding: 0; transition: background-color 0.2s, border-color 0.2s, color 0.2s; } .btn-close-modal:hover, .erp-mobile-modal-close:hover { background: var(--erp-surface); border-color: var(--erp-border-strong); color: var(--erp-text-primary); } .btn-close-modal:focus-visible, .erp-mobile-modal-close:focus-visible { outline: 2px solid var(--erp-primary); outline-offset: 2px; } .mobile-filter-modal-body, .erp-mobile-modal-body { padding: 1rem 1.25rem 1.25rem; overflow-y: auto; display: flex; flex-direction: column; gap: 1rem; overscroll-behavior: contain; } .erp-mobile-modal-body .erp-form-group { flex: 0 0 auto; min-width: 0; } .erp-mobile-modal-body .erp-input, .erp-mobile-modal-body .erp-select, .erp-mobile-modal-body .erp-date-input { min-height: 46px; border-radius: 10px; } .erp-mobile-modal-summary { display: flex; flex-direction: column; gap: 0.625rem; padding: 0.875rem 1rem; border: 1px solid var(--erp-border); border-radius: 12px; background: var(--erp-surface-subtle); } .erp-mobile-modal-summary-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; color: var(--erp-text-muted); } .erp-mobile-modal-summary-row strong { min-width: 0; color: var(--erp-text-primary); text-align: right; overflow-wrap: anywhere; } .mobile-filter-modal-body .erp-filter-group { flex: 0 0 auto; min-width: 0; gap: 0.45rem; } .mobile-filter-modal-body .erp-filter-label { white-space: normal; } .mobile-filter-modal-body .erp-input, .mobile-filter-modal-body .erp-date-input, .mobile-filter-modal-body .erp-status-toggle { min-height: 46px; border-radius: 10px; } .mobile-filter-modal-body .erp-status-menu { position: relative; z-index: 15; box-shadow: none; border: 1px solid var(--erp-border); margin-top: 0.375rem; } .mobile-filter-date-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; min-width: 0; } .mobile-filter-modal-footer, .erp-mobile-modal-footer { display: flex; gap: 0.75rem; padding: 1rem 1.25rem calc(1rem + env(safe-area-inset-bottom)); border-top: 1px solid var(--erp-border); background: var(--erp-surface); flex-shrink: 0; margin-top: 0; } .mobile-filter-modal-footer .erp-btn, .erp-mobile-modal-footer .erp-btn { flex: 1; min-width: 0; min-height: 44px; justify-content: center; border-radius: 10px; } /* ── Transferencias — /inventory/transfers (InventoryTransferBatches.razor) ── Migrado a @if (Device.IsMobileExperience) real - el toolbar/filtros de escritorio y el FAB ya no coexisten en el DOM (ver InventoryTransferBatches.razor). Pero el @if solo controla si el elemento EXISTE; su visibilidad CSS todavía dependía únicamente del ancho, por eso hace falta esta regla aparte: sin ella, un Tablet en 1024px con Device.IsMobileExperience=true igual renderiza el FAB en el DOM pero con display:none heredado del estado oculto-por-defecto compartido (erp-design-system.css). */ html.device-experience-mobile .transfer-batches-page .mobile-fab-container { display: flex; flex-direction: column; align-items: flex-end; position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 900; } html.device-experience-mobile .transfer-batches-page .mobile-fab-backdrop { position: fixed; inset: 0; z-index: -1; } html.device-experience-mobile .transfer-batches-page .mobile-fab-main { width: 56px; height: 56px; border-radius: 50%; border: none; background: var(--erp-primary); color: white; font-size: 1.4rem; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25); cursor: pointer; } html.device-experience-mobile .transfer-batches-page .mobile-fab-main:active { background: var(--erp-primary-hover); } html.device-experience-mobile .transfer-batches-page .mobile-fab-option { display: flex; align-items: center; gap: 0.75rem; background: none; border: none; padding: 0; margin-bottom: 0.9rem; cursor: pointer; } html.device-experience-mobile .transfer-batches-page .mobile-fab-option-label { background: var(--erp-surface); color: var(--erp-text-primary); font-size: 0.8rem; font-weight: 600; padding: 0.4rem 0.75rem; border-radius: 8px; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12); white-space: nowrap; } html.device-experience-mobile .transfer-batches-page .mobile-fab-option-circle { position: relative; width: 44px; height: 44px; border-radius: 50%; background: var(--erp-surface); color: var(--erp-primary); display: flex; align-items: center; justify-content: center; font-size: 1.1rem; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2); flex-shrink: 0; } html.device-experience-mobile .transfer-batches-page .mobile-fab-badge { position: absolute; top: -4px; right: -4px; display: inline-flex; align-items: center; justify-content: center; min-width: 1.1rem; height: 1.1rem; padding: 0 0.3rem; border-radius: 999px; background: var(--erp-danger); color: white; font-size: 0.65rem; font-weight: 700; } /* ── Lista de Bancos — /banks (Banks.razor) ── Migrado: @if (Device.IsMobileExperience) real. El FAB de esta página está incluido en el bloque agrupado del lote de Finanzas/Bancos/CFDI/Reportes (ver más abajo, "banks-page" en la lista de selectores). */ /* ── Tabla → tarjetas (selección de experiencia), opt-in ────────────────── Corrección del tercer piloto: la auditoría original clasificó "tabla con data-label" como ajuste FÍSICO puro (erp-design-system.css, dentro de @media max-width:768px) y por eso nunca se migró. Es un error - un Tablet ancho (iPad Pro 1024/1366px) tiene Device.IsMobileExperience=true pero esa media query no se activa nunca ahí, así que la tabla se seguía viendo como tabla de escritorio. Cambiar tabla-con-filas por tarjetas-apiladas no es "reflow por espacio disponible" (eso ya lo cubre el tr→card compaction physical de responsive-polish.css) - es una decisión de QUÉ EXPERIENCIA usar, igual que el FAB o el toolbar. No se activa para TODAS las .erp-table del sitio: muchas tablas no tienen data-label en cada celda, o son tablas de edición complejas (líneas de documento, BOM, WBS) donde una tarjeta apilada sería ilegible o rompería inputs/selects en línea. En vez de una lista de excepciones (frágil, hay que mantenerla), esto es opt-in explícito: solo las tablas cuyo Y su .erp-table-shell envolvente tengan agregada la clase "erp-table-mobile-cards" adoptan esta transformación. Antes de agregar esa clase a una tabla nueva, confirmar que TODOS sus
tienen data-label (excepto los que llevan colspan) y que no es una tabla de edición en línea ni anidada. Migradas hasta ahora: InventoryTransferBatches.razor (las dos tablas, pestañas "Pendientes" y "Transferencias"). El resto de la app sigue usando el equivalente físico en erp-design-system.css/erp-mobile.css (@media max-width:768px), sin duplicarse ni contradecirse con esto - son selectores distintos (.erp-table sin la clase opt-in vs. .erp-table con ella) y ambos bloques coexisten hasta que cada página se migre. */ html.device-experience-mobile .erp-table-shell.erp-table-mobile-cards { border: none; background: transparent; } html.device-experience-mobile .erp-table-shell.erp-table-mobile-cards .erp-custom-scrollbar-track, html.device-experience-mobile .erp-table-shell.erp-table-mobile-cards .erp-custom-scrollbar-thumb { display: none !important; } html.device-experience-mobile table.erp-table-mobile-cards thead { display: none; } html.device-experience-mobile table.erp-table-mobile-cards, html.device-experience-mobile table.erp-table-mobile-cards tbody, html.device-experience-mobile table.erp-table-mobile-cards tr, html.device-experience-mobile table.erp-table-mobile-cards td { display: block; width: 100%; } html.device-experience-mobile table.erp-table-mobile-cards tr { position: relative; margin-bottom: 1rem; padding: 0.875rem; padding-top: 2.25rem; background: var(--erp-surface); border: 1px solid var(--erp-border); border-radius: 12px; } html.device-experience-mobile table.erp-table-mobile-cards td { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0.625rem 0; text-align: right; } html.device-experience-mobile table.erp-table-mobile-cards td::before { content: attr(data-label); color: var(--erp-text-muted); font-size: var(--erp-text-xs); font-weight: 700; letter-spacing: 0.03em; text-align: left; text-transform: uppercase; } html.device-experience-mobile table.erp-table-mobile-cards td[colspan]::before { content: none; } /* Estado (col-status) flota en la esquina superior izquierda de la tarjeta, sobre los campos apilados - de ahí el padding-top: 2.25rem en la regla de tr de arriba, que le reserva el espacio. width: auto !important es obligatorio: erp-design-system.css define ".erp-table .col-status { width: 1%; white-space: nowrap }" SIN media query (pensado para que en la tabla de escritorio, con layout automático, la columna de estado no robe espacio de más). Esa regla sigue vigente aquí porque nunca se sobreescribía - con position:absolute heredaba width:1% del tr (no del contenido), comprimiendo la caja a un punto donde el badge de estado quedaba recortado (ej. "COMPLETADO"). Precedente ya probado en producción: erp-mobile.css, .retainer-agreements-page .retainer-agreements-table td.col-status. */ html.device-experience-mobile table.erp-table-mobile-cards td.col-status { position: absolute; top: 0.75rem; left: 0.875rem; width: auto !important; min-width: 0; max-width: calc(100% - 1.75rem); box-sizing: border-box; padding: 0; display: block; border-bottom: none; z-index: 2; } html.device-experience-mobile table.erp-table-mobile-cards td.col-status::before { content: none; } /* El badge en sí también necesita su propio tope de ancho - .erp-badge trae white-space:nowrap fijo (erp-design-system.css) y sin esto se saldría de la caja de arriba en vez de recortarse dentro de ella. A diferencia de los demás campos de la tarjeta (ver regla siguiente), acá SÍ se usa ellipsis en vez de permitir wrap: es una sola palabra corta (ACTIVO/CANCELADO/COMPLETADO...) flotando sobre contenido apilado - partirla en dos líneas se vería peor que truncarla, y en la práctica ningún estado localizado es tan largo como para necesitar el corte. */ html.device-experience-mobile table.erp-table-mobile-cards td.col-status .erp-badge { display: inline-flex; width: auto; max-width: 100%; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } /* .erp-link-code/.erp-badge/.erp-number traen white-space:nowrap fijo para la tabla de escritorio, donde la celda crece con el contenido; en la tarjeta móvil su celda es un flex de ancho fijo y no se encogen solos - se les permite partir línea en vez de salirse de la tarjeta. :not(.col-status) porque el badge de estado tiene su propia regla de ellipsis arriba (celda position:absolute sin ancho definido - con white-space:normal ahí el texto terminaría partido letra por letra). Esto es a propósito distinto del caso anterior: acá SÍ es contenido normal (código de documento, tipo, cantidad), no debe ocultarse - permitir wrap en vez de truncar. */ html.device-experience-mobile table.erp-table-mobile-cards td:not(.col-status) .erp-link-code, html.device-experience-mobile table.erp-table-mobile-cards td:not(.col-status) .erp-badge, html.device-experience-mobile table.erp-table-mobile-cards td .erp-number { min-width: 0; max-width: 100%; white-space: normal; overflow-wrap: anywhere; } /* Texto plano largo sin envoltorio propio (descripción, artículo, origen, destino...): nunca debe truncarse silenciosamente - permitir wrap. La celda ya es flex (regla de td más arriba); sin min-width:0 un hijo de texto no se encoge por debajo de su ancho intrínseco y saldría de la tarjeta en vez de partir línea. */ html.device-experience-mobile table.erp-table-mobile-cards td { min-width: 0; overflow-wrap: anywhere; } /* Inputs/selects/botones dentro de una tarjeta: sin esto, un control con ancho fijo en px (heredado de un layout de escritorio en columnas) puede exceder el ancho de la tarjeta en vez de encogerse a 100%. */ html.device-experience-mobile table.erp-table-mobile-cards td input, html.device-experience-mobile table.erp-table-mobile-cards td select, html.device-experience-mobile table.erp-table-mobile-cards td button:not(.erp-btn-icon) { max-width: 100%; box-sizing: border-box; } /* Acciones de fila visibles en línea (reemplaza el menú meatball ⋯): !important gana sobre la regla de hover-reveal de escritorio (erp-design-system.css), que de otro modo sacaría esta celda del flujo normal con position:absolute. */ html.device-experience-mobile table.erp-table-mobile-cards td.erp-actions-cell, html.device-experience-mobile table.erp-table-mobile-cards tbody tr:hover td.erp-actions-cell, html.device-experience-mobile table.erp-table-mobile-cards tbody tr:focus-within td.erp-actions-cell { display: flex !important; position: static !important; justify-content: flex-end !important; padding: 0.625rem 0 !important; } html.device-experience-mobile table.erp-table-mobile-cards td.erp-actions-cell::before { content: none; } html.device-experience-mobile table.erp-table-mobile-cards tbody tr:hover td { background: inherit; } html.device-experience-mobile table.erp-table-mobile-cards .desktop-actions-row { display: flex !important; align-items: center; justify-content: flex-end; gap: 1.25rem; width: 100%; } html.device-experience-mobile table.erp-table-mobile-cards td.total-actions-cell { flex-wrap: wrap; } html.device-experience-mobile table.erp-table-mobile-cards .total-actions-cell .cell-value { min-width: 0; margin-left: auto; } html.device-experience-mobile table.erp-table-mobile-cards .total-actions-cell .cell-hover-actions, html.device-experience-mobile table.erp-table-mobile-cards tbody tr:hover .total-actions-cell .cell-hover-actions, html.device-experience-mobile table.erp-table-mobile-cards tbody tr:focus-within .total-actions-cell .cell-hover-actions { position: static; display: flex; flex: 1 0 100%; justify-content: center; padding: 0.5rem 0 0; background: transparent; } html.device-experience-mobile table.erp-table-mobile-cards .mobile-meatball-wrapper { display: none !important; } /* ── Lote Inventario — FAB compartido con ámbito por página ─────────────── 15 páginas migradas juntas en el mismo lote: en vez de repetir el cuerpo completo de cada regla 15 veces (como se hizo para transfer-batches-page y banks-page en el piloto), se agrupan los selectores de página en una sola lista por regla - el cuerpo es idéntico, solo cambia a qué página aplica. Sigue siendo "con ámbito" (nunca ".mobile-fab-container" solo): el resto de la app (~70 páginas con FAB fuera de Inventario) todavía depende del ancho vía erp-mobile.css y NO debe activarse aquí. Cuando esas también se migren, esta lista se fusiona con la compartida y deja de hacer falta un selector por página. */ html.device-experience-mobile .assemblies-page .mobile-fab-container, html.device-experience-mobile .cost-analysis-page .mobile-fab-container, html.device-experience-mobile .inventory-details-page .mobile-fab-container, html.device-experience-mobile .inventory-page .mobile-fab-container, html.device-experience-mobile .transfer-batch-view-page .mobile-fab-container, html.device-experience-mobile .transfer-legacy-view-page .mobile-fab-container, html.device-experience-mobile .categories-page .mobile-fab-container, html.device-experience-mobile .families-page .mobile-fab-container, html.device-experience-mobile .locations-page .mobile-fab-container, html.device-experience-mobile .warehouses-page .mobile-fab-container, html.device-experience-mobile .uoms-page .mobile-fab-container, html.device-experience-mobile .adjustment-batches-page .mobile-fab-container, html.device-experience-mobile .adjustment-batch-view-page .mobile-fab-container, html.device-experience-mobile .adjustment-batch-edit-page .mobile-fab-container, html.device-experience-mobile .valuation-report-page .mobile-fab-container { display: flex; flex-direction: column; align-items: flex-end; position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 900; } html.device-experience-mobile .assemblies-page .mobile-fab-backdrop, html.device-experience-mobile .cost-analysis-page .mobile-fab-backdrop, html.device-experience-mobile .inventory-details-page .mobile-fab-backdrop, html.device-experience-mobile .inventory-page .mobile-fab-backdrop, html.device-experience-mobile .transfer-batch-view-page .mobile-fab-backdrop, html.device-experience-mobile .transfer-legacy-view-page .mobile-fab-backdrop, html.device-experience-mobile .categories-page .mobile-fab-backdrop, html.device-experience-mobile .families-page .mobile-fab-backdrop, html.device-experience-mobile .locations-page .mobile-fab-backdrop, html.device-experience-mobile .warehouses-page .mobile-fab-backdrop, html.device-experience-mobile .uoms-page .mobile-fab-backdrop, html.device-experience-mobile .adjustment-batches-page .mobile-fab-backdrop, html.device-experience-mobile .adjustment-batch-view-page .mobile-fab-backdrop, html.device-experience-mobile .adjustment-batch-edit-page .mobile-fab-backdrop, html.device-experience-mobile .valuation-report-page .mobile-fab-backdrop { position: fixed; inset: 0; z-index: -1; } html.device-experience-mobile .assemblies-page .mobile-fab-main, html.device-experience-mobile .cost-analysis-page .mobile-fab-main, html.device-experience-mobile .inventory-details-page .mobile-fab-main, html.device-experience-mobile .inventory-page .mobile-fab-main, html.device-experience-mobile .transfer-batch-view-page .mobile-fab-main, html.device-experience-mobile .transfer-legacy-view-page .mobile-fab-main, html.device-experience-mobile .categories-page .mobile-fab-main, html.device-experience-mobile .families-page .mobile-fab-main, html.device-experience-mobile .locations-page .mobile-fab-main, html.device-experience-mobile .warehouses-page .mobile-fab-main, html.device-experience-mobile .uoms-page .mobile-fab-main, html.device-experience-mobile .adjustment-batches-page .mobile-fab-main, html.device-experience-mobile .adjustment-batch-view-page .mobile-fab-main, html.device-experience-mobile .adjustment-batch-edit-page .mobile-fab-main, html.device-experience-mobile .valuation-report-page .mobile-fab-main { width: 56px; height: 56px; border-radius: 50%; border: none; background: var(--erp-primary); color: white; font-size: 1.4rem; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25); cursor: pointer; } html.device-experience-mobile .assemblies-page .mobile-fab-main:active, html.device-experience-mobile .cost-analysis-page .mobile-fab-main:active, html.device-experience-mobile .inventory-details-page .mobile-fab-main:active, html.device-experience-mobile .inventory-page .mobile-fab-main:active, html.device-experience-mobile .transfer-batch-view-page .mobile-fab-main:active, html.device-experience-mobile .transfer-legacy-view-page .mobile-fab-main:active, html.device-experience-mobile .categories-page .mobile-fab-main:active, html.device-experience-mobile .families-page .mobile-fab-main:active, html.device-experience-mobile .locations-page .mobile-fab-main:active, html.device-experience-mobile .warehouses-page .mobile-fab-main:active, html.device-experience-mobile .uoms-page .mobile-fab-main:active, html.device-experience-mobile .adjustment-batches-page .mobile-fab-main:active, html.device-experience-mobile .adjustment-batch-view-page .mobile-fab-main:active, html.device-experience-mobile .adjustment-batch-edit-page .mobile-fab-main:active, html.device-experience-mobile .valuation-report-page .mobile-fab-main:active { background: var(--erp-primary-hover); } html.device-experience-mobile .assemblies-page .mobile-fab-option, html.device-experience-mobile .cost-analysis-page .mobile-fab-option, html.device-experience-mobile .inventory-details-page .mobile-fab-option, html.device-experience-mobile .inventory-page .mobile-fab-option, html.device-experience-mobile .transfer-batch-view-page .mobile-fab-option, html.device-experience-mobile .transfer-legacy-view-page .mobile-fab-option, html.device-experience-mobile .categories-page .mobile-fab-option, html.device-experience-mobile .families-page .mobile-fab-option, html.device-experience-mobile .locations-page .mobile-fab-option, html.device-experience-mobile .warehouses-page .mobile-fab-option, html.device-experience-mobile .uoms-page .mobile-fab-option, html.device-experience-mobile .adjustment-batches-page .mobile-fab-option, html.device-experience-mobile .adjustment-batch-view-page .mobile-fab-option, html.device-experience-mobile .adjustment-batch-edit-page .mobile-fab-option, html.device-experience-mobile .valuation-report-page .mobile-fab-option { display: flex; align-items: center; gap: 0.75rem; background: none; border: none; padding: 0; margin-bottom: 0.9rem; cursor: pointer; } html.device-experience-mobile .assemblies-page .mobile-fab-option-label, html.device-experience-mobile .cost-analysis-page .mobile-fab-option-label, html.device-experience-mobile .inventory-details-page .mobile-fab-option-label, html.device-experience-mobile .inventory-page .mobile-fab-option-label, html.device-experience-mobile .transfer-batch-view-page .mobile-fab-option-label, html.device-experience-mobile .transfer-legacy-view-page .mobile-fab-option-label, html.device-experience-mobile .categories-page .mobile-fab-option-label, html.device-experience-mobile .families-page .mobile-fab-option-label, html.device-experience-mobile .locations-page .mobile-fab-option-label, html.device-experience-mobile .warehouses-page .mobile-fab-option-label, html.device-experience-mobile .uoms-page .mobile-fab-option-label, html.device-experience-mobile .adjustment-batches-page .mobile-fab-option-label, html.device-experience-mobile .adjustment-batch-view-page .mobile-fab-option-label, html.device-experience-mobile .adjustment-batch-edit-page .mobile-fab-option-label, html.device-experience-mobile .valuation-report-page .mobile-fab-option-label { background: var(--erp-surface); color: var(--erp-text-primary); font-size: 0.8rem; font-weight: 600; padding: 0.4rem 0.75rem; border-radius: 8px; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12); white-space: nowrap; } html.device-experience-mobile .assemblies-page .mobile-fab-option-circle, html.device-experience-mobile .cost-analysis-page .mobile-fab-option-circle, html.device-experience-mobile .inventory-details-page .mobile-fab-option-circle, html.device-experience-mobile .inventory-page .mobile-fab-option-circle, html.device-experience-mobile .transfer-batch-view-page .mobile-fab-option-circle, html.device-experience-mobile .transfer-legacy-view-page .mobile-fab-option-circle, html.device-experience-mobile .categories-page .mobile-fab-option-circle, html.device-experience-mobile .families-page .mobile-fab-option-circle, html.device-experience-mobile .locations-page .mobile-fab-option-circle, html.device-experience-mobile .warehouses-page .mobile-fab-option-circle, html.device-experience-mobile .uoms-page .mobile-fab-option-circle, html.device-experience-mobile .adjustment-batches-page .mobile-fab-option-circle, html.device-experience-mobile .adjustment-batch-view-page .mobile-fab-option-circle, html.device-experience-mobile .adjustment-batch-edit-page .mobile-fab-option-circle, html.device-experience-mobile .valuation-report-page .mobile-fab-option-circle { position: relative; width: 44px; height: 44px; border-radius: 50%; background: var(--erp-surface); color: var(--erp-primary); display: flex; align-items: center; justify-content: center; font-size: 1.1rem; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2); flex-shrink: 0; } html.device-experience-mobile .assemblies-page .mobile-fab-badge, html.device-experience-mobile .cost-analysis-page .mobile-fab-badge, html.device-experience-mobile .inventory-details-page .mobile-fab-badge, html.device-experience-mobile .inventory-page .mobile-fab-badge, html.device-experience-mobile .transfer-batch-view-page .mobile-fab-badge, html.device-experience-mobile .transfer-legacy-view-page .mobile-fab-badge, html.device-experience-mobile .categories-page .mobile-fab-badge, html.device-experience-mobile .families-page .mobile-fab-badge, html.device-experience-mobile .locations-page .mobile-fab-badge, html.device-experience-mobile .warehouses-page .mobile-fab-badge, html.device-experience-mobile .uoms-page .mobile-fab-badge, html.device-experience-mobile .adjustment-batches-page .mobile-fab-badge, html.device-experience-mobile .adjustment-batch-view-page .mobile-fab-badge, html.device-experience-mobile .adjustment-batch-edit-page .mobile-fab-badge, html.device-experience-mobile .valuation-report-page .mobile-fab-badge { position: absolute; top: -4px; right: -4px; display: inline-flex; align-items: center; justify-content: center; min-width: 1.1rem; height: 1.1rem; padding: 0 0.3rem; border-radius: 999px; background: var(--erp-danger); color: white; font-size: 0.65rem; font-weight: 700; } /* ── Lote Finanzas/Bancos/CFDI/Reportes — FAB compartido con ámbito por página ─── 35 páginas migradas juntas en este lote (mismo patrón que el lote de Inventario más arriba): selectores de página agrupados por regla en vez de repetir el cuerpo completo 35 veces. Incluye banks-page, cuyo bloque standalone del piloto anterior se retiró de aquí arriba al fusionarse en esta lista. El resto de la app (páginas con FAB fuera de estos dos lotes) sigue dependiendo del ancho vía erp-mobile.css. */ html.device-experience-mobile .finance-settings-page .mobile-fab-container, html.device-experience-mobile .gl-account-edit-page .mobile-fab-container, html.device-experience-mobile .payment-term-edit-page .mobile-fab-container, html.device-experience-mobile .bank-edit-page .mobile-fab-container, html.device-experience-mobile .bank-view-page .mobile-fab-container, html.device-experience-mobile .exchange-rate-edit-page .mobile-fab-container, html.device-experience-mobile .landed-cost-type-edit-page .mobile-fab-container, html.device-experience-mobile .cash-flow-report-page .mobile-fab-container, html.device-experience-mobile .journal-entries-page .mobile-fab-container, html.device-experience-mobile .ledger-entries-page .mobile-fab-container, html.device-experience-mobile .payment-terms-page .mobile-fab-container, html.device-experience-mobile .scheduled-reports-page .mobile-fab-container, html.device-experience-mobile .cfdi-documents-page .mobile-fab-container, html.device-experience-mobile .cfdi-payroll-page .mobile-fab-container, html.device-experience-mobile .exchange-rates-page .mobile-fab-container, html.device-experience-mobile .cash-receipts-page .mobile-fab-container, html.device-experience-mobile .expenses-page .mobile-fab-container, html.device-experience-mobile .landed-cost-templates-page .mobile-fab-container, html.device-experience-mobile .landed-cost-types-page .mobile-fab-container, html.device-experience-mobile .landed-cost-vouchers-page .mobile-fab-container, html.device-experience-mobile .payments-page .mobile-fab-container, html.device-experience-mobile .view-cash-receipt-page .mobile-fab-container, html.device-experience-mobile .landed-cost-voucher-edit-page .mobile-fab-container, html.device-experience-mobile .bank-statements-page .mobile-fab-container, html.device-experience-mobile .bank-transactions-page .mobile-fab-container, html.device-experience-mobile .bank-statement-report-page .mobile-fab-container, html.device-experience-mobile .banks-page .mobile-fab-container, html.device-experience-mobile .journal-entry-edit-page .mobile-fab-container, html.device-experience-mobile .bank-transaction-edit-page .mobile-fab-container, html.device-experience-mobile .create-cash-receipt-page .mobile-fab-container, html.device-experience-mobile .edit-cash-receipt-page .mobile-fab-container, html.device-experience-mobile .payment-edit-page .mobile-fab-container, html.device-experience-mobile .lcte2-page .mobile-fab-container, html.device-experience-mobile .expense-edit-page .mobile-fab-container, html.device-experience-mobile .finance-reports-page .mobile-fab-container { display: flex; flex-direction: column; align-items: flex-end; position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 900; } html.device-experience-mobile .finance-settings-page .mobile-fab-backdrop, html.device-experience-mobile .gl-account-edit-page .mobile-fab-backdrop, html.device-experience-mobile .payment-term-edit-page .mobile-fab-backdrop, html.device-experience-mobile .bank-edit-page .mobile-fab-backdrop, html.device-experience-mobile .bank-view-page .mobile-fab-backdrop, html.device-experience-mobile .exchange-rate-edit-page .mobile-fab-backdrop, html.device-experience-mobile .landed-cost-type-edit-page .mobile-fab-backdrop, html.device-experience-mobile .cash-flow-report-page .mobile-fab-backdrop, html.device-experience-mobile .journal-entries-page .mobile-fab-backdrop, html.device-experience-mobile .ledger-entries-page .mobile-fab-backdrop, html.device-experience-mobile .payment-terms-page .mobile-fab-backdrop, html.device-experience-mobile .scheduled-reports-page .mobile-fab-backdrop, html.device-experience-mobile .cfdi-documents-page .mobile-fab-backdrop, html.device-experience-mobile .cfdi-payroll-page .mobile-fab-backdrop, html.device-experience-mobile .exchange-rates-page .mobile-fab-backdrop, html.device-experience-mobile .cash-receipts-page .mobile-fab-backdrop, html.device-experience-mobile .expenses-page .mobile-fab-backdrop, html.device-experience-mobile .landed-cost-templates-page .mobile-fab-backdrop, html.device-experience-mobile .landed-cost-types-page .mobile-fab-backdrop, html.device-experience-mobile .landed-cost-vouchers-page .mobile-fab-backdrop, html.device-experience-mobile .payments-page .mobile-fab-backdrop, html.device-experience-mobile .view-cash-receipt-page .mobile-fab-backdrop, html.device-experience-mobile .landed-cost-voucher-edit-page .mobile-fab-backdrop, html.device-experience-mobile .bank-statements-page .mobile-fab-backdrop, html.device-experience-mobile .bank-transactions-page .mobile-fab-backdrop, html.device-experience-mobile .bank-statement-report-page .mobile-fab-backdrop, html.device-experience-mobile .banks-page .mobile-fab-backdrop, html.device-experience-mobile .journal-entry-edit-page .mobile-fab-backdrop, html.device-experience-mobile .bank-transaction-edit-page .mobile-fab-backdrop, html.device-experience-mobile .create-cash-receipt-page .mobile-fab-backdrop, html.device-experience-mobile .edit-cash-receipt-page .mobile-fab-backdrop, html.device-experience-mobile .payment-edit-page .mobile-fab-backdrop, html.device-experience-mobile .lcte2-page .mobile-fab-backdrop, html.device-experience-mobile .expense-edit-page .mobile-fab-backdrop, html.device-experience-mobile .finance-reports-page .mobile-fab-backdrop { position: fixed; inset: 0; z-index: -1; } html.device-experience-mobile .finance-settings-page .mobile-fab-main, html.device-experience-mobile .gl-account-edit-page .mobile-fab-main, html.device-experience-mobile .payment-term-edit-page .mobile-fab-main, html.device-experience-mobile .bank-edit-page .mobile-fab-main, html.device-experience-mobile .bank-view-page .mobile-fab-main, html.device-experience-mobile .exchange-rate-edit-page .mobile-fab-main, html.device-experience-mobile .landed-cost-type-edit-page .mobile-fab-main, html.device-experience-mobile .cash-flow-report-page .mobile-fab-main, html.device-experience-mobile .journal-entries-page .mobile-fab-main, html.device-experience-mobile .ledger-entries-page .mobile-fab-main, html.device-experience-mobile .payment-terms-page .mobile-fab-main, html.device-experience-mobile .scheduled-reports-page .mobile-fab-main, html.device-experience-mobile .cfdi-documents-page .mobile-fab-main, html.device-experience-mobile .cfdi-payroll-page .mobile-fab-main, html.device-experience-mobile .exchange-rates-page .mobile-fab-main, html.device-experience-mobile .cash-receipts-page .mobile-fab-main, html.device-experience-mobile .expenses-page .mobile-fab-main, html.device-experience-mobile .landed-cost-templates-page .mobile-fab-main, html.device-experience-mobile .landed-cost-types-page .mobile-fab-main, html.device-experience-mobile .landed-cost-vouchers-page .mobile-fab-main, html.device-experience-mobile .payments-page .mobile-fab-main, html.device-experience-mobile .view-cash-receipt-page .mobile-fab-main, html.device-experience-mobile .landed-cost-voucher-edit-page .mobile-fab-main, html.device-experience-mobile .bank-statements-page .mobile-fab-main, html.device-experience-mobile .bank-transactions-page .mobile-fab-main, html.device-experience-mobile .bank-statement-report-page .mobile-fab-main, html.device-experience-mobile .banks-page .mobile-fab-main, html.device-experience-mobile .journal-entry-edit-page .mobile-fab-main, html.device-experience-mobile .bank-transaction-edit-page .mobile-fab-main, html.device-experience-mobile .create-cash-receipt-page .mobile-fab-main, html.device-experience-mobile .edit-cash-receipt-page .mobile-fab-main, html.device-experience-mobile .payment-edit-page .mobile-fab-main, html.device-experience-mobile .lcte2-page .mobile-fab-main, html.device-experience-mobile .expense-edit-page .mobile-fab-main, html.device-experience-mobile .finance-reports-page .mobile-fab-main { width: 56px; height: 56px; border-radius: 50%; border: none; background: var(--erp-primary); color: white; font-size: 1.4rem; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25); cursor: pointer; } html.device-experience-mobile .finance-settings-page .mobile-fab-main:active, html.device-experience-mobile .gl-account-edit-page .mobile-fab-main:active, html.device-experience-mobile .payment-term-edit-page .mobile-fab-main:active, html.device-experience-mobile .bank-edit-page .mobile-fab-main:active, html.device-experience-mobile .bank-view-page .mobile-fab-main:active, html.device-experience-mobile .exchange-rate-edit-page .mobile-fab-main:active, html.device-experience-mobile .landed-cost-type-edit-page .mobile-fab-main:active, html.device-experience-mobile .cash-flow-report-page .mobile-fab-main:active, html.device-experience-mobile .journal-entries-page .mobile-fab-main:active, html.device-experience-mobile .ledger-entries-page .mobile-fab-main:active, html.device-experience-mobile .payment-terms-page .mobile-fab-main:active, html.device-experience-mobile .scheduled-reports-page .mobile-fab-main:active, html.device-experience-mobile .cfdi-documents-page .mobile-fab-main:active, html.device-experience-mobile .cfdi-payroll-page .mobile-fab-main:active, html.device-experience-mobile .exchange-rates-page .mobile-fab-main:active, html.device-experience-mobile .cash-receipts-page .mobile-fab-main:active, html.device-experience-mobile .expenses-page .mobile-fab-main:active, html.device-experience-mobile .landed-cost-templates-page .mobile-fab-main:active, html.device-experience-mobile .landed-cost-types-page .mobile-fab-main:active, html.device-experience-mobile .landed-cost-vouchers-page .mobile-fab-main:active, html.device-experience-mobile .payments-page .mobile-fab-main:active, html.device-experience-mobile .view-cash-receipt-page .mobile-fab-main:active, html.device-experience-mobile .landed-cost-voucher-edit-page .mobile-fab-main:active, html.device-experience-mobile .bank-statements-page .mobile-fab-main:active, html.device-experience-mobile .bank-transactions-page .mobile-fab-main:active, html.device-experience-mobile .bank-statement-report-page .mobile-fab-main:active, html.device-experience-mobile .banks-page .mobile-fab-main:active, html.device-experience-mobile .journal-entry-edit-page .mobile-fab-main:active, html.device-experience-mobile .bank-transaction-edit-page .mobile-fab-main:active, html.device-experience-mobile .create-cash-receipt-page .mobile-fab-main:active, html.device-experience-mobile .edit-cash-receipt-page .mobile-fab-main:active, html.device-experience-mobile .payment-edit-page .mobile-fab-main:active, html.device-experience-mobile .lcte2-page .mobile-fab-main:active, html.device-experience-mobile .expense-edit-page .mobile-fab-main:active, html.device-experience-mobile .finance-reports-page .mobile-fab-main:active { background: var(--erp-primary-hover); } html.device-experience-mobile .finance-settings-page .mobile-fab-option, html.device-experience-mobile .gl-account-edit-page .mobile-fab-option, html.device-experience-mobile .payment-term-edit-page .mobile-fab-option, html.device-experience-mobile .bank-edit-page .mobile-fab-option, html.device-experience-mobile .bank-view-page .mobile-fab-option, html.device-experience-mobile .exchange-rate-edit-page .mobile-fab-option, html.device-experience-mobile .landed-cost-type-edit-page .mobile-fab-option, html.device-experience-mobile .cash-flow-report-page .mobile-fab-option, html.device-experience-mobile .journal-entries-page .mobile-fab-option, html.device-experience-mobile .ledger-entries-page .mobile-fab-option, html.device-experience-mobile .payment-terms-page .mobile-fab-option, html.device-experience-mobile .scheduled-reports-page .mobile-fab-option, html.device-experience-mobile .cfdi-documents-page .mobile-fab-option, html.device-experience-mobile .cfdi-payroll-page .mobile-fab-option, html.device-experience-mobile .exchange-rates-page .mobile-fab-option, html.device-experience-mobile .cash-receipts-page .mobile-fab-option, html.device-experience-mobile .expenses-page .mobile-fab-option, html.device-experience-mobile .landed-cost-templates-page .mobile-fab-option, html.device-experience-mobile .landed-cost-types-page .mobile-fab-option, html.device-experience-mobile .landed-cost-vouchers-page .mobile-fab-option, html.device-experience-mobile .payments-page .mobile-fab-option, html.device-experience-mobile .view-cash-receipt-page .mobile-fab-option, html.device-experience-mobile .landed-cost-voucher-edit-page .mobile-fab-option, html.device-experience-mobile .bank-statements-page .mobile-fab-option, html.device-experience-mobile .bank-transactions-page .mobile-fab-option, html.device-experience-mobile .bank-statement-report-page .mobile-fab-option, html.device-experience-mobile .banks-page .mobile-fab-option, html.device-experience-mobile .journal-entry-edit-page .mobile-fab-option, html.device-experience-mobile .bank-transaction-edit-page .mobile-fab-option, html.device-experience-mobile .create-cash-receipt-page .mobile-fab-option, html.device-experience-mobile .edit-cash-receipt-page .mobile-fab-option, html.device-experience-mobile .payment-edit-page .mobile-fab-option, html.device-experience-mobile .lcte2-page .mobile-fab-option, html.device-experience-mobile .expense-edit-page .mobile-fab-option, html.device-experience-mobile .finance-reports-page .mobile-fab-option { display: flex; align-items: center; gap: 0.75rem; background: none; border: none; padding: 0; margin-bottom: 0.9rem; cursor: pointer; } html.device-experience-mobile .finance-settings-page .mobile-fab-option-label, html.device-experience-mobile .gl-account-edit-page .mobile-fab-option-label, html.device-experience-mobile .payment-term-edit-page .mobile-fab-option-label, html.device-experience-mobile .bank-edit-page .mobile-fab-option-label, html.device-experience-mobile .bank-view-page .mobile-fab-option-label, html.device-experience-mobile .exchange-rate-edit-page .mobile-fab-option-label, html.device-experience-mobile .landed-cost-type-edit-page .mobile-fab-option-label, html.device-experience-mobile .cash-flow-report-page .mobile-fab-option-label, html.device-experience-mobile .journal-entries-page .mobile-fab-option-label, html.device-experience-mobile .ledger-entries-page .mobile-fab-option-label, html.device-experience-mobile .payment-terms-page .mobile-fab-option-label, html.device-experience-mobile .scheduled-reports-page .mobile-fab-option-label, html.device-experience-mobile .cfdi-documents-page .mobile-fab-option-label, html.device-experience-mobile .cfdi-payroll-page .mobile-fab-option-label, html.device-experience-mobile .exchange-rates-page .mobile-fab-option-label, html.device-experience-mobile .cash-receipts-page .mobile-fab-option-label, html.device-experience-mobile .expenses-page .mobile-fab-option-label, html.device-experience-mobile .landed-cost-templates-page .mobile-fab-option-label, html.device-experience-mobile .landed-cost-types-page .mobile-fab-option-label, html.device-experience-mobile .landed-cost-vouchers-page .mobile-fab-option-label, html.device-experience-mobile .payments-page .mobile-fab-option-label, html.device-experience-mobile .view-cash-receipt-page .mobile-fab-option-label, html.device-experience-mobile .landed-cost-voucher-edit-page .mobile-fab-option-label, html.device-experience-mobile .bank-statements-page .mobile-fab-option-label, html.device-experience-mobile .bank-transactions-page .mobile-fab-option-label, html.device-experience-mobile .bank-statement-report-page .mobile-fab-option-label, html.device-experience-mobile .banks-page .mobile-fab-option-label, html.device-experience-mobile .journal-entry-edit-page .mobile-fab-option-label, html.device-experience-mobile .bank-transaction-edit-page .mobile-fab-option-label, html.device-experience-mobile .create-cash-receipt-page .mobile-fab-option-label, html.device-experience-mobile .edit-cash-receipt-page .mobile-fab-option-label, html.device-experience-mobile .payment-edit-page .mobile-fab-option-label, html.device-experience-mobile .lcte2-page .mobile-fab-option-label, html.device-experience-mobile .expense-edit-page .mobile-fab-option-label, html.device-experience-mobile .finance-reports-page .mobile-fab-option-label { background: var(--erp-surface); color: var(--erp-text-primary); font-size: 0.8rem; font-weight: 600; padding: 0.4rem 0.75rem; border-radius: 8px; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12); white-space: nowrap; } html.device-experience-mobile .finance-settings-page .mobile-fab-option-circle, html.device-experience-mobile .gl-account-edit-page .mobile-fab-option-circle, html.device-experience-mobile .payment-term-edit-page .mobile-fab-option-circle, html.device-experience-mobile .bank-edit-page .mobile-fab-option-circle, html.device-experience-mobile .bank-view-page .mobile-fab-option-circle, html.device-experience-mobile .exchange-rate-edit-page .mobile-fab-option-circle, html.device-experience-mobile .landed-cost-type-edit-page .mobile-fab-option-circle, html.device-experience-mobile .cash-flow-report-page .mobile-fab-option-circle, html.device-experience-mobile .journal-entries-page .mobile-fab-option-circle, html.device-experience-mobile .ledger-entries-page .mobile-fab-option-circle, html.device-experience-mobile .payment-terms-page .mobile-fab-option-circle, html.device-experience-mobile .scheduled-reports-page .mobile-fab-option-circle, html.device-experience-mobile .cfdi-documents-page .mobile-fab-option-circle, html.device-experience-mobile .cfdi-payroll-page .mobile-fab-option-circle, html.device-experience-mobile .exchange-rates-page .mobile-fab-option-circle, html.device-experience-mobile .cash-receipts-page .mobile-fab-option-circle, html.device-experience-mobile .expenses-page .mobile-fab-option-circle, html.device-experience-mobile .landed-cost-templates-page .mobile-fab-option-circle, html.device-experience-mobile .landed-cost-types-page .mobile-fab-option-circle, html.device-experience-mobile .landed-cost-vouchers-page .mobile-fab-option-circle, html.device-experience-mobile .payments-page .mobile-fab-option-circle, html.device-experience-mobile .view-cash-receipt-page .mobile-fab-option-circle, html.device-experience-mobile .landed-cost-voucher-edit-page .mobile-fab-option-circle, html.device-experience-mobile .bank-statements-page .mobile-fab-option-circle, html.device-experience-mobile .bank-transactions-page .mobile-fab-option-circle, html.device-experience-mobile .bank-statement-report-page .mobile-fab-option-circle, html.device-experience-mobile .banks-page .mobile-fab-option-circle, html.device-experience-mobile .journal-entry-edit-page .mobile-fab-option-circle, html.device-experience-mobile .bank-transaction-edit-page .mobile-fab-option-circle, html.device-experience-mobile .create-cash-receipt-page .mobile-fab-option-circle, html.device-experience-mobile .edit-cash-receipt-page .mobile-fab-option-circle, html.device-experience-mobile .payment-edit-page .mobile-fab-option-circle, html.device-experience-mobile .lcte2-page .mobile-fab-option-circle, html.device-experience-mobile .expense-edit-page .mobile-fab-option-circle, html.device-experience-mobile .finance-reports-page .mobile-fab-option-circle { position: relative; width: 44px; height: 44px; border-radius: 50%; background: var(--erp-surface); color: var(--erp-primary); display: flex; align-items: center; justify-content: center; font-size: 1.1rem; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2); flex-shrink: 0; } html.device-experience-mobile .finance-settings-page .mobile-fab-badge, html.device-experience-mobile .gl-account-edit-page .mobile-fab-badge, html.device-experience-mobile .payment-term-edit-page .mobile-fab-badge, html.device-experience-mobile .bank-edit-page .mobile-fab-badge, html.device-experience-mobile .bank-view-page .mobile-fab-badge, html.device-experience-mobile .exchange-rate-edit-page .mobile-fab-badge, html.device-experience-mobile .landed-cost-type-edit-page .mobile-fab-badge, html.device-experience-mobile .cash-flow-report-page .mobile-fab-badge, html.device-experience-mobile .journal-entries-page .mobile-fab-badge, html.device-experience-mobile .ledger-entries-page .mobile-fab-badge, html.device-experience-mobile .payment-terms-page .mobile-fab-badge, html.device-experience-mobile .scheduled-reports-page .mobile-fab-badge, html.device-experience-mobile .cfdi-documents-page .mobile-fab-badge, html.device-experience-mobile .cfdi-payroll-page .mobile-fab-badge, html.device-experience-mobile .exchange-rates-page .mobile-fab-badge, html.device-experience-mobile .cash-receipts-page .mobile-fab-badge, html.device-experience-mobile .expenses-page .mobile-fab-badge, html.device-experience-mobile .landed-cost-templates-page .mobile-fab-badge, html.device-experience-mobile .landed-cost-types-page .mobile-fab-badge, html.device-experience-mobile .landed-cost-vouchers-page .mobile-fab-badge, html.device-experience-mobile .payments-page .mobile-fab-badge, html.device-experience-mobile .view-cash-receipt-page .mobile-fab-badge, html.device-experience-mobile .landed-cost-voucher-edit-page .mobile-fab-badge, html.device-experience-mobile .bank-statements-page .mobile-fab-badge, html.device-experience-mobile .bank-transactions-page .mobile-fab-badge, html.device-experience-mobile .bank-statement-report-page .mobile-fab-badge, html.device-experience-mobile .banks-page .mobile-fab-badge, html.device-experience-mobile .journal-entry-edit-page .mobile-fab-badge, html.device-experience-mobile .bank-transaction-edit-page .mobile-fab-badge, html.device-experience-mobile .create-cash-receipt-page .mobile-fab-badge, html.device-experience-mobile .edit-cash-receipt-page .mobile-fab-badge, html.device-experience-mobile .payment-edit-page .mobile-fab-badge, html.device-experience-mobile .lcte2-page .mobile-fab-badge, html.device-experience-mobile .expense-edit-page .mobile-fab-badge, html.device-experience-mobile .finance-reports-page .mobile-fab-badge { position: absolute; top: -4px; right: -4px; display: inline-flex; align-items: center; justify-content: center; min-width: 1.1rem; height: 1.1rem; padding: 0 0.3rem; border-radius: 999px; background: var(--erp-danger); color: white; font-size: 0.65rem; font-weight: 700; } /* ── Reportes Financieros — /finance/reports (Reports.razor) ────────────── Corrección: las 5 tablas de estados financieros (Balanza, P&L, Balance General, Libro Mayor, Flujo de Efectivo) se dejaron deliberadamente SIN "erp-table-mobile-cards" - tienen jerarquía por indentación, filas colspan de encabezado de sección y filas de subtotal/total que se leerían peor como tarjetas apiladas que como tabla con scroll horizontal. Se mantienen tabulares en toda experiencia, pero necesitan 3 ajustes para funcionar bien en un iPad ancho (1024/1366px) con Device.IsMobileExperience=true: 1. Exportar Excel/PDF duplicado: de cada reporte generado solo se ocultaba por ANCHO (.export-buttons, @media max-width:768px, erp-mobile.css) - en un Tablet ancho aparecía A LA VEZ que las mismas acciones ya presentes en el FAB. Se agrega aquí el mismo ocultamiento pero gobernado por clase de dispositivo. El componente sigue montado (@ref="currentExportButtons" desde Reports.razor sigue funcionando para los botones del FAB). 2. Primera columna legible durante el scroll horizontal: se fija (position:sticky) para que no se pierda de vista al desplazarse para ver Debe/Haber/Monto. 3. El FAB flotante (56px + margen) puede tapar la última fila de un reporte largo (statement de cierre) al hacer scroll hasta el final - se reserva espacio inferior en la página. */ html.device-experience-mobile .finance-reports-page .export-buttons { display: none !important; } html.device-experience-mobile .finance-reports-page .erp-table-shell { overflow-x: auto; } html.device-experience-mobile .finance-reports-page .erp-table th:first-child, html.device-experience-mobile .finance-reports-page .erp-table td:first-child { position: sticky; left: 0; z-index: 1; background: var(--erp-surface); } html.device-experience-mobile .finance-reports-page .erp-table thead th:first-child { z-index: 2; } html.device-experience-mobile .finance-reports-page .erp-table tr.section-header td:first-child, html.device-experience-mobile .finance-reports-page .erp-table tr.fw-bold td:first-child { background: var(--erp-surface-subtle); } html.device-experience-mobile .finance-reports-page { padding-bottom: 6rem; } /* ── Flujo de Efectivo (standalone) — /finance/reports/cash-flow ── Mismo riesgo que finance-reports-page: el FAB flotante puede tapar la última fila (saldo de cierre) de un reporte largo. */ html.device-experience-mobile .cash-flow-report-page { padding-bottom: 6rem; } /* ── Lote Ventas/Compras/Clientes/Proveedores — FAB compartido con ámbito por página ─── 20 páginas migradas juntas en este lote: selectores de página agrupados por regla en vez de repetir el cuerpo completo 20 veces, mismo patrón que los lotes de Inventario y Finanzas/Bancos/CFDI/Reportes de arriba. El resto de la app (páginas con FAB fuera de estos tres lotes) sigue dependiendo del ancho vía erp-mobile.css. */ html.device-experience-mobile .orders-page .mobile-fab-container, html.device-experience-mobile .invoices-page .mobile-fab-container, html.device-experience-mobile .invoice-details-page .mobile-fab-container, html.device-experience-mobile .sales-returns-page .mobile-fab-container, html.device-experience-mobile .sales-return-details-page .mobile-fab-container, html.device-experience-mobile .quotes-page .mobile-fab-container, html.device-experience-mobile .quote-approvals-page .mobile-fab-container, html.device-experience-mobile .purchase-orders-page .mobile-fab-container, html.device-experience-mobile .po-details-page .mobile-fab-container, html.device-experience-mobile .purchase-requisitions-page .mobile-fab-container, html.device-experience-mobile .create-purchase-requisition-page .mobile-fab-container, html.device-experience-mobile .edit-purchase-requisition-page .mobile-fab-container, html.device-experience-mobile .pr-details-page .mobile-fab-container, html.device-experience-mobile .goods-receipts-page .mobile-fab-container, html.device-experience-mobile .gr-details-page .mobile-fab-container, html.device-experience-mobile .procurement-settings-page .mobile-fab-container, html.device-experience-mobile .customers-page .mobile-fab-container, html.device-experience-mobile .customer-groups-page .mobile-fab-container, html.device-experience-mobile .vendors-page .mobile-fab-container, html.device-experience-mobile .vendor-edit-page .mobile-fab-container, html.device-experience-mobile .customer-edit-page .mobile-fab-container, html.device-experience-mobile .customer-group-edit-page .mobile-fab-container, html.device-experience-mobile .sales-return-create-page .mobile-fab-container { display: flex; flex-direction: column; align-items: flex-end; position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 900; } html.device-experience-mobile .orders-page .mobile-fab-backdrop, html.device-experience-mobile .invoices-page .mobile-fab-backdrop, html.device-experience-mobile .invoice-details-page .mobile-fab-backdrop, html.device-experience-mobile .sales-returns-page .mobile-fab-backdrop, html.device-experience-mobile .sales-return-details-page .mobile-fab-backdrop, html.device-experience-mobile .quotes-page .mobile-fab-backdrop, html.device-experience-mobile .quote-approvals-page .mobile-fab-backdrop, html.device-experience-mobile .purchase-orders-page .mobile-fab-backdrop, html.device-experience-mobile .po-details-page .mobile-fab-backdrop, html.device-experience-mobile .purchase-requisitions-page .mobile-fab-backdrop, html.device-experience-mobile .create-purchase-requisition-page .mobile-fab-backdrop, html.device-experience-mobile .edit-purchase-requisition-page .mobile-fab-backdrop, html.device-experience-mobile .pr-details-page .mobile-fab-backdrop, html.device-experience-mobile .goods-receipts-page .mobile-fab-backdrop, html.device-experience-mobile .gr-details-page .mobile-fab-backdrop, html.device-experience-mobile .procurement-settings-page .mobile-fab-backdrop, html.device-experience-mobile .customers-page .mobile-fab-backdrop, html.device-experience-mobile .customer-groups-page .mobile-fab-backdrop, html.device-experience-mobile .vendors-page .mobile-fab-backdrop, html.device-experience-mobile .vendor-edit-page .mobile-fab-backdrop, html.device-experience-mobile .customer-edit-page .mobile-fab-backdrop, html.device-experience-mobile .customer-group-edit-page .mobile-fab-backdrop, html.device-experience-mobile .sales-return-create-page .mobile-fab-backdrop { position: fixed; inset: 0; z-index: -1; } html.device-experience-mobile .orders-page .mobile-fab-main, html.device-experience-mobile .invoices-page .mobile-fab-main, html.device-experience-mobile .invoice-details-page .mobile-fab-main, html.device-experience-mobile .sales-returns-page .mobile-fab-main, html.device-experience-mobile .sales-return-details-page .mobile-fab-main, html.device-experience-mobile .quotes-page .mobile-fab-main, html.device-experience-mobile .quote-approvals-page .mobile-fab-main, html.device-experience-mobile .purchase-orders-page .mobile-fab-main, html.device-experience-mobile .po-details-page .mobile-fab-main, html.device-experience-mobile .purchase-requisitions-page .mobile-fab-main, html.device-experience-mobile .create-purchase-requisition-page .mobile-fab-main, html.device-experience-mobile .edit-purchase-requisition-page .mobile-fab-main, html.device-experience-mobile .pr-details-page .mobile-fab-main, html.device-experience-mobile .goods-receipts-page .mobile-fab-main, html.device-experience-mobile .gr-details-page .mobile-fab-main, html.device-experience-mobile .procurement-settings-page .mobile-fab-main, html.device-experience-mobile .customers-page .mobile-fab-main, html.device-experience-mobile .customer-groups-page .mobile-fab-main, html.device-experience-mobile .vendors-page .mobile-fab-main, html.device-experience-mobile .vendor-edit-page .mobile-fab-main, html.device-experience-mobile .customer-edit-page .mobile-fab-main, html.device-experience-mobile .customer-group-edit-page .mobile-fab-main, html.device-experience-mobile .sales-return-create-page .mobile-fab-main { width: 56px; height: 56px; border-radius: 50%; border: none; background: var(--erp-primary); color: white; font-size: 1.4rem; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25); cursor: pointer; } html.device-experience-mobile .orders-page .mobile-fab-main:active, html.device-experience-mobile .invoices-page .mobile-fab-main:active, html.device-experience-mobile .invoice-details-page .mobile-fab-main:active, html.device-experience-mobile .sales-returns-page .mobile-fab-main:active, html.device-experience-mobile .sales-return-details-page .mobile-fab-main:active, html.device-experience-mobile .quotes-page .mobile-fab-main:active, html.device-experience-mobile .quote-approvals-page .mobile-fab-main:active, html.device-experience-mobile .purchase-orders-page .mobile-fab-main:active, html.device-experience-mobile .po-details-page .mobile-fab-main:active, html.device-experience-mobile .purchase-requisitions-page .mobile-fab-main:active, html.device-experience-mobile .create-purchase-requisition-page .mobile-fab-main:active, html.device-experience-mobile .edit-purchase-requisition-page .mobile-fab-main:active, html.device-experience-mobile .pr-details-page .mobile-fab-main:active, html.device-experience-mobile .goods-receipts-page .mobile-fab-main:active, html.device-experience-mobile .gr-details-page .mobile-fab-main:active, html.device-experience-mobile .procurement-settings-page .mobile-fab-main:active, html.device-experience-mobile .customers-page .mobile-fab-main:active, html.device-experience-mobile .customer-groups-page .mobile-fab-main:active, html.device-experience-mobile .vendors-page .mobile-fab-main:active, html.device-experience-mobile .vendor-edit-page .mobile-fab-main:active, html.device-experience-mobile .customer-edit-page .mobile-fab-main:active, html.device-experience-mobile .customer-group-edit-page .mobile-fab-main:active, html.device-experience-mobile .sales-return-create-page .mobile-fab-main:active { background: var(--erp-primary-hover); } html.device-experience-mobile .orders-page .mobile-fab-option, html.device-experience-mobile .invoices-page .mobile-fab-option, html.device-experience-mobile .invoice-details-page .mobile-fab-option, html.device-experience-mobile .sales-returns-page .mobile-fab-option, html.device-experience-mobile .sales-return-details-page .mobile-fab-option, html.device-experience-mobile .quotes-page .mobile-fab-option, html.device-experience-mobile .quote-approvals-page .mobile-fab-option, html.device-experience-mobile .purchase-orders-page .mobile-fab-option, html.device-experience-mobile .po-details-page .mobile-fab-option, html.device-experience-mobile .purchase-requisitions-page .mobile-fab-option, html.device-experience-mobile .create-purchase-requisition-page .mobile-fab-option, html.device-experience-mobile .edit-purchase-requisition-page .mobile-fab-option, html.device-experience-mobile .pr-details-page .mobile-fab-option, html.device-experience-mobile .goods-receipts-page .mobile-fab-option, html.device-experience-mobile .gr-details-page .mobile-fab-option, html.device-experience-mobile .procurement-settings-page .mobile-fab-option, html.device-experience-mobile .customers-page .mobile-fab-option, html.device-experience-mobile .customer-groups-page .mobile-fab-option, html.device-experience-mobile .vendors-page .mobile-fab-option, html.device-experience-mobile .vendor-edit-page .mobile-fab-option, html.device-experience-mobile .customer-edit-page .mobile-fab-option, html.device-experience-mobile .customer-group-edit-page .mobile-fab-option, html.device-experience-mobile .sales-return-create-page .mobile-fab-option { display: flex; align-items: center; gap: 0.75rem; background: none; border: none; padding: 0; margin-bottom: 0.9rem; cursor: pointer; } html.device-experience-mobile .orders-page .mobile-fab-option-label, html.device-experience-mobile .invoices-page .mobile-fab-option-label, html.device-experience-mobile .invoice-details-page .mobile-fab-option-label, html.device-experience-mobile .sales-returns-page .mobile-fab-option-label, html.device-experience-mobile .sales-return-details-page .mobile-fab-option-label, html.device-experience-mobile .quotes-page .mobile-fab-option-label, html.device-experience-mobile .quote-approvals-page .mobile-fab-option-label, html.device-experience-mobile .purchase-orders-page .mobile-fab-option-label, html.device-experience-mobile .po-details-page .mobile-fab-option-label, html.device-experience-mobile .purchase-requisitions-page .mobile-fab-option-label, html.device-experience-mobile .create-purchase-requisition-page .mobile-fab-option-label, html.device-experience-mobile .edit-purchase-requisition-page .mobile-fab-option-label, html.device-experience-mobile .pr-details-page .mobile-fab-option-label, html.device-experience-mobile .goods-receipts-page .mobile-fab-option-label, html.device-experience-mobile .gr-details-page .mobile-fab-option-label, html.device-experience-mobile .procurement-settings-page .mobile-fab-option-label, html.device-experience-mobile .customers-page .mobile-fab-option-label, html.device-experience-mobile .customer-groups-page .mobile-fab-option-label, html.device-experience-mobile .vendors-page .mobile-fab-option-label, html.device-experience-mobile .vendor-edit-page .mobile-fab-option-label, html.device-experience-mobile .customer-edit-page .mobile-fab-option-label, html.device-experience-mobile .customer-group-edit-page .mobile-fab-option-label, html.device-experience-mobile .sales-return-create-page .mobile-fab-option-label { background: var(--erp-surface); color: var(--erp-text-primary); font-size: 0.8rem; font-weight: 600; padding: 0.4rem 0.75rem; border-radius: 8px; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12); white-space: nowrap; } html.device-experience-mobile .orders-page .mobile-fab-option-circle, html.device-experience-mobile .invoices-page .mobile-fab-option-circle, html.device-experience-mobile .invoice-details-page .mobile-fab-option-circle, html.device-experience-mobile .sales-returns-page .mobile-fab-option-circle, html.device-experience-mobile .sales-return-details-page .mobile-fab-option-circle, html.device-experience-mobile .quotes-page .mobile-fab-option-circle, html.device-experience-mobile .quote-approvals-page .mobile-fab-option-circle, html.device-experience-mobile .purchase-orders-page .mobile-fab-option-circle, html.device-experience-mobile .po-details-page .mobile-fab-option-circle, html.device-experience-mobile .purchase-requisitions-page .mobile-fab-option-circle, html.device-experience-mobile .create-purchase-requisition-page .mobile-fab-option-circle, html.device-experience-mobile .edit-purchase-requisition-page .mobile-fab-option-circle, html.device-experience-mobile .pr-details-page .mobile-fab-option-circle, html.device-experience-mobile .goods-receipts-page .mobile-fab-option-circle, html.device-experience-mobile .gr-details-page .mobile-fab-option-circle, html.device-experience-mobile .procurement-settings-page .mobile-fab-option-circle, html.device-experience-mobile .customers-page .mobile-fab-option-circle, html.device-experience-mobile .customer-groups-page .mobile-fab-option-circle, html.device-experience-mobile .vendors-page .mobile-fab-option-circle, html.device-experience-mobile .vendor-edit-page .mobile-fab-option-circle, html.device-experience-mobile .customer-edit-page .mobile-fab-option-circle, html.device-experience-mobile .customer-group-edit-page .mobile-fab-option-circle, html.device-experience-mobile .sales-return-create-page .mobile-fab-option-circle { position: relative; width: 44px; height: 44px; border-radius: 50%; background: var(--erp-surface); color: var(--erp-primary); display: flex; align-items: center; justify-content: center; font-size: 1.1rem; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2); flex-shrink: 0; } html.device-experience-mobile .orders-page .mobile-fab-badge, html.device-experience-mobile .invoices-page .mobile-fab-badge, html.device-experience-mobile .invoice-details-page .mobile-fab-badge, html.device-experience-mobile .sales-returns-page .mobile-fab-badge, html.device-experience-mobile .sales-return-details-page .mobile-fab-badge, html.device-experience-mobile .quotes-page .mobile-fab-badge, html.device-experience-mobile .quote-approvals-page .mobile-fab-badge, html.device-experience-mobile .purchase-orders-page .mobile-fab-badge, html.device-experience-mobile .po-details-page .mobile-fab-badge, html.device-experience-mobile .purchase-requisitions-page .mobile-fab-badge, html.device-experience-mobile .create-purchase-requisition-page .mobile-fab-badge, html.device-experience-mobile .edit-purchase-requisition-page .mobile-fab-badge, html.device-experience-mobile .pr-details-page .mobile-fab-badge, html.device-experience-mobile .goods-receipts-page .mobile-fab-badge, html.device-experience-mobile .gr-details-page .mobile-fab-badge, html.device-experience-mobile .procurement-settings-page .mobile-fab-badge, html.device-experience-mobile .customers-page .mobile-fab-badge, html.device-experience-mobile .customer-groups-page .mobile-fab-badge, html.device-experience-mobile .vendors-page .mobile-fab-badge, html.device-experience-mobile .vendor-edit-page .mobile-fab-badge, html.device-experience-mobile .customer-edit-page .mobile-fab-badge, html.device-experience-mobile .customer-group-edit-page .mobile-fab-badge, html.device-experience-mobile .sales-return-create-page .mobile-fab-badge { position: absolute; top: -4px; right: -4px; display: inline-flex; align-items: center; justify-content: center; min-width: 1.1rem; height: 1.1rem; padding: 0 0.3rem; border-radius: 999px; background: var(--erp-danger); color: white; font-size: 0.65rem; font-weight: 700; } /* ── InvoiceDetails — el FAB flotante puede tapar la última línea de la factura o la sección de totales al llegar al final de una factura larga (muchos ítems). Se reserva espacio inferior en la página, mismo patrón que finance-reports-page/cash-flow-report-page. */ html.device-experience-mobile .invoice-details-page { padding-bottom: 6rem; } /* ── Lote CRM + Service Orders — FAB compartido con ámbito por página ─── 20 páginas migradas juntas en este lote: selectores de página agrupados por regla en vez de repetir el cuerpo completo 20 veces, mismo patrón que los lotes anteriores. service-project-detail-page/retainer-detail-page son las clases que ProjectDetail.razor/RetainerDetail.razor agregan solo en estado "detalle" (no "nuevo"), que es exactamente cuando su FAB existe en el DOM. */ html.device-experience-mobile .accounts-page .mobile-fab-container, html.device-experience-mobile .contacts-page .mobile-fab-container, html.device-experience-mobile .leads-page .mobile-fab-container, html.device-experience-mobile .sales-stages-container .mobile-fab-container, html.device-experience-mobile .opportunities-page .mobile-fab-container, html.device-experience-mobile .account-edit-page .mobile-fab-container, html.device-experience-mobile .contact-edit-page .mobile-fab-container, html.device-experience-mobile .lead-edit-page .mobile-fab-container, html.device-experience-mobile .opportunity-edit-page .mobile-fab-container, html.device-experience-mobile .employees-page .mobile-fab-container, html.device-experience-mobile .service-projects-page .mobile-fab-container, html.device-experience-mobile .retainer-agreements-page .mobile-fab-container, html.device-experience-mobile .retainer-reports-page .mobile-fab-container, html.device-experience-mobile .service-task-types-page .mobile-fab-container, html.device-experience-mobile .retainer-service-types-page .mobile-fab-container, html.device-experience-mobile .emp-edit-container .mobile-fab-container, html.device-experience-mobile .service-task-type-edit-page .mobile-fab-container, html.device-experience-mobile .retainer-service-type-edit-page .mobile-fab-container, html.device-experience-mobile .service-project-detail-page .mobile-fab-container, html.device-experience-mobile .retainer-detail-page .mobile-fab-container { display: flex; flex-direction: column; align-items: flex-end; position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 900; } html.device-experience-mobile .accounts-page .mobile-fab-backdrop, html.device-experience-mobile .contacts-page .mobile-fab-backdrop, html.device-experience-mobile .leads-page .mobile-fab-backdrop, html.device-experience-mobile .sales-stages-container .mobile-fab-backdrop, html.device-experience-mobile .opportunities-page .mobile-fab-backdrop, html.device-experience-mobile .account-edit-page .mobile-fab-backdrop, html.device-experience-mobile .contact-edit-page .mobile-fab-backdrop, html.device-experience-mobile .lead-edit-page .mobile-fab-backdrop, html.device-experience-mobile .opportunity-edit-page .mobile-fab-backdrop, html.device-experience-mobile .employees-page .mobile-fab-backdrop, html.device-experience-mobile .service-projects-page .mobile-fab-backdrop, html.device-experience-mobile .retainer-agreements-page .mobile-fab-backdrop, html.device-experience-mobile .retainer-reports-page .mobile-fab-backdrop, html.device-experience-mobile .service-task-types-page .mobile-fab-backdrop, html.device-experience-mobile .retainer-service-types-page .mobile-fab-backdrop, html.device-experience-mobile .emp-edit-container .mobile-fab-backdrop, html.device-experience-mobile .service-task-type-edit-page .mobile-fab-backdrop, html.device-experience-mobile .retainer-service-type-edit-page .mobile-fab-backdrop, html.device-experience-mobile .service-project-detail-page .mobile-fab-backdrop, html.device-experience-mobile .retainer-detail-page .mobile-fab-backdrop { position: fixed; inset: 0; z-index: -1; } html.device-experience-mobile .accounts-page .mobile-fab-main, html.device-experience-mobile .contacts-page .mobile-fab-main, html.device-experience-mobile .leads-page .mobile-fab-main, html.device-experience-mobile .sales-stages-container .mobile-fab-main, html.device-experience-mobile .opportunities-page .mobile-fab-main, html.device-experience-mobile .account-edit-page .mobile-fab-main, html.device-experience-mobile .contact-edit-page .mobile-fab-main, html.device-experience-mobile .lead-edit-page .mobile-fab-main, html.device-experience-mobile .opportunity-edit-page .mobile-fab-main, html.device-experience-mobile .employees-page .mobile-fab-main, html.device-experience-mobile .service-projects-page .mobile-fab-main, html.device-experience-mobile .retainer-agreements-page .mobile-fab-main, html.device-experience-mobile .retainer-reports-page .mobile-fab-main, html.device-experience-mobile .service-task-types-page .mobile-fab-main, html.device-experience-mobile .retainer-service-types-page .mobile-fab-main, html.device-experience-mobile .emp-edit-container .mobile-fab-main, html.device-experience-mobile .service-task-type-edit-page .mobile-fab-main, html.device-experience-mobile .retainer-service-type-edit-page .mobile-fab-main, html.device-experience-mobile .service-project-detail-page .mobile-fab-main, html.device-experience-mobile .retainer-detail-page .mobile-fab-main { width: 56px; height: 56px; border-radius: 50%; border: none; background: var(--erp-primary); color: white; font-size: 1.4rem; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25); cursor: pointer; } html.device-experience-mobile .accounts-page .mobile-fab-main:active, html.device-experience-mobile .contacts-page .mobile-fab-main:active, html.device-experience-mobile .leads-page .mobile-fab-main:active, html.device-experience-mobile .sales-stages-container .mobile-fab-main:active, html.device-experience-mobile .opportunities-page .mobile-fab-main:active, html.device-experience-mobile .account-edit-page .mobile-fab-main:active, html.device-experience-mobile .contact-edit-page .mobile-fab-main:active, html.device-experience-mobile .lead-edit-page .mobile-fab-main:active, html.device-experience-mobile .opportunity-edit-page .mobile-fab-main:active, html.device-experience-mobile .employees-page .mobile-fab-main:active, html.device-experience-mobile .service-projects-page .mobile-fab-main:active, html.device-experience-mobile .retainer-agreements-page .mobile-fab-main:active, html.device-experience-mobile .retainer-reports-page .mobile-fab-main:active, html.device-experience-mobile .service-task-types-page .mobile-fab-main:active, html.device-experience-mobile .retainer-service-types-page .mobile-fab-main:active, html.device-experience-mobile .emp-edit-container .mobile-fab-main:active, html.device-experience-mobile .service-task-type-edit-page .mobile-fab-main:active, html.device-experience-mobile .retainer-service-type-edit-page .mobile-fab-main:active, html.device-experience-mobile .service-project-detail-page .mobile-fab-main:active, html.device-experience-mobile .retainer-detail-page .mobile-fab-main:active { background: var(--erp-primary-hover); } html.device-experience-mobile .accounts-page .mobile-fab-option, html.device-experience-mobile .contacts-page .mobile-fab-option, html.device-experience-mobile .leads-page .mobile-fab-option, html.device-experience-mobile .sales-stages-container .mobile-fab-option, html.device-experience-mobile .opportunities-page .mobile-fab-option, html.device-experience-mobile .account-edit-page .mobile-fab-option, html.device-experience-mobile .contact-edit-page .mobile-fab-option, html.device-experience-mobile .lead-edit-page .mobile-fab-option, html.device-experience-mobile .opportunity-edit-page .mobile-fab-option, html.device-experience-mobile .employees-page .mobile-fab-option, html.device-experience-mobile .service-projects-page .mobile-fab-option, html.device-experience-mobile .retainer-agreements-page .mobile-fab-option, html.device-experience-mobile .retainer-reports-page .mobile-fab-option, html.device-experience-mobile .service-task-types-page .mobile-fab-option, html.device-experience-mobile .retainer-service-types-page .mobile-fab-option, html.device-experience-mobile .emp-edit-container .mobile-fab-option, html.device-experience-mobile .service-task-type-edit-page .mobile-fab-option, html.device-experience-mobile .retainer-service-type-edit-page .mobile-fab-option, html.device-experience-mobile .service-project-detail-page .mobile-fab-option, html.device-experience-mobile .retainer-detail-page .mobile-fab-option { display: flex; align-items: center; gap: 0.75rem; background: none; border: none; padding: 0; margin-bottom: 0.9rem; cursor: pointer; } html.device-experience-mobile .accounts-page .mobile-fab-option-label, html.device-experience-mobile .contacts-page .mobile-fab-option-label, html.device-experience-mobile .leads-page .mobile-fab-option-label, html.device-experience-mobile .sales-stages-container .mobile-fab-option-label, html.device-experience-mobile .opportunities-page .mobile-fab-option-label, html.device-experience-mobile .account-edit-page .mobile-fab-option-label, html.device-experience-mobile .contact-edit-page .mobile-fab-option-label, html.device-experience-mobile .lead-edit-page .mobile-fab-option-label, html.device-experience-mobile .opportunity-edit-page .mobile-fab-option-label, html.device-experience-mobile .employees-page .mobile-fab-option-label, html.device-experience-mobile .service-projects-page .mobile-fab-option-label, html.device-experience-mobile .retainer-agreements-page .mobile-fab-option-label, html.device-experience-mobile .retainer-reports-page .mobile-fab-option-label, html.device-experience-mobile .service-task-types-page .mobile-fab-option-label, html.device-experience-mobile .retainer-service-types-page .mobile-fab-option-label, html.device-experience-mobile .emp-edit-container .mobile-fab-option-label, html.device-experience-mobile .service-task-type-edit-page .mobile-fab-option-label, html.device-experience-mobile .retainer-service-type-edit-page .mobile-fab-option-label, html.device-experience-mobile .service-project-detail-page .mobile-fab-option-label, html.device-experience-mobile .retainer-detail-page .mobile-fab-option-label { background: var(--erp-surface); color: var(--erp-text-primary); font-size: 0.8rem; font-weight: 600; padding: 0.4rem 0.75rem; border-radius: 8px; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12); white-space: nowrap; } html.device-experience-mobile .accounts-page .mobile-fab-option-circle, html.device-experience-mobile .contacts-page .mobile-fab-option-circle, html.device-experience-mobile .leads-page .mobile-fab-option-circle, html.device-experience-mobile .sales-stages-container .mobile-fab-option-circle, html.device-experience-mobile .opportunities-page .mobile-fab-option-circle, html.device-experience-mobile .account-edit-page .mobile-fab-option-circle, html.device-experience-mobile .contact-edit-page .mobile-fab-option-circle, html.device-experience-mobile .lead-edit-page .mobile-fab-option-circle, html.device-experience-mobile .opportunity-edit-page .mobile-fab-option-circle, html.device-experience-mobile .employees-page .mobile-fab-option-circle, html.device-experience-mobile .service-projects-page .mobile-fab-option-circle, html.device-experience-mobile .retainer-agreements-page .mobile-fab-option-circle, html.device-experience-mobile .retainer-reports-page .mobile-fab-option-circle, html.device-experience-mobile .service-task-types-page .mobile-fab-option-circle, html.device-experience-mobile .retainer-service-types-page .mobile-fab-option-circle, html.device-experience-mobile .emp-edit-container .mobile-fab-option-circle, html.device-experience-mobile .service-task-type-edit-page .mobile-fab-option-circle, html.device-experience-mobile .retainer-service-type-edit-page .mobile-fab-option-circle, html.device-experience-mobile .service-project-detail-page .mobile-fab-option-circle, html.device-experience-mobile .retainer-detail-page .mobile-fab-option-circle { position: relative; width: 44px; height: 44px; border-radius: 50%; background: var(--erp-surface); color: var(--erp-primary); display: flex; align-items: center; justify-content: center; font-size: 1.1rem; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2); flex-shrink: 0; } html.device-experience-mobile .accounts-page .mobile-fab-badge, html.device-experience-mobile .contacts-page .mobile-fab-badge, html.device-experience-mobile .leads-page .mobile-fab-badge, html.device-experience-mobile .sales-stages-container .mobile-fab-badge, html.device-experience-mobile .opportunities-page .mobile-fab-badge, html.device-experience-mobile .account-edit-page .mobile-fab-badge, html.device-experience-mobile .contact-edit-page .mobile-fab-badge, html.device-experience-mobile .lead-edit-page .mobile-fab-badge, html.device-experience-mobile .opportunity-edit-page .mobile-fab-badge, html.device-experience-mobile .employees-page .mobile-fab-badge, html.device-experience-mobile .service-projects-page .mobile-fab-badge, html.device-experience-mobile .retainer-agreements-page .mobile-fab-badge, html.device-experience-mobile .retainer-reports-page .mobile-fab-badge, html.device-experience-mobile .service-task-types-page .mobile-fab-badge, html.device-experience-mobile .retainer-service-types-page .mobile-fab-badge, html.device-experience-mobile .emp-edit-container .mobile-fab-badge, html.device-experience-mobile .service-task-type-edit-page .mobile-fab-badge, html.device-experience-mobile .retainer-service-type-edit-page .mobile-fab-badge, html.device-experience-mobile .service-project-detail-page .mobile-fab-badge, html.device-experience-mobile .retainer-detail-page .mobile-fab-badge { position: absolute; top: -4px; right: -4px; display: inline-flex; align-items: center; justify-content: center; min-width: 1.1rem; height: 1.1rem; padding: 0 0.3rem; border-radius: 999px; background: var(--erp-danger); color: white; font-size: 0.65rem; font-weight: 700; } /* ── RetainerList — el FAB flotante llevaba un offset extra en la versión width-only (erp-mobile.css) para no tapar el bottom nav en algunos dispositivos con safe-area-inset-bottom. Se conserva ese ajuste aquí. */ html.device-experience-mobile .retainer-agreements-page .mobile-fab-container { bottom: calc(1.25rem + env(safe-area-inset-bottom)); } /* ── ProjectDetail / RetainerDetail — el FAB flotante puede tapar la última fila de una tabla larga (tareas, líneas de servicio, horas) al llegar al final de una pestaña con muchos registros. */ html.device-experience-mobile .service-project-detail-page, html.device-experience-mobile .retainer-detail-page { padding-bottom: 6rem; } /* ── Lote final Admin/Pricing/páginas varias — FAB compartido con ámbito por página ─── Último lote funcional de la migración: Admin, Pricing, más ~25 páginas huérfanas de módulos ya aprobados (Finanzas/Inventario/Compras) y Items/ItemEdit/AgentChat/AgentActionDetails/AgentPolicies. Mismo patrón de selectores agrupados que los lotes anteriores. Algunas páginas de este lote solo tenían la clase genérica ".erp-page" como raíz (compartida por decenas de páginas no migradas todavía) - se les agregó una clase propia (tax-rate-edit-page, tax-code-edit-page, currency-edit-page, agent-suggestion-edit-page, knowledge-base-edit-page, agent-policies-page) para poder darles ámbito aquí sin afectar el resto de páginas ".erp-page" que todavía dependen del ancho. Finance/BankReconciliation.razor fue excluida de este lote (pendiente de rediseño táctil, no migrada) - no tiene selector en este bloque. */ html.device-experience-mobile .admin-users-page .mobile-fab-container, html.device-experience-mobile .admin-user-edit-page .mobile-fab-container, html.device-experience-mobile .admin-roles-page .mobile-fab-container, html.device-experience-mobile .admin-role-edit-page .mobile-fab-container, html.device-experience-mobile .admin-tenants-page .mobile-fab-container, html.device-experience-mobile .admin-tenant-edit-page .mobile-fab-container, html.device-experience-mobile .admin-logging-page .mobile-fab-container, html.device-experience-mobile .price-lists-page .mobile-fab-container, html.device-experience-mobile .price-list-edit-page .mobile-fab-container, html.device-experience-mobile .cost-lists-page .mobile-fab-container, html.device-experience-mobile .cost-list-edit-page .mobile-fab-container, html.device-experience-mobile .tax-rates-page .mobile-fab-container, html.device-experience-mobile .tax-rate-edit-page .mobile-fab-container, html.device-experience-mobile .tax-codes-page .mobile-fab-container, html.device-experience-mobile .tax-code-edit-page .mobile-fab-container, html.device-experience-mobile .currencies-page .mobile-fab-container, html.device-experience-mobile .currency-edit-page .mobile-fab-container, html.device-experience-mobile .items-page .mobile-fab-container, html.device-experience-mobile .item-edit-page .mobile-fab-container, html.device-experience-mobile .ap-aging-page .mobile-fab-container, html.device-experience-mobile .ar-aging-page .mobile-fab-container, html.device-experience-mobile .agent-suggestions-page .mobile-fab-container, html.device-experience-mobile .agent-suggestion-edit-page .mobile-fab-container, html.device-experience-mobile .knowledge-base-page .mobile-fab-container, html.device-experience-mobile .knowledge-base-edit-page .mobile-fab-container, html.device-experience-mobile .price-assignments-page .mobile-fab-container, html.device-experience-mobile .price-assignment-edit-page .mobile-fab-container, html.device-experience-mobile .agent-policies-page .mobile-fab-container, html.device-experience-mobile .create-purchase-order-page .mobile-fab-container, html.device-experience-mobile .edit-purchase-order-page .mobile-fab-container, html.device-experience-mobile .create-goods-receipt-page .mobile-fab-container, html.device-experience-mobile .assembly-details-page .mobile-fab-container { display: flex; flex-direction: column; align-items: flex-end; position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 900; } html.device-experience-mobile .admin-users-page .mobile-fab-backdrop, html.device-experience-mobile .admin-user-edit-page .mobile-fab-backdrop, html.device-experience-mobile .admin-roles-page .mobile-fab-backdrop, html.device-experience-mobile .admin-role-edit-page .mobile-fab-backdrop, html.device-experience-mobile .admin-tenants-page .mobile-fab-backdrop, html.device-experience-mobile .admin-tenant-edit-page .mobile-fab-backdrop, html.device-experience-mobile .admin-logging-page .mobile-fab-backdrop, html.device-experience-mobile .price-lists-page .mobile-fab-backdrop, html.device-experience-mobile .price-list-edit-page .mobile-fab-backdrop, html.device-experience-mobile .cost-lists-page .mobile-fab-backdrop, html.device-experience-mobile .cost-list-edit-page .mobile-fab-backdrop, html.device-experience-mobile .tax-rates-page .mobile-fab-backdrop, html.device-experience-mobile .tax-rate-edit-page .mobile-fab-backdrop, html.device-experience-mobile .tax-codes-page .mobile-fab-backdrop, html.device-experience-mobile .tax-code-edit-page .mobile-fab-backdrop, html.device-experience-mobile .currencies-page .mobile-fab-backdrop, html.device-experience-mobile .currency-edit-page .mobile-fab-backdrop, html.device-experience-mobile .items-page .mobile-fab-backdrop, html.device-experience-mobile .item-edit-page .mobile-fab-backdrop, html.device-experience-mobile .ap-aging-page .mobile-fab-backdrop, html.device-experience-mobile .ar-aging-page .mobile-fab-backdrop, html.device-experience-mobile .agent-suggestions-page .mobile-fab-backdrop, html.device-experience-mobile .agent-suggestion-edit-page .mobile-fab-backdrop, html.device-experience-mobile .knowledge-base-page .mobile-fab-backdrop, html.device-experience-mobile .knowledge-base-edit-page .mobile-fab-backdrop, html.device-experience-mobile .price-assignments-page .mobile-fab-backdrop, html.device-experience-mobile .price-assignment-edit-page .mobile-fab-backdrop, html.device-experience-mobile .agent-policies-page .mobile-fab-backdrop, html.device-experience-mobile .create-purchase-order-page .mobile-fab-backdrop, html.device-experience-mobile .edit-purchase-order-page .mobile-fab-backdrop, html.device-experience-mobile .create-goods-receipt-page .mobile-fab-backdrop, html.device-experience-mobile .assembly-details-page .mobile-fab-backdrop { position: fixed; inset: 0; z-index: -1; } html.device-experience-mobile .admin-users-page .mobile-fab-main, html.device-experience-mobile .admin-user-edit-page .mobile-fab-main, html.device-experience-mobile .admin-roles-page .mobile-fab-main, html.device-experience-mobile .admin-role-edit-page .mobile-fab-main, html.device-experience-mobile .admin-tenants-page .mobile-fab-main, html.device-experience-mobile .admin-tenant-edit-page .mobile-fab-main, html.device-experience-mobile .admin-logging-page .mobile-fab-main, html.device-experience-mobile .price-lists-page .mobile-fab-main, html.device-experience-mobile .price-list-edit-page .mobile-fab-main, html.device-experience-mobile .cost-lists-page .mobile-fab-main, html.device-experience-mobile .cost-list-edit-page .mobile-fab-main, html.device-experience-mobile .tax-rates-page .mobile-fab-main, html.device-experience-mobile .tax-rate-edit-page .mobile-fab-main, html.device-experience-mobile .tax-codes-page .mobile-fab-main, html.device-experience-mobile .tax-code-edit-page .mobile-fab-main, html.device-experience-mobile .currencies-page .mobile-fab-main, html.device-experience-mobile .currency-edit-page .mobile-fab-main, html.device-experience-mobile .items-page .mobile-fab-main, html.device-experience-mobile .item-edit-page .mobile-fab-main, html.device-experience-mobile .ap-aging-page .mobile-fab-main, html.device-experience-mobile .ar-aging-page .mobile-fab-main, html.device-experience-mobile .agent-suggestions-page .mobile-fab-main, html.device-experience-mobile .agent-suggestion-edit-page .mobile-fab-main, html.device-experience-mobile .knowledge-base-page .mobile-fab-main, html.device-experience-mobile .knowledge-base-edit-page .mobile-fab-main, html.device-experience-mobile .price-assignments-page .mobile-fab-main, html.device-experience-mobile .price-assignment-edit-page .mobile-fab-main, html.device-experience-mobile .agent-policies-page .mobile-fab-main, html.device-experience-mobile .create-purchase-order-page .mobile-fab-main, html.device-experience-mobile .edit-purchase-order-page .mobile-fab-main, html.device-experience-mobile .create-goods-receipt-page .mobile-fab-main, html.device-experience-mobile .assembly-details-page .mobile-fab-main { width: 56px; height: 56px; border-radius: 50%; border: none; background: var(--erp-primary); color: white; font-size: 1.4rem; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25); cursor: pointer; } html.device-experience-mobile .admin-users-page .mobile-fab-main:active, html.device-experience-mobile .admin-user-edit-page .mobile-fab-main:active, html.device-experience-mobile .admin-roles-page .mobile-fab-main:active, html.device-experience-mobile .admin-role-edit-page .mobile-fab-main:active, html.device-experience-mobile .admin-tenants-page .mobile-fab-main:active, html.device-experience-mobile .admin-tenant-edit-page .mobile-fab-main:active, html.device-experience-mobile .admin-logging-page .mobile-fab-main:active, html.device-experience-mobile .price-lists-page .mobile-fab-main:active, html.device-experience-mobile .price-list-edit-page .mobile-fab-main:active, html.device-experience-mobile .cost-lists-page .mobile-fab-main:active, html.device-experience-mobile .cost-list-edit-page .mobile-fab-main:active, html.device-experience-mobile .tax-rates-page .mobile-fab-main:active, html.device-experience-mobile .tax-rate-edit-page .mobile-fab-main:active, html.device-experience-mobile .tax-codes-page .mobile-fab-main:active, html.device-experience-mobile .tax-code-edit-page .mobile-fab-main:active, html.device-experience-mobile .currencies-page .mobile-fab-main:active, html.device-experience-mobile .currency-edit-page .mobile-fab-main:active, html.device-experience-mobile .items-page .mobile-fab-main:active, html.device-experience-mobile .item-edit-page .mobile-fab-main:active, html.device-experience-mobile .ap-aging-page .mobile-fab-main:active, html.device-experience-mobile .ar-aging-page .mobile-fab-main:active, html.device-experience-mobile .agent-suggestions-page .mobile-fab-main:active, html.device-experience-mobile .agent-suggestion-edit-page .mobile-fab-main:active, html.device-experience-mobile .knowledge-base-page .mobile-fab-main:active, html.device-experience-mobile .knowledge-base-edit-page .mobile-fab-main:active, html.device-experience-mobile .price-assignments-page .mobile-fab-main:active, html.device-experience-mobile .price-assignment-edit-page .mobile-fab-main:active, html.device-experience-mobile .agent-policies-page .mobile-fab-main:active, html.device-experience-mobile .create-purchase-order-page .mobile-fab-main:active, html.device-experience-mobile .edit-purchase-order-page .mobile-fab-main:active, html.device-experience-mobile .create-goods-receipt-page .mobile-fab-main:active, html.device-experience-mobile .assembly-details-page .mobile-fab-main:active { background: var(--erp-primary-hover); } html.device-experience-mobile .admin-users-page .mobile-fab-option, html.device-experience-mobile .admin-user-edit-page .mobile-fab-option, html.device-experience-mobile .admin-roles-page .mobile-fab-option, html.device-experience-mobile .admin-role-edit-page .mobile-fab-option, html.device-experience-mobile .admin-tenants-page .mobile-fab-option, html.device-experience-mobile .admin-tenant-edit-page .mobile-fab-option, html.device-experience-mobile .admin-logging-page .mobile-fab-option, html.device-experience-mobile .price-lists-page .mobile-fab-option, html.device-experience-mobile .price-list-edit-page .mobile-fab-option, html.device-experience-mobile .cost-lists-page .mobile-fab-option, html.device-experience-mobile .cost-list-edit-page .mobile-fab-option, html.device-experience-mobile .tax-rates-page .mobile-fab-option, html.device-experience-mobile .tax-rate-edit-page .mobile-fab-option, html.device-experience-mobile .tax-codes-page .mobile-fab-option, html.device-experience-mobile .tax-code-edit-page .mobile-fab-option, html.device-experience-mobile .currencies-page .mobile-fab-option, html.device-experience-mobile .currency-edit-page .mobile-fab-option, html.device-experience-mobile .items-page .mobile-fab-option, html.device-experience-mobile .item-edit-page .mobile-fab-option, html.device-experience-mobile .ap-aging-page .mobile-fab-option, html.device-experience-mobile .ar-aging-page .mobile-fab-option, html.device-experience-mobile .agent-suggestions-page .mobile-fab-option, html.device-experience-mobile .agent-suggestion-edit-page .mobile-fab-option, html.device-experience-mobile .knowledge-base-page .mobile-fab-option, html.device-experience-mobile .knowledge-base-edit-page .mobile-fab-option, html.device-experience-mobile .price-assignments-page .mobile-fab-option, html.device-experience-mobile .price-assignment-edit-page .mobile-fab-option, html.device-experience-mobile .agent-policies-page .mobile-fab-option, html.device-experience-mobile .create-purchase-order-page .mobile-fab-option, html.device-experience-mobile .edit-purchase-order-page .mobile-fab-option, html.device-experience-mobile .create-goods-receipt-page .mobile-fab-option, html.device-experience-mobile .assembly-details-page .mobile-fab-option { display: flex; align-items: center; gap: 0.75rem; background: none; border: none; padding: 0; margin-bottom: 0.9rem; cursor: pointer; } html.device-experience-mobile .admin-users-page .mobile-fab-option-label, html.device-experience-mobile .admin-user-edit-page .mobile-fab-option-label, html.device-experience-mobile .admin-roles-page .mobile-fab-option-label, html.device-experience-mobile .admin-role-edit-page .mobile-fab-option-label, html.device-experience-mobile .admin-tenants-page .mobile-fab-option-label, html.device-experience-mobile .admin-tenant-edit-page .mobile-fab-option-label, html.device-experience-mobile .admin-logging-page .mobile-fab-option-label, html.device-experience-mobile .price-lists-page .mobile-fab-option-label, html.device-experience-mobile .price-list-edit-page .mobile-fab-option-label, html.device-experience-mobile .cost-lists-page .mobile-fab-option-label, html.device-experience-mobile .cost-list-edit-page .mobile-fab-option-label, html.device-experience-mobile .tax-rates-page .mobile-fab-option-label, html.device-experience-mobile .tax-rate-edit-page .mobile-fab-option-label, html.device-experience-mobile .tax-codes-page .mobile-fab-option-label, html.device-experience-mobile .tax-code-edit-page .mobile-fab-option-label, html.device-experience-mobile .currencies-page .mobile-fab-option-label, html.device-experience-mobile .currency-edit-page .mobile-fab-option-label, html.device-experience-mobile .items-page .mobile-fab-option-label, html.device-experience-mobile .item-edit-page .mobile-fab-option-label, html.device-experience-mobile .ap-aging-page .mobile-fab-option-label, html.device-experience-mobile .ar-aging-page .mobile-fab-option-label, html.device-experience-mobile .agent-suggestions-page .mobile-fab-option-label, html.device-experience-mobile .agent-suggestion-edit-page .mobile-fab-option-label, html.device-experience-mobile .knowledge-base-page .mobile-fab-option-label, html.device-experience-mobile .knowledge-base-edit-page .mobile-fab-option-label, html.device-experience-mobile .price-assignments-page .mobile-fab-option-label, html.device-experience-mobile .price-assignment-edit-page .mobile-fab-option-label, html.device-experience-mobile .agent-policies-page .mobile-fab-option-label, html.device-experience-mobile .create-purchase-order-page .mobile-fab-option-label, html.device-experience-mobile .edit-purchase-order-page .mobile-fab-option-label, html.device-experience-mobile .create-goods-receipt-page .mobile-fab-option-label, html.device-experience-mobile .assembly-details-page .mobile-fab-option-label { background: var(--erp-surface); color: var(--erp-text-primary); font-size: 0.8rem; font-weight: 600; padding: 0.4rem 0.75rem; border-radius: 8px; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12); white-space: nowrap; } html.device-experience-mobile .admin-users-page .mobile-fab-option-circle, html.device-experience-mobile .admin-user-edit-page .mobile-fab-option-circle, html.device-experience-mobile .admin-roles-page .mobile-fab-option-circle, html.device-experience-mobile .admin-role-edit-page .mobile-fab-option-circle, html.device-experience-mobile .admin-tenants-page .mobile-fab-option-circle, html.device-experience-mobile .admin-tenant-edit-page .mobile-fab-option-circle, html.device-experience-mobile .admin-logging-page .mobile-fab-option-circle, html.device-experience-mobile .price-lists-page .mobile-fab-option-circle, html.device-experience-mobile .price-list-edit-page .mobile-fab-option-circle, html.device-experience-mobile .cost-lists-page .mobile-fab-option-circle, html.device-experience-mobile .cost-list-edit-page .mobile-fab-option-circle, html.device-experience-mobile .tax-rates-page .mobile-fab-option-circle, html.device-experience-mobile .tax-rate-edit-page .mobile-fab-option-circle, html.device-experience-mobile .tax-codes-page .mobile-fab-option-circle, html.device-experience-mobile .tax-code-edit-page .mobile-fab-option-circle, html.device-experience-mobile .currencies-page .mobile-fab-option-circle, html.device-experience-mobile .currency-edit-page .mobile-fab-option-circle, html.device-experience-mobile .items-page .mobile-fab-option-circle, html.device-experience-mobile .item-edit-page .mobile-fab-option-circle, html.device-experience-mobile .ap-aging-page .mobile-fab-option-circle, html.device-experience-mobile .ar-aging-page .mobile-fab-option-circle, html.device-experience-mobile .agent-suggestions-page .mobile-fab-option-circle, html.device-experience-mobile .agent-suggestion-edit-page .mobile-fab-option-circle, html.device-experience-mobile .knowledge-base-page .mobile-fab-option-circle, html.device-experience-mobile .knowledge-base-edit-page .mobile-fab-option-circle, html.device-experience-mobile .price-assignments-page .mobile-fab-option-circle, html.device-experience-mobile .price-assignment-edit-page .mobile-fab-option-circle, html.device-experience-mobile .agent-policies-page .mobile-fab-option-circle, html.device-experience-mobile .create-purchase-order-page .mobile-fab-option-circle, html.device-experience-mobile .edit-purchase-order-page .mobile-fab-option-circle, html.device-experience-mobile .create-goods-receipt-page .mobile-fab-option-circle, html.device-experience-mobile .assembly-details-page .mobile-fab-option-circle { position: relative; width: 44px; height: 44px; border-radius: 50%; background: var(--erp-surface); color: var(--erp-primary); display: flex; align-items: center; justify-content: center; font-size: 1.1rem; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2); flex-shrink: 0; } html.device-experience-mobile .admin-users-page .mobile-fab-badge, html.device-experience-mobile .admin-user-edit-page .mobile-fab-badge, html.device-experience-mobile .admin-roles-page .mobile-fab-badge, html.device-experience-mobile .admin-role-edit-page .mobile-fab-badge, html.device-experience-mobile .admin-tenants-page .mobile-fab-badge, html.device-experience-mobile .admin-tenant-edit-page .mobile-fab-badge, html.device-experience-mobile .admin-logging-page .mobile-fab-badge, html.device-experience-mobile .price-lists-page .mobile-fab-badge, html.device-experience-mobile .price-list-edit-page .mobile-fab-badge, html.device-experience-mobile .cost-lists-page .mobile-fab-badge, html.device-experience-mobile .cost-list-edit-page .mobile-fab-badge, html.device-experience-mobile .tax-rates-page .mobile-fab-badge, html.device-experience-mobile .tax-rate-edit-page .mobile-fab-badge, html.device-experience-mobile .tax-codes-page .mobile-fab-badge, html.device-experience-mobile .tax-code-edit-page .mobile-fab-badge, html.device-experience-mobile .currencies-page .mobile-fab-badge, html.device-experience-mobile .currency-edit-page .mobile-fab-badge, html.device-experience-mobile .items-page .mobile-fab-badge, html.device-experience-mobile .item-edit-page .mobile-fab-badge, html.device-experience-mobile .ap-aging-page .mobile-fab-badge, html.device-experience-mobile .ar-aging-page .mobile-fab-badge, html.device-experience-mobile .agent-suggestions-page .mobile-fab-badge, html.device-experience-mobile .agent-suggestion-edit-page .mobile-fab-badge, html.device-experience-mobile .knowledge-base-page .mobile-fab-badge, html.device-experience-mobile .knowledge-base-edit-page .mobile-fab-badge, html.device-experience-mobile .price-assignments-page .mobile-fab-badge, html.device-experience-mobile .price-assignment-edit-page .mobile-fab-badge, html.device-experience-mobile .agent-policies-page .mobile-fab-badge, html.device-experience-mobile .create-purchase-order-page .mobile-fab-badge, html.device-experience-mobile .edit-purchase-order-page .mobile-fab-badge, html.device-experience-mobile .create-goods-receipt-page .mobile-fab-badge, html.device-experience-mobile .assembly-details-page .mobile-fab-badge, html.device-experience-mobile .tenant-signup-requests-page .mobile-fab-badge { position: absolute; top: -4px; right: -4px; display: inline-flex; align-items: center; justify-content: center; min-width: 1.1rem; height: 1.1rem; padding: 0 0.3rem; border-radius: 999px; background: var(--erp-danger); color: white; font-size: 0.65rem; font-weight: 700; } /* ── ItemEdit / TenantEdit / CostListEdit / PriceListEdit — el FAB flotante puede tapar la última fila de una tabla larga de líneas/asignaciones/tabs con mucho contenido al llegar al final de la página. */ html.device-experience-mobile .item-edit-page, html.device-experience-mobile .admin-tenant-edit-page, html.device-experience-mobile .cost-list-edit-page, html.device-experience-mobile .price-list-edit-page { padding-bottom: 6rem; } /* ── CFDI Nómina — Configuración por Tenant — /cfdi/payroll/settings (TenantPayrollCfdiSettings.razor) ── Página traída por el merge de main - conversión puntual a la hoja de estilos compartida (erp-design-system.css/erp-mobile.css) pedida por el usuario. Un solo botón "Guardar" + "Cancelar", FAB propio (no forma parte de ningún lote por ahora, así que va en su propio bloque con ámbito, no en las listas agrupadas de arriba). */ html.device-experience-mobile .payroll-settings-page .mobile-fab-container { display: flex; flex-direction: column; align-items: flex-end; position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 900; } html.device-experience-mobile .payroll-settings-page .mobile-fab-backdrop { position: fixed; inset: 0; z-index: -1; } html.device-experience-mobile .payroll-settings-page .mobile-fab-main { width: 56px; height: 56px; border-radius: 50%; border: none; background: var(--erp-primary); color: white; font-size: 1.4rem; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25); cursor: pointer; } html.device-experience-mobile .payroll-settings-page .mobile-fab-main:active { background: var(--erp-primary-hover); } html.device-experience-mobile .payroll-settings-page .mobile-fab-option { display: flex; align-items: center; gap: 0.75rem; background: none; border: none; padding: 0; margin-bottom: 0.9rem; cursor: pointer; } html.device-experience-mobile .payroll-settings-page .mobile-fab-option-label { background: var(--erp-surface); color: var(--erp-text-primary); font-size: 0.8rem; font-weight: 600; padding: 0.4rem 0.75rem; border-radius: 8px; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12); white-space: nowrap; } html.device-experience-mobile .payroll-settings-page .mobile-fab-option-circle { position: relative; width: 44px; height: 44px; border-radius: 50%; background: var(--erp-surface); color: var(--erp-primary); display: flex; align-items: center; justify-content: center; font-size: 1.1rem; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2); flex-shrink: 0; } html.device-experience-mobile .payroll-settings-page .mobile-fab-badge { position: absolute; top: -4px; right: -4px; display: inline-flex; align-items: center; justify-content: center; min-width: 1.1rem; height: 1.1rem; padding: 0 0.3rem; border-radius: 999px; background: var(--erp-danger); color: white; font-size: 0.65rem; font-weight: 700; }