"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroOverlay from '@/components/sections/hero/HeroOverlay';
import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
import PricingCardOne from '@/components/sections/pricing/PricingCardOne';
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import { Clock, Lightbulb, Rocket, Shield, Star, Users, Zap } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="icon-arrow"
      defaultTextAnimation="background-highlight"
      borderRadius="soft"
      contentWidth="mediumLarge"
      sizing="largeSmallSizeMediumTitles"
      background="circleGradient"
      cardStyle="gradient-mesh"
      primaryButtonStyle="diagonal-gradient"
      secondaryButtonStyle="solid"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          brandName="SaaScale"
          navItems={[
            { name: "Features", id: "features" },
            { name: "Pricing", id: "pricing" },
            { name: "Testimonials", id: "testimonials" },
            { name: "About", id: "about" },
            { name: "Contact", id: "contact" }
          ]}
          button={{
            text: "Get Started",            href: "contact"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroOverlay
          title="Scale Your Business with Intelligent SaaS Solutions"
          description="Empower your team with powerful automation, real-time analytics, and seamless integrations. SaaScale helps you achieve more with less."
          tag="Launch Your Growth"
          tagIcon={Rocket}
          imageSrc="https://img.b2bpic.net/free-photo/woman-watching-business-conference-computer-screen-looking-statistics_482257-125563.jpg"
          imageAlt="Modern SaaS dashboard interface"
          textPosition="bottom-left"
          showBlur={true}
          showDimOverlay={true}
          buttons={[
            { text: "Start Free Trial", href: "contact" },
            { text: "Watch Demo", href: "https://www.youtube.com" }
          ]}
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardNineteen
          title="Streamline Your Workflow"
          description="Discover how our platform transforms the way your team works"
          tag="Core Features"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          features={[
            {
              id: 1,
              tag: "Intelligence",              title: "Intelligent Automation",              subtitle: "Save countless hours with smart workflows",              description: "Our AI-powered automation engine learns your business patterns and automates repetitive tasks, reducing manual work by up to 80% while maintaining accuracy and consistency.",              imageSrc: "https://img.b2bpic.net/free-photo/information-technology-connection-graphics-concept_53876-121040.jpg",              imageAlt: "Automation workflow interface"
            },
            {
              id: 2,
              tag: "Analytics",              title: "Real-Time Analytics",              subtitle: "Make decisions backed by data insights",              description: "Access comprehensive dashboards with actionable insights. Track key metrics in real-time, identify trends, and optimize performance with powerful visualization tools.",              imageSrc: "https://img.b2bpic.net/free-photo/standard-quality-control-collage-concept_23-2149595844.jpg",              imageAlt: "Analytics dashboard with metrics"
            },
            {
              id: 3,
              tag: "Integration",              title: "Seamless Integrations",              subtitle: "Connect your entire tech stack effortlessly",              description: "Integrate with 500+ popular applications and services. Our API-first architecture ensures smooth data flow between all your tools without requiring technical expertise.",              imageSrc: "https://img.b2bpic.net/free-photo/automation-production-system-operation-precess-concept_53876-138637.jpg",              imageAlt: "Integration ecosystem visualization"
            }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <TestimonialAboutCard
          tag="Who We Are"
          title="Built by experts for modern teams who demand excellence"
          description="Sarah Chen"
          subdescription="Founder & CEO, SaaScale"
          icon={Lightbulb}
          imageSrc="https://img.b2bpic.net/free-photo/team-diverse-coworkers-modern-office-discuss-their-project-together_93675-133516.jpg"
          imageAlt="Our collaborative team working together"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="pricing" data-section="pricing">
        <PricingCardOne
          title="Choose Your Plan"
          description="Flexible pricing designed to scale with your business. Start free, upgrade anytime."
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="slide-up"
          plans={[
            {
              id: "1",              badge: "Starter",              price: "$29",              subtitle: "/month • Perfect for small teams",              features: [
                "Up to 5 team members",                "5,000 automated workflows",                "Basic analytics dashboard",                "Community support",                "Email integrations"
              ]
            },
            {
              id: "2",              badge: "Professional",              badgeIcon: Star,
              price: "$99",              subtitle: "/month • Most popular choice",              features: [
                "Up to 50 team members",                "Unlimited workflows",                "Advanced analytics & AI insights",                "Priority email & chat support",                "500+ app integrations",                "Custom workflows builder",                "API access"
              ]
            },
            {
              id: "3",              badge: "Enterprise",              price: "Custom",              subtitle: "For large-scale operations",              features: [
                "Unlimited team members",                "Unlimited everything",                "Dedicated account manager",                "24/7 phone & email support",                "Custom integrations",                "Advanced security features",                "SLA guarantee",                "On-premise option"
              ]
            }
          ]}
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardOne
          title="Our Impact"
          description="Trusted by thousands of businesses worldwide to drive growth and efficiency"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="slide-up"
          gridVariant="uniform-all-items-equal"
          metrics={[
            {
              id: "1",              value: "50K",              title: "Active Users",              description: "Teams powered by SaaScale daily",              icon: Users
            },
            {
              id: "2",              value: "500M",              title: "Tasks Automated",              description: "Workflows completed successfully",              icon: Zap
            },
            {
              id: "3",              value: "99.9%",              title: "Uptime",              description: "Enterprise-grade reliability",              icon: Shield
            },
            {
              id: "4",              value: "40H",              title: "Time Saved",              description: "Average per team per month",              icon: Clock
            }
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardOne
          title="What Our Customers Say"
          description="Join thousands of satisfied teams who've transformed their operations with SaaScale"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="slide-up"
          gridVariant="uniform-all-items-equal"
          testimonials={[
            {
              id: "1",              name: "Michael Rodriguez",              role: "Operations Director",              company: "TechVenture Inc",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg",              imageAlt: "Michael Rodriguez headshot"
            },
            {
              id: "2",              name: "Jessica Anderson",              role: "CEO",              company: "Growth Collective",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/smiling-homosexual-man-official-suit-looking-camera-close-up-shot-happy-gay-getting-dressed-wedding-ceremony-standing-hotel-room-with-his-partner-background-love-emotion-concept_74855-22675.jpg",              imageAlt: "Jessica Anderson headshot"
            },
            {
              id: "3",              name: "David Kumar",              role: "Product Manager",              company: "StartupXYZ",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/close-up-competitive-employee_1098-2870.jpg",              imageAlt: "David Kumar headshot"
            },
            {
              id: "4",              name: "Emily Thompson",              role: "Founder",              company: "Scale Digital",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/closeup-handsome-middle-aged-business-leader_1262-4822.jpg",              imageAlt: "Emily Thompson headshot"
            },
            {
              id: "5",              name: "James Wilson",              role: "CTO",              company: "InnovateLab",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/positive-middle-aged-business-leader-window_1262-5388.jpg",              imageAlt: "James Wilson headshot"
            },
            {
              id: "6",              name: "Rachel Moore",              role: "Director of Operations",              company: "Enterprise Solutions",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/happy-young-professional-posing-office_1262-21170.jpg",              imageAlt: "Rachel Moore headshot"
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplitForm
          title="Ready to Transform Your Business?"
          description="Join thousands of teams already scaling with SaaScale. Get started with a free trial—no credit card required. Our team is here to help you succeed."
          inputs={[
            {
              name: "fullName",              type: "text",              placeholder: "Full Name",              required: true
            },
            {
              name: "email",              type: "email",              placeholder: "Work Email",              required: true
            },
            {
              name: "company",              type: "text",              placeholder: "Company Name",              required: true
            },
            {
              name: "teamSize",              type: "text",              placeholder: "Team Size",              required: false
            }
          ]}
          textarea={{
            name: "message",            placeholder: "Tell us about your goals and challenges",            rows: 5,
            required: false
          }}
          useInvertedBackground="noInvert"
          imageSrc="https://img.b2bpic.net/free-photo/happy-african-american-businesswoman-drinking-coffee-conference-call-laptop_637285-12927.jpg"
          imageAlt="Professional team collaborating"
          mediaPosition="right"
          buttonText="Start Free Trial"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoEmphasis
          logoText="SaaScale"
          columns={[
            {
              items: [
                { label: "Product", href: "features" },
                { label: "Features", href: "features" },
                { label: "Pricing", href: "pricing" },
                { label: "Security", href: "#" }
              ]
            },
            {
              items: [
                { label: "Company", href: "about" },
                { label: "About Us", href: "about" },
                { label: "Blog", href: "#" },
                { label: "Careers", href: "#" }
              ]
            },
            {
              items: [
                { label: "Support", href: "contact" },
                { label: "Contact", href: "contact" },
                { label: "Documentation", href: "#" },
                { label: "Community", href: "#" }
              ]
            },
            {
              items: [
                { label: "Legal", href: "#" },
                { label: "Privacy Policy", href: "#" },
                { label: "Terms of Service", href: "#" },
                { label: "Cookie Policy", href: "#" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}