"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import FeatureCardSixteen from '@/components/sections/feature/FeatureCardSixteen';
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
import PricingCardOne from '@/components/sections/pricing/PricingCardOne';
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import { Package, Sparkles, Star, Smartphone, TrendingUp, Zap, Mail } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="text-stagger"
      defaultTextAnimation="entrance-slide"
      borderRadius="sharp"
      contentWidth="compact"
      sizing="largeSizeMediumTitles"
      background="none"
      cardStyle="inset"
      primaryButtonStyle="gradient"
      secondaryButtonStyle="layered"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          brandName="iPhone Store"
          navItems={[
            { name: "Products", id: "products" },
            { name: "Features", id: "features" },
            { name: "Pricing", id: "pricing" },
            { name: "Reviews", id: "testimonials" },
            { name: "Contact", id: "contact" }
          ]}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboardScroll
          title="Experience the Power of iPhone"
          description="Discover cutting-edge technology, stunning cameras, and seamless performance. Find your perfect iPhone today."
          tag="Innovation at Your Fingertips"
          tagIcon={Sparkles}
          background={{ variant: "plain" }}
          imageSrc="https://img.b2bpic.net/free-photo/smartphone-minimal-display-marble_23-2149554980.jpg"
          imageAlt="Latest iPhone product showcase"
          buttons={[
            { text: "Shop Now", href: "products" },
            { text: "Learn More", href: "features" }
          ]}
        />
      </div>

      <div id="products" data-section="products">
        <ProductCardFour
          title="Our iPhone Collection"
          description="Explore our premium selection of iPhone models, each designed with innovation and quality."
          tag="Latest Models"
          tagIcon={Package}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="slide-up"
          gridVariant="uniform-all-items-equal"
          carouselMode="buttons"
          products={[
            {
              id: "1",              name: "iPhone 15 Pro Max",              price: "$1,199",              variant: "Titanium Gray  6 Colors",              imageSrc: "https://img.b2bpic.net/free-photo/smartphone-minimal-display-marble_23-2149554984.jpg",              imageAlt: "iPhone 15 Pro Max",              isFavorited: false
            },
            {
              id: "2",              name: "iPhone 15 Pro",              price: "$999",              variant: "Space Black  5 Colors",              imageSrc: "https://img.b2bpic.net/free-photo/smartphone-minimal-display-marble_23-2149554966.jpg",              imageAlt: "iPhone 15 Pro",              isFavorited: false
            },
            {
              id: "3",              name: "iPhone 15",              price: "$799",              variant: "Black  5 Colors",              imageSrc: "https://img.b2bpic.net/free-photo/modern-workspace-featuring-cellphone-setup_58702-17222.jpg",              imageAlt: "iPhone 15",              isFavorited: false
            }
          ]}
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardSixteen
          title="Why iPhone Stands Apart"
          description="Compare the advanced capabilities and seamless ecosystem that make iPhone the choice of millions."
          tag="Superior Technology"
          tagIcon={Zap}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="slide-up"
          negativeCard={{
            items: [
              "Limited customization options",              "Smaller display choices",              "Lower battery life",              "Slower processing speeds"
            ]
          }}
          positiveCard={{
            items: [
              "Seamless ecosystem integration",              "Multiple size options (4.3\" to 6.9\")",              "All-day battery with fast charging",              "Industry-leading A18 Pro chip"
            ]
          }}
        />
      </div>

      <div id="about" data-section="about">
        <TextSplitAbout
          title="About Our iPhone Store"
          description={[
            "We are committed to bringing you the latest iPhone technology with exceptional customer service. Since our founding, we've been dedicated to helping customers find their perfect iPhone match.",            "Our expert team provides personalized recommendations, comprehensive support, and competitive pricing. Every iPhone we sell comes with full warranty coverage and lifetime technical support to ensure your satisfaction.",            "Join thousands of satisfied customers who have made iPhone their choice for premium mobile computing."
          ]}
          useInvertedBackground="noInvert"
          showBorder={true}
          buttons={[
            { text: "Shop Now", href: "products" }
          ]}
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardSeven
          title="Our Impact"
          description="Trusted by customers worldwide with proven excellence in service and product quality."
          tag="By The Numbers"
          tagIcon={TrendingUp}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="slide-up"
          uniformGridCustomHeightClasses="min-h-95 2xl:min-h-105"
          carouselMode="buttons"
          metrics={[
            {
              id: "1",              value: "50K+",              title: "Happy Customers",              items: [
                "Served across 25 countries",                "5-star average rating",                "99% satisfaction rate"
              ]
            },
            {
              id: "2",              value: "10+",              title: "Years in Business",              items: [
                "Trusted brand since 2014",                "Industry leading expertise",                "Award-winning service"
              ]
            }
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardTwo
          title="What Our Customers Say"
          description="Read genuine reviews from satisfied iPhone customers who trust us with their purchases."
          tag="Reviews"
          tagIcon={Star}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="slide-up"
          carouselMode="buttons"
          testimonials={[
            {
              id: "1",              name: "Sarah Mitchell",              role: "Tech Entrepreneur",              testimonial: "The iPhone Pro Max exceeded my expectations. Incredible camera quality and seamless performance for my business needs.",              imageSrc: "https://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg",              imageAlt: "Sarah Mitchell"
            },
            {
              id: "2",              name: "James Chen",              role: "Creative Director",              testimonial: "Best purchase I've made. The display is stunning, and the customer service was phenomenal. Highly recommend!",              imageSrc: "https://img.b2bpic.net/free-photo/happy-young-professional-posing-office_1262-21170.jpg",              imageAlt: "James Chen"
            },
            {
              id: "3",              name: "Emily Rodriguez",              role: "Marketing Manager",              testimonial: "The iPhone 15 Pro is a game-changer for photography. Worth every penny. Their team helped me choose the perfect model.",              imageSrc: "https://img.b2bpic.net/free-photo/smiling-homosexual-man-official-suit-looking-camera-close-up-shot-happy-gay-getting-dressed-wedding-ceremony-standing-hotel-room-with-his-partner-background-love-emotion-concept_74855-22675.jpg",              imageAlt: "Emily Rodriguez"
            },
            {
              id: "4",              name: "David Kim",              role: "Software Developer",              testimonial: "Fast shipping, excellent packaging, and the phone arrived in perfect condition. This is my go-to store for iPhones.",              imageSrc: "https://img.b2bpic.net/free-photo/portrait-smiley-business-man_23-2148514859.jpg",              imageAlt: "David Kim"
            },
            {
              id: "5",              name: "Lisa Thompson",              role: "Healthcare Professional",              testimonial: "Outstanding customer service. They answered all my questions and helped me find the right iPhone for my lifestyle.",              imageSrc: "https://img.b2bpic.net/free-photo/portrait-smiley-modern-male_23-2148514900.jpg",              imageAlt: "Lisa Thompson"
            },
            {
              id: "6",              name: "Michael Torres",              role: "Consultant",              testimonial: "Competitive pricing combined with exceptional service. I've already recommended this store to all my friends and colleagues.",              imageSrc: "https://img.b2bpic.net/free-photo/happy-businessman-smiling-camera_1163-4660.jpg",              imageAlt: "Michael Torres"
            }
          ]}
        />
      </div>

      <div id="pricing" data-section="pricing">
        <PricingCardOne
          title="Simple, Transparent Pricing"
          description="Choose the perfect iPhone plan that fits your budget and lifestyle needs."
          tag="Flexible Options"
          tagIcon={Smartphone}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="slide-up"
          carouselMode="buttons"
          plans={[
            {
              id: "1",              badge: "Best Value",              badgeIcon: Sparkles,
              price: "$799",              subtitle: "Perfect for everyday use",              features: [
                "6.1\" Super Retina XDR display",                "A18 chip with 6-core CPU",                "Dual camera system",                "All-day battery life",                "1 year Apple warranty"
              ]
            },
            {
              id: "2",              badge: "Most Popular",              badgeIcon: Star,
              price: "$999",              subtitle: "Pro-level photography",              features: [
                "6.1\" Titanium design",                "A18 Pro chip",                "Advanced camera system",                "ProMotion 120Hz display",                "Extended battery",                "2 years Apple warranty"
              ]
            },
            {
              id: "3",              badge: "Premium Choice",              badgeIcon: Zap,
              price: "$1,199",              subtitle: "Ultimate performance",              features: [
                "6.7\" largest display",                "A18 Pro Max chip",                "Pro camera with zoom",                "120Hz ProMotion display",                "All-day + battery",                "Priority support included"
              ]
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCenter
          tag="Newsletter"
          title="Stay Updated With iPhone Deals"
          description="Subscribe to our newsletter for exclusive offers, new product launches, and special promotions delivered straight to your inbox."
          tagIcon={Mail}
          background={{ variant: "rotated-rays-animated-grid" }}
          useInvertedBackground="noInvert"
          inputPlaceholder="Enter your email"
          buttonText="Subscribe"
          termsText="We respect your privacy. Unsubscribe at any time."
        />
      </div>

      <div id="product" data-section="product">
        <ProductCardFour />
      </div>

      <div id="footer" data-section="footer">
        <FooterMedia
          imageSrc="https://img.b2bpic.net/free-vector/abstract-technology-science-background-with-connecting-lines_1017-22915.jpg"
          imageAlt="Technology innovation background"
          logoText="iPhone Store"
          copyrightText="© 2025 iPhone Store. All rights reserved."
          columns={[
            {
              title: "Shop",              items: [
                { label: "iPhone 15 Pro", href: "products" },
                { label: "iPhone 15", href: "products" },
                { label: "Accessories", href: "products" }
              ]
            },
            {
              title: "Company",              items: [
                { label: "About Us", href: "about" },
                { label: "Contact", href: "contact" },
                { label: "Blog", href: "#" }
              ]
            },
            {
              title: "Support",              items: [
                { label: "Warranty", href: "#" },
                { label: "Technical Support", href: "#" },
                { label: "Returns", href: "#" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}