"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
import TeamCardOne from '@/components/sections/team/TeamCardOne';
import FeatureCardSix from '@/components/sections/feature/FeatureCardSix';
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import { Sparkles, Users, Zap, TrendingUp, Send } from 'lucide-react';

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="background-highlight"
      borderRadius="rounded"
      contentWidth="medium"
      sizing="largeSmallSizeMediumTitles"
      background="aurora"
      cardStyle="glass-elevated"
      primaryButtonStyle="inset-glow"
      secondaryButtonStyle="glass"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          brandName="StartupHub"
          navItems={[
            { name: "About", id: "team" },
            { name: "Investors", id: "investors" },
            { name: "Features", id: "features" },
            { name: "Contact", id: "contact" }
          ]}
          button={{
            text: "Get Started",            href: "#contact"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroSplitDualMedia
          title="Build the Future of Technology"
          description="Join us on a mission to revolutionize how teams collaborate and innovate. We're backed by leading venture capital firms and trusted by innovative companies worldwide."
          tag="Innovative Startup"
          tagIcon={Sparkles}
          background={{ variant: "aurora" }}
          mediaItems={[
            {
              imageSrc: "https://img.b2bpic.net/free-photo/group-three-young-multi-ethnic-successful-business-people-sitting-coworking-space-talking-about-new-project-competitor-team-making-plans-bypass-their-project_176420-8311.jpg",              imageAlt: "Startup team collaboration in modern workspace"
            },
            {
              imageSrc: "https://img.b2bpic.net/free-photo/disabled-man-wheelchair-working-his-office-job_23-2149571107.jpg",              imageAlt: "Developer working on cutting-edge technology"
            }
          ]}
          rating={5}
          ratingText="Trusted by innovative teams"
          buttons={[
            { text: "Start Free Trial", href: "#contact" },
            { text: "Watch Demo", href: "#features" }
          ]}
        />
      </div>

      <div id="team" data-section="team">
        <TeamCardOne
          title="Meet Our Team"
          description="Exceptional talent driving innovation and success at every level of our organization"
          tag="Leadership"
          tagIcon={Users}
          members={[
            {
              id: "1",              name: "Sarah Chen",              role: "CEO & Founder",              imageSrc: "https://img.b2bpic.net/free-photo/smiling-businessman-standing-airport-terminal_107420-85070.jpg",              imageAlt: "Sarah Chen, CEO and Founder"
            },
            {
              id: "2",              name: "Michael Rodriguez",              role: "CTO",              imageSrc: "https://img.b2bpic.net/free-photo/positive-middle-aged-business-leader-window_1262-5388.jpg",              imageAlt: "Michael Rodriguez, Chief Technology Officer"
            },
            {
              id: "3",              name: "Emily Watson",              role: "Head of Design",              imageSrc: "https://img.b2bpic.net/free-photo/closeup-senior-businessman-with-arms-crossed_1262-1751.jpg",              imageAlt: "Emily Watson, Head of Design"
            },
            {
              id: "4",              name: "James Park",              role: "VP Marketing",              imageSrc: "https://img.b2bpic.net/free-photo/pensive-mature-businessman-formal-suit-glasses-standing-by-office-glass-wall-looking-away-copy-space-business-portrait-concept_74855-14255.jpg",              imageAlt: "James Park, Vice President of Marketing"
            }
          ]}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          gridVariant="four-items-2x2-equal-grid"
          animationType="depth-3d"
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardSix
          title="How It Works"
          description="Simple, powerful, and designed for teams that move fast"
          tag="Process"
          tagIcon={Zap}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          features={[
            {
              id: 1,
              title: "Connect Your Tools",              description: "Seamlessly integrate with your favorite apps and services in minutes, not hours. Our API supports hundreds of integrations out of the box.",              imageSrc: "https://img.b2bpic.net/free-photo/luxurious-boardroom-space-within-multinational-company-used-meetings_482257-124520.jpg",              imageAlt: "Integration dashboard showing connected tools"
            },
            {
              id: 2,
              title: "Automate Your Workflow",              description: "Eliminate repetitive tasks and let our intelligent automation engine handle the heavy lifting. Save your team hundreds of hours every month.",              imageSrc: "https://img.b2bpic.net/free-photo/business-graphs-figures-laptop-left-open-desk-empty-office_482257-84546.jpg",              imageAlt: "Workflow automation interface"
            },
            {
              id: 3,
              title: "Scale with Confidence",              description: "Built for growth. Our platform scales with your business, from startup to enterprise, with 99.99% uptime guarantees and dedicated support.",              imageSrc: "https://img.b2bpic.net/free-photo/woman-watching-business-conference-computer-screen-looking-statistics_482257-125563.jpg",              imageAlt: "Enterprise infrastructure visualization"
            }
          ]}
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardEleven
          title="Our Impact"
          description="Proven results from companies that trust us with their most critical workflows"
          tag="Results"
          tagIcon={TrendingUp}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="slide-up"
          metrics={[
            {
              id: "1",              value: "500K+",              title: "Active Users",              description: "Teams collaborating and building every day",              imageSrc: "https://img.b2bpic.net/free-vector/business-growth-concept-with-rocket_23-2147780577.jpg",              imageAlt: "Users dashboard showing growth metrics"
            },
            {
              id: "2",              value: "150M+",              title: "Tasks Processed",              description: "Automated workflows completing successfully",              imageSrc: "https://img.b2bpic.net/free-vector/landing-page-concept-start-up_23-2148268941.jpg",              imageAlt: "Task completion analytics"
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCTA
          tag="Ready to Build?"
          tagIcon={Send}
          title="Join the Future of Collaboration"
          description="Start building with us today. Get unlimited access to all features, priority support, and exclusive resources for the first 100 teams."
          buttons={[
            { text: "Start Free Trial", href: "#" },
            { text: "Schedule Demo", href: "#" }
          ]}
          background={{ variant: "sparkles-gradient" }}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterSimple
          columns={[
            {
              title: "Product",              items: [
                { label: "Features", href: "#features" },
                { label: "Pricing", href: "#" },
                { label: "Security", href: "#" },
                { label: "Roadmap", href: "#" }
              ]
            },
            {
              title: "Company",              items: [
                { label: "About", href: "#team" },
                { label: "Blog", href: "#" },
                { label: "Careers", href: "#" },
                { label: "Contact", href: "#contact" }
              ]
            },
            {
              title: "Resources",              items: [
                { label: "Documentation", href: "#" },
                { label: "API Docs", href: "#" },
                { label: "Community", href: "#" },
                { label: "Support", href: "#" }
              ]
            },
            {
              title: "Legal",              items: [
                { label: "Privacy", href: "#" },
                { label: "Terms", href: "#" },
                { label: "Security", href: "#" }
              ]
            }
          ]}
          bottomLeftText="© 2025 StartupHub. All rights reserved."
          bottomRightText="Made with innovation"
        />
      </div>
    </ThemeProvider>
  );
}