<section class="products-slider-section" x-data="{ tabActive: 1 }">
    <div class="products-slider-section__head">
        <span class="products-slider-section__head__title">{{ productsSliderTitle }}</span>
        
        {% if productsSliderMoreHide != true %}
            <button class="products-slider-section__head__btn">
                <span class="products-slider-section__head__btn__label" data-desktop-text="Показать все"><i>Все</i></span>
                <svg class="products-slider-section__head__btn__icon"><use xlink:href="/sprite.svg#angle-right"></use></svg>
            </button>
        {% endif %}
        
        {% if productsSliderTabsVisible == true %}
            <div class="products-slider-section__head__tabs">
                {% for item in ["Для легковых", "Для грузовых"] %}
                    <button 
                        class="products-slider-section__head__tab-item" 
                        :class="{ active: tabActive === {{ loop.index }} }" 
                        @click.prevent="tabActive = {{ loop.index }}"
                    >{{ item }}</button>
                {% endfor %}
            </div>
        {% endif %}
    </div>

    <div class="products-slider-section__slider" data-products-slider x-show="tabActive === 1">
        <div class="swiper-slider">
            <div class="swiper-wrapper">
                {% for item in range(1, 2) %}
                    <div class="swiper-slide">
                        <div class="product-item">
                            <div class="product-item__photo-wrapper">
                                <img src="/images/products/p-1.png" alt="" srcset="/images/products/p-1@2x.png 2x" class="product-item__photo-img">
                                <div class="product-item__guarantee-label">
                                    <svg><use xlink:href="/sprite.svg#security"></use></svg>
                                    <span>12 мес</span>
                                </div>
                                <div class="product-item__control-labels">
                                    <button class="product-item__control-label" :class="{ 'active-heart': active }" x-data="{ active: false }" @click.prevent="active = !active">
                                        <svg><use x-bind:href="'/sprite.svg#' + (active ? 'heart-fill' : 'control-heart')"></use></svg>
                                    </button>
                                    <button class="product-item__control-label" :class="{ 'active-compare': active }" x-data="{ active: false }" @click.prevent="active = !active">
                                        <svg><use x-bind:href="'/sprite.svg#' + (active ? 'signal-fill' : 'control-signal')"></use></svg>
                                    </button>
                                </div>
                                <button class="product-item__preview-btn" data-product-popup-button="8d473b5f-efe0-4d89-bd0e-308ce68ca514">
                                    <svg><use xlink:href="/sprite.svg#eye"></use></svg>
                                    <span>Быстрый просмотр</span>
                                </button>
                            </div>
                            <div class="product-item__content">
                                <div class="product-item__main">
                                    <ul class="product-item__stat">
                                        <li class="product-item__stat__rate">
                                            <svg class="product-item__stat__rate__icon"><use xlink:href="/sprite.svg#product-star"></use></svg>
                                            <span class="product-item__stat__rate__num">4,9</span>
                                        </li>
                                        <li class="product-item__stat__status product-item__stat__status--green"><span>В наличии</span></li>
                                        <li class="product-item__stat__pr">Словения</li>
                                    </ul>
                                    <a href="" class="product-item__name">Delkor 75D23L 65Ач 550А, ОП, стандартные клеммы</a>
                                    <ul class="product-item__params">
                                        <li class="product-item__param-text product-item__param-text--fill">
                                            250х175х225 мм
                                        </li>
                                        <li class="product-item__param-acc">
                                            <svg class="product-item__param-acc__icon"><use xlink:href="/sprite.svg#battery-md"></use></svg>
                                            <span class="product-item__param-acc__text">75Ач</span>
                                        </li>
                                        <li class="product-item__param-text">
                                            Обратная полярность
                                        </li>
                                    </ul>
                                </div>
                                <button class="product-item__add-to-cart-btn" data-product-in-cart-popup-btn="22c849f8-8208-456a-8d6e-6f91eec3686a">
                                    <svg class="product-item__add-to-cart-btn__icon"><use xlink:href="/sprite.svg#cart"></use></svg>
                                    <span class="product-item__add-to-cart-btn__text">6 400 ₽</span>
                                </button>
                            </div>
                            <template data-product-popup="8d473b5f-efe0-4d89-bd0e-308ce68ca514">
                                {% include "product-popup.twig" %}
                            </template>
                            <template data-product-in-cart-popup="22c849f8-8208-456a-8d6e-6f91eec3686a">
                                {% include "product-in-cart-popup.twig" %}
                            </template>
                        </div>
                    </div>
                    <div class="swiper-slide">
                        <div class="product-item">
                            <div class="product-item__photo-wrapper">
                                <img src="/images/products/p-2.png" alt="" srcset="/images/products/p-2@2x.png 2x" class="product-item__photo-img">
                                <div class="product-item__guarantee-label">
                                    <svg><use xlink:href="/sprite.svg#security"></use></svg>
                                    <span>12 мес</span>
                                </div>
                                <div class="product-item__control-labels">
                                    <button class="product-item__control-label" :class="{ 'active-heart': active }" x-data="{ active: false }" @click.prevent="active = !active">
                                        <svg><use x-bind:href="'/sprite.svg#' + (active ? 'heart-fill' : 'control-heart')"></use></svg>
                                    </button>
                                    <button class="product-item__control-label" :class="{ 'active-compare': active }" x-data="{ active: false }" @click.prevent="active = !active">
                                        <svg><use x-bind:href="'/sprite.svg#' + (active ? 'signal-fill' : 'control-signal')"></use></svg>
                                    </button>
                                </div>
                                <div class="product-item__ntf-label">Установка бесплатно</div>
                                <button class="product-item__preview-btn" data-product-popup-button="8d473b5f-efe0-4d89-bd0e-308ce68ca514">
                                    <svg><use xlink:href="/sprite.svg#eye"></use></svg>
                                    <span>Быстрый просмотр</span>
                                </button>
                            </div>
                            <div class="product-item__content">
                                <div class="product-item__main">
                                    <ul class="product-item__stat">
                                        <li class="product-item__stat__rate">
                                            <svg class="product-item__stat__rate__icon"><use xlink:href="/sprite.svg#product-star"></use></svg>
                                            <span class="product-item__stat__rate__num">4,9</span>
                                        </li>
                                        <li class="product-item__stat__status product-item__stat__status--green"><span>В наличии</span></li>
                                        <li class="product-item__stat__pr">Словения</li>
                                    </ul>
                                    <a href="" class="product-item__name">Delkor 75D23L 65Ач 550А, ОП, стандартные клеммы</a>
                                    <ul class="product-item__params">
                                        <li class="product-item__param-text product-item__param-text--fill">
                                            250х175х225 мм
                                        </li>
                                        <li class="product-item__param-acc">
                                            <svg class="product-item__param-acc__icon"><use xlink:href="/sprite.svg#battery-md"></use></svg>
                                            <span class="product-item__param-acc__text">75Ач</span>
                                        </li>
                                        <li class="product-item__param-text">
                                            Обратная полярность
                                        </li>
                                    </ul>
                                </div>
                                <button class="product-item__add-to-cart-btn" data-product-in-cart-popup-btn="22c849f8-8208-456a-8d6e-6f91eec3686a">
                                    <svg class="product-item__add-to-cart-btn__icon"><use xlink:href="/sprite.svg#cart"></use></svg>
                                    <span class="product-item__add-to-cart-btn__text">6 400 ₽</span>
                                </button>
                            </div>
                            <template data-product-popup="8d473b5f-efe0-4d89-bd0e-308ce68ca514">
                                {% include "product-popup.twig" %}
                            </template>
                            <template data-product-in-cart-popup="22c849f8-8208-456a-8d6e-6f91eec3686a">
                                {% include "product-in-cart-popup.twig" %}
                            </template>
                        </div>
                    </div>
                    <div class="swiper-slide">
                        <div class="product-item">
                            <div class="product-item__photo-wrapper">
                                <img src="/images/products/p-3.png" alt="" srcset="/images/products/p-3@2x.png 2x" class="product-item__photo-img">
                                <div class="product-item__guarantee-label">
                                    <svg><use xlink:href="/sprite.svg#security"></use></svg>
                                    <span>12 мес</span>
                                </div>
                                <div class="product-item__control-labels">
                                    <button class="product-item__control-label" :class="{ 'active-heart': active }" x-data="{ active: false }" @click.prevent="active = !active">
                                        <svg><use x-bind:href="'/sprite.svg#' + (active ? 'heart-fill' : 'control-heart')"></use></svg>
                                    </button>
                                    <button class="product-item__control-label" :class="{ 'active-compare': active }" x-data="{ active: false }" @click.prevent="active = !active">
                                        <svg><use x-bind:href="'/sprite.svg#' + (active ? 'signal-fill' : 'control-signal')"></use></svg>
                                    </button>
                                </div>
                                <button class="product-item__preview-btn" data-product-popup-button="8d473b5f-efe0-4d89-bd0e-308ce68ca514">
                                    <svg><use xlink:href="/sprite.svg#eye"></use></svg>
                                    <span>Быстрый просмотр</span>
                                </button>
                            </div>
                            <div class="product-item__content">
                                <div class="product-item__main">
                                    <ul class="product-item__stat">
                                        <li class="product-item__stat__rate">
                                            <svg class="product-item__stat__rate__icon"><use xlink:href="/sprite.svg#product-star"></use></svg>
                                            <span class="product-item__stat__rate__num">4,9</span>
                                        </li>
                                        <li class="product-item__stat__status product-item__stat__status--gray"><span>Нет в наличии</span></li>
                                        <li class="product-item__stat__pr">Словения</li>
                                    </ul>
                                    <a href="" class="product-item__name">Delkor 75D23L 65Ач 550А, ОП, стандартные клеммы</a>
                                    <ul class="product-item__params">
                                        <li class="product-item__param-text product-item__param-text--fill">
                                            250х175х225 мм
                                        </li>
                                        <li class="product-item__param-acc">
                                            <svg class="product-item__param-acc__icon"><use xlink:href="/sprite.svg#battery-md"></use></svg>
                                            <span class="product-item__param-acc__text">75Ач</span>
                                        </li>
                                        <li class="product-item__param-text">
                                            Обратная полярность
                                        </li>
                                    </ul>
                                </div>
                                <button class="product-item__add-to-cart-btn product-item__add-to-cart-btn--gray" data-modal-btn="c5b89100-a594-4e4c-b7e2-9e2d822ff6f6">
                                    Уточнить наличие
                                    <template data-modal-idx="c5b89100-a594-4e4c-b7e2-9e2d822ff6f6">
                                        {% include "modals/help-akb.twig" %}
                                    </template>
                                </button>
                            </div>
                            <template data-product-popup="8d473b5f-efe0-4d89-bd0e-308ce68ca514">
                                {% include "product-popup.twig" %}
                            </template>
                        </div>
                    </div>
                    <div class="swiper-slide">
                        <div class="product-item">
                            <div class="product-item__photo-wrapper">
                                <img src="/images/products/p-4.png" alt="" srcset="/images/products/p-4@2x.png 2x" class="product-item__photo-img">
                                <div class="product-item__guarantee-label">
                                    <svg><use xlink:href="/sprite.svg#security"></use></svg>
                                    <span>12 мес</span>
                                </div>
                                <div class="product-item__control-labels">
                                    <button class="product-item__control-label" :class="{ 'active-heart': active }" x-data="{ active: false }" @click.prevent="active = !active">
                                        <svg><use x-bind:href="'/sprite.svg#' + (active ? 'heart-fill' : 'control-heart')"></use></svg>
                                    </button>
                                    <button class="product-item__control-label" :class="{ 'active-compare': active }" x-data="{ active: false }" @click.prevent="active = !active">
                                        <svg><use x-bind:href="'/sprite.svg#' + (active ? 'signal-fill' : 'control-signal')"></use></svg>
                                    </button>
                                </div>
                                <button class="product-item__preview-btn" data-product-popup-button="8d473b5f-efe0-4d89-bd0e-308ce68ca514">
                                    <svg><use xlink:href="/sprite.svg#eye"></use></svg>
                                    <span>Быстрый просмотр</span>
                                </button>
                            </div>
                            <div class="product-item__content">
                                <div class="product-item__main">
                                    <ul class="product-item__stat">
                                        <li class="product-item__stat__rate">
                                            <svg class="product-item__stat__rate__icon"><use xlink:href="/sprite.svg#product-star"></use></svg>
                                            <span class="product-item__stat__rate__num">4,9</span>
                                        </li>
                                        <li class="product-item__stat__status product-item__stat__status--green"><span>В наличии</span></li>
                                        <li class="product-item__stat__pr">Словения</li>
                                    </ul>
                                    <a href="" class="product-item__name">Delkor 75D23L 65Ач 550А, ОП, стандартные клеммы</a>
                                    <ul class="product-item__params">
                                        <li class="product-item__param-text product-item__param-text--fill">
                                            250х175х225 мм
                                        </li>
                                        <li class="product-item__param-acc">
                                            <svg class="product-item__param-acc__icon"><use xlink:href="/sprite.svg#battery-md"></use></svg>
                                            <span class="product-item__param-acc__text">75Ач</span>
                                        </li>
                                        <li class="product-item__param-text">
                                            Обратная полярность
                                        </li>
                                    </ul>
                                </div>
                                <button class="product-item__add-to-cart-btn" data-product-in-cart-popup-btn="22c849f8-8208-456a-8d6e-6f91eec3686a">
                                    <svg class="product-item__add-to-cart-btn__icon"><use xlink:href="/sprite.svg#cart"></use></svg>
                                    <span class="product-item__add-to-cart-btn__text">6 400 ₽</span>
                                </button>
                            </div>
                            <template data-product-popup="8d473b5f-efe0-4d89-bd0e-308ce68ca514">
                                {% include "product-popup.twig" %}
                            </template>
                            <template data-product-in-cart-popup="22c849f8-8208-456a-8d6e-6f91eec3686a">
                                {% include "product-in-cart-popup.twig" %}
                            </template>
                        </div>
                    </div>
                {% endfor %}
            </div>
        </div>
        <button class="slider-nav-btn slider-nav-btn--prev" data-slide-nav-btn-prev>
            <svg class="slider-nav-btn__icon"><use xlink:href="/sprite.svg#angle-right"></use></svg>
        </button>
        <button class="slider-nav-btn slider-nav-btn--next" data-slide-nav-btn-next>
            <svg class="slider-nav-btn__icon"><use xlink:href="/sprite.svg#angle-right"></use></svg>
        </button>
    </div>

    <div class="products-slider-section__slider" data-products-slider x-show="tabActive === 2">
        <div class="swiper-slider">
            <div class="swiper-wrapper">
                {% for item in range(1, 2) %}
                    <div class="swiper-slide">
                        <div class="product-item">
                            <div class="product-item__photo-wrapper">
                                <img src="/images/products/p-2.png" alt="" srcset="/images/products/p-2@2x.png 2x" class="product-item__photo-img">
                                <div class="product-item__guarantee-label">
                                    <svg><use xlink:href="/sprite.svg#security"></use></svg>
                                    <span>12 мес</span>
                                </div>
                                <div class="product-item__control-labels">
                                    <button class="product-item__control-label" :class="{ 'active-heart': active }" x-data="{ active: false }" @click.prevent="active = !active">
                                        <svg><use x-bind:href="'/sprite.svg#' + (active ? 'heart-fill' : 'control-heart')"></use></svg>
                                    </button>
                                    <button class="product-item__control-label" :class="{ 'active-compare': active }" x-data="{ active: false }" @click.prevent="active = !active">
                                        <svg><use x-bind:href="'/sprite.svg#' + (active ? 'signal-fill' : 'control-signal')"></use></svg>
                                    </button>
                                </div>
                                <div class="product-item__ntf-label">Установка бесплатно</div>
                                <button class="product-item__preview-btn" data-product-popup-button="8d473b5f-efe0-4d89-bd0e-308ce68ca514">
                                    <svg><use xlink:href="/sprite.svg#eye"></use></svg>
                                    <span>Быстрый просмотр</span>
                                </button>
                            </div>
                            <div class="product-item__content">
                                <div class="product-item__main">
                                    <ul class="product-item__stat">
                                        <li class="product-item__stat__rate">
                                            <svg class="product-item__stat__rate__icon"><use xlink:href="/sprite.svg#product-star"></use></svg>
                                            <span class="product-item__stat__rate__num">4,9</span>
                                        </li>
                                        <li class="product-item__stat__status product-item__stat__status--green"><span>В наличии</span></li>
                                        <li class="product-item__stat__pr">Словения</li>
                                    </ul>
                                    <a href="" class="product-item__name">Delkor 75D23L 65Ач 550А, ОП, стандартные клеммы</a>
                                    <ul class="product-item__params">
                                        <li class="product-item__param-text product-item__param-text--fill">
                                            250х175х225 мм
                                        </li>
                                        <li class="product-item__param-acc">
                                            <svg class="product-item__param-acc__icon"><use xlink:href="/sprite.svg#battery-md"></use></svg>
                                            <span class="product-item__param-acc__text">75Ач</span>
                                        </li>
                                        <li class="product-item__param-text">
                                            Обратная полярность
                                        </li>
                                    </ul>
                                </div>
                                <button class="product-item__add-to-cart-btn" data-product-in-cart-popup-btn="22c849f8-8208-456a-8d6e-6f91eec3686a">
                                    <svg class="product-item__add-to-cart-btn__icon"><use xlink:href="/sprite.svg#cart"></use></svg>
                                    <span class="product-item__add-to-cart-btn__text">6 400 ₽</span>
                                </button>
                            </div>
                            <template data-product-popup="8d473b5f-efe0-4d89-bd0e-308ce68ca514">
                                {% include "product-popup.twig" %}
                            </template>
                            <template data-product-in-cart-popup="22c849f8-8208-456a-8d6e-6f91eec3686a">
                                {% include "product-in-cart-popup.twig" %}
                            </template>
                        </div>
                    </div>
                    <div class="swiper-slide">
                        <div class="product-item">
                            <div class="product-item__photo-wrapper">
                                <img src="/images/products/p-1.png" alt="" srcset="/images/products/p-1@2x.png 2x" class="product-item__photo-img">
                                <div class="product-item__guarantee-label">
                                    <svg><use xlink:href="/sprite.svg#security"></use></svg>
                                    <span>12 мес</span>
                                </div>
                                <div class="product-item__control-labels">
                                    <button class="product-item__control-label" :class="{ 'active-heart': active }" x-data="{ active: false }" @click.prevent="active = !active">
                                        <svg><use x-bind:href="'/sprite.svg#' + (active ? 'heart-fill' : 'control-heart')"></use></svg>
                                    </button>
                                    <button class="product-item__control-label" :class="{ 'active-compare': active }" x-data="{ active: false }" @click.prevent="active = !active">
                                        <svg><use x-bind:href="'/sprite.svg#' + (active ? 'signal-fill' : 'control-signal')"></use></svg>
                                    </button>
                                </div>
                                <button class="product-item__preview-btn" data-product-popup-button="8d473b5f-efe0-4d89-bd0e-308ce68ca514">
                                    <svg><use xlink:href="/sprite.svg#eye"></use></svg>
                                    <span>Быстрый просмотр</span>
                                </button>
                            </div>
                            <div class="product-item__content">
                                <div class="product-item__main">
                                    <ul class="product-item__stat">
                                        <li class="product-item__stat__rate">
                                            <svg class="product-item__stat__rate__icon"><use xlink:href="/sprite.svg#product-star"></use></svg>
                                            <span class="product-item__stat__rate__num">4,9</span>
                                        </li>
                                        <li class="product-item__stat__status product-item__stat__status--green"><span>В наличии</span></li>
                                        <li class="product-item__stat__pr">Словения</li>
                                    </ul>
                                    <a href="" class="product-item__name">Delkor 75D23L 65Ач 550А, ОП, стандартные клеммы</a>
                                    <ul class="product-item__params">
                                        <li class="product-item__param-text product-item__param-text--fill">
                                            250х175х225 мм
                                        </li>
                                        <li class="product-item__param-acc">
                                            <svg class="product-item__param-acc__icon"><use xlink:href="/sprite.svg#battery-md"></use></svg>
                                            <span class="product-item__param-acc__text">75Ач</span>
                                        </li>
                                        <li class="product-item__param-text">
                                            Обратная полярность
                                        </li>
                                    </ul>
                                </div>
                                <button class="product-item__add-to-cart-btn" data-product-in-cart-popup-btn="22c849f8-8208-456a-8d6e-6f91eec3686a">
                                    <svg class="product-item__add-to-cart-btn__icon"><use xlink:href="/sprite.svg#cart"></use></svg>
                                    <span class="product-item__add-to-cart-btn__text">6 400 ₽</span>
                                </button>
                            </div>
                            <template data-product-popup="8d473b5f-efe0-4d89-bd0e-308ce68ca514">
                                {% include "product-popup.twig" %}
                            </template>
                            <template data-product-in-cart-popup="22c849f8-8208-456a-8d6e-6f91eec3686a">
                                {% include "product-in-cart-popup.twig" %}
                            </template>
                        </div>
                    </div>
                    <div class="swiper-slide">
                        <div class="product-item">
                            <div class="product-item__photo-wrapper">
                                <img src="/images/products/p-3.png" alt="" srcset="/images/products/p-3@2x.png 2x" class="product-item__photo-img">
                                <div class="product-item__guarantee-label">
                                    <svg><use xlink:href="/sprite.svg#security"></use></svg>
                                    <span>12 мес</span>
                                </div>
                                <div class="product-item__control-labels">
                                    <button class="product-item__control-label" :class="{ 'active-heart': active }" x-data="{ active: false }" @click.prevent="active = !active">
                                        <svg><use x-bind:href="'/sprite.svg#' + (active ? 'heart-fill' : 'control-heart')"></use></svg>
                                    </button>
                                    <button class="product-item__control-label" :class="{ 'active-compare': active }" x-data="{ active: false }" @click.prevent="active = !active">
                                        <svg><use x-bind:href="'/sprite.svg#' + (active ? 'signal-fill' : 'control-signal')"></use></svg>
                                    </button>
                                </div>
                                <button class="product-item__preview-btn" data-product-popup-button="8d473b5f-efe0-4d89-bd0e-308ce68ca514">
                                    <svg><use xlink:href="/sprite.svg#eye"></use></svg>
                                    <span>Быстрый просмотр</span>
                                </button>
                            </div>
                            <div class="product-item__content">
                                <div class="product-item__main">
                                    <ul class="product-item__stat">
                                        <li class="product-item__stat__rate">
                                            <svg class="product-item__stat__rate__icon"><use xlink:href="/sprite.svg#product-star"></use></svg>
                                            <span class="product-item__stat__rate__num">4,9</span>
                                        </li>
                                        <li class="product-item__stat__status product-item__stat__status--gray"><span>Нет в наличии</span></li>
                                        <li class="product-item__stat__pr">Словения</li>
                                    </ul>
                                    <a href="" class="product-item__name">Delkor 75D23L 65Ач 550А, ОП, стандартные клеммы</a>
                                    <ul class="product-item__params">
                                        <li class="product-item__param-text product-item__param-text--fill">
                                            250х175х225 мм
                                        </li>
                                        <li class="product-item__param-acc">
                                            <svg class="product-item__param-acc__icon"><use xlink:href="/sprite.svg#battery-md"></use></svg>
                                            <span class="product-item__param-acc__text">75Ач</span>
                                        </li>
                                        <li class="product-item__param-text">
                                            Обратная полярность
                                        </li>
                                    </ul>
                                </div>
                                <button class="product-item__add-to-cart-btn product-item__add-to-cart-btn--gray" data-modal-btn="c5b89100-a594-4e4c-b7e2-9e2d822ff6f6">
                                    Уточнить наличие
                                    <template data-modal-idx="c5b89100-a594-4e4c-b7e2-9e2d822ff6f6">
                                        {% include "modals/help-akb.twig" %}
                                    </template>
                                </button>
                            </div>
                            <template data-product-popup="8d473b5f-efe0-4d89-bd0e-308ce68ca514">
                                {% include "product-popup.twig" %}
                            </template>
                        </div>
                    </div>
                    <div class="swiper-slide">
                        <div class="product-item">
                            <div class="product-item__photo-wrapper">
                                <img src="/images/products/p-4.png" alt="" srcset="/images/products/p-4@2x.png 2x" class="product-item__photo-img">
                                <div class="product-item__guarantee-label">
                                    <svg><use xlink:href="/sprite.svg#security"></use></svg>
                                    <span>12 мес</span>
                                </div>
                                <div class="product-item__control-labels">
                                    <button class="product-item__control-label" :class="{ 'active-heart': active }" x-data="{ active: false }" @click.prevent="active = !active">
                                        <svg><use x-bind:href="'/sprite.svg#' + (active ? 'heart-fill' : 'control-heart')"></use></svg>
                                    </button>
                                    <button class="product-item__control-label" :class="{ 'active-compare': active }" x-data="{ active: false }" @click.prevent="active = !active">
                                        <svg><use x-bind:href="'/sprite.svg#' + (active ? 'signal-fill' : 'control-signal')"></use></svg>
                                    </button>
                                </div>
                                <button class="product-item__preview-btn" data-product-popup-button="8d473b5f-efe0-4d89-bd0e-308ce68ca514">
                                    <svg><use xlink:href="/sprite.svg#eye"></use></svg>
                                    <span>Быстрый просмотр</span>
                                </button>
                            </div>
                            <div class="product-item__content">
                                <div class="product-item__main">
                                    <ul class="product-item__stat">
                                        <li class="product-item__stat__rate">
                                            <svg class="product-item__stat__rate__icon"><use xlink:href="/sprite.svg#product-star"></use></svg>
                                            <span class="product-item__stat__rate__num">4,9</span>
                                        </li>
                                        <li class="product-item__stat__status product-item__stat__status--green"><span>В наличии</span></li>
                                        <li class="product-item__stat__pr">Словения</li>
                                    </ul>
                                    <a href="" class="product-item__name">Delkor 75D23L 65Ач 550А, ОП, стандартные клеммы</a>
                                    <ul class="product-item__params">
                                        <li class="product-item__param-text product-item__param-text--fill">
                                            250х175х225 мм
                                        </li>
                                        <li class="product-item__param-acc">
                                            <svg class="product-item__param-acc__icon"><use xlink:href="/sprite.svg#battery-md"></use></svg>
                                            <span class="product-item__param-acc__text">75Ач</span>
                                        </li>
                                        <li class="product-item__param-text">
                                            Обратная полярность
                                        </li>
                                    </ul>
                                </div>
                                <button class="product-item__add-to-cart-btn" data-product-in-cart-popup-btn="22c849f8-8208-456a-8d6e-6f91eec3686a">
                                    <svg class="product-item__add-to-cart-btn__icon"><use xlink:href="/sprite.svg#cart"></use></svg>
                                    <span class="product-item__add-to-cart-btn__text">6 400 ₽</span>
                                </button>
                            </div>
                            <template data-product-popup="8d473b5f-efe0-4d89-bd0e-308ce68ca514">
                                {% include "product-popup.twig" %}
                            </template>
                            <template data-product-in-cart-popup="22c849f8-8208-456a-8d6e-6f91eec3686a">
                                {% include "product-in-cart-popup.twig" %}
                            </template>
                        </div>
                    </div>
                {% endfor %}
            </div>
        </div>
        <button class="slider-nav-btn slider-nav-btn--prev" data-slide-nav-btn-prev>
            <svg class="slider-nav-btn__icon"><use xlink:href="/sprite.svg#angle-right"></use></svg>
        </button>
        <button class="slider-nav-btn slider-nav-btn--next" data-slide-nav-btn-next>
            <svg class="slider-nav-btn__icon"><use xlink:href="/sprite.svg#angle-right"></use></svg>
        </button>
    </div>
</section>