document.addEventListener('DOMContentLoaded', function() {
const slides = document.querySelector('.slides');
const totalSlides = slides.children.length;
let currentIndex = 0;
const btnPrev = document.querySelector('.slider-prev');
const btnNext = document.querySelector('.slider-next');
function updateSlidePosition() {
slides.style.transform = `translateX(-${currentIndex * 100}%)`;
}
btnNext.addEventListener('click', () => {
currentIndex = (currentIndex + 1) % totalSlides;
updateSlidePosition();
});
btnPrev.addEventListener('click', () => {
currentIndex = (currentIndex - 1 + totalSlides) % totalSlides;
updateSlidePosition();
});
// Optional: Auto slide (every 5 seconds)
setInterval(() => {
currentIndex = (currentIndex + 1) % totalSlides;
updateSlidePosition();
}, 5000);
});