"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
import TeamCardFive from '@/components/sections/team/TeamCardFive';
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import { Rocket, Users, Zap, TrendingUp, BarChart3, Activity, Globe, Shield, Plug, Code, CheckCircle, Mail } from 'lucide-react';

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="text-shift"
      defaultTextAnimation="reveal-blur"
      borderRadius="soft"
      contentWidth="smallMedium"
      sizing="mediumSizeLargeTitles"
      background="aurora"
      cardStyle="soft-shadow"
      primaryButtonStyle="inset-glow"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleFullscreen
          brandName="StartupLabs"
          navItems={[
            { name: "Home", id: "home" },
            { name: "Team", id: "team" },
            { name: "Features", id: "features" },
            { name: "Investors", id: "investors" },
            { name: "Contact", id: "contact" }
          ]}
          bottomLeftText="San Francisco, CA"
          bottomRightText="hello@startuplabs.io"
        />
      </div>

      <div id="hero" data-section="hero" className="w-full min-h-screen">
        <HeroBillboardScroll
          title="Build Your Future with StartupLabs"
          description="We empower innovative founders to scale their vision with cutting-edge technology, expert mentorship, and strategic investor connections."
          tag="Investor-Backed Innovation"
          tagIcon={Rocket}
          background={{ variant: "canvas-reveal" }}
          imageSrc="https://img.b2bpic.net/free-photo/person-talking-colleagues-video-call-communication-using-smartphone-business-meeting-businessman-holding-mobile-phone-online-conference-with-workmates-corporate-office_482257-28475.jpg"
          imageAlt="StartupLabs dashboard showcasing product analytics and insights"
          buttons={[
            { text: "Get Started Today", href: "contact" },
            { text: "Learn More", href: "features" }
          ]}
        />
      </div>

      <div id="team" data-section="team" className="w-full py-20">
        <TeamCardFive
          team={[
            {
              id: "1",              name: "Sarah Chen",              role: "Founder & CEO",              imageSrc: "https://img.b2bpic.net/free-photo/business-lady-looking-copyspace-with-interest_1262-2957.jpg"
            },
            {
              id: "2",              name: "Marcus Rodriguez",              role: "CTO & Co-Founder",              imageSrc: "https://img.b2bpic.net/free-photo/close-up-positive-businesswoman_1098-3531.jpg"
            },
            {
              id: "3",              name: "Jessica Park",              role: "Chief Product Officer",              imageSrc: "https://img.b2bpic.net/free-photo/closeup-smiling-beautiful-adult-businesswoman_1262-1760.jpg"
            },
            {
              id: "4",              name: "David Thompson",              role: "Lead Engineer",              imageSrc: "https://img.b2bpic.net/free-photo/fashion-portrait-young-elegant-woman_1328-4107.jpg"
            },
            {
              id: "5",              name: "Elena Volkov",              role: "Head of Design",              imageSrc: "https://img.b2bpic.net/free-photo/confident-middle-aged-businesswoman-looking-camera_74855-4120.jpg"
            },
            {
              id: "6",              name: "James Mitchell",              role: "Chief Operations Officer",              imageSrc: "https://img.b2bpic.net/free-photo/portrait-business-woman-office_1398-6.jpg"
            }
          ]}
          title="Meet Our Founding Team"
          description="Our diverse team brings decades of combined experience from leading tech companies and successful startups."
          tag="Experienced Founders"
          tagIcon={Users}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="slide-up"
        />
      </div>

      <div id="features" data-section="features" className="w-full py-20">
        <FeatureCardTen
          title="Powerful Features for Your Success"
          description="Everything a modern startup needs to scale rapidly and efficiently"
          tag="Capabilities"
          tagIcon={Zap}
          features={[
            {
              id: "1",              title: "AI-Powered Analytics",              description: "Real-time insights into user behavior, conversion funnels, and growth metrics with intelligent recommendations.",              media: {
                imageSrc: "https://img.b2bpic.net/free-photo/person-talking-colleagues-video-call-communication-using-smartphone-business-meeting-businessman-holding-mobile-phone-online-conference-with-workmates-corporate-office_482257-28475.jpg"
              },
              items: [
                { icon: TrendingUp, text: "Real-time data visualization" },
                { icon: BarChart3, text: "Predictive analytics" },
                { icon: Activity, text: "Performance monitoring" }
              ],
              reverse: false
            },
            {
              id: "2",              title: "Global Scale Infrastructure",              description: "Deploy your application across multiple regions with automatic failover and 99.99% uptime guarantee.",              media: {
                imageSrc: "https://img.b2bpic.net/free-photo/person-talking-colleagues-video-call-communication-using-smartphone-business-meeting-businessman-holding-mobile-phone-online-conference-with-workmates-corporate-office_482257-28475.jpg"
              },
              items: [
                { icon: Globe, text: "Multi-region deployment" },
                { icon: Shield, text: "Enterprise security" },
                { icon: Zap, text: "Lightning-fast performance" }
              ],
              reverse: true
            },
            {
              id: "3",              title: "Seamless Integrations",              description: "Connect with 500+ third-party services out of the box. Custom API for unlimited possibilities.",              media: {
                imageSrc: "https://img.b2bpic.net/free-photo/person-talking-colleagues-video-call-communication-using-smartphone-business-meeting-businessman-holding-mobile-phone-online-conference-with-workmates-corporate-office_482257-28475.jpg"
              },
              items: [
                { icon: Plug, text: "500+ integrations" },
                { icon: Code, text: "Powerful REST API" },
                { icon: Zap, text: "Real-time webhooks" }
              ],
              reverse: false
            }
          ]}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="slide-up"
        />
      </div>

      <div id="metrics" data-section="metrics" className="w-full py-16">
        <MetricCardTwo
          title="Proven Track Record"
          description="Metrics that showcase our impact in the startup ecosystem"
          tag="Results"
          tagIcon={CheckCircle}
          metrics={[
            {
              id: "1",              value: "250+",              description: "Startups Accelerated"
            },
            {
              id: "2",              value: "$5.2B",              description: "Total Funding Raised"
            },
            {
              id: "3",              value: "40+",              description: "Unicorn Exits"
            },
            {
              id: "4",              value: "98%",              description: "Founder Success Rate"
            }
          ]}
          gridVariant="uniform-all-items-equal"
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          animationType="scale-rotate"
        />
      </div>

      <div id="contact" data-section="contact" className="w-full py-20">
        <ContactCTA
          tag="Ready to Scale?"
          tagIcon={Mail}
          title="Join the Next Generation of Unicorns"
          description="Let's discuss how StartupLabs can accelerate your journey from idea to IPO. Schedule a consultation with our team today."
          background={{ variant: "gradient-bars" }}
          buttons={[
            { text: "Schedule Demo", href: "https://calendly.com/startuplabs" },
            { text: "Send Inquiry", onClick: () => window.location.href = 'mailto:hello@startuplabs.io' }
          ]}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoReveal
          logoText="StartupLabs"
          leftLink={{
            text: "Privacy Policy",            href: "https://example.com/privacy"
          }}
          rightLink={{
            text: "Terms of Service",            href: "https://example.com/terms"
          }}
        />
      </div>
    </ThemeProvider>
  );
}