.custom-css{margin-right:auto;margin-left:auto;width:630px;height:217px;background:#f1f5f6;border:1px solid #E5E8EC;border-radius:20px;display:flex;justify-content:center;align-items:center;text-align:center;padding:40px;font-weight:500;font-size:20px;line-height:30px}.product__text{font-weight:400;color:#333;font-size:14px;paddding-left:20px}html{scroll-behavior:smooth}.ai_gen_block_27314a1_LjxXfw,.ai_gen_block_27314a1_XhgtEY{position:relative;width:100%;overflow:hidden}.ai_gen_block_27314a1_LjxXfw .slider-container,.ai_gen_block_27314a1_XhgtEY .slider-container{display:flex;animation:autoScroll 20s linear infinite;width:100%}@keyframes autoScroll{0%{transform:translate(0)}to{transform:translate(-100%)}}.ai_gen_block_27314a1_LjxXfw .slider-container:hover,.ai_gen_block_27314a1_XhgtEY .slider-container:hover{animation-play-state:paused}.ai_gen_block_8f26425_C3w9fQ{position:relative;width:100%;max-width:800px;margin:0 auto;overflow:visible;border-radius:20px;padding-bottom:60px}.slider-wrapper{position:relative;width:100%;overflow:hidden;border-radius:20px}.slides-container{display:flex;transition:transform .6s cubic-bezier(.4,0,.2,1);width:100%}@media(min-width:1025px){document.addEventListener("DOMContentLoaded",function() {// Initialize slider for reviews block const initializeSlider = function() {const sliderContainer = document.querySelector(".ai_gen_block_8f26425_C3w9fQ"); if (!sliderContainer) return; // Get all review items (slides) const slides = sliderContainer.querySelectorAll(".custom-css"); if (slides.length <= 1) return; // No need for slider if only one slide let currentSlide = 0; const totalSlides = slides.length; // Create slider wrapper const wrapper = document.createElement("div"); wrapper.className = "slider-wrapper"; // Create slides container const slidesContainer = document.createElement("div"); slidesContainer.className = "slides-container"; // Move all slides into container slides.forEach((slide,index) => {slide.classList.add("slide"); if (index === 0) {slide.classList.add("active");} else {slide.classList.add("inactive");} slidesContainer.appendChild(slide);}); wrapper.appendChild(slidesContainer); sliderContainer.insertBefore(wrapper,sliderContainer.firstChild); // Create Previous Button const prevBtn = document.createElement("button"); prevBtn.className = "slider-nav-button slider-prev"; prevBtn.innerHTML = "\276e"; prevBtn.setAttribute("aria-label","Previous slide"); prevBtn.addEventListener("click",() => {currentSlide = (currentSlide - 1 + totalSlides) % totalSlides; updateSlider();}); sliderContainer.appendChild(prevBtn); // Create Next Button const nextBtn = document.createElement("button"); nextBtn.className = "slider-nav-button slider-next"; nextBtn.innerHTML = "\276f"; nextBtn.setAttribute("aria-label","Next slide"); nextBtn.addEventListener("click",() => {currentSlide = (currentSlide + 1) % totalSlides; updateSlider();}); sliderContainer.appendChild(nextBtn); // Create Dot Indicators const dotsContainer = document.createElement("div"); dotsContainer.className = "slider-dots"; for (let i = 0; i < totalSlides; i++) {const dot = document.createElement("button"); dot.className = "slider-dot"; if (i === 0) dot.classList.add("active"); dot.setAttribute("aria-label",`Go to slide ${i + 1}`); dot.addEventListener("click",() => {currentSlide = i; updateSlider();}); dotsContainer.appendChild(dot);} sliderContainer.appendChild(dotsContainer); // Update Slider Function function updateSlider() {// Update slides position const offset = -currentSlide * 100; slidesContainer.style.transform = `translateX(${offset}%)`; // Update slide classes slides.forEach((slide,index) => {slide.classList.remove("active","inactive"); if (index === currentSlide) {slide.classList.add("active");} else {slide.classList.add("inactive");}}); // Update dot indicators const dots = dotsContainer.querySelectorAll(".slider-dot"); dots.forEach((dot,index) => {dot.classList.toggle("active",index === currentSlide);});} // Optional: Auto-advance slides every 8 seconds setInterval(() => {currentSlide = (currentSlide + 1) % totalSlides; updateSlider();},8000);}; // Initialize on page load initializeSlider(); // Re-initialize if content is dynamically added const observer = new MutationObserver(() => {const sliderContainer = document.querySelector(".ai_gen_block_8f26425_C3w9fQ"); if (sliderContainer && !sliderContainer.querySelector(".slider-wrapper")) {initializeSlider();}}); observer.observe(document.body,{childList: true,subtree: true});})}@media(max-width:1024px){.custom-css{padding:10px}}@media(max-width:767px){.custom-css{padding:10px;width:100%;height:auto}.slider-nav-button{width:36px;height:36px;font-size:16px}.slider-prev{left:-30px}.slider-next{right:-30px}.slider-dots{bottom:5px;gap:6px}.slider-dot{width:10px;height:10px}}
/*# sourceMappingURL=/cdn/shop/t/3/assets/custom.css.map */
