/*
 * Mobile slider for [bep_featured_products].
 * Desktop and tablet keep the normal WooCommerce grid.
 */

.bep-mobile-slider-controls {
    display: none;
}

@media (max-width: 549px) {
    .bep-featured-products {
        position: relative;
        overflow: hidden;
    }

    .bep-featured-products .products {
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: stretch !important;
        gap: 12px !important;
        width: 100%;
        margin: 0 !important;
        padding: 2px 10px 10px !important;
        overflow-x: auto;
        overscroll-behavior-x: contain;
        scroll-behavior: smooth;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }

    .bep-featured-products .products::-webkit-scrollbar {
        display: none;
    }

    /*
     * Override Flatsome small-6 / mobile column widths:
     * one complete product card per slide.
     */
    .bep-featured-products .products > .product-small,
    .bep-featured-products .products > .product {
        display: block !important;
        flex: 0 0 calc(100% - 20px) !important;
        width: calc(100% - 20px) !important;
        min-width: calc(100% - 20px) !important;
        max-width: calc(100% - 20px) !important;
        margin: 0 !important;
        padding: 0 !important;
        scroll-snap-align: center;
        scroll-snap-stop: always;
    }

    .bep-featured-products .product-small > .col-inner {
        width: 100%;
        height: 100%;
    }

    .bep-featured-products .box-image {
        aspect-ratio: 4 / 3;
    }

    .bep-featured-products .box-image img {
        padding: 14px;
    }

    .bep-featured-products .box-text {
        padding: 16px !important;
    }

    .bep-featured-products .product-title {
        min-height: auto;
        font-size: 17px !important;
        line-height: 1.35;
    }

    .bep-featured-products .category {
        font-size: 11px;
    }

    .bep-featured-products .bep-loop-code,
    .bep-featured-products ul.bep-loop-specs > li {
        font-size: 12px !important;
    }

    .bep-featured-products ul.bep-loop-specs > li {
        grid-template-columns: minmax(88px, auto) minmax(0, 1fr);
    }

    .bep-featured-products .price,
    .bep-featured-products .price-wrapper .amount {
        font-size: 18px;
    }

    .bep-featured-products .bep-loop-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .bep-featured-products .bep-loop-actions > .bep-loop-button {
        min-height: 44px;
        font-size: 12px !important;
    }

    .bep-mobile-slider-controls {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 12px;
        margin-top: 12px;
    }

    .bep-mobile-slider-button {
        display: inline-flex;
        width: 38px;
        height: 38px;
        align-items: center;
        justify-content: center;
        margin: 0;
        padding: 0;
        border: 1px solid var(--bep-border);
        border-radius: 50%;
        color: var(--bep-primary);
        background: #fff;
        box-shadow: 0 5px 14px rgba(15, 50, 90, .09);
        cursor: pointer;
    }

    .bep-mobile-slider-button:disabled {
        opacity: .35;
        cursor: default;
    }

    .bep-mobile-slider-counter {
        min-width: 52px;
        color: var(--bep-muted);
        font-size: 12px;
        font-weight: 700;
        text-align: center;
    }
}
/* Cân lại card slider sản phẩm trên mobile */
@media (max-width: 549px) {
    .bep-featured-products .products {
        gap: 14px !important;
        padding: 4px 14px 12px !important;
        scroll-padding-inline: 14px;
    }

    .bep-featured-products .products > .product-small,
    .bep-featured-products .products > .product {
        flex: 0 0 calc(100% - 28px) !important;
        width: calc(100% - 28px) !important;
        min-width: calc(100% - 28px) !important;
        max-width: calc(100% - 28px) !important;
    }

    /* Giảm chiều cao vùng ảnh */
    .bep-featured-products .box-image {
        width: 100% !important;
        height: 220px !important;
        aspect-ratio: auto !important;
    }

    .bep-featured-products .box-image > div,
    .bep-featured-products .box-image .image-fade_in_back,
    .bep-featured-products .box-image .image-fade_in_back > a {
        width: 100% !important;
        height: 100% !important;
    }

    /* Phóng ảnh chính lớn hơn nhưng không cắt sản phẩm */
    .bep-featured-products .box-image .image-fade_in_back img:first-child {
        width: 100% !important;
        height: 100% !important;
        padding: 8px !important;
        object-fit: contain !important;
    }

    .bep-featured-products .box-text {
        padding: 14px 16px 16px !important;
    }

    .bep-featured-products .product-title {
        font-size: 17px !important;
        line-height: 1.35 !important;
    }
}