"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroCentered from '@/components/sections/hero/HeroCentered';
import MediaSplitTabsAbout from '@/components/sections/about/MediaSplitTabsAbout';
import TeamCardEleven from '@/components/sections/team/TeamCardEleven';
import FeatureCardTwentyOne from '@/components/sections/feature/FeatureCardTwentyOne';
import ContactText from '@/components/sections/contact/ContactText';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import { Sparkles } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="shift-hover"
      defaultTextAnimation="entrance-slide"
      borderRadius="sharp"
      contentWidth="compact"
      sizing="largeSmallSizeLargeTitles"
      background="none"
      cardStyle="elevated"
      primaryButtonStyle="radial-glow"
      secondaryButtonStyle="layered"
      headingFontWeight="semibold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          brandName="StartupHub"
          navItems={[
            { name: "About", id: "about" },
            { name: "Team", id: "team" },
            { name: "Investors", id: "social-proof" },
            { name: "Features", id: "features" },
            { name: "Contact", id: "contact" }
          ]}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroCentered
          title="The Future of Startup Innovation"
          description="Build, scale, and succeed with the most advanced platform for modern startups. Join thousands of founders reshaping industries."
          background={{ variant: "downward-rays-animated" }}
          avatars={[
            { src: "https://img.b2bpic.net/free-photo/smiling-african-american-man-posing-library_74855-1619.jpg", alt: "Founder 1" },
            { src: "https://img.b2bpic.net/free-photo/smiling-middle-aged-man-using-tablet-street-cafe_1262-19056.jpg", alt: "Founder 2" },
            { src: "https://img.b2bpic.net/free-photo/bearded-young-man-casual-shirt-standing-with-laptop-hands_93675-134479.jpg", alt: "Founder 3" }
          ]}
          avatarText="Trusted by 500+ funded startups"
          buttons={[
            { text: "Get Started Free", href: "contact" },
            { text: "Watch Demo", href: "#" }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <MediaSplitTabsAbout
          title="Why StartupHub"
          description="We're built by founders, for founders. Our platform addresses the real challenges facing early-stage companies."
          tabs={[
            {
              id: "mission",              label: "Our Mission",              description: "We empower founders with tools, insights, and community to accelerate growth from day one. Every feature is designed with startup DNA in mind."
            },
            {
              id: "approach",              label: "Our Approach",              description: "Data-driven decision making meets human-centered design. We obsess over metrics while never forgetting the human stories behind them."
            },
            {
              id: "impact",              label: "Our Impact",              description: "From seed to Series C, our users have collectively raised over $2B in funding and created over 10,000 jobs worldwide."
            }
          ]}
          imageSrc="https://img.b2bpic.net/free-photo/multiethnic-coworkers-looking-revenue-figures-tablet-diverse-office_482257-126319.jpg"
          imageAlt="StartupHub team collaboration"
          imagePosition="right"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="team" data-section="team">
        <TeamCardEleven
          title="Meet Our Founding Team"
          description="World-class leaders with deep experience building and scaling technology companies."
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          groups={[
            {
              id: "leadership",              groupTitle: "Leadership",              members: [
                {
                  id: "1",                  title: "Sarah Chen",                  subtitle: "CEO & Co-Founder",                  detail: "sarah@startuphub.com",                  imageSrc: "https://img.b2bpic.net/free-photo/inspiring-new-boss_1098-93.jpg",                  imageAlt: "Sarah Chen, CEO"
                },
                {
                  id: "2",                  title: "Marcus Rodriguez",                  subtitle: "CTO & Co-Founder",                  detail: "marcus@startuphub.com",                  imageSrc: "https://img.b2bpic.net/free-photo/man-portrait-posing-loft-modern-space_158595-5367.jpg",                  imageAlt: "Marcus Rodriguez, CTO"
                },
                {
                  id: "3",                  title: "Elena Volkov",                  subtitle: "CFO & Co-Founder",                  detail: "elena@startuphub.com",                  imageSrc: "https://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",                  imageAlt: "Elena Volkov, CFO"
                },
                {
                  id: "4",                  title: "James Park",                  subtitle: "Chief Marketing Officer",                  detail: "james@startuphub.com",                  imageSrc: "https://img.b2bpic.net/free-photo/pov-businessman-attending-videocall-meeting-office-using-online-videoconference-talk-consultant-about-financial-strategy-company-employee-chatting-remote-teleconference-close-up_482257-40929.jpg",                  imageAlt: "James Park, CMO"
                },
                {
                  id: "5",                  title: "Priya Desai",                  subtitle: "Chief Operations Officer",                  detail: "priya@startuphub.com",                  imageSrc: "https://img.b2bpic.net/free-photo/smiling-confident-manager-cafeteria_1098-20954.jpg",                  imageAlt: "Priya Desai, COO"
                }
              ]
            }
          ]}
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardTwentyOne
          title="Powerful Features for Every Stage"
          description="From launch to scale, we provide the tools you need to succeed."
          tag="Capabilities"
          tagIcon={Sparkles}
          accordionItems={[
            {
              id: "1",              title: "Real-time Analytics Dashboard",              content: "Track key metrics, investor interest, and fundraising progress in one unified dashboard. Get actionable insights to guide your strategic decisions."
            },
            {
              id: "2",              title: "Investor Network Access",              content: "Connect directly with 5000+ vetted investors, venture capitalists, and advisors. Build relationships that matter for your growth journey."
            },
            {
              id: "3",              title: "Document & Legal Suite",              content: "Pre-built templates for term sheets, pitch decks, and legal documents. Save months and thousands in legal fees with startup-optimized documents."
            },
            {
              id: "4",              title: "Financial Forecasting",              content: "AI-powered projections and scenario planning to forecast runway, unit economics, and fundraising needs with unprecedented accuracy."
            }
          ]}
          imageSrc="https://img.b2bpic.net/free-photo/computer-scientist-updating-ai-systems_482257-91183.jpg"
          imageAlt="StartupHub analytics interface"
          useInvertedBackground="invertDefault"
          mediaPosition="right"
          buttons={[
            { text: "Explore All Features", href: "#" }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactText
          text="Ready to launch your startup journey? Join hundreds of founders already building the future with StartupHub."
          animationType="entrance-slide"
          background={{ variant: "radial-gradient" }}
          useInvertedBackground="noInvert"
          buttons={[
            { text: "Start Free Trial", href: "#" },
            { text: "Schedule Demo", href: "#" }
          ]}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoEmphasis
          logoText="StartupHub"
          columns={[
            {
              items: [
                { label: "Product", href: "#" },
                { label: "Features", href: "#" },
                { label: "Pricing", href: "#" },
                { label: "Security", href: "#" }
              ]
            },
            {
              items: [
                { label: "Company", href: "#" },
                { label: "About", href: "about" },
                { label: "Team", href: "team" },
                { label: "Blog", href: "#" }
              ]
            },
            {
              items: [
                { label: "Resources", href: "#" },
                { label: "Documentation", href: "#" },
                { label: "API Reference", href: "#" },
                { label: "Guides", href: "#" }
              ]
            },
            {
              items: [
                { label: "Legal", href: "#" },
                { label: "Privacy", href: "#" },
                { label: "Terms", href: "#" },
                { label: "Contact", href: "contact" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}