html, body { margin: 0; font-family: 'Roboto', sans-serif; }

.app-loading {
    display: flex; align-items: center; justify-content: center;
    height: 100vh; font-size: 1.25rem; color: #1565c0;
}

/* Visible keyboard focus everywhere — POS is keyboard-driven (WCAG 2.4.7). */
:focus-visible { outline: 3px solid #1565c0; outline-offset: 2px; }

#blazor-error-ui {
    background: #b71c1c; color: #fff; bottom: 0; display: none;
    left: 0; padding: 0.75rem 1.25rem; position: fixed; width: 100%; z-index: 1000;
}
#blazor-error-ui .dismiss { cursor: pointer; position: absolute; right: 0.75rem; top: 0.5rem; }
#blazor-error-ui .reload { color: #fff; text-decoration: underline; }

/* Carrito del POS: tipografía más grande — la lee tanto el cajero como el cliente. */
.pos-cart .mud-table-cell { font-size: 1.15rem; }
.pos-cart .mud-table-row .mud-table-cell { padding-top: 12px; padding-bottom: 12px; }
.pos-cart .mud-table-head .mud-table-cell { font-weight: 600; }
.pos-cart .mud-table-cell strong { font-size: 1.3rem; }
.pos-cart .pos-cart-sku { font-size: .95rem; }
.pos-cart .mud-input input { font-size: 1.25rem; }
.pos-cart .mud-input .mud-input-root { max-width: 110px; }
.pos-cart-totals span { font-size: 1.15rem; }

/* Barra de atajos del POS. z-index 900: por debajo de #blazor-error-ui (1000) y de los diálogos de
   MudBlazor, que deben poder taparla. Usa las variables del tema para seguir el modo oscuro. */
.pos-hints {
    align-items: center; background: var(--mud-palette-surface); bottom: 0;
    border-top: 1px solid var(--mud-palette-lines-default); display: flex; flex-wrap: wrap;
    gap: 0 1.25rem; left: 0; padding: 6px 16px; position: fixed; width: 100%; z-index: 900;
}
.pos-hint { align-items: center; display: inline-flex; gap: 6px; }
.pos-hint-text { color: var(--mud-palette-text-secondary); font-size: .8rem; }
.pos-key {
    background: var(--mud-palette-background-gray); border: 1px solid var(--mud-palette-lines-default);
    border-bottom-width: 2px; border-radius: 4px; font-family: inherit; font-size: .75rem;
    font-weight: 600; line-height: 1; padding: 3px 6px; white-space: nowrap;
}
/* La barra es fixed: sin este colchón taparía el botón de vaciar carrito al final de la página. */
.pos-hints-spacer { height: 48px; }
/* Sin teclado físico la barra solo roba alto útil; y no tiene sentido en papel. */
@media (max-width: 959.98px) {
    .pos-hints { display: none; }
    .pos-hints-spacer { height: 0; }
}
@media print {
    .pos-hints { display: none; }
    .pos-hints-spacer { height: 0; }
}