"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
import HeroBillboard from "@/components/sections/hero/HeroBillboard";
import FeatureCardTwentySeven from "@/components/sections/feature/FeatureCardTwentySeven";
import ProductCardOne from "@/components/sections/product/ProductCardOne";
import TestimonialCardTen from "@/components/sections/testimonial/TestimonialCardTen";
import MetricCardThree from "@/components/sections/metrics/MetricCardThree";
import PricingCardFive from "@/components/sections/pricing/PricingCardFive";
import FaqSplitText from "@/components/sections/faq/FaqSplitText";
import ContactSplit from "@/components/sections/contact/ContactSplit";
import FooterSimple from "@/components/sections/footer/FooterSimple";
import { Sparkles, Award, Mail, TrendingUp, Users, Zap, Crown } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="text-shift"
      defaultTextAnimation="background-highlight"
      borderRadius="soft"
      contentWidth="mediumSmall"
      sizing="mediumLargeSizeMediumTitles"
      background="noiseDiagonalGradient"
      cardStyle="outline"
      primaryButtonStyle="radial-glow"
      secondaryButtonStyle="glass"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          brandName="EditFlow"
          navItems={[
            { name: "Features", id: "features" },
            { name: "Products", id: "products" },
            { name: "Pricing", id: "pricing" },
            { name: "FAQ", id: "faq" },
            { name: "Contact", id: "contact" },
          ]}
          button={{ text: "Get Started", href: "https://editflow.example.com/signup" }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboard
          title="Professional Video Editing at Your Fingertips"
          description="Transform your raw footage into stunning videos with EditFlow's intuitive editing suite. Powerful tools designed for creators, filmmakers, and professionals who demand precision and speed."
          tag="Video Editing Platform"
          tagIcon={Sparkles}
          tagAnimation="slide-up"
          background={{ variant: "sparkles-gradient" }}
          buttons={[
            { text: "Try Free for 14 Days", href: "https://editflow.example.com/download" },
            { text: "Watch Demo", href: "#features" },
          ]}
          buttonAnimation="slide-up"
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQoqRc5UjHqgr4bZ9Mv03rN5Xg/a-modern-video-editing-software-dashboar-1772534458962-17040fa4.png"
          imageAlt="EditFlow Video Editing Dashboard"
          mediaAnimation="slide-up"
          avatars={[
            {
              src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQoqRc5UjHqgr4bZ9Mv03rN5Xg/professional-headshot-of-a-young-content-1772534455314-93ca0373.png",              alt: "Creator"},
            {
              src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQoqRc5UjHqgr4bZ9Mv03rN5Xg/professional-headshot-of-a-filmmaker-wit-1772534455618-5b1546a2.png",              alt: "Filmmaker"},
            {
              src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQoqRc5UjHqgr4bZ9Mv03rN5Xg/professional-headshot-of-a-video-editor--1772534455973-1a15bba2.png",              alt: "Editor"},
          ]}
          avatarText="Trusted by 50,000+ content creators worldwide"
          marqueeItems={[
            { type: "text", text: "4K/8K Support" },
            { type: "text", text: "AI Color Grading" },
            { type: "text", text: "Multi-Track Editing" },
            { type: "text", text: "Real-time Preview" },
            { type: "text", text: "Professional Transitions" },
            { type: "text", text: "Advanced Audio Tools" },
          ]}
          marqueeSpeed={40}
          showMarqueeCard={true}
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardTwentySeven
          title="Powerful Editing Features"
          description="Everything you need to create professional-quality videos with intuitive controls and advanced capabilities."
          tag="Features"
          tagAnimation="slide-up"
          features={[
            {
              id: "trim",              title: "Precision Trimming",              description: "Frame-accurate editing with visual timeline controls. Cut and arrange clips with pixel-perfect precision for seamless transitions and perfect pacing.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQoqRc5UjHqgr4bZ9Mv03rN5Xg/close-up-screenshot-of-a-video-trimming--1772534457910-4d30b4a8.png",              imageAlt: "Video trimming tool"},
            {
              id: "effects",              title: "Visual Effects & Filters",              description: "Professional-grade effects library with filters, transitions, motion graphics, and color correction. Create stunning visuals with drag-and-drop simplicity.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQoqRc5UjHqgr4bZ9Mv03rN5Xg/visual-effects-panel-with-colorful-filte-1772534456859-4be1d4de.png",              imageAlt: "Effects and filters panel"},
            {
              id: "export",              title: "Smart Export Options",              description: "Export to any format with optimized presets for social media, broadcast, and web. Choose from multiple quality levels and resolutions instantly.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQoqRc5UjHqgr4bZ9Mv03rN5Xg/export-settings-dialog-showing-multiple--1772534456788-6cdd475e.png",              imageAlt: "Export settings interface"},
            {
              id: "audio",              title: "Advanced Audio Editing",              description: "Professional audio mixing, EQ, and effects. Synchronize multiple audio tracks, adjust levels, and add spatial audio for immersive content.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQoqRc5UjHqgr4bZ9Mv03rN5Xg/visual-effects-panel-with-colorful-filte-1772534456859-4be1d4de.png",              imageAlt: "Audio editing tools"},
          ]}
          gridVariant="four-items-2x2-equal-grid"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="products" data-section="products">
        <ProductCardOne
          title="Choose Your Editing Suite"
          description="Select the perfect plan for your creative needs, from hobbyists to professional studios."
          products={[
            {
              id: "starter",              name: "EditFlow Starter",              price: "$29/mo",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQoqRc5UjHqgr4bZ9Mv03rN5Xg/beginner-friendly-video-editing-package--1772534456678-710dbd74.png",              imageAlt: "Starter package interface"},
            {
              id: "pro",              name: "EditFlow Pro",              price: "$79/mo",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQoqRc5UjHqgr4bZ9Mv03rN5Xg/premium-video-editing-software-package-v-1772534455782-77c5d9c8.png",              imageAlt: "Professional package features"},
            {
              id: "studio",              name: "EditFlow Studio",              price: "$199/mo",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQoqRc5UjHqgr4bZ9Mv03rN5Xg/professional-studio-grade-video-editing--1772534458217-db71a671.png",              imageAlt: "Studio-grade features"},
          ]}
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          tag="Product Packages"
          tagAnimation="slide-up"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardTen
          title="Loved by Creators Everywhere"
          description="Hear from content creators and professionals who've transformed their workflow with EditFlow."
          tag="Success Stories"
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          testimonials={[
            {
              id: "1",              title: "Changed My Entire Workflow",              quote: "EditFlow has cut my editing time in half. The UI is intuitive, powerful tools are right where I need them, and the results are absolutely professional-grade. It's become my go-to editor.",              name: "Sarah Martinez",              role: "YouTube Content Creator",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQoqRc5UjHqgr4bZ9Mv03rN5Xg/professional-headshot-of-a-young-content-1772534455314-93ca0373.png",              imageAlt: "Sarah Martinez"},
            {
              id: "2",              title: "Professional Features, Beginner-Friendly",              quote: "I was intimidated by professional editing software, but EditFlow makes it accessible. The AI color grading feature alone has elevated my videos significantly. Highly recommend!",              name: "James Chen",              role: "Filmmaker",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQoqRc5UjHqgr4bZ9Mv03rN5Xg/professional-headshot-of-a-filmmaker-wit-1772534455618-5b1546a2.png",              imageAlt: "James Chen"},
            {
              id: "3",              title: "The Fastest Export I've Ever Used",              quote: "As someone producing daily content, speed matters. EditFlow's export engine is incredibly fast, and the quality options are perfectly optimized for every platform I use.",              name: "Emma Thompson",              role: "Podcast Producer",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQoqRc5UjHqgr4bZ9Mv03rN5Xg/professional-headshot-of-a-video-editor--1772534455973-1a15bba2.png",              imageAlt: "Emma Thompson"},
            {
              id: "4",              title: "Studio-Quality Results",              quote: "We use EditFlow Studio for all our commercial productions. The multi-track capabilities and color grading tools rival software costing triple the price. Absolutely worth it.",              name: "Marcus Anderson",              role: "Production Director",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQoqRc5UjHqgr4bZ9Mv03rN5Xg/professional-headshot-of-a-content-creat-1772534456196-eded5bb9.png",              imageAlt: "Marcus Anderson"},
            {
              id: "5",              title: "Perfect for Agency Work",              quote: "EditFlow's collaboration features and rendering speed have made us more efficient. Our team can now deliver client projects 40% faster without compromising quality.",              name: "Lisa Wong",              role: "Creative Director",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQoqRc5UjHqgr4bZ9Mv03rN5Xg/professional-headshot-of-a-young-produce-1772534455350-e4ccbb84.png",              imageAlt: "Lisa Wong"},
            {
              id: "6",              title: "Industry-Leading Support",              quote: "Beyond the amazing software, EditFlow's support team is responsive and helpful. When I had questions, answers came quickly. This level of service is rare.",              name: "David Park",              role: "Corporate Video Producer",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQoqRc5UjHqgr4bZ9Mv03rN5Xg/professional-headshot-of-a-creative-prof-1772534455685-4a5b6314.png",              imageAlt: "David Park"},
          ]}
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardThree
          title="By the Numbers"
          description="See why creators and professionals choose EditFlow for their editing needs."
          tag="Performance Metrics"
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          metrics={[
            { id: "1", icon: Users, title: "Active Users", value: "50K+" },
            { id: "2", icon: Zap, title: "Videos Edited", value: "2M+" },
            { id: "3", icon: TrendingUp, title: "Satisfaction Rate", value: "98%" },
            { id: "4", icon: Award, title: "Awards Won", value: "15" },
          ]}
          animationType="slide-up"
          carouselMode="buttons"
        />
      </div>

      <div id="pricing" data-section="pricing">
        <PricingCardFive
          title="Simple, Transparent Pricing"
          description="Choose the plan that fits your creative needs. All plans include free updates and community support."
          tag="Pricing"
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          animationType="slide-up"
          plans={[
            {
              id: "starter",              tag: "Starter Plan",              price: "$29",              period: "/month",              description: "Perfect for beginners and hobbyist creators starting their journey.",              button: { text: "Start Free Trial", href: "https://editflow.example.com/try" },              featuresTitle: "What's Included:",              features: [
                "Up to 1080p export",                "20 GB cloud storage",                "Basic effects library",                "Email support",                "Single device license"],
            },
            {
              id: "pro",              tag: "Pro Plan",              tagIcon: Sparkles,
              price: "$79",              period: "/month",              description: "For content creators who want professional features and faster workflows.",              button: { text: "Choose Pro", href: "https://editflow.example.com/checkout/pro" },              featuresTitle: "What's Included:",              features: [
                "4K/8K export support",                "100 GB cloud storage",                "Premium effects & transitions",                "AI color grading",                "Priority email support",                "3 device licenses",                "Advanced audio editing"],
            },
            {
              id: "studio",              tag: "Studio Plan",              tagIcon: Crown,
              price: "$199",              period: "/month",              description: "Enterprise-grade editing for production studios and agencies.",              button: { text: "Contact Sales", href: "https://editflow.example.com/contact-sales" },              featuresTitle: "Everything in Pro, Plus:",              features: [
                "Unlimited cloud storage",                "Multi-track editing (16+ tracks)",                "Professional color grading suite",                "Collaboration tools",                "Unlimited device licenses",                "24/7 dedicated support",                "Custom integrations",                "Team management features"],
            },
          ]}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqSplitText
          sideTitle="Frequently Asked Questions"
          sideDescription="Get answers to common questions about EditFlow, pricing, features, and support."
          textPosition="left"
          useInvertedBackground={false}
          faqsAnimation="slide-up"
          faqs={[
            {
              id: "1",              title: "Is there a free trial available?",              content: "Yes! EditFlow offers a 14-day free trial with full access to Pro features. No credit card required. After the trial, you can choose to continue with any plan or cancel anytime."},
            {
              id: "2",              title: "What video formats does EditFlow support?",              content: "EditFlow supports all major formats including MP4, MOV, AVI, WebM, ProRes, and more. Import and export to virtually any format used in professional video production."},
            {
              id: "3",              title: "Can I use EditFlow on multiple devices?",              content: "Yes! With the Starter plan, you get one device license. Pro includes 3 devices, and Studio plans offer unlimited devices. Simply log in to any device to access your account."},
            {
              id: "4",              title: "What about technical support?",              content: "Starter plan users get email support. Pro and Studio customers receive priority support with faster response times. Studio users get access to 24/7 dedicated support team."},
            {
              id: "5",              title: "Can I export my projects for backup?",              content: "Absolutely. You can export your entire project file, all media, and effects to keep on your local drive. Cloud storage is for collaborative access and syncing across devices."},
            {
              id: "6",              title: "Does EditFlow work offline?",              content: "Yes, EditFlow works offline for editing. You'll need internet for account login, cloud syncing, and some AI-powered features, but the core editing functionality is available offline."},
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplit
          tag="Get in Touch"
          tagIcon={Mail}
          title="Stay Updated With EditFlow"
          description="Subscribe to our newsletter for editing tips, feature releases, and exclusive creator content delivered to your inbox."
          background={{ variant: "radial-gradient" }}
          useInvertedBackground={false}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQoqRc5UjHqgr4bZ9Mv03rN5Xg/modern-workspace-showing-a-content-creat-1772534456769-2c49347e.png"
          imageAlt="Creative workspace with video editing setup"
          mediaAnimation="slide-up"
          mediaPosition="right"
          inputPlaceholder="your@email.com"
          buttonText="Subscribe"
          termsText="We respect your privacy. Unsubscribe at any time. Read our privacy policy."
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterSimple
          columns={[
            {
              title: "Product",              items: [
                { label: "Features", href: "#features" },
                { label: "Pricing", href: "#pricing" },
                { label: "Download", href: "https://editflow.example.com/download" },
                { label: "Updates", href: "https://editflow.example.com/releases" },
              ],
            },
            {
              title: "Resources",              items: [
                { label: "Documentation", href: "https://docs.editflow.example.com" },
                { label: "Tutorials", href: "https://editflow.example.com/tutorials" },
                { label: "Community", href: "https://community.editflow.example.com" },
                { label: "Support", href: "https://support.editflow.example.com" },
              ],
            },
            {
              title: "Company",              items: [
                { label: "About Us", href: "https://editflow.example.com/about" },
                { label: "Blog", href: "https://editflow.example.com/blog" },
                { label: "Careers", href: "https://editflow.example.com/careers" },
                { label: "Contact", href: "#contact" },
              ],
            },
            {
              title: "Legal",              items: [
                { label: "Privacy Policy", href: "https://editflow.example.com/privacy" },
                { label: "Terms of Service", href: "https://editflow.example.com/terms" },
                { label: "Cookie Policy", href: "https://editflow.example.com/cookies" },
                { label: "Disclaimer", href: "https://editflow.example.com/disclaimer" },
              ],
            },
          ]}
          bottomLeftText="© 2025 EditFlow. All rights reserved."
          bottomRightText="Made for creators, by creators"
        />
      </div>
    </ThemeProvider>
  );
}
