document.addEventListener('DOMContentLoaded', (event) => {
  setTimeout(() => {

    // Get full slider class ID (change if you have changed it manually)
    const idComplete = document.querySelector(".tienda-hero__slider");
    // Obtaining the required object ID for the const mySlider
    const idSlider = idComplete.getAttribute('data-script-id');

    const mySlider = window.bricksData?.splideInstances[idSlider] || false

    // Please replace the button classes to suit your scenario
    const myPrevBtn = document.querySelector('.tienda-hero__arrow-left')
    const myNextBtn = document.querySelector('.tienda-hero__arrow-right')

    if (mySlider && myPrevBtn && myNextBtn) {

      // Add click event handlers for your custom buttons
      myPrevBtn.addEventListener('click', function () {
        mySlider.go('-1') // go() function by SplideJS
      })
      myNextBtn.addEventListener('click', function () {
        mySlider.go('+1') // go() function by SplideJS
      })
    }
  }, 250)
})