style gallery

assets/js/product-gallery.js

@@ -0,0 +1,31 @@
+// Initialize Swiper for product gallery
+document.addEventListener('DOMContentLoaded', function() {
+    const productGallery = document.querySelector('.product-gallery.swiper');
+
+    if (productGallery) {
+        const swiper = new Swiper('.product-gallery.swiper', {
+            // Enable loop if there are multiple slides
+            loop: true,
+
+            // Let CSS control the width
+            slidesPerView: 'auto',
+
+            // Navigation arrows
+            navigation: {
+                nextEl: '.swiper-button-next',
+                prevEl: '.swiper-button-prev',
+            },
+
+            // Pagination dots
+            pagination: {
+                el: '.swiper-pagination',
+                clickable: true,
+            },
+
+            // Keyboard navigation
+            keyboard: {
+                enabled: true,
+            }
+        });
+    }
+});