"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroCentered from '@/components/sections/hero/HeroCentered';
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
import PricingCardOne from '@/components/sections/pricing/PricingCardOne';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import { BarChart3, TrendingUp, FileText, Zap, Plug, AlertCircle, Shield, Lock, Eye, Rocket, Sparkles, Crown, ChevronRight } from 'lucide-react';

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="text-shift"
      defaultTextAnimation="background-highlight"
      borderRadius="sharp"
      contentWidth="medium"
      sizing="medium"
      background="floatingGradient"
      cardStyle="glass-elevated"
      primaryButtonStyle="diagonal-gradient"
      secondaryButtonStyle="layered"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          brandName="SaaS Pro"
          navItems={[
            { name: "Features", id: "features" },
            { name: "Pricing", id: "pricing" },
            { name: "Testimonials", id: "testimonials" },
            { name: "Contact", id: "contact" }
          ]}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroCentered
          title="Transform Your Business With Intelligent Automation"
          description="Streamline workflows, reduce operational costs, and accelerate growth with our powerful SaaS platform built for modern teams."
          background={{ variant: "animated-grid" }}
          avatars={[
            { src: "https://img.b2bpic.net/free-photo/close-up-portrait-curly-handsome-european-male_176532-8133.jpg", alt: "User 1" },
            { src: "https://img.b2bpic.net/free-photo/smiling-young-handsome-guy-wearing-green-shirt_141793-122624.jpg", alt: "User 2" },
            { src: "https://img.b2bpic.net/free-photo/smiling-millennial-man-looking-camera-cafe-headshot-portrait_1163-5163.jpg", alt: "User 3" }
          ]}
          avatarText="Trusted by 5,000+ companies"
          buttons={[
            { text: "Start Free Trial", href: "https://example.com/signup" },
            { text: "Watch Demo", href: "https://example.com/demo" }
          ]}
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardTen
          title="Powerful Features Built for Scale"
          description="Everything you need to automate, optimize, and grow your business without complexity."
          features={[
            {
              id: "1",              title: "Advanced Analytics Dashboard",              description: "Get real-time insights into your business performance with comprehensive analytics, custom reports, and predictive intelligence.",              media: { imageSrc: "https://img.b2bpic.net/free-photo/luxurious-boardroom-space-within-multinational-company-used-meetings_482257-124520.jpg" },
              items: [
                { icon: BarChart3, text: "Real-time data visualization" },
                { icon: TrendingUp, text: "Predictive analytics engine" },
                { icon: FileText, text: "Custom report generation" }
              ],
              reverse: false
            },
            {
              id: "2",              title: "Seamless API Integration",              description: "Connect with 1000+ applications through our robust API and pre-built integrations. Sync data instantly across your tech stack.",              media: { imageSrc: "https://img.b2bpic.net/free-photo/business-graphs-figures-laptop-left-open-desk-empty-office_482257-84546.jpg" },
              items: [
                { icon: Zap, text: "1000+ pre-built integrations" },
                { icon: Plug, text: "REST & GraphQL APIs" },
                { icon: AlertCircle, text: "Real-time webhooks" }
              ],
              reverse: true
            },
            {
              id: "3",              title: "Enterprise-Grade Security",              description: "Your data is protected with military-grade encryption, compliance certifications, and advanced threat detection systems.",              media: { imageSrc: "https://img.b2bpic.net/free-photo/empty-startup-office-displays-statistics_482257-119484.jpg" },
              items: [
                { icon: Shield, text: "SOC 2 & GDPR compliant" },
                { icon: Lock, text: "256-bit AES encryption" },
                { icon: Eye, text: "99.99% uptime SLA" }
              ],
              reverse: false
            }
          ]}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="pricing" data-section="pricing">
        <PricingCardOne
          title="Simple, Transparent Pricing"
          description="Choose the perfect plan for your team. Always flexible, always fair. No hidden fees."
          plans={[
            {
              id: "starter",              badge: "For Startups",              badgeIcon: Rocket,
              price: "$99/month",              subtitle: "Perfect for small teams just getting started",              features: [
                "Up to 5 team members",                "5 integrations",                "Basic analytics",                "Community support",                "5GB storage"
              ]
            },
            {
              id: "professional",              badge: "Most Popular",              badgeIcon: Sparkles,
              price: "$299/month",              subtitle: "Best for growing businesses",              features: [
                "Up to 25 team members",                "100+ integrations",                "Advanced analytics",                "Priority support",                "500GB storage",                "Custom workflows"
              ]
            },
            {
              id: "enterprise",              badge: "For Enterprises",              badgeIcon: Crown,
              price: "Custom",              subtitle: "Tailored for large organizations",              features: [
                "Unlimited team members",                "All integrations",                "Custom analytics",                "Dedicated support",                "Unlimited storage",                "Custom SLA",                "White-label options"
              ]
            }
          ]}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardOne
          title="Loved by Industry Leaders"
          description="See how companies like yours are transforming their operations with our platform."
          testimonials={[
            {
              id: "1",              name: "Sarah Johnson",              role: "CEO",              company: "TechVision Inc",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/happy-young-professional-posing-office_1262-21170.jpg",              imageAlt: "Sarah Johnson"
            },
            {
              id: "2",              name: "Michael Chen",              role: "COO",              company: "InnovateLabs",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/confident-middle-aged-businesswoman-posing-near-office-building_1262-21023.jpg",              imageAlt: "Michael Chen"
            },
            {
              id: "3",              name: "Emily Rodriguez",              role: "Founder",              company: "GrowthCo",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/content-beautiful-businesswoman-standing-window_1262-1778.jpg",              imageAlt: "Emily Rodriguez"
            },
            {
              id: "4",              name: "David Kim",              role: "VP Product",              company: "StartupXYZ",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1674.jpg",              imageAlt: "David Kim"
            }
          ]}
          gridVariant="uniform-all-items-equal"
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoEmphasis
          logoText="SaaS Pro"
          columns={[
            {
              items: [
                { label: "Product", href: "features" },
                { label: "Features", href: "features" },
                { label: "Pricing", href: "pricing" },
                { label: "Security", href: "features" }
              ]
            },
            {
              items: [
                { label: "Company", href: "/" },
                { label: "About", href: "/" },
                { label: "Blog", href: "/" },
                { label: "Careers", href: "/" }
              ]
            },
            {
              items: [
                { label: "Resources", href: "/" },
                { label: "Documentation", href: "/" },
                { label: "API Reference", href: "/" },
                { label: "Support", href: "/" }
              ]
            },
            {
              items: [
                { label: "Legal", href: "/" },
                { label: "Privacy Policy", href: "/" },
                { label: "Terms of Service", href: "/" },
                { label: "Cookie Policy", href: "/" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}