/**
 * Animación de carga de la marca (inc/theme/loader.php). La URL es relativa a este archivo.
 * Los botones (añadir al carrito, favoritos, comparar) conservan su indicador pequeño.
 */

:root { --sym-loader: url("../img/loader/sym-loader.webp"); }

/* 1. Zonas que WooCommerce/XStore bloquean al actualizar. */
:is(.woocommerce-cart-form, .cart_totals, .cart-order-details, .woocommerce-checkout-review-order-table, .woocommerce-checkout-payment, form.checkout, .woocommerce-shipping-calculator, .xstore-wishlist-form, .xstore-compare-form, .woocommerce-MyAccount-content, .widget_shopping_cart_content, .etheme-elementor-off-canvas__main) .blockOverlay::before,
.etheme-elementor-off-canvas.processing .etheme-elementor-off-canvas__main::before {
	width: var(--sym-loader-size, 92px) !important;
	height: var(--sym-loader-size, 92px) !important;
	top: calc(50% - var(--sym-loader-size, 92px) / 2) !important;
	left: calc(50% - var(--sym-loader-size, 92px) / 2) !important;
	right: auto !important;
	margin: 0 !important;
	border: 0 !important;
	/* El GIF original tiene fondo blanco (no transparente): se presenta en una tarjeta blanca. */
	border-radius: 20px !important;
	background: #fff var(--sym-loader) center / 86% no-repeat !important;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.14) !important;
	-webkit-animation: none !important;
	animation: none !important;
}

/* Zonas pequeñas (filas del total del pedido): mascota más chica. */
:is(.woocommerce-checkout-review-order-table, .cart_totals) .blockOverlay::before { --sym-loader-size: 72px; }

/* 2. Cargadores .et-loader de XStore (listados por AJAX, paneles, galería, página completa). */
.et-loader:not(:is(.add_to_cart_button, .single_add_to_cart_button, .show-quickly, .wishlist-fragment, .yith-wcwl-add-to-wishlist, .etheme-product-grid-item, .etheme-product-list-item) .et-loader) .loader-circular { visibility: hidden; }

.et-loader:not(:is(.add_to_cart_button, .single_add_to_cart_button, .show-quickly, .wishlist-fragment, .yith-wcwl-add-to-wishlist, .etheme-product-grid-item, .etheme-product-list-item) .et-loader):has(.loader-circular)::before {
	content: "";
	position: absolute;
	top: calc(50% - 46px);
	left: calc(50% - 46px);
	width: 92px;
	height: 92px;
	border-radius: 20px;
	background: #fff var(--sym-loader) center / 86% no-repeat;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.14);
	pointer-events: none;
}