(function () {
  // Ocultar toda la navegación inmediatamente al cargar el script
  const customNav = document.querySelector('.custom-nav');
  if (customNav) {
    customNav.style.visibility = 'hidden';
  }

  function initCustomNav() {
    const slider = window.bricksData?.splideInstances?.['brzkwj'];
    if (!slider) return;
    
    const customNav = document.querySelector('.custom-nav');
    const prevBtn   = document.querySelector('.custom-nav__button-prev');
    const nextBtn   = document.querySelector('.custom-nav__button-next');
    const counterEl = document.querySelector('.custom-nav__counter');
    
    if (!customNav || !prevBtn || !nextBtn || !counterEl) return;
    
    /* ---- Ocultar navegación si hay un solo slide ---- */
    function toggleNavVisibility() {
      if (slider.length <= 1) {
        customNav.style.visibility = 'hidden';
      } else {
        customNav.style.visibility = 'visible';
      }
    }
    
    /* ---- 1. Contador ---- */
    function updateCounter() {
      counterEl.textContent = `${slider.index + 1}/${slider.length}`;
    }
    
    // Función para inicializar todo una vez que el slider esté listo
    function initializeWhenReady() {
      updateCounter();
      // Primero mostrar la navegación
      customNav.style.visibility = 'visible';
      // Luego evaluar si debe ocultarse según el número de slides
      toggleNavVisibility();
    }
    
    // Usar solo el setTimeout con un delay suficiente
    setTimeout(initializeWhenReady, 800);
    
    // Eventos para actualizaciones posteriores
    slider.on('moved', updateCounter);
    
    /* ---- 2. Navegación ---- */
    prevBtn.addEventListener('click', () => slider.go('-1'));
    nextBtn.addEventListener('click', () => slider.go('+1'));
    
    /* ---- 3. Deshabilitar en no-loop (opcional) ---- */
    if (slider.options.type !== 'loop') {
      const toggleDisabled = () => {
        prevBtn.disabled = slider.index === 0;
        nextBtn.disabled = slider.index === slider.Components.Controller.getEnd();
      };
      toggleDisabled();
      slider.on('moved', toggleDisabled);
    }
    
    // Escuchar cambios en el número de slides (por si se agregan/quitan dinámicamente)
    slider.on('refresh', toggleNavVisibility);
  }
  
  document.addEventListener('bricks/splide:init', initCustomNav);
  document.addEventListener('DOMContentLoaded', () => setTimeout(initCustomNav, 500));
})();