/* ESR Infinite Scroll Auto for Bootstrap Starter */
.esr-infinite-scroll-status {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 2.85rem;
    margin: 1.05rem 0 0.55rem;
    color: var(--esr-purple, #502098);
    font-size: 0.9rem;
    font-weight: 850;
    line-height: 1.25;
    text-align: center;
}

.esr-infinite-scroll-sentinel {
    width: 100%;
    height: 1px;
}

.esr-is-loader {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    padding: 0.55rem 0.95rem;
    border: 1px solid rgba(255, 47, 159, 0.16);
    border-radius: 999px;
    background: linear-gradient(135deg, #ffffff 0%, #fff7fc 100%);
    color: var(--esr-purple, #502098);
    box-shadow: 0 0.5rem 1.5rem rgba(80, 32, 152, 0.13);
}

.esr-is-spinner {
    width: 1.2rem;
    height: 1.2rem;
    border: 0.16rem solid var(--esr-pink, currentColor);
    border-right-color: transparent;
    border-radius: 50%;
    animation: esr-is-spin 0.7s linear infinite;
}

.esr-is-pagination-hidden {
    display: none !important;
}

.esr-is-appended-product {
    animation: esr-is-product-enter 0.22s ease both;
}

.esr-infinite-scroll-top {
    position: fixed;
    right: max(1rem, env(safe-area-inset-right));
    bottom: max(1rem, env(safe-area-inset-bottom));
    z-index: 1045;
    width: 3rem;
    height: 3rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 999px;
    background: linear-gradient(180deg, #ff4eac 0%, #ee238f 100%);
    color: #ffffff;
    font-size: 1.05rem;
    box-shadow: 0 0.75rem 1.75rem rgba(80, 32, 152, 0.25);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(0.6rem) scale(0.96);
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
}

.esr-infinite-scroll-top.is-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0) scale(1);
}

.esr-infinite-scroll-top:focus-visible {
    outline: 0.18rem solid rgba(255, 255, 255, 0.95);
    outline-offset: 0.18rem;
}

@keyframes esr-is-spin {
    to {
        transform: rotate(360deg);
    }
}

@keyframes esr-is-product-enter {
    from {
        opacity: 0;
        transform: translateY(0.75rem);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@media (prefers-reduced-motion: reduce) {
    .esr-is-spinner,
    .esr-is-appended-product {
        animation: none;
    }

    .esr-infinite-scroll-top {
        transition: none;
    }
}

@media (max-width: 575.98px) {
    .esr-infinite-scroll-status {
        min-height: 2.4rem;
        margin: 0.8rem 0 0.55rem;
        font-size: 0.78rem;
    }

    .esr-is-loader {
        width: min(100%, 18rem);
        gap: 0.42rem;
        padding: 0.44rem 0.72rem;
        border-radius: 0.8rem;
        box-shadow: 0 0.42rem 1rem rgba(80, 32, 152, 0.1);
    }

    .esr-is-spinner {
        width: 1rem;
        height: 1rem;
        border-width: 0.13rem;
    }

    .esr-infinite-scroll-top {
        right: max(0.72rem, env(safe-area-inset-right));
        bottom: calc(0.72rem + env(safe-area-inset-bottom));
        width: 2.58rem;
        height: 2.58rem;
        font-size: 0.95rem;
        box-shadow: 0 0.55rem 1.3rem rgba(80, 32, 152, 0.2);
    }
}
