"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import AboutMetric from '@/components/sections/about/AboutMetric';
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import PricingCardOne from '@/components/sections/pricing/PricingCardOne';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
import { Cloud, Database, Headphones, Image, Shield, Smile, Users, Zap } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="text-stagger"
        defaultTextAnimation="background-highlight"
        borderRadius="soft"
        contentWidth="medium"
        sizing="large"
        background="blurBottom"
        cardStyle="gradient-radial"
        primaryButtonStyle="double-inset"
        secondaryButtonStyle="layered"
        headingFontWeight="light"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleFullscreen
      navItems={[
        { name: "Home", id: "hero" },
        { name: "Explore", id: "products" },
        { name: "Pricing", id: "pricing" },
        { name: "FAQ", id: "faq" }
      ]}
      brandName="AI-Forge"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroSplitKpi
      background={{ variant: "glowing-orb" }}
      title="Unleash Your Creative AI Vision"
      description="Start solo or collaborative AI projects. Access high-end tools to create, manage, and scale your creative vision with our intuitive AI platform."
      kpis={[
        { value: "1.2M+", label: "Projects Created" },
        { value: "500K+", label: "Active Creators" },
        { value: "99.9%", label: "System Uptime" }
      ]}
      enableKpiAnimation={true}
      imageSrc="http://img.b2bpic.net/free-photo/futurism-perspective-digital-nomads-lifestyle_23-2151252432.jpg"
      mediaAnimation="slide-up"
      avatars={[
        { src: "http://img.b2bpic.net/free-photo/blonde-businesswoman-analyzing-financial-graphs-using-vr-headset-working-overtime-startup-office-executive-manager-wearing-virtual-reality-goggles-planning-financial-investment-strategy_482257-59715.jpg", alt: "Blonde businesswoman analyzing financial graphs using vr headset" },
        { src: "http://img.b2bpic.net/free-photo/industrial-designers-working-3d-model_23-2149370109.jpg", alt: "Industrial designers working on 3d model" },
        { src: "http://img.b2bpic.net/free-photo/beautiful-mature-woman-having-fun-time_23-2149232846.jpg", alt: "Beautiful mature woman having a fun time" },
        { src: "http://img.b2bpic.net/free-photo/futurism-perspective-digital-nomads-lifestyle_23-2151252491.jpg", alt: "Futurism perspective of digital nomads lifestyle" },
        { src: "http://img.b2bpic.net/free-photo/lifestyle-people-office_23-2149173774.jpg", alt: "Lifestyle of people in the office" }
      ]}
      marqueeItems={[
        { type: "text", text: "Neural Network Integration" },
        { type: "text", text: "Real-time Collaboration" },
        { type: "text", text: "Ultra-fast GPU Rendering" },
        { type: "text", text: "Scalable AI Architecture" },
        { type: "text", text: "Secure Cloud Storage" }
      ]}
    />
  </div>

  <div id="about" data-section="about">
      <AboutMetric
      useInvertedBackground={false}
      title="Empowering Your AI Ambitions"
      metrics={[
        { icon: Zap, label: "Fast Processing", value: "100x" },
        { icon: Users, label: "Group Collaboration", value: "Yes" },
        { icon: Shield, label: "Secure Workspace", value: "256-bit" }
      ]}
      metricsAnimation="blur-reveal"
    />
  </div>

  <div id="products" data-section="products">
      <ProductCardThree
      animationType="slide-up"
      textboxLayout="split"
      gridVariant="four-items-2x2-equal-grid"
      useInvertedBackground={true}
      products={[
        { id: "p1", name: "Neural Art Generation", price: "$49.00", imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-working-digital-monitors_23-2148910247.jpg" },
        { id: "p2", name: "Motion Graphics Engine", price: "$99.00", imageSrc: "http://img.b2bpic.net/free-photo/background-with-printed-circuit-board-concept-modern-technologies_169016-61390.jpg" },
        { id: "p3", name: "Solo Personal Assistant", price: "$29.00", imageSrc: "http://img.b2bpic.net/free-photo/woman-sitting-house-with-automation-light-system-holding-smartphone-turning-light-using-voice-activated-application_482257-2271.jpg" },
        { id: "p4", name: "Collaborative Design Space", price: "$149.00", imageSrc: "http://img.b2bpic.net/free-photo/view-3d-personal-computer-with-workstation_23-2150713979.jpg" },
        { id: "p5", name: "Machine Learning Lab", price: "$199.00", imageSrc: "http://img.b2bpic.net/free-photo/abstract-low-poly-with-connecting-lines-dots_1048-7721.jpg" },
        { id: "p6", name: "AI Content Studio", price: "$79.00", imageSrc: "http://img.b2bpic.net/free-photo/colleague-looking-woman-drawing-graph-flipchart_23-2147847548.jpg" }
      ]}
      title="AI Project Suite"
      description="Choose from a wide variety of project templates designed to jumpstart your creative AI work."
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardTwentyFive
      animationType="depth-3d"
      textboxLayout="split"
      useInvertedBackground={false}
      features={[
        {
          title: "Collaborative Mode",          description: "Work together in real-time on complex AI creations.",          icon: Users,
          mediaItems: [
            { imageSrc: "http://img.b2bpic.net/free-photo/man-pointing-digital-security-plan-background_53876-102579.jpg" },
            { imageSrc: "http://img.b2bpic.net/free-photo/modern-office-space-with-futuristic-decor-furniture_23-2151797755.jpg" }
          ]
        },
        {
          title: "Solo Efficiency",          description: "Rapidly prototype your unique creative ideas alone.",          icon: Database,
          mediaItems: [
            { imageSrc: "http://img.b2bpic.net/free-photo/representation-user-experience-interface-design_23-2150169862.jpg" },
            { imageSrc: "http://img.b2bpic.net/free-photo/business-network-background-connecting-dots-technology-design_53876-160244.jpg" }
          ]
        },
        {
          title: "Scalable Infrastructure",          description: "Never worry about hardware limitations again.",          icon: Cloud,
          mediaItems: [
            { imageSrc: "http://img.b2bpic.net/free-photo/abstract-3d-creation-made-from-geometric-shapes_23-2150829321.jpg" },
            { imageSrc: "http://img.b2bpic.net/free-photo/teamwork-collaboration-modern-office_23-2152013692.jpg" }
          ]
        }
      ]}
      title="Why Choose Our Platform"
      description="Powerful features tailored for solo artists and creative teams."
    />
  </div>

  <div id="pricing" data-section="pricing">
      <PricingCardOne
      animationType="slide-up"
      textboxLayout="split"
      useInvertedBackground={true}
      plans={[
        { id: "basic", badge: "Starter", price: "$29", subtitle: "Perfect for solo projects.", features: ["Limited GPU Access", "Basic AI Models", "Community Support"] },
        { id: "pro", badge: "Professional", price: "$89", subtitle: "For advanced creators.", features: ["Full GPU Access", "All AI Models", "Priority Rendering"] },
        { id: "team", badge: "Team", price: "$199", subtitle: "For larger collaborative teams.", features: ["Shared Workspaces", "Multi-user Access", "24/7 Priority Support"] }
      ]}
      title="Simple Transparent Pricing"
      description="Select the level that matches your creative needs."
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardOne
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="bento-grid"
      useInvertedBackground={false}
      metrics={[
        { id: "m1", value: "10M+", title: "Models Rendered", description: "Successful creative exports.", icon: Image },
        { id: "m2", value: "98%", title: "Client Satisfaction", description: "Highly rated creative support.", icon: Smile },
        { id: "m3", value: "24/7", title: "Active Support", description: "Always ready to help you.", icon: Headphones }
      ]}
      title="Community Impact"
      description="Trusted by thousands of creators globally."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardTen
      textboxLayout="default"
      useInvertedBackground={true}
      testimonials={[
        { id: "t1", title: "Amazing Results", quote: "The platform completely changed my creative workflow for the better.", name: "Sarah Chen", role: "Graphic Designer", imageSrc: "http://img.b2bpic.net/free-photo/thoughtful-artist_23-2147781632.jpg" },
        { id: "t2", title: "Game Changer", quote: "AI-Forge offers the best collaborative features I have ever tested.", name: "David Miller", role: "Product Manager", imageSrc: "http://img.b2bpic.net/free-photo/close-up-entrepreneur-with-corporate-job-looking-camera-business-office-portrait-young-man-preparing-work-planning-development-industry-with-technology-computer_482257-29387.jpg" },
        { id: "t3", title: "Fast and Reliable", quote: "Renders are incredibly fast and the model quality is top-tier.", name: "Elena Rodriguez", role: "Creative Director", imageSrc: "http://img.b2bpic.net/free-photo/happy-girl-takes-selfie-with-her-phone-emotions-concept_169016-64227.jpg" },
        { id: "t4", title: "Unmatched Support", quote: "Support team helped me solve rendering issues in minutes.", name: "James Wilson", role: "Solo Artist", imageSrc: "http://img.b2bpic.net/free-photo/african-man-guy-black-suit-students-with-talet-girl-white-blouse_1157-41615.jpg" },
        { id: "t5", title: "Best-in-class", quote: "The most professional AI platform currently available on the market.", name: "Linda Wu", role: "Art Director", imageSrc: "http://img.b2bpic.net/free-photo/successful-businesswoman-holding-papers_23-2148452649.jpg" }
      ]}
      title="Loved by Creators"
      description="See why our platform is the home for creative AI projects."
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactCenter
      useInvertedBackground={false}
      background={{ variant: "animated-grid" }}
      tag="Join Now"
      title="Ready to Start Your Project?"
      description="Sign up today and get your first credit pack for free."
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterMedia
      imageSrc="http://img.b2bpic.net/free-photo/abstract-geometric-wavy-folds-background_1048-16078.jpg"
      logoText="AI-Forge"
      columns={[
        { title: "Platform", items: [{ label: "Features", href: "#features" }, { label: "Pricing", href: "#pricing" }, { label: "FAQ", href: "#faq" }] },
        { title: "Company", items: [{ label: "About Us", href: "#" }, { label: "Careers", href: "#" }, { label: "Terms", href: "#" }] }
      ]}
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
