
/*
GUÍA DE LECTURA DEL CÓDIGO | styles/storefront-load-state.css
Responsabilidad: Estilos de pantalla y estados de carga de la tienda.

Recorrido sugerido: estilos base; componentes; estados; variantes responsivas.
ATENCIÓN: el orden de las reglas forma parte de la cascada CSS y se mantuvo intacto.
Selectores para buscar: #storefrontLoadState, .header-main, .category-card, .product-detail-image, .product-stars

Seguridad: no se movió, eliminó ni reescribió ningún bloque ejecutable.
Este mapa orienta la lectura; el archivo mantiene su orden de ejecución original.
*/
/* El diseño público se revela solamente después de aplicar la configuración guardada. */
html.storefront-data-pending { overflow: hidden; }
html.storefront-data-pending body > :not(#storefrontLoadState),
html.storefront-data-pending body > :not(#storefrontLoadState) * {
    visibility: hidden !important;
    pointer-events: none !important;
}
#storefrontLoadState {
    position: fixed;
    inset: 0;
    z-index: 2147483647;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
    padding: 24px;
    background: #fff;
    color: #222;
    text-align: center;
    font: 16px/1.5 system-ui, sans-serif;
}
#storefrontLoadState[hidden], #storefrontLoadState button[hidden] { display: none !important; }
#storefrontLoadState button {
    padding: 10px 20px;
    border: 1px solid currentColor;
    border-radius: 6px;
    background: #fff;
    color: #222;
    cursor: pointer;
    font: inherit;
}
.header-main[data-header-logo-mode="none"] .logo { visibility: hidden !important; }
.category-card img[hidden], .product-image img[hidden],
.product-detail-image[hidden], #detailImage[hidden] { display: none !important; }
.product-stars[hidden] { display: none !important; }
