"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import HeroLogoBillboardSplit from '@/components/sections/hero/HeroLogoBillboardSplit';
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
import SplitAbout from '@/components/sections/about/SplitAbout';
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import { Award, BarChart3, CheckCircle, Clock, Code, DollarSign, Download, GitBranch, Headphones, Link2, Rocket, Shield, Sparkles, TrendingUp, Zap } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="entrance-slide"
      borderRadius="rounded"
      contentWidth="smallMedium"
      sizing="largeSizeMediumTitles"
      background="none"
      cardStyle="subtle-shadow"
      primaryButtonStyle="double-inset"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          brandName="SaaS Pro"
          navItems={[
            { name: "Features", id: "features" },
            { name: "Pricing", id: "pricing" },
            { name: "About", id: "about" },
            { name: "Testimonials", id: "testimonials" },
            { name: "Contact", id: "contact" }
          ]}
          button={{
            text: "Get Started",            href: "#pricing"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroLogoBillboardSplit
          logoText="SAAS PRO"
          description="Streamline your workflow, empower your team, and scale your business with our intelligent SaaS platform designed for modern enterprises."
          background={{ variant: "plain" }}
          buttons={[
            { text: "Start Free Trial", href: "#pricing" },
            { text: "Watch Demo", href: "#" }
          ]}
          layoutOrder="default"
          imageSrc="https://img.b2bpic.net/free-photo/research-analysis-ideas-strategy-information-concept_53876-123886.jpg"
          imageAlt="SaaS Pro Dashboard Interface"
          frameStyle="browser"
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardTen
          title="Powerful Features for Every Team"
          description="Everything you need to optimize operations, collaborate seamlessly, and make data-driven decisions with confidence."
          tag="Capabilities"
          tagIcon={Sparkles}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="slide-up"
          features={[
            {
              id: "1",              title: "Advanced Analytics Dashboard",              description: "Gain deep insights into your business metrics with real-time data visualization, custom reports, and predictive analytics powered by machine learning.",              media: {
                imageSrc: "https://img.b2bpic.net/free-photo/luxurious-boardroom-space-within-multinational-company-used-meetings_482257-124520.jpg",                imageAlt: "data analytics charts graphs business intelligence metrics"
              },
              items: [
                { icon: BarChart3, text: "Real-time data visualization" },
                { icon: TrendingUp, text: "Predictive analytics" },
                { icon: Download, text: "Automated report generation" }
              ],
              reverse: false
            },
            {
              id: "2",              title: "Intelligent Automation",              description: "Automate repetitive tasks and workflows to save time, reduce errors, and increase productivity across your entire organization.",              media: {
                imageSrc: "https://img.b2bpic.net/free-photo/programming-background-with-html_23-2150038862.jpg",                imageAlt: "automation workflow process automation efficiency technology"
              },
              items: [
                { icon: Zap, text: "One-click workflow automation" },
                { icon: Clock, text: "Scheduled task execution" },
                { icon: CheckCircle, text: "Error prevention system" }
              ],
              reverse: true
            },
            {
              id: "3",              title: "Seamless Integrations",              description: "Connect with 500+ popular tools and platforms to create a unified ecosystem that works exactly how your team operates.",              media: {
                imageSrc: "https://img.b2bpic.net/free-photo/information-technology-connection-graphics-concept_53876-121040.jpg",                imageAlt: "api integration software integration connected systems data sync"
              },
              items: [
                { icon: Link2, text: "500+ pre-built integrations" },
                { icon: Code, text: "Custom API access" },
                { icon: GitBranch, text: "Webhook support" }
              ],
              reverse: false
            }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <SplitAbout
          title="Why Choose SaaS Pro"
          description="Built by industry veterans with decades of experience, we understand the challenges modern teams face. Our platform combines cutting-edge technology with user-centric design."
          tag="Our Advantage"
          tagIcon={Award}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          imagePosition="right"
          imageSrc="https://img.b2bpic.net/free-photo/hand-touching-tablet_1134-117.jpg"
          imageAlt="Security and Trust"
          bulletPoints={[
            {
              title: "Enterprise-Grade Security",              description: "SOC 2 Type II certified with end-to-end encryption and 99.99% uptime guarantee.",              icon: Shield
            },
            {
              title: "Industry-Leading Support",              description: "24/7 dedicated support team with average response time under 2 hours.",              icon: Headphones
            },
            {
              title: "Unlimited Scalability",              description: "Handle millions of transactions and grow without worrying about infrastructure limits.",              icon: TrendingUp
            },
            {
              title: "Transparent Pricing",              description: "No hidden fees or surprise charges. Pay only for what you use with flexible billing.",              icon: DollarSign
            }
          ]}
          buttons={[
            { text: "Learn More", href: "#" }
          ]}
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardFourteen
          title="Trusted by teams worldwide to drive growth and efficiency."
          tag="Impact"
          useInvertedBackground="noInvert"
          metrics={[
            {
              id: "1",              value: "50K+",              description: "Active users across 120+ countries leveraging our platform daily"
            },
            {
              id: "2",              value: "98%",              description: "Customer satisfaction rate with industry-leading Net Promoter Score"
            },
            {
              id: "3",              value: "10M+",              description: "Automated workflows executed monthly saving teams countless hours"
            },
            {
              id: "4",              value: "99.99%",              description: "Uptime guarantee backed by our commitment to reliability"
            }
          ]}
        />
      </div>

      <div id="pricing" data-section="pricing">
        <PricingCardNine
          title="Simple, Transparent Pricing"
          description="Choose the perfect plan for your team. Always flexible to scale up or down as your needs evolve."
          tag="Pricing"
          tagIcon={DollarSign}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="slide-up"
          plans={[
            {
              id: "starter",              title: "Starter",              price: "$49",              period: "/month",              imageSrc: "https://img.b2bpic.net/free-photo/business-report-graphs-charts-business-reports-pile-documents-business-concept_1150-2254.jpg",              imageAlt: "Starter Plan",              button: {
                text: "Start Free Trial",                href: "#"
              },
              features: [
                "Up to 5 team members",                "Core analytics and reporting",                "100 automated workflows",                "Email support",                "Basic integrations"
              ]
            },
            {
              id: "professional",              title: "Professional",              price: "$149",              period: "/month",              imageSrc: "https://img.b2bpic.net/free-photo/programming-background-with-html_23-2150038862.jpg",              imageAlt: "Professional Plan",              button: {
                text: "Start Free Trial",                href: "#"
              },
              features: [
                "Up to 50 team members",                "Advanced analytics and AI insights",                "Unlimited automated workflows",                "Priority support",                "500+ integrations",                "Custom workflows"
              ]
            },
            {
              id: "enterprise",              title: "Enterprise",              price: "Custom",              period: "pricing",              imageSrc: "https://img.b2bpic.net/free-photo/luxurious-boardroom-space-within-multinational-company-used-meetings_482257-124520.jpg",              imageAlt: "Enterprise Plan",              button: {
                text: "Contact Sales",                href: "#"
              },
              features: [
                "Unlimited team members",                "Custom integrations",                "Dedicated account manager",                "SLA guarantee",                "Advanced security features",                "Custom training and onboarding"
              ]
            }
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardFifteen
          testimonial="SaaS Pro transformed how our team operates. We automated 40% of our manual tasks in the first month, saving hundreds of hours and allowing us to focus on strategy instead of repetitive work."
          rating={5}
          author="Sarah Chen, VP Operations at TechCorp"
          useInvertedBackground="noInvert"
          avatars={[
            {
              src: "https://img.b2bpic.net/free-photo/close-up-positive-businesswoman_1098-3531.jpg",              alt: "Customer testimonial 1"
            },
            {
              src: "https://img.b2bpic.net/free-photo/closeup-smiling-beautiful-adult-businesswoman_1262-1760.jpg",              alt: "Customer testimonial 2"
            },
            {
              src: "https://img.b2bpic.net/free-photo/portrait-business-woman-office_1398-6.jpg",              alt: "Customer testimonial 3"
            },
            {
              src: "https://img.b2bpic.net/free-photo/confident-middle-aged-businesswoman-looking-camera_74855-4120.jpg",              alt: "Customer testimonial 4"
            },
            {
              src: "https://img.b2bpic.net/free-photo/business-woman-banner-concept-with-copy-space_23-2149601533.jpg",              alt: "Customer testimonial 5"
            },
            {
              src: "https://img.b2bpic.net/free-photo/close-up-good-looking-smiling-friendly-female-trainee-ready-tackle-assignments-smiling-broadly-feeling-lucky-day-work-self-assured-encouraged-achieve-success-goal-white-wall_176420-35567.jpg",              alt: "Customer testimonial 6"
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCTA
          tag="Ready to Transform Your Workflow?"
          tagIcon={Rocket}
          title="Join Thousands of Teams Using SaaS Pro"
          description="Start your free 14-day trial today. No credit card required. Get instant access to all features and see how SaaS Pro can streamline your operations."
          background={{ variant: "radial-gradient" }}
          useInvertedBackground="noInvert"
          buttons={[
            { text: "Start Free Trial", href: "#pricing" },
            { text: "Schedule Demo", href: "#" }
          ]}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterMedia
          imageSrc="https://img.b2bpic.net/free-photo/financial-charts-kpi-metrics-displays-office_482257-126638.jpg"
          imageAlt="Modern office workspace"
          logoText="SaaS Pro"
          copyrightText="© 2025 SaaS Pro. All rights reserved."
          columns={[
            {
              title: "Product",              items: [
                { label: "Features", href: "#features" },
                { label: "Pricing", href: "#pricing" },
                { label: "Security", href: "#" },
                { label: "Roadmap", href: "#" }
              ]
            },
            {
              title: "Company",              items: [
                { label: "About Us", href: "#about" },
                { label: "Blog", href: "#" },
                { label: "Careers", href: "#" },
                { label: "Contact", href: "#contact" }
              ]
            },
            {
              title: "Resources",              items: [
                { label: "Documentation", href: "#" },
                { label: "API Reference", href: "#" },
                { label: "Community", href: "#" },
                { label: "Support", href: "#" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}