document.addEventListener("DOMContentLoaded", function () {
  // PRICING FUNCTIONALITY
  const pricingData = {
    logo: {
      basic: {
        plan: "Starter identity Package",
        price: "£39",
        features: [
          "2 Bespoke Logo Design Concepts",
          "1 Dedicated Creative Specialist",
          "3 Comprehensive Revisions",
          "Final Files (JPG & PNG)",
          "24-72 Hours Turnaround",
        ],
      },
      standard: {
        plan: "Professional Identity Package",
        price: "£59",
        features: [
          "3-4 Bespoke Logo Design Concepts",
          "2 Passionate Designers",
          "5-6 Comprehensive Revisions",
          "Final Files (JPG, PNG & PDF)",
          "24-72 Hours Turnaround",
        ],
      },
      premium: {
        plan: "Elite Identity Transformation",
        price: "£99",
        features: [
          "6 Unique Logo Design Concepts",
          "3 Senior Creative Specialists",
          "Unlimited Comprehensive Revisions",
          "Full Source Files (JPG, PNG, PDF, Ai/Psd)",
          "24-72 Hours Delivery",
        ],
      },
    },
    web: {
      basic: {
        plan: "Starter Web Package",
        price: "£149",
        features: [
          "1-3 Page Bespoke Website",
          "Powered by WordPress",
          "1 Bespoke Banner Design",
          "Interactive Hover Effects",
          "Contact & Enquiry Form",
          "3-4 Comprehensive Revisions",
          "Full Deployment Assistance",
          "100% Intellectual Property Ownership",
          "100% Satisfaction Guarantee",
          "✖ Professional Email",
          "✖ SSL Certificate",
        ],
      },
      standard: {
        plan: "Professional Web Package",
        price: "£349",
        features: [
          "4-5 Page Bespoke Website",
          "Powered by WordPress",
          "3 Dynamic Sliding Banners",
          "Interactive Hover Effects",
          "3 Professional Email Addresses",
          "Unlimited Comprehensive Revisions",
          "Contact & Enquiry Form",
          "Full Deployment Assistance",
          "Fully Responsive Design",
          "100% Intellectual Property Ownership",
          "100% Satisfaction Guarantee",
          "✖ SSL Certificate",
        ],
      },
      premium: {
        plan: "Elite Web Transformation",
        price: "£1299",
        features: [
          "10 page Bespoke Website",
          "Custom WordPress or PHP Development",
          "High-End Interactive & Dynamic Design",
          "10 Professional Stock Images",
          "10 Interactive Sliding Banners",
          "5 Professional Email Addresses",
          "Full Deployment Assistance",
          "Fully Responsive Design",
          "100% Intellectual Property Ownership",
          "100% Satisfaction Guarantee",
          "Full SSL Certificate",
        ],
      },
    },
    ecommerce: {
      basic: {
        plan: "Starter eCommerce Package",
        price: "£299",
        features: [
          "Bespoke eCommerce Configuration",
          "5 Product Uploads",
          "Secure Payment Gateway Integration",
          "Fully Mobile Responsive",
          "✖ Custom Functionality",
        ],
      },
      standard: {
        plan: "Professional eCommerce Package",
        price: "£599",
        features: [
          "Comprehensive eCommerce Solution",
          "Unlimited Product Catalogues",
          "Advanced SEO Optimisation",
          "Secure Payment Gateway Integration",
          "24/7 Dedicated Assistance",
        ],
      },
      premium: {
        plan: "Elite eCommerce Transformation",
        price: "£1499",
        features: [
          "Bespoke eCommerce Solutions",
          "Integrated Marketing Tools",
          "Full SEO Optimisation",
          "Bespoke Features & Functionality",
          "Priority Client Assistance",
        ],
      },
    },
    app: {
      basic: {
        plan: "Starter Application Package",
        price: "£499",
        features: [
          "Essential App UI/UX Design",
          "Interactive Prototype",
          "Android or iOS Platform",
          "Full Intellectual Property Rights",
          "✖ Advanced Functionality",
        ],
      },
      standard: {
        plan: "Professional Application Package",
        price: "£999",
        features: [
          "Comprehensive UI/UX Design",
          "Cross-platform Development",
          "Robust Backend Integration",
          "Advanced Features",
          "24/7 Dedicated Assistance",
        ],
      },
      premium: {
        plan: "Elite Bespoke App Transformation",
        price: "£1999",
        features: [
          "Bespoke Mobile Development",
          "AI & ML Integrations",
          "Rigorous End-to-End Testing",
          "Priority Client Assistance",
          "Continuous Maintenance",
        ],
      },
    },
    branding: {
      basic: {
        plan: "Starter Identity Package",
        price: "£149/",
        features: [
          "9 Bespoke Social Posts",
          "Social Media Strategy",
          "Account Configuration",
          "Monthly Performance Insights",
          "✖ 1 Video Reel (15-30 Seconds)",
          "✖ Bespoke Content Creation",
          "✖ Social Media Monitoring",
          "✖ Guaranteed Follower Growth",
        ],
      },
      standard: {
        plan: "Professional Identity Package",
        price: "£249/",
        features: [
          "9 Bespoke Social Posts",
          "Social Media Strategy",
          "Account Configuration",
          "Bespoke Content Creation",
          "Social Media Monitoring",
          "Monthly Performance Insights",
          "1 Video Reel (15-30 Seconds)",
          "✖ Guaranteed Follower Growth",
        ],
      },
      premium: {
        plan: "Elite Identity Transformation",
        price: "£399/",
        features: [
          "9 Bespoke Social Posts",
          "1 Video Reel (15-30 Seconds)",
          "Social Media Strategy",
          "Account Configuration",
          "Bespoke Content Creation",
          "Social Media Monitoring",
          "Guaranteed Follower Growth",
          "Monthly Performance Insights",
        ],
      },
    },
    smm: {
      basic: {
        plan: "Starter Social Package",
        price: "£99",
        features: [
          "2 Bespoke Social Media Posts",
          "Full Account Configuration",
          "Essential Engagement Tactics",
          "Full Intellectual Property Rights",
          "✖ Paid Advertising Management",
        ],
      },
      standard: {
        plan: "Professional Social Package",
        price: "£299",
        features: [
          "10 Bespoke Posts",
          "Proactive Community Management",
          "Strategic Hashtag Research",
          "Paid Advertising Strategy",
          "24/7 Dedicated Assistance",
        ],
      },
      premium: {
        plan: "Elite Social Transformation",
        price: "£799",
        features: [
          "Bespoke Content Production",
          "Advanced Audience Targeting",
          "Full Paid Ad Management",
          "Strategic Influencer Collaboration",
          "Priority Client Assistance",
        ],
      },
    },
    seo: {
      basic: {
        plan: "Starter SEO Package",
        price: "£79",
        features: [
          "Comprehensive SEO Audit",
          "Strategic Keyword Research",
          "On-Page SEO Optimisation",
          "Full Intellectual Property Rights",
          "✖ Off-Page SEO Strategies",
        ],
      },
      standard: {
        plan: "Professional SEO Package",
        price: "£199",
        features: [
          "Full Search Optimisation",
          "Technical SEO Enhancements",
          "Quality Link Building",
          "Content Excellence Strategy",
          "24/7 Dedicated Assistance",
        ],
      },
      premium: {
        plan: "Elite SEO Transformation",
        price: "£499",
        features: [
          "Enterprise-Level SEO",
          "In-depth Competitive Analysis",
          "AI-Enhanced SEO Strategies",
          "Continuous Optimisation",
          "Priority Client Assistance",
        ],
      },
    },
    video: {
      basic: {
        plan: "2D Animation <br>Essential",
        price: "£199",
        features: [
          "30-Second Duration",
          "Professional Scriptwriting",
          "Creative Storyboarding",
          "Bespoke Graphics",
          "Animation & SFX",
          "Full HD Resolution",
          "Professional Voiceover",
          "Synchronised Audio",
          "Unlimited Revisions",
          "Delivery within 2-3 Weeks",
        ],
      },
      standard: {
        plan: "2D Animation Professional",
        price: "£299",
        features: [
          "Up to 60-Second Duration",
          "Professional Scriptwriting",
          "Creative Storyboarding",
          "Bespoke Graphics",
          "Animation & SFX",
          "Full HD Resolution",
          "Professional Voiceover",
          "Synchronised Audio",
          "Unlimited Revisions",
          "Delivery within 3-4 Weeks",
        ],
      },
      premium: {
        plan: "2D Animation Supreme",
        price: "£999",
        features: [
          "Up to 120-Second Duration",
          "Professional Scriptwriting",
          "Creative Storyboarding",
          "Bespoke Graphics",
          "Animation & SFX",
          "Full HD Resolution",
          "Professional Voiceover",
          "Synchronised Audio",
          "Unlimited Revisions",
          "Delivery within 4-6 Weeks",
        ],
      },
    },
  };

  // Function to update pricing based on selected category
  function updatePricing(category) {
    const data = pricingData[category];
    if (!data) return;

    const priceElements = {
      basic: document.getElementById("basic-price"),
      standard: document.getElementById("standard-price"),
      premium: document.getElementById("premium-price"),
    };

    const planElements = {
      basic: document.getElementById("basic-plan"),
      standard: document.getElementById("standard-plan"),
      premium: document.getElementById("premium-plan"),
    };

    ["basic", "standard", "premium"].forEach((type) => {
      if (priceElements[type]) {
        priceElements[type].innerHTML =
          category === "branding"
            ? `${data[type].price} <span class="per-month">Month</span>`
            : data[type].price;
      }

      if (planElements[type]) {
        planElements[type].innerHTML = data[type].plan;
      }

      updateFeatures(`${type}-features`, data[type].features);
    });
  }

  function updateFeatures(elementId, features) {
    const ul = document.getElementById(elementId);
    if (!ul) return;

    ul.innerHTML = "";
    features.forEach((feature) => {
      const li = document.createElement("li");
      li.className = "mb-3 d-flex align-items-start gap-2";

      if (feature.includes("✖")) {
        li.classList.add("not-included", "text-muted", "opacity-50");
        li.innerHTML = `<i class="fas fa-times-circle mt-1 text-danger"></i> <span>${feature.replace("✖", "").trim()}</span>`;
      } else {
        li.classList.add("included");
        li.innerHTML = `<i class="fas fa-check-circle mt-1 text-primary"></i> <span>${feature.replace("✔", "").trim()}</span>`;
      }
      ul.appendChild(li);
    });
  }

  document.querySelectorAll(".tab").forEach((tab) => {
    tab.addEventListener("click", function () {
      document.querySelectorAll(".tab").forEach((t) => t.classList.remove("active"));
      this.classList.add("active");
      updatePricing(this.dataset.category);
    });
  });

  const bodyClass =
    document.body.classList.contains("web-pricing-tab")
      ? "web"
      : document.body.classList.contains("brand-pricing-tab")
        ? "branding"
        : document.body.classList.contains("smm-pricing-tab")
          ? "smm"
          : document.body.classList.contains("seo-pricing-tab")
            ? "seo"
            : document.body.classList.contains("app-pricing-tab")
              ? "app"
              : document.body.classList.contains("ecom-pricing-tab")
                ? "ecommerce"
                : "logo";

  updatePricing(bodyClass);

  // SHOWCASE FILTER
  const filterButtons = document.querySelectorAll(".showcase-filter-menu button");
  const showcaseCards = document.querySelectorAll(".showcase-card");
  const learnMoreButton = document.querySelector(".showcase-learn-more");

  if (filterButtons.length && showcaseCards.length && learnMoreButton) {
    let activeFilter = "all";
    let visibleCount = 6;

    function updateVisibleCards() {
      let shown = 0;
      showcaseCards.forEach((card) => {
        const categoryEl = card.querySelector(".showcase-category");
        if (!categoryEl) return;
        const category = categoryEl.textContent.trim().toLowerCase();
        const matchesFilter = activeFilter === "all" || category.includes(activeFilter);
        if (matchesFilter && shown < visibleCount) {
          card.style.display = "block";
          shown++;
        } else {
          card.style.display = "none";
        }
      });

      const totalMatching = Array.from(showcaseCards).filter((card) => {
        const categoryEl = card.querySelector(".showcase-category");
        if (!categoryEl) return false;
        const category = categoryEl.textContent.trim().toLowerCase();
        return activeFilter === "all" || category.includes(activeFilter);
      }).length;

      learnMoreButton.style.display = shown >= totalMatching ? "none" : "";

      // Refresh AOS to catch newly visible/hidden elements
      if (typeof AOS !== 'undefined') {
        AOS.refresh();
      }
    }

    filterButtons.forEach((button) => {
      button.addEventListener("click", () => {
        filterButtons.forEach((btn) => btn.classList.remove("active"));
        button.classList.add("active");
        activeFilter = button.textContent.trim().toLowerCase();
        visibleCount = 6;
        updateVisibleCards();
      });
    });

    learnMoreButton.addEventListener("click", () => {
      visibleCount += 6;
      updateVisibleCards();
    });

    updateVisibleCards();
  }

  // NAVIGATION TOGGLE
  const menuButton = document.querySelector(".menu");
  const navLinks = document.querySelector("nav ul");
  if (menuButton && navLinks) {
    menuButton.addEventListener("click", () => {
      navLinks.classList.toggle("active-menu");
    });
  }


  // CAROUSEL (3D Coverflow)
  const carousel = document.getElementById("services-carousel");
  const items = Array.from(document.querySelectorAll(".service-carousel-item"));
  let currentIndex = 0;

  function renderCarousel() {
    const total = items.length;
    items.forEach((item, i) => {
      const offset = ((i - currentIndex + total) % total);
      const r = offset <= total / 2 ? offset : offset - total;

      // Calculate translation and rotation for Coverflow effect
      const translateX = r * 280; // Adjusted spacing
      const rotateY = r * -45;    // Adjusted rotation
      const scale = r === 0 ? 1 : 0.8;
      const opacity = Math.abs(r) > 2 ? 0 : 1 - (Math.abs(r) * 0.2);

      item.style.transform = `translateX(${translateX}px) rotateY(${rotateY}deg) scale(${scale})`;
      item.style.opacity = opacity;
      item.style.zIndex = `${100 - Math.abs(r)}`;
      item.style.pointerEvents = r === 0 ? "auto" : "none"; // Only middle card is clickable
    });
  }

  function moveNext() {
    currentIndex = (currentIndex + 1) % items.length;
    renderCarousel();
  }

  if (carousel && items.length) {
    setInterval(moveNext, 4000); // Slightly slower intervals for better readability
    renderCarousel();

    // Optional: Add click to navigate
    items.forEach((item, index) => {
      item.addEventListener("click", () => {
        currentIndex = index;
        renderCarousel();
      });
    });
  }





  // BACK-TO-TOP BUTTON
  const backToTopButton = document.getElementById("back-to-top");

  if (backToTopButton) {
    window.addEventListener("scroll", () => {
      backToTopButton.style.display =
        window.scrollY > 100 ? "block" : "none";
    });

    backToTopButton.addEventListener("click", () => {
      window.scrollTo({
        top: 0,
        behavior: "smooth",
      });
    });
  }
});
