// Scroll to Top
window.onscroll = function() {
  const expert_cleaning_button = document.querySelector('.scroll-top-box');
  if (expert_cleaning_button) {
    if (document.body.scrollTop > 100 || document.documentElement.scrollTop > 100) {
      expert_cleaning_button.style.display = "block";
    } else {
      expert_cleaning_button.style.display = "none";
    }
  }
};

const scrollTopLink = document.querySelector('.scroll-top-box a');
if (scrollTopLink) {
  scrollTopLink.onclick = function(event) {
    event.preventDefault();
    window.scrollTo({ top: 0, behavior: 'smooth' });
  };
}

// header sidebar Toggle
document.addEventListener("DOMContentLoaded", () => {
  const expert_cleaning_toggle = document.querySelector(".header-info-btn a"),
        expert_cleaning_info = document.querySelector(".header-info"),
        expert_cleaning_close = document.querySelector(".info-close-btn a");

  if (!expert_cleaning_toggle || !expert_cleaning_info) return;

  expert_cleaning_toggle.onclick = () => (expert_cleaning_info.classList.add("active"), document.body.classList.add("header-info-open"));
  expert_cleaning_close && (expert_cleaning_close.onclick = () => (expert_cleaning_info.classList.remove("active"), document.body.classList.remove("header-info-open")));

  document.addEventListener("click", e => {
    if (document.body.classList.contains("header-info-open") &&
        !expert_cleaning_info.contains(e.target) && !expert_cleaning_toggle.contains(e.target)) {
      expert_cleaning_info.classList.remove("active");
      document.body.classList.remove("header-info-open");
    }
  });
});

document.addEventListener("DOMContentLoaded", () => {
  const expert_cleaning_toggleBtn = document.querySelector(".header-info-btn a"); // open button
  const expert_cleaning_infoBox = document.querySelector(".header-info"); // info box
  const expert_cleaning_closeBtn = document.querySelector(".info-close-btn a"); // close button

  if (!expert_cleaning_toggleBtn || !expert_cleaning_infoBox || !expert_cleaning_closeBtn) return;

  // OPEN the info box
  expert_cleaning_toggleBtn.addEventListener("click", () => {
    expert_cleaning_infoBox.classList.add("active");
    document.body.classList.add("header-info-active");

    // Optional: move keyboard focus inside
    const firstFocusable = expert_cleaning_infoBox.querySelector(
      'a, button, input, textarea, select, [tabindex]:not([tabindex="-1"])'
    );
    if (firstFocusable) firstFocusable.focus();
  });

  // CLOSE the info box (when clicking the close icon)
  expert_cleaning_closeBtn.addEventListener("click", () => {
    expert_cleaning_infoBox.classList.remove("active");
    document.body.classList.remove("header-info-active");
    expert_cleaning_toggleBtn.focus(); // return focus to the button
  });

  // Trap focus inside when active
  document.addEventListener("keydown", (e) => {
    if (!expert_cleaning_infoBox.classList.contains("active")) return;

    const focusable = expert_cleaning_infoBox.querySelectorAll(
      'a, button, input, textarea, select, [tabindex]:not([tabindex="-1"])'
    );
    const first = focusable[0];
    const last = focusable[focusable.length - 1];

    if (e.key === "Tab") {
      if (e.shiftKey && document.activeElement === first) {
        e.preventDefault();
        last.focus();
      } else if (!e.shiftKey && document.activeElement === last) {
        e.preventDefault();
        first.focus();
      }
    }

    // ESC key also closes the box
    if (e.key === "Escape") {
      expert_cleaning_closeBtn.click();
    }
  });
});

// Slider with number pagination - Multiple Sliders Support
jQuery(document).ready(function ($) {
  var $sliders = $('.main-slider-sec .owl-carousel');

  if ($sliders.length > 0) {
    $sliders.each(function () {
      var $currentSlider = $(this);

      var owl = $currentSlider.owlCarousel({
        loop: true,
        items: 1,
        nav: true,
        dots: false,
        autoplay: false,
      });

      // Function to update slide numbers (Swiper-style: current / next)
      function expert_cleaning_updateSlideNumbers(event) {
        // Total real slides
        var total = event.item.count;

        // Owl gives cloned items in index, so normalize
        // event.item.index is 0-based, including clones
        var realIndex = (event.item.index - event.relatedTarget._clones.length / 2) % total;
        if (realIndex < 0) {
          realIndex = realIndex + total;
        }

        var current = realIndex + 1;                 // 1-based
        var next = (current % total) + 1;            // wrap like Swiper

        var currentSlide = ('0' + current).slice(-2);
        var nextSlide = ('0' + next).slice(-2);

        // Update ONLY this slider's pagination
        var $wrap = $currentSlider.closest('.main-slider-sec');
        $wrap.find('.current-number').text(currentSlide);
        $wrap.find('.next-number').text(nextSlide);

        // console.log('total:', total, 'current:', currentSlide, 'next:', nextSlide);
      }

      // Update on carousel initialization
      $currentSlider.on('initialized.owl.carousel', function (event) {
        expert_cleaning_updateSlideNumbers(event);
      });

      // Update when slide changes
      $currentSlider.on('changed.owl.carousel', function (event) {
        expert_cleaning_updateSlideNumbers(event);
      });

      // Click events for navigation using numbers
      $currentSlider.closest('.main-slider-sec').find('.next-number').on('click', function () {
        owl.trigger('next.owl.carousel');
      });

      $currentSlider.closest('.main-slider-sec').find('.current-number').on('click', function () {
        owl.trigger('to.owl.carousel', [0]);
      });
    });
  }
});

// services
jQuery(document).ready(function() {
  jQuery('.our-services .owl-carousel').owlCarousel({
    loop: true,
    margin: 30,
    nav: true,
    dots: true,
    rtl: false,
    responsive: {
    0: { 
      items: 1 
    },
    600: { 
      items: 2 
    },
    999: { 
      items: 3
    },
    1200: { 
      items: 3
    }
  },
    autoplay: false,
  });
});

// latest blog
jQuery(document).ready(function() {
  jQuery('.blog-section .owl-carousel').owlCarousel({
    loop: true,
    margin: 30,
    nav: false,
    dots: false,
    rtl: false,
    responsive: {
    0: { 
      items: 1 
    },
    600: { 
      items: 2 
    },
    1025: { 
      items: 3
    },
    1200: { 
      items: 3
    }
  },
    autoplay: false,
  });
});