"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import FeatureBento from '@/components/sections/feature/FeatureBento';
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
import TextAbout from '@/components/sections/about/TextAbout';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import { Check, Clock, CreditCard, HelpCircle, Quote, Sparkles, Star, TrendingUp, Users, Workflow, Zap, Package, Shield, MessageCircle, Share2, Eye } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-bubble"
      defaultTextAnimation="entrance-slide"
      borderRadius="sharp"
      contentWidth="compact"
      sizing="mediumLargeSizeLargeTitles"
      background="circleGradient"
      cardStyle="gradient-radial"
      primaryButtonStyle="flat"
      secondaryButtonStyle="layered"
      headingFontWeight="normal"
    >
      <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="Built for Teams"
          bottomRightText="hello@saaspro.com"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboard
          title="Build Faster. Scale Smarter."
          description="Streamline your workflow with intelligent automation, real-time analytics, and seamless integrations. Trusted by 5,000+ growing teams worldwide."
          background={{ variant: "sparkles-gradient" }}
          tag="Launch Week Special"
          tagIcon={Sparkles}
          imageSrc="https://img.b2bpic.net/free-photo/close-up-modern-laptop-with-rate-charts-display-while-man-woman-working-business-project-design-computer-screen-with-data-chart-information-finance-analysis-desk_482257-40065.jpg"
          imageAlt="SaaS product dashboard interface"
          buttons={[
            { text: "Start Free Trial", href: "#contact" },
            { text: "View Demo", href: "https://example.com/demo" }
          ]}
          avatars={[
            { src: "https://img.b2bpic.net/free-photo/happy-young-professional-posing-office_1262-21170.jpg", alt: "Customer 1" },
            { src: "https://img.b2bpic.net/free-photo/positive-middle-aged-business-leader-window_1262-5388.jpg", alt: "Customer 2" },
            { src: "https://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1649.jpg", alt: "Customer 3" }
          ]}
          avatarText="Trusted by 5,000+ teams"
        />
      </div>

      <div id="features" data-section="features">
        <FeatureBento
          title="Powerful Features Built for Your Success"
          description="Everything you need to automate, analyze, and optimize your business in one intuitive platform."
          tag="Platform"
          tagIcon={Zap}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="slide-up"
          features={[
            {
              title: "Advanced Analytics",              description: "Track key metrics with real-time dashboards and detailed insights",              bentoComponent: "animated-bar-chart"
            },
            {
              title: "Smart Automation",              description: "Reduce manual work by automating repetitive workflows",              bentoComponent: "orbiting-icons",              centerIcon: Zap,
              items: [
                { icon: Clock, ring: 1 },
                { icon: Workflow, ring: 2 },
                { icon: Check, ring: 3 }
              ]
            },
            {
              title: "Seamless Integrations",              description: "Connect with 500+ tools and platforms instantly",              bentoComponent: "icon-info-cards",              items: [
                { icon: Package, label: "500+", value: "Integrations" },
                { icon: Zap, label: "1-Click", value: "Setup" },
                { icon: Shield, label: "Enterprise", value: "Security" }
              ]
            },
            {
              title: "Real-Time Collaboration",              description: "Work together seamlessly across teams and time zones",              bentoComponent: "marquee",              centerIcon: Users,
              variant: "icon",              icons: [Users, MessageCircle, Share2, Eye]
            }
          ]}
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardOne
          title="Proven Results"
          description="See the impact SaaS Pro has on businesses like yours"
          tag="Impact"
          tagIcon={TrendingUp}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          gridVariant="uniform-all-items-equal"
          animationType="scale-rotate"
          metrics={[
            {
              id: "1",              value: "73%",              title: "Time Saved",              description: "Average reduction in manual work per team",              icon: Clock
            },
            {
              id: "2",              value: "4.9",              title: "Star Rating",              description: "From 2,500+ verified customer reviews",              icon: Star
            },
            {
              id: "3",              value: "150K+",              title: "Active Users",              description: "Growing daily across all industries",              icon: Users
            },
            {
              id: "4",              value: "$2.3M",              title: "Saved Monthly",              description: "Cumulative cost savings for our customers",              icon: TrendingUp
            }
          ]}
        />
      </div>

      <div id="pricing" data-section="pricing">
        <PricingCardNine
          title="Simple, Transparent Pricing"
          description="Choose the plan that scales with your business. No hidden fees."
          tag="Pricing"
          tagIcon={CreditCard}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="slide-up"
          plans={[
            {
              id: "starter",              title: "Starter",              price: "$49",              period: "/month",              imageSrc: "https://img.b2bpic.net/free-photo/luxurious-boardroom-space-within-multinational-company-used-meetings_482257-124520.jpg",              imageAlt: "Starter plan features",              features: [
                "Up to 5 team members",                "Basic automation workflows",                "50+ integrations",                "Daily backups",                "Email support"
              ],
              button: { text: "Get Started", href: "#contact" }
            },
            {
              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 features",              features: [
                "Unlimited team members",                "Advanced automation & AI",                "All 500+ integrations",                "Real-time backups",                "Priority support",                "Custom workflows"
              ],
              button: { text: "Start Free Trial", href: "#contact" }
            },
            {
              id: "enterprise",              title: "Enterprise",              price: "Custom",              period: "/year",              imageSrc: "https://img.b2bpic.net/free-photo/hand-touching-tablet_1134-117.jpg",              imageAlt: "Enterprise plan features",              features: [
                "Dedicated account manager",                "Custom integrations",                "Advanced security & compliance",                "SLA guarantee",                "24/7 phone support",                "On-premise deployment"
              ],
              button: { text: "Contact Sales", href: "https://example.com/contact" }
            }
          ]}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqSplitMedia
          title="Frequently Asked Questions"
          description="Everything you need to know about SaaS Pro and how it can help your team"
          tag="Help"
          tagIcon={HelpCircle}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          imageSrc="https://img.b2bpic.net/free-photo/man-wheelchair-having-office-job_23-2149571066.jpg"
          imageAlt="Team collaboration"
          mediaPosition="right"
          animationType="smooth"
          faqs={[
            {
              id: "1",              title: "How quickly can we get started?",              content: "Most teams are up and running within 30 minutes. We provide personalized onboarding, templates, and comprehensive documentation to ensure a smooth setup process."
            },
            {
              id: "2",              title: "What integrations do you support?",              content: "We support 500+ integrations with popular tools like Slack, Salesforce, HubSpot, Zapier, and more. Custom API integrations are available on Enterprise plans."
            },
            {
              id: "3",              title: "Is my data secure?",              content: "Absolutely. We use enterprise-grade encryption, comply with GDPR, SOC 2, and ISO 27001 standards. All data is encrypted at rest and in transit with regular security audits."
            },
            {
              id: "4",              title: "Can we cancel anytime?",              content: "Yes, you can cancel anytime with no long-term contracts. We're confident you'll love SaaS Pro, but we never want to lock you in."
            },
            {
              id: "5",              title: "Do you offer custom training?",              content: "Yes! Professional and Enterprise customers get dedicated onboarding sessions, webinars, and ongoing support from our customer success team."
            },
            {
              id: "6",              title: "What kind of support do you provide?",              content: "We offer email support for all plans, priority support for Professional plans, and 24/7 phone support for Enterprise customers. Average response time is under 1 hour."
            }
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardTen
          title="Loved by Leading Teams"
          description="Hear from founders, CTOs, and managers who trust SaaS Pro to power their operations"
          tag="Testimonials"
          tagIcon={Quote}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          testimonials={[
            {
              id: "1",              title: "Cut our automation costs by 60%",              quote: "SaaS Pro transformed how we manage our workflows. We've eliminated countless manual hours and our team is far more productive. The ROI was immediate.",              name: "Sarah Chen",              role: "VP of Operations",              imageSrc: "https://img.b2bpic.net/free-photo/happy-young-professional-posing-office_1262-21170.jpg",              imageAlt: "Sarah Chen"
            },
            {
              id: "2",              title: "Best decision for our scaling team",              quote: "As we grew from 10 to 100+ team members, SaaS Pro grew with us seamlessly. The integrations alone saved us months of custom development.",              name: "Marcus Johnson",              role: "CEO",              imageSrc: "https://img.b2bpic.net/free-photo/positive-middle-aged-business-leader-window_1262-5388.jpg",              imageAlt: "Marcus Johnson"
            },
            {
              id: "3",              title: "Intuitive interface, powerful capabilities",              quote: "What impressed us most was how easy it is to use. Our non-technical team members were creating workflows within days. No training needed.",              name: "Elena Rodriguez",              role: "Operations Manager",              imageSrc: "https://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1649.jpg",              imageAlt: "Elena Rodriguez"
            },
            {
              id: "4",              title: "Enterprise security we can rely on",              quote: "Our security team was skeptical until they reviewed SaaS Pro's compliance certifications. Now it's our go-to solution for sensitive workflows.",              name: "David Kim",              role: "CTO",              imageSrc: "https://img.b2bpic.net/free-photo/happy-business-woman-standing-outdoors_1262-20546.jpg",              imageAlt: "David Kim"
            },
            {
              id: "5",              title: "Game changer for our customer success team",              quote: "Automating our customer onboarding flows with SaaS Pro meant we could finally focus on relationship building instead of busywork.",              name: "Lisa Wang",              role: "Head of Customer Success",              imageSrc: "https://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1563.jpg",              imageAlt: "Lisa Wang"
            },
            {
              id: "6",              title: "The support team is exceptional",              quote: "Whenever we hit a snag, their support team goes above and beyond. They feel like part of our team, not just vendors.",              name: "James Mitchell",              role: "Founder",              imageSrc: "https://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1588.jpg",              imageAlt: "James Mitchell"
            }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <TextAbout
          tag="Ready to Transform?"
          title="Join thousands of teams already working smarter with SaaS Pro"
          useInvertedBackground="noInvert"
          buttons={[
            { text: "Start Your Free Trial", href: "#contact" },
            { text: "Schedule a Demo", href: "https://example.com/demo" }
          ]}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterMedia
          imageSrc="https://img.b2bpic.net/free-photo/man-wheelchair-having-office-job_23-2149571066.jpg"
          imageAlt="Team working together"
          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: "https://example.com/security" },
                { label: "Roadmap", href: "https://example.com/roadmap" }
              ]
            },
            {
              title: "Company",              items: [
                { label: "About", href: "https://example.com/about" },
                { label: "Blog", href: "https://example.com/blog" },
                { label: "Careers", href: "https://example.com/careers" },
                { label: "Contact", href: "#contact" }
              ]
            },
            {
              title: "Legal",              items: [
                { label: "Privacy Policy", href: "https://example.com/privacy" },
                { label: "Terms of Service", href: "https://example.com/terms" },
                { label: "Cookie Policy", href: "https://example.com/cookies" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}