<?php

declare(strict_types=1);
/**
 * @var $block \Mirasvit\LayeredNavigation\Block\StickySidebar
 */
?>

<?php if ($block->isStickySidebar()): ?>

    <script>
        function initStickySidebar() {
            if (window.innerWidth < 748) {
                return;
            }

            const filtersOverflowOffset = 200;

            const sidebarMain = document.querySelector('.sidebar.sidebar-main');
            if (!sidebarMain) {
                return;
            }
            sidebarMain.classList.add("sticky", "top-0", "z-10", "bg-white",);

            const filterContent = sidebarMain.getElementsByClassName('filter-content')[0];

            if (!filterContent) {
                return;
            }

            filterContent.style.maxHeight = 'calc(90vh - ' + filtersOverflowOffset + 'px)';
        }

        document.addEventListener('DOMContentLoaded', function() {
            initStickySidebar();
        });
    </script>

    <style>
        .sidebar-main::-webkit-scrollbar {
            display: none;
        }
    </style>

<?php endif ?>
