"use client"
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import HeroBillboardDashboard from '@/components/sections/hero/HeroBillboardDashboard';
import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import { Sparkles, Hexagon, Home, BarChart3, Users, Settings, Zap, TrendingUp, AlertCircle, Award, MessageCircle, Star, Shield } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="slide-background"
      defaultTextAnimation="entrance-slide"
      borderRadius="sharp"
      contentWidth="smallMedium"
      sizing="largeSmallSizeLargeTitles"
      background="circleGradient"
      cardStyle="elevated"
      primaryButtonStyle="radial-glow"
      secondaryButtonStyle="layered"
      headingFontWeight="semibold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          brandName="SaasPro"
          navItems={[
            { name: "Features", id: "features" },
            { name: "Pricing", id: "pricing" },
            { name: "Testimonials", id: "testimonials" },
            { name: "Contact", id: "contact" }
          ]}
          button={{
            text: "Get Started",            href: "#pricing"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboardDashboard
          title="Real-Time Analytics for Modern Teams"
          description="Monitor performance, collaborate seamlessly, and make data-driven decisions. All in one intuitive platform."
          tag="Powerful Analytics"
          tagIcon={Sparkles}
          buttons={[
            { text: "Start Free Trial", href: "#pricing" },
            { text: "View Demo", href: "#features" }
          ]}
          background={{ variant: "radial-gradient" }}
          dashboard={{
            title: "Analytics Hub",            logoIcon: Hexagon,
            imageSrc: "https://img.b2bpic.net/free-vector/professional-dashboard-user-panel_23-2148368370.jpg",            imageAlt: "dashboard analytics saas interface metrics charts data",            searchPlaceholder: "Search metrics...",            buttons: [
              { text: "Dashboard", href: "#" },
              { text: "Export Report", href: "#" }
            ],
            sidebarItems: [
              { icon: Home, active: true },
              { icon: BarChart3 },
              { icon: Users },
              { icon: Settings }
            ],
            stats: [
              {
                title: "Total Revenue",                values: [245890, 312750, 425600],
                valuePrefix: "$",                description: "Monthly recurring revenue"
              },
              {
                title: "Active Users",                values: [8420, 12560, 15890],
                description: "Authenticated users"
              },
              {
                title: "Conversion Rate",                values: [3.2, 4.1, 5.8],
                valueSuffix: "%",                description: "Average conversion rate"
              }
            ],
            chartTitle: "Performance Trend",            chartData: [
              { value: 65 },
              { value: 45 },
              { value: 80 },
              { value: 55 },
              { value: 90 },
              { value: 70 },
              { value: 85 }
            ],
            listTitle: "Recent Events",            listItems: [
              {
                icon: TrendingUp,
                title: "Revenue increased 24%",                status: "Confirmed"
              },
              {
                icon: Users,
                title: "New signup wave detected",                status: "Active"
              },
              {
                icon: AlertCircle,
                title: "API response time optimal",                status: "Healthy"
              }
            ]
          }}
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardNine
          title="Powerful Features Built for Scale"
          description="Everything you need to track, analyze, and optimize your business performance."
          tag="Key Features"
          tagIcon={Zap}
          showStepNumbers={true}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          features={[
            {
              id: 1,
              title: "Seamless Integration",              description: "Connect all your data sources with one-click integrations. Your tools work harder together.",              phoneOne: {
                imageSrc: "https://img.b2bpic.net/free-photo/information-technology-connection-graphics-concept_53876-121040.jpg",                imageAlt: "automation workflow process efficiency integration tools"
              },
              phoneTwo: {
                imageSrc: "https://img.b2bpic.net/free-photo/standard-quality-control-collage-concept_23-2149595844.jpg",                imageAlt: "analytics reporting data insights dashboard performance"
              }
            },
            {
              id: 2,
              title: "Real-Time Insights",              description: "Get instant visibility into your metrics. Watch trends unfold and respond in seconds, not hours.",              phoneOne: {
                imageSrc: "https://img.b2bpic.net/free-photo/standard-quality-control-collage-concept_23-2149595844.jpg",                imageAlt: "analytics reporting data insights dashboard performance"
              },
              phoneTwo: {
                imageSrc: "https://img.b2bpic.net/free-photo/automation-production-system-operation-precess-concept_53876-138637.jpg",                imageAlt: "collaboration teamwork communication workspace meeting together"
              }
            },
            {
              id: 3,
              title: "Team Collaboration",              description: "Built-in collaboration tools let your team work together effortlessly. Share insights, align on decisions.",              phoneOne: {
                imageSrc: "https://img.b2bpic.net/free-photo/automation-production-system-operation-precess-concept_53876-138637.jpg",                imageAlt: "collaboration teamwork communication workspace meeting together"
              },
              phoneTwo: {
                imageSrc: "https://img.b2bpic.net/free-photo/standard-quality-control-concept-m_23-2150041843.jpg",                imageAlt: "security protection lock privacy shield encryption safe"
              }
            }
          ]}
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardTwo
          title="Trusted by Industry Leaders"
          description="Join thousands of companies that use SaasPro to drive growth and optimize performance."
          tag="By The Numbers"
          tagIcon={Award}
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          metrics={[
            {
              id: "1",              value: "10K+",              description: "Active Companies"
            },
            {
              id: "2",              value: "98%",              description: "Uptime SLA"
            },
            {
              id: "3",              value: "$2.3B",              description: "Data Processed Daily"
            },
            {
              id: "4",              value: "50+",              description: "Enterprise Integrations"
            }
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardThirteen
          title="What Our Customers Say"
          description="Hear from companies that have transformed their operations with SaasPro."
          tag="Customer Stories"
          tagIcon={MessageCircle}
          showRating={true}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          testimonials={[
            {
              id: "1",              name: "Sarah Johnson",              handle: "@sarah_j",              testimonial: "SaasPro transformed how we track metrics. We reduced reporting time by 80% and gained real-time visibility into all operations.",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg",              imageAlt: "portrait professional headshot business person woman face"
            },
            {
              id: "2",              name: "Michael Chen",              handle: "@m_chen",              testimonial: "The integration capabilities are incredible. We connected all our tools without touching a single line of code. Game changer.",              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: "portrait professional headshot business person man face"
            },
            {
              id: "3",              name: "Emily Rodriguez",              handle: "@emily_r",              testimonial: "Our team loves the collaboration features. Sharing insights and aligning on decisions has never been easier. Highly recommended.",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/close-up-competitive-employee_1098-2870.jpg",              imageAlt: "portrait professional headshot business person female face"
            },
            {
              id: "4",              name: "David Kim",              handle: "@david_k",              testimonial: "The customer support is exceptional. Every question answered within minutes. Combined with a powerful product, it's unbeatable.",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/closeup-handsome-middle-aged-business-leader_1262-4822.jpg",              imageAlt: "portrait professional headshot business person male face"
            },
            {
              id: "5",              name: "Jessica Lee",              handle: "@jess_lee",              testimonial: "Finally, a platform that scales with our growth. Started with 2 users, now we have 500+ in our organization. Zero issues.",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/positive-middle-aged-business-leader-window_1262-5388.jpg",              imageAlt: "portrait professional headshot business person diverse face"
            },
            {
              id: "6",              name: "Thomas Wright",              handle: "@t_wright",              testimonial: "ROI was immediate. We cut analysis time in half and discovered new growth opportunities. Worth every penny of our investment.",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/positive-confident-businessman-posing-outside_74855-1183.jpg",              imageAlt: "portrait professional headshot business person executive face"
            }
          ]}
        />
      </div>

      <div id="pricing" data-section="pricing">
        <PricingCardEight
          title="Simple, Transparent Pricing"
          description="Choose the perfect plan for your team. Always know what you're paying with no hidden fees."
          tag="Flexible Plans"
          tagIcon={Zap}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          plans={[
            {
              id: "starter",              badge: "Popular for Teams",              badgeIcon: Star,
              price: "$49/mo",              subtitle: "Perfect for growing teams",              buttons: [
                { text: "Start Free Trial", href: "#" }
              ],
              features: [
                "Up to 10 team members",                "Basic analytics dashboard",                "5 integrations included",                "Email support",                "Monthly reports",                "7-day data retention"
              ]
            },
            {
              id: "professional",              badge: "Most Popular",              badgeIcon: Sparkles,
              price: "$149/mo",              subtitle: "For scaling operations",              buttons: [
                { text: "Start Free Trial", href: "#" }
              ],
              features: [
                "Unlimited team members",                "Advanced analytics & AI insights",                "25 integrations included",                "Priority support",                "Custom reports & scheduling",                "90-day data retention",                "Custom dashboards",                "API access"
              ]
            },
            {
              id: "enterprise",              badge: "For Large Organizations",              badgeIcon: Shield,
              price: "Custom",              subtitle: "Tailored to your needs",              buttons: [
                { text: "Contact Sales", href: "#contact" }
              ],
              features: [
                "Unlimited everything",                "White-label solution",                "Unlimited integrations",                "24/7 dedicated support",                "Advanced security & compliance",                "Unlimited data retention",                "Custom integrations",                "SLA guarantee",                "Onboarding & training",                "Advanced analytics"
              ]
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCTA
          tag="Ready to Get Started?"
          tagIcon={Zap}
          title="Join Thousands of Teams Using SaasPro"
          description="Start tracking what matters with our free trial. No credit card required. Get instant access to all features and see the difference real-time analytics can make."
          buttons={[
            { text: "Start Free Trial", href: "#" },
            { text: "Schedule a Demo", href: "#" }
          ]}
          background={{ variant: "gradient-bars" }}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoReveal
          logoText="SaasPro"
          leftLink={{
            text: "Privacy Policy",            href: "#"
          }}
          rightLink={{
            text: "Terms of Service",            href: "#"
          }}
        />
      </div>
    </ThemeProvider>
  );
}