/**
 * Add-to-Cart Progress Bar Loader
 *
 * El fondo del botón se llena de izquierda a derecha con el color del theme.
 * Se aplica en loops de productos y página de producto individual.
 *
 * @package B2C
 */

/* =============================================================================
   HOVER LOCK - Mantener visible durante carga
   ============================================================================= */

.listing-product-container.b2c-adding .info-listing-product,
.listing-product-container.b2c-adding .add-to-container {
    opacity: 1 !important;
}

/* =============================================================================
   BOTÓN EN ESTADO DE CARGA
   ============================================================================= */

.b2c-atc-loading {
    position: relative;
    overflow: hidden;
    pointer-events: none;
    opacity: 1 !important;
    isolation: isolate;
    -webkit-mask-image: -webkit-radial-gradient(white, black);
}

.b2c-atc-loading::after {
    display: none !important;
}

/* Ocultar texto original del botón durante carga */
.b2c-atc-loading .b2c-atc-original-text {
    visibility: hidden;
}

/* =============================================================================
   FONDO DE PROGRESO (llena el botón de izquierda a derecha)
   ============================================================================= */

.b2c-atc-loader {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1;
}

.b2c-atc-progress {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 0;
    background: var(--e-global-color-secondary, #FF5FD2);
    transition: width 0.3s ease;
}

.b2c-atc-loader-text {
    position: relative;
    z-index: 2;
    font-size: inherit;
    font-weight: inherit;
    color: #fff;
}

/* =============================================================================
   ESTADO DE ÉXITO
   ============================================================================= */

.b2c-atc-added .b2c-atc-progress {
    background: var(--e-global-color-secondary, #FF5FD2);
}