var swiperTabNew1 = new Swiper(".mySwiperTabNew1", {
    slidesPerView: 1,
    spaceBetween: 10,
    centerInsufficientSlides: true,
    watchOverflow: true,
    // Responsive breakpoints
       breakpoints: {
      // when window width is >= 320px
      320: {
        slidesPerView: 1,
        spaceBetween: 24
      },
      370: {
        slidesPerView: 1.15,
        spaceBetween: 24
      },
      400: {
        slidesPerView: 1.4,
        spaceBetween: 24
      },
      // when window width is >= 480px
      480: {
        slidesPerView: 1.6,
        spaceBetween: 24
      },
      // when window width is >= 640px
      640: {
        slidesPerView: 2,
        spaceBetween: 24
      },
      800: {
        slidesPerView: 2.5,
        spaceBetween: 24
      },
      1000: {
        slidesPerView: 3,
        spaceBetween: 24
      },
      1200: {
        slidesPerView: 4,
        spaceBetween: 24
      }
    },
    pagination: {
      el: ".swiper-paginationTabNew",
      dynamicBullets: true,
      clickable: true,
    },
    navigation: {
        nextEl: ".swiper-button-nextTabNew1",
        prevEl: ".swiper-button-prevTabNew1",
    },
    
  });

  var swiperTabNew2 = new Swiper(".mySwiperTabNew2", {
    slidesPerView: 1,
    spaceBetween: 10,
    centerInsufficientSlides: true,
    watchOverflow: true,
    // Responsive breakpoints
    breakpoints: {
      // when window width is >= 320px
      320: {
        slidesPerView: 1,
        spaceBetween: 24
      },
      370: {
        slidesPerView: 1.15,
        spaceBetween: 24
      },
      400: {
        slidesPerView: 1.4,
        spaceBetween: 24
      },
      // when window width is >= 480px
      480: {
        slidesPerView: 1.6,
        spaceBetween: 24
      },
      // when window width is >= 640px
      640: {
        slidesPerView: 2,
        spaceBetween: 24
      },
      800: {
        slidesPerView: 2.5,
        spaceBetween: 24
      },
      1000: {
        slidesPerView: 3,
        spaceBetween: 24
      },
      1200: {
        slidesPerView: 4,
        spaceBetween: 24
      }
    },
    pagination: {
      el: ".swiper-paginationTabNew",
      dynamicBullets: true,
      clickable: true,
    },
    navigation: {
        nextEl: ".swiper-button-nextTabNew2",
        prevEl: ".swiper-button-prevTabNew2",
    },
    
  });


  var swiperTabNew3 = new Swiper(".mySwiperTabNew3", {
    slidesPerView: 1,
    spaceBetween: 10,
    centerInsufficientSlides: true,
    watchOverflow: true,
    // Responsive breakpoints
    breakpoints: {
      // when window width is >= 320px
      320: {
        slidesPerView: 1,
        spaceBetween: 24
      },
      370: {
        slidesPerView: 1.15,
        spaceBetween: 24
      },
      400: {
        slidesPerView: 1.4,
        spaceBetween: 24
      },
      // when window width is >= 480px
      480: {
        slidesPerView: 1.6,
        spaceBetween: 24
      },
      // when window width is >= 640px
      640: {
        slidesPerView: 2,
        spaceBetween: 24
      },
      800: {
        slidesPerView: 2.5,
        spaceBetween: 24
      },
      1000: {
        slidesPerView: 3,
        spaceBetween: 24
      },
      1200: {
        slidesPerView: 4,
        spaceBetween: 24
      }
    },
    pagination: {
      el: ".swiper-paginationTabNew",
      dynamicBullets: true,
      clickable: true,
    },
    navigation: {
        nextEl: ".swiper-button-nextTabNew3",
        prevEl: ".swiper-button-prevTabNew3",
    },
    
  });





  let tabArrayNew = document.querySelectorAll(".btnLlamaSwiper");
  let contenedorTabArray = document.querySelectorAll(".containerSwiperWraper");

  function desactivaTabs(nodoTab) {
    tabArrayNew.forEach(elementnodo => {
        if (elementnodo != nodoTab) {
            elementnodo.classList.remove("activoTab");
        }
    });

  }



  for (let contadorTab = 0; contadorTab < tabArrayNew.length; contadorTab++) {
    const nodoTab = tabArrayNew[contadorTab];

    
    
    nodoTab.addEventListener("click", ()=>{

        let numeroTab = nodoTab.getAttribute("data-btnTab");

        nodoTab.classList.add("activoTab");
        desactivaTabs(nodoTab);

        for (let contadorSwiper = 0; contadorSwiper < contenedorTabArray.length; contadorSwiper++) {
           
            const nodContainerSwiper = contenedorTabArray[contadorSwiper];
            let dataSetSwiper = nodContainerSwiper.getAttribute("data-numeroCSwiper");
            if (numeroTab === dataSetSwiper) {
                nodContainerSwiper.classList.add("activo");
            }else{
                nodContainerSwiper.classList.remove("activo");
            }
            
        }
    });
  }