let currentIndex = 0;

function showSlide(index) {
	const slider = document.querySelector('.slider');
	const slides = document.querySelectorAll('.slide');
	const slideWidth = slides[0].offsetWidth;

	currentIndex = index;

	slider.style.transform = `translateX(-${currentIndex * slideWidth}px)`;
}

function nextSlide() {
	const slides = document.querySelectorAll('.slide');
	if (currentIndex < slides.length - 1) {
		currentIndex++;
	} else {
		currentIndex = 0;
	}

	showSlide(currentIndex);
}

function prevSlide() {
	if (currentIndex > 0) {
		currentIndex--;
	} else {
		const slides = document.querySelectorAll('.slide');
		currentIndex = slides.length - 1;
	}

	showSlide(currentIndex);
}
function startAutoplay() {
	intervalId = setInterval(() => {
		nextSlide();
	}, 5000); // Change 2000 to the desired interval in milliseconds (e.g., 3000 for 3 seconds)
}

function stopAutoplay() {
	clearInterval(intervalId);
}

// Start autoplay when the page loads
startAutoplay();