// ================= Testimonial Slider =================
var testimonialSwiper = new Swiper(".testimonial-swiper", {
  slidesPerView: 1,
  spaceBetween: 24,
  loop: true, // slider loop on
  autoplay: {
    delay: 3500,
    disableOnInteraction: false,
  },
  pagination: {
    el: ".testimonial-pagination",
    clickable: true,
  },
});

document.addEventListener("DOMContentLoaded", function () {

  const features = {
    spark: [
      "99.9% Uptime SLA",
      "2 vCPU Cores",
      "4 GB RAM",
      "80 GB NVMe SSD",
      "Unlimited Bandwidth",
      "Free SSL Certificate",
      "Firewall Protection",
      "Basic DDoS Protection",
      "Weekly Backups",
      "7 Days Retention",
      "cPanel Control Panel",
      "PHP Versions Selector",
      "1 Site Migration",
      "24/7 Ticket Support",
      "Instant Deployment",
      "Auto Scaling (Not Included)",
      "Dedicated IP (Not Included)",
      "SSH Access (Not Included)",
      "Root Access (Not Included)",
      "API Access (Not Included)",
      "Staging (Not Included)",
      "Malware Scanning (Not Included)",
      "LiteSpeed (Not Included)",
      "HTTP/2 Support",
      "Uptime Monitoring",
      "Email Accounts Unlimited",
      "Free Domain (Yearly)",
      "Daily Security Scans",
      "Cloudflare Integration",
      "1 Free Website Builder",
      "WordPress Installer",
      "Redis Cache (Not Included)",
      "Custom OS (Not Included)",
      "Priority Support (Not Included)",
      "Dedicated Manager (Not Included)",
      "Global CDN (Optional)",
      "Multi Data Center (Optional)",
      "Custom Firewall Rules",
      "Spam Protection",
      "Webmail Access",
      "Unlimited Subdomains",
      "Unlimited Databases",
      "Unlimited FTP Accounts",
      "Resource Dashboard",
      "Automatic Updates",
      "Server Monitoring",
      "SSL Wildcard (Not Included)",
      "Cron Jobs Support",
      "High Performance Network"
    ],

    turbo: [
      "99.9% Uptime SLA",
      "4 vCPU Cores",
      "8 GB RAM",
      "160 GB NVMe SSD",
      "Unlimited Bandwidth",
      "Free SSL Certificate + Wildcard",
      "Firewall Protection",
      "Advanced DDoS Protection",
      "Daily Backups",
      "14 Days Retention",
      "cPanel Control Panel",
      "LiteSpeed Web Server",
      "PHP Versions Selector",
      "3 Sites Migration",
      "24/7 Ticket + Chat Support",
      "Instant Deployment",
      "Auto Scaling Included",
      "Dedicated IP (1)",
      "SSH Access Included",
      "Root Access (Not Included)",
      "API Access (Not Included)",
      "Staging Included",
      "Malware Scanning Included",
      "HTTP/2 & HTTP/3 Support",
      "Uptime Monitoring",
      "Email Accounts Unlimited",
      "Free Domain (Yearly)",
      "Daily Security Scans",
      "Cloudflare Integration",
      "2 Free Website Builder",
      "WordPress Installer",
      "Redis Cache Included",
      "Custom OS (Not Included)",
      "Priority Support (Not Included)",
      "Dedicated Manager (Not Included)",
      "Global CDN (Optional)",
      "Multi Data Center (Optional)",
      "Custom Firewall Rules",
      "Spam Protection",
      "Webmail Access",
      "Unlimited Subdomains",
      "Unlimited Databases",
      "Unlimited FTP Accounts",
      "Resource Dashboard",
      "Automatic Updates",
      "Server Monitoring",
      "SSL Wildcard (Not Included)",
      "Cron Jobs Support",
      "High Performance Network"
    ],

    titan: [
      "99.9% Uptime SLA",
      "16 vCPU Cores",
      "32 GB RAM",
      "640 GB NVMe SSD",
      "Unlimited Bandwidth",
      "Free SSL Certificate + Wildcard",
      "Firewall Protection",
      "Enterprise DDoS Protection",
      "Hourly Backups",
      "60 Days Retention",
      "cPanel Control Panel",
      "LiteSpeed Web Server",
      "PHP Versions Selector",
      "Unlimited Sites Migration",
      "Dedicated Manager",
      "Instant Deployment",
      "Auto Scaling Included",
      "Dedicated IP (4)",
      "SSH Access Included",
      "Root Access Included",
      "API Access Included",
      "Staging Included",
      "Malware Scanning Included",
      "HTTP/2 & HTTP/3 Support",
      "Uptime Monitoring",
      "Email Accounts Unlimited",
      "Free Domain (Yearly)",
      "Daily Security Scans",
      "Cloudflare Integration",
      "5 Free Website Builder",
      "WordPress Installer",
      "Redis Cache Included",
      "Custom OS Included",
      "Priority Support Included",
      "Global CDN (Optional)",
      "Multi Data Center (Optional)",
      "Custom Firewall Rules",
      "Spam Protection",
      "Webmail Access",
      "Unlimited Subdomains",
      "Unlimited Databases",
      "Unlimited FTP Accounts",
      "Resource Dashboard",
      "Automatic Updates",
      "Server Monitoring",
      "SSL Wildcard Included",
      "Cron Jobs Support",
      "High Performance Network"
    ]
  };

  // Modal HTML
  const modalHTML = `
    <div id="featuresModal" class="features-modal">
      <div class="features-modal-inner">
        <div class="features-modal-header">
          <h3 id="modalTitle">Features</h3>
          <button id="closeModal" class="modal-close">×</button>
        </div>
        <div id="modalBody" class="features-modal-body"></div>
      </div>
    </div>
  `;
  document.body.insertAdjacentHTML("beforeend", modalHTML);

  const modal = document.getElementById("featuresModal");
  const modalTitle = document.getElementById("modalTitle");
  const modalBody = document.getElementById("modalBody");
  const closeModal = document.getElementById("closeModal");

  document.querySelectorAll(".view-features").forEach(btn => {
    btn.addEventListener("click", function () {
      const plan = this.getAttribute("data-plan");
      const list = features[plan];

      modalTitle.innerText = `50+ Features - ${plan.toUpperCase()}`;
      modalBody.innerHTML = "";

      list.forEach(item => {
        const div = document.createElement("div");
        div.className = "feature-item";
        div.innerHTML = `<i class="fas fa-check-circle"></i><span>${item}</span>`;
        modalBody.appendChild(div);
      });

      modal.style.display = "flex";
    });
  });

  closeModal.addEventListener("click", () => {
    modal.style.display = "none";
  });

  window.addEventListener("click", (e) => {
    if (e.target === modal) {
      modal.style.display = "none";
    }
  });
});

