services.js

let slideIndex = 0;
showSlides();

function showSlides() {
  let i;
  let slides = document.getElementsByClassName("slides");
  let dots = document.getElementsByClassName("dot");

  for (i = 0; i < slides.length; i++) {
    slides[i].style.display = "none";  
  }
  slideIndex++;
  if (slideIndex > slides.length) {slideIndex = 1}    

  for (i = 0; i < dots.length; i++) {
    dots[i].className = dots[i].className.replace(" active", "");
  }

  slides[slideIndex-1].style.display = "block";  
  dots[slideIndex-1].className += " active";
  setTimeout(showSlides, 4000); // Change every 4 seconds
}


// Show the form
document.getElementById("bookBtn").addEventListener("click", function () {
  document.getElementById("appointmentForm").style.display = "block";
});

// Hide the form
document.getElementById("closeForm").addEventListener("click", function () {
  document.getElementById("appointmentForm").style.display = "none";
});

// Handle form submission
document.getElementById("serviceForm").addEventListener("submit", function (e) {
  e.preventDefault();

  const name = document.getElementById("fullName").value;
  const phone = document.getElementById("contactNo").value;
  const service = document.getElementById("serviceNeed").value;
  const address = document.getElementById("address").value;
  const issue = document.getElementById("issue").value;

  const whatsappNumber = "923001234567"; // <-- Change to your number
  const message = `New Appointment Request:%0A
  Name: ${name}%0A
  Phone: ${phone}%0A
  Service: ${service}%0A
  Address: ${address}%0A
  Issue: ${issue}`;

  window.open(`https://wa.me/${whatsappNumber}?text=${message}`, "_blank");
});