"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleMinimal from '@/components/navbar/NavbarStyleMinimal';
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
import AboutMetric from '@/components/sections/about/AboutMetric';
import FeatureCardTwentyTwo from '@/components/sections/feature/FeatureCardTwentyTwo';
import PricingCardFive from '@/components/sections/pricing/PricingCardFive';
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import { DollarSign, Download, Globe, Quote, Sparkles, Star, TrendingUp, Users, Zap } from "lucide-react";

export default function AppLandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="slide-background"
      defaultTextAnimation="entrance-slide"
      borderRadius="rounded"
      contentWidth="smallMedium"
      sizing="large"
      background="floatingGradient"
      cardStyle="solid"
      primaryButtonStyle="gradient"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="light"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleMinimal
          brandName="AppStudio"
          button={{
            text: "Download Now",            href: "#contact"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboardCarousel
          title="Elevate Your Mobile Experience"
          description="Discover the app designed to simplify your daily workflow. Seamless, intuitive, and powerful features built for modern users who demand excellence."
          background={{ variant: "sparkles-gradient" }}
          tag="Revolutionary App"
          tagIcon={Sparkles}
          buttons={[
            { text: "Download Free", href: "#contact" },
            { text: "Watch Demo", href: "#features" }
          ]}
          mediaItems={[
            {
              imageSrc: "https://img.b2bpic.net/free-photo/representation-user-experience-interface-design_23-2150169863.jpg",              imageAlt: "AppStudio Mobile App Interface"
            },
            {
              imageSrc: "https://img.b2bpic.net/free-vector/workout-tracker-app_23-2148639062.jpg",              imageAlt: "App User Interface"
            },
            {
              imageSrc: "https://img.b2bpic.net/free-vector/travel-booking-app-template-pack_23-2148592857.jpg",              imageAlt: "App Dashboard"
            },
            {
              imageSrc: "https://img.b2bpic.net/free-vector/user-interface-design-concept-with-different-screens-buttons-web-elements-mobile-social-applications_1284-45222.jpg",              imageAlt: "App Notifications"
            },
            {
              imageSrc: "https://img.b2bpic.net/free-vector/course-app-concept_23-2148671561.jpg",              imageAlt: "App Security Features"
            }
          ]}
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardTwentyTwo
          title="Powerful Features"
          description="Everything you need to stay productive, organized, and connected. Our app delivers industry-leading functionality with an intuitive design that anyone can master."
          tag="Core Features"
          tagIcon={Zap}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="invertDefault"
          features={[
            {
              id: "1",              title: "Intuitive User Interface Design",              category: ["Design", "UX"],
              imageSrc: "https://img.b2bpic.net/free-vector/workout-tracker-app_23-2148639062.jpg",              imageAlt: "Intuitive interface design"
            },
            {
              id: "2",              title: "Real-Time Data Synchronization",              category: ["Technology", "Sync"],
              imageSrc: "https://img.b2bpic.net/free-vector/travel-booking-app-template-pack_23-2148592857.jpg",              imageAlt: "Real-time sync dashboard"
            },
            {
              id: "3",              title: "Smart Notifications System",              category: ["Engagement", "Features"],
              imageSrc: "https://img.b2bpic.net/free-vector/user-interface-design-concept-with-different-screens-buttons-web-elements-mobile-social-applications_1284-45222.jpg",              imageAlt: "Smart notifications"
            },
            {
              id: "4",              title: "Enterprise-Grade Security",              category: ["Security", "Privacy"],
              imageSrc: "https://img.b2bpic.net/free-vector/course-app-concept_23-2148671561.jpg",              imageAlt: "Security features"
            },
            {
              id: "5",              title: "Seamless Cloud Storage",              category: ["Cloud", "Storage"],
              imageSrc: "https://img.b2bpic.net/free-photo/representation-user-experience-interface-design_23-2150169839.jpg",              imageAlt: "Cloud storage integration"
            },
            {
              id: "6",              title: "Advanced Personalization",              category: ["Customization", "Settings"],
              imageSrc: "https://img.b2bpic.net/free-vector/task-management-app_23-2148639059.jpg",              imageAlt: "Personalization options"
            }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <AboutMetric
          title="Trusted by millions of users worldwide who rely on our app for productivity, security, and seamless integration into their daily lives."
          useInvertedBackground="noInvert"
          metrics={[
            {
              icon: Users,
              label: "Active Users",              value: "2.5M+"
            },
            {
              icon: Globe,
              label: "Countries",              value: "150+"
            },
            {
              icon: Star,
              label: "App Rating",              value: "4.9/5"
            },
            {
              icon: TrendingUp,
              label: "Monthly Growth",              value: "45%"
            }
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardThirteen
          title="What Our Users Say"
          description="Join thousands of satisfied users who have transformed their productivity with our mobile app."
          tag="Testimonials"
          tagIcon={Quote}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="invertDefault"
          showRating={true}
          testimonials={[
            {
              id: "1",              name: "Sarah Chen",              handle: "@sarahchen",              testimonial: "This app completely changed how I manage my daily tasks. It's intuitive, fast, and I can't imagine working without it anymore.",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg",              imageAlt: "Sarah Chen"
            },
            {
              id: "2",              name: "Michael Rodriguez",              handle: "@mrodriguez",              testimonial: "Outstanding app with seamless synchronization across all my devices. The customer support is exceptional.",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/portrait-smiley-business-man_23-2148514859.jpg",              imageAlt: "Michael Rodriguez"
            },
            {
              id: "3",              name: "Emma Thompson",              handle: "@emmathompson",              testimonial: "I've tried many productivity apps, but this one stands out. Clean interface and powerful features make it a must-have.",              rating: 5,
              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: "Emma Thompson"
            },
            {
              id: "4",              name: "David Kim",              handle: "@davidkim",              testimonial: "The best investment for my business. It improved our team's efficiency by 40% in just three months.",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/happy-young-professional-posing-office_1262-21170.jpg",              imageAlt: "David Kim"
            },
            {
              id: "5",              name: "Jessica Martinez",              handle: "@jmartinez",              testimonial: "Security and privacy are top-notch. I trust this app with my most important data.",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/portrait-businessman-conference-room-thinking-about-future_482257-25787.jpg",              imageAlt: "Jessica Martinez"
            },
            {
              id: "6",              name: "James Wilson",              handle: "@jamesiw",              testimonial: "Excellent user experience across iOS and Android. The team regularly updates with new features.",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/positive-confident-businesswoman-wearing-formal-suit-standing-with-arms-folded_74855-10328.jpg",              imageAlt: "James Wilson"
            }
          ]}
        />
      </div>

      <div id="pricing" data-section="pricing">
        <PricingCardFive
          title="Simple, Transparent Pricing"
          description="Choose the plan that works best for you. No hidden fees, cancel anytime."
          tag="Pricing Plans"
          tagIcon={DollarSign}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="noInvert"
          plans={[
            {
              id: "free",              tag: "Free Plan",              price: "Free",              period: "Forever",              description: "Perfect for getting started and exploring core features.",              button: {
                text: "Get Started",                href: "#contact"
              },
              featuresTitle: "What's Included:",              features: [
                "5GB cloud storage",                "Basic synchronization",                "Email support",                "Mobile app access"
              ]
            },
            {
              id: "pro",              tag: "Pro Plan",              price: "$9.99",              period: "/month",              description: "For power users who need advanced features and priority support.",              button: {
                text: "Start Free Trial",                href: "#contact"
              },
              featuresTitle: "Everything in Free, plus:",              features: [
                "100GB cloud storage",                "Real-time synchronization",                "Priority email support",                "Advanced analytics",                "Custom themes and integrations"
              ]
            },
            {
              id: "enterprise",              tag: "Enterprise Plan",              price: "Custom",              period: "Contact Sales",              description: "For large teams and organizations requiring custom solutions.",              button: {
                text: "Schedule Demo",                href: "#contact"
              },
              featuresTitle: "Everything in Pro, plus:",              features: [
                "Unlimited cloud storage",                "Dedicated account manager",                "24/7 phone support",                "Custom integrations",                "Team collaboration tools",                "Advanced security features"
              ]
            }
          ]}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqSplitText
          sideTitle="Frequently Asked Questions"
          sideDescription="Got questions? We have answers. Explore our comprehensive FAQ section to learn more about AppStudio."
          useInvertedBackground="invertDefault"
          textPosition="left"
          animationType="smooth"
          faqs={[
            {
              id: "1",              title: "Is my data safe and secure in the app?",              content: "Absolutely. We use military-grade encryption and comply with international data protection standards. Your data is encrypted both in transit and at rest, and we conduct regular security audits."
            },
            {
              id: "2",              title: "Can I use the app on multiple devices?",              content: "Yes! Your data syncs seamlessly across all your devices. Whether you're on iPhone, iPad, Android, or Web, your information stays in perfect sync in real-time."
            },
            {
              id: "3",              title: "What if I need to cancel my subscription?",              content: "You can cancel your subscription anytime with just a few clicks. We won't charge you again, and you'll keep access to your free plan features. Your data remains accessible."
            },
            {
              id: "4",              title: "Does the app work offline?",              content: "Yes, the app has robust offline functionality. You can continue working without an internet connection, and all changes will synchronize automatically once you're back online."
            },
            {
              id: "5",              title: "How often are new features released?",              content: "We release new features and improvements regularly, typically on a monthly basis. Our team is constantly working to enhance your experience based on user feedback."
            },
            {
              id: "6",              title: "Is there a free trial available?",              content: "Yes! All new users get a 14-day free trial of our Pro plan with full access to all premium features. No credit card required to get started."
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCenter
          tag="Get Started"
          title="Join Millions of Happy Users Today"
          description="Download AppStudio now and experience the power of productivity. Available on iOS, Android, and Web."
          tagIcon={Download}
          useInvertedBackground="noInvert"
          inputPlaceholder="Enter your email"
          buttonText="Download App"
          termsText="By downloading, you agree to our Terms of Service and Privacy Policy. We'll send download links and updates to your email."
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterMedia
          imageSrc="https://img.b2bpic.net/free-vector/technology-digital-concept-blue-background_1035-17972.jpg"
          imageAlt="AppStudio Footer"
          logoText="AppStudio"
          copyrightText="© 2025 AppStudio. All rights reserved."
          columns={[
            {
              title: "Product",              items: [
                { label: "Features", href: "#features" },
                { label: "Pricing", href: "#pricing" },
                { label: "Security", href: "#about" },
                { label: "Download", href: "#contact" }
              ]
            },
            {
              title: "Company",              items: [
                { label: "About Us", href: "#about" },
                { label: "Blog", href: "#" },
                { label: "Careers", href: "#" },
                { label: "Contact", href: "#contact" }
              ]
            },
            {
              title: "Legal",              items: [
                { label: "Privacy Policy", href: "#" },
                { label: "Terms of Service", href: "#" },
                { label: "Cookie Policy", href: "#" },
                { label: "Status", href: "#" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}