function isElementInHorizontalContainer(el, container) {
  if (el instanceof jQuery) el = el[0];
  if (container instanceof jQuery) container = container[0];

  if (!el || !container) return false;

  const elRect = el.getBoundingClientRect();
  const containerRect = container.getBoundingClientRect();

  return (
    elRect.left >= containerRect.left &&
    elRect.right <= containerRect.right
  );
}

$(document).ready(function () {
  $('.cards-slider').each(function (index, slider) {
    var $slider = $(slider);
    var $container = $slider.find('.swiper-container');
    var $nextBtn = $slider.find('.cards-slider__next-btn');
    var $prevBtn = $slider.find('.cards-slider__prev-btn');
    var $pagination = $slider.find('.swiper-pagination');

    // eslint-disable-next-line no-undef
    var swiper = new Swiper($container[0], {
      speed: 400,
      spaceBetween: 24,
      slidesPerView: 'auto',
      navigation: {
        nextEl: $nextBtn[0],
        prevEl: $prevBtn[0],
      },
      pagination: {
        el: $pagination[0],
        type: 'bullets',
        bulletClass: 'swiper-pagination-bullet',
        bulletActiveClass: 'swiper-pagination-bullet-active',
      },
      breakpoints: {
        767: {
          spaceBetween: 16,
        },
      },
    });

    function isXLScreen() {
      return 1200 <= (window.innerWidth || document.documentElement.clientWidth);
    }

    function isEverySlideVisible() {
      const visibleContainer = isXLScreen() ? $container : $slider.closest('.cards-slider-boundary');
      var $slides = $slider.find('.cards-swiper-wrapper .swiper-slide');
      return $slides.filter((index, slide) => isElementInHorizontalContainer($(slide), visibleContainer)).length === $slides.length;
    }

    function updateUI() {
      if (isEverySlideVisible()) {
        $slider.addClass('cards-slider--fits');
      } else {
        $slider.removeClass('cards-slider--fits');
      }
    }

    $(window).on('resize', _.debounce(function () {
      swiper.update();
      updateUI();
    }, 250));

    updateUI();
  });
});