"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
import FeatureBorderGlow from '@/components/sections/feature/featureBorderGlow/FeatureBorderGlow';
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
import PricingCardFive from '@/components/sections/pricing/PricingCardFive';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
import FaqBase from '@/components/sections/faq/FaqBase';
import ContactText from '@/components/sections/contact/ContactText';
import FooterCard from '@/components/sections/footer/FooterCard';
import { BarChart3, Crown, Cpu, DollarSign, Github, Heart, HelpCircle, Linkedin, Plug, Rocket, Shield, Sparkles, Star, TrendingUp, Twitter, Users, Zap } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="shift-hover"
      defaultTextAnimation="background-highlight"
      borderRadius="soft"
      contentWidth="mediumLarge"
      sizing="large"
      background="circleGradient"
      cardStyle="solid"
      primaryButtonStyle="radial-glow"
      secondaryButtonStyle="solid"
      headingFontWeight="light"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleFullscreen
          brandName="SaaS Pro"
          navItems={[
            { name: "Features", id: "features" },
            { name: "Pricing", id: "pricing" },
            { name: "Testimonials", id: "testimonials" },
            { name: "FAQ", id: "faq" },
            { name: "Contact", id: "contact" }
          ]}
          bottomLeftText="Global SaaS Community"
          bottomRightText="hello@saaspro.com"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroLogoBillboard
          logoText="SaaS Pro"
          description="Streamline your workflow with our intelligent platform. Automate tasks, gain insights, and scale your business without complexity."
          buttons={[
            { text: "Start Free Trial", href: "#contact" },
            { text: "View Demo", href: "#features" }
          ]}
          background={{ variant: "sparkles-gradient" }}
          imageSrc="https://img.b2bpic.net/free-vector/professional-dashboard-user-panel_23-2148368370.jpg"
          imageAlt="SaaS Pro Dashboard Interface"
          frameStyle="browser"
        />
      </div>

      <div id="features" data-section="features">
        <FeatureBorderGlow
          title="Powerful Features Built for Success"
          description="Everything you need to streamline operations and drive growth"
          tag="Features"
          tagIcon={Sparkles}
          features={[
            {
              icon: Zap,
              title: "Lightning Fast",              description: "Optimized for speed with sub-second response times and automated workflows that save hours of manual work daily."
            },
            {
              icon: BarChart3,
              title: "Advanced Analytics",              description: "Real-time dashboards and insights that help you understand your data and make informed decisions quickly."
            },
            {
              icon: Plug,
              title: "Seamless Integration",              description: "Connect with 500+ tools and services you already use. APIs, webhooks, and native integrations included."
            },
            {
              icon: Shield,
              title: "Enterprise Security",              description: "Bank-level encryption, SOC 2 compliance, and regular security audits keep your data safe and protected."
            },
            {
              icon: Users,
              title: "Team Collaboration",              description: "Built-in collaboration tools with real-time editing, comments, and permissions management for teams of any size."
            },
            {
              icon: Cpu,
              title: "AI-Powered Automation",              description: "Intelligent automation that learns from your workflow and suggests optimizations to maximize efficiency and results."
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardEleven
          title="Trusted by Growing Teams"
          description="Join thousands of companies that have transformed their operations"
          tag="Impact"
          tagIcon={TrendingUp}
          metrics={[
            {
              id: "1",              value: "50K+",              title: "Active Users",              description: "Growing community of teams worldwide",              imageSrc: "https://img.b2bpic.net/free-photo/three-creative-people-having-discussion-cafe-african-woman-explaining-her-vision-pointing-screen-touch-pad-bearded-man-glasses-listening-attentively-redhead-partner-making-notes_273609-6354.jpg",              imageAlt: "Active users collaboration"
            },
            {
              id: "2",              value: "99.99%",              title: "Uptime SLA",              description: "Reliable infrastructure you can depend on",              imageSrc: "https://img.b2bpic.net/free-photo/lifestyle-people-office_23-2149173739.jpg",              imageAlt: "Server reliability monitoring"
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="pricing" data-section="pricing">
        <PricingCardFive
          title="Transparent Pricing for Every Stage"
          description="Choose the perfect plan for your needs. Scale as you grow."
          tag="Pricing"
          tagIcon={DollarSign}
          plans={[
            {
              id: "starter",              tag: "Starter Plan",              tagIcon: Rocket,
              price: "$29",              period: "/month",              description: "Perfect for individuals and small teams getting started.",              button: { text: "Start Free Trial", href: "#contact" },
              featuresTitle: "What's Included:",              features: [
                "Up to 5 projects",                "Basic analytics",                "Community support",                "1GB storage",                "Email integrations"
              ]
            },
            {
              id: "professional",              tag: "Professional Plan",              tagIcon: Star,
              price: "$99",              period: "/month",              description: "For growing teams that need more power and control.",              button: { text: "Start Free Trial", href: "#contact" },
              featuresTitle: "Everything in Starter, plus:",              features: [
                "Unlimited projects",                "Advanced analytics & AI insights",                "Priority email support",                "100GB storage",                "Custom integrations",                "Team collaboration tools",                "Advanced permissions"
              ]
            },
            {
              id: "enterprise",              tag: "Enterprise Plan",              tagIcon: Crown,
              price: "Custom",              period: "quote",              description: "For large organizations with advanced needs.",              button: { text: "Contact Sales", href: "#contact" },
              featuresTitle: "Everything in Professional, plus:",              features: [
                "Unlimited everything",                "Dedicated account manager",                "24/7 phone & email support",                "Unlimited storage",                "Custom development",                "SSO & advanced security",                "99.99% SLA guarantee",                "On-premise options available"
              ]
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardSix
          title="Loved by Teams Everywhere"
          description="See what our customers have to say about their experience"
          tag="Reviews"
          tagIcon={Heart}
          testimonials={[
            {
              id: "1",              name: "Sarah Johnson",              handle: "CEO at TechStart",              testimonial: "SaaS Pro transformed how we manage projects. We saved 20 hours per week on administrative tasks alone.",              imageSrc: "https://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg",              imageAlt: "Sarah Johnson"
            },
            {
              id: "2",              name: "Michael Chen",              handle: "Operations Director",              testimonial: "The integration capabilities are incredible. We connected all our tools in minutes and the automation is a game-changer.",              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: "Michael Chen"
            },
            {
              id: "3",              name: "Emily Rodriguez",              handle: "Founder at GrowthCo",              testimonial: "Best investment we made this year. The analytics alone have helped us identify growth opportunities worth $500K+.",              imageSrc: "https://img.b2bpic.net/free-photo/close-up-competitive-employee_1098-2870.jpg",              imageAlt: "Emily Rodriguez"
            },
            {
              id: "4",              name: "David Kim",              handle: "CTO at InnovateLab",              testimonial: "Outstanding customer support and constant feature updates. They genuinely listen to user feedback and implement it quickly.",              imageSrc: "https://img.b2bpic.net/free-photo/positive-confident-businessman-posing-outside_74855-1183.jpg",              imageAlt: "David Kim"
            },
            {
              id: "5",              name: "Jessica Martinez",              handle: "Product Manager",              testimonial: "The learning curve was minimal. Our entire team was productive within a day. The documentation is exceptional.",              imageSrc: "https://img.b2bpic.net/free-photo/closeup-handsome-middle-aged-business-leader_1262-4822.jpg",              imageAlt: "Jessica Martinez"
            },
            {
              id: "6",              name: "Robert Thompson",              handle: "VP Engineering",              testimonial: "Security and compliance features give us peace of mind. Perfect for handling sensitive client data with confidence.",              imageSrc: "https://img.b2bpic.net/free-photo/positive-middle-aged-business-leader-window_1262-5388.jpg",              imageAlt: "Robert Thompson"
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          speed={40}
          topMarqueeDirection="left"
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqBase
          title="Frequently Asked Questions"
          description="Everything you need to know about SaaS Pro and how it can help your business succeed"
          tag="Help"
          tagIcon={HelpCircle}
          faqs={[
            {
              id: "1",              title: "How do I get started with SaaS Pro?",              content: "Getting started is easy! Sign up for a free account, invite your team, and connect your existing tools. Our onboarding guide will walk you through setup in minutes. Most teams are productive within their first day."
            },
            {
              id: "2",              title: "Is my data secure with SaaS Pro?",              content: "Security is our top priority. We use AES-256 encryption for data at rest, TLS 1.2+ for data in transit, and undergo regular SOC 2 Type II audits. We're GDPR and HIPAA compliant, with enterprise customers able to use dedicated infrastructure."
            },
            {
              id: "3",              title: "What integrations are available?",              content: "We support 500+ native integrations with popular tools like Slack, Zapier, Salesforce, HubSpot, Stripe, and more. We also provide comprehensive APIs and webhooks for custom integrations. Check our integration marketplace for the complete list."
            },
            {
              id: "4",              title: "Can I cancel my subscription anytime?",              content: "Yes, absolutely. You can cancel your subscription anytime with no lock-in contracts or hidden fees. If you're on an annual plan, we offer a 30-day money-back guarantee. We'd love to hear feedback about why you're leaving so we can improve."
            },
            {
              id: "5",              title: "Do you offer enterprise support?",              content: "Yes. Enterprise customers get a dedicated account manager, 24/7 phone and email support, custom SLAs, and the option for on-premise deployment. Contact our sales team for custom enterprise packages."
            },
            {
              id: "6",              title: "How often do you release new features?",              content: "We release new features and improvements weekly. Major features are typically rolled out monthly. Enterprise customers can request priority features and custom development. Check our roadmap to see what's coming next."
            }
          ]}
          animationType="smooth"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactText
          text="Ready to transform your workflow and scale your business? Start your free trial today with no credit card required."
          animationType="entrance-slide"
          buttons={[
            { text: "Get Started Free", href: "#" },
            { text: "Schedule Demo", href: "#" }
          ]}
          background={{ variant: "plain" }}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterCard
          logoText="SaaS Pro"
          copyrightText="© 2025 SaaS Pro. All rights reserved."
          socialLinks={[
            { icon: Twitter, href: "https://twitter.com/saaspro", ariaLabel: "Twitter" },
            { icon: Linkedin, href: "https://linkedin.com/company/saaspro", ariaLabel: "LinkedIn" },
            { icon: Github, href: "https://github.com/saaspro", ariaLabel: "GitHub" }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}