"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import { Sparkles, Zap, DollarSign, Heart, TrendingUp, HelpCircle } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="background-highlight"
      borderRadius="pill"
      contentWidth="mediumLarge"
      sizing="largeSmallSizeLargeTitles"
      background="none"
      cardStyle="glass-depth"
      primaryButtonStyle="radial-glow"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="light"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleFullscreen
          navItems={[
            { name: "Home", id: "home" },
            { name: "Features", id: "features" },
            { name: "Pricing", id: "pricing" },
            { name: "Testimonials", id: "testimonials" },
            { name: "Contact", id: "contact" }
          ]}
          brandName="SaaSync"
          bottomLeftText="Made for modern teams"
          bottomRightText="hello@saasync.io"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboardGallery
          title="Transform Your Workflow with SaaSync"
          description="The all-in-one platform designed for teams who want to move faster. Collaborate seamlessly, automate repetitive tasks, and scale your business without limits."
          background={{ variant: "radial-gradient" }}
          tag="Trusted by 10K+ teams"
          tagIcon={Sparkles}
          mediaItems={[
            {
              imageSrc: "https://img.b2bpic.net/free-photo/luxurious-boardroom-space-within-multinational-company-used-meetings_482257-124520.jpg",              imageAlt: "SaaSync dashboard overview"
            },
            {
              imageSrc: "https://img.b2bpic.net/free-vector/professional-dashboard-user-panel_23-2148368370.jpg",              imageAlt: "Team collaboration interface"
            },
            {
              imageSrc: "https://img.b2bpic.net/free-vector/dashboard-admin-panel-template_23-2148372587.jpg",              imageAlt: "Analytics and reporting screen"
            },
            {
              imageSrc: "https://img.b2bpic.net/free-vector/dashboard-user-panel_23-2148370944.jpg",              imageAlt: "Data visualization dashboard"
            },
            {
              imageSrc: "https://img.b2bpic.net/free-vector/professional-dashboard-user-panel_23-2148358961.jpg",              imageAlt: "Product features showcase"
            }
          ]}
          buttons={[
            { text: "Start Free Trial", href: "#pricing" },
            { text: "Watch Demo", href: "https://youtube.com" }
          ]}
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardNine
          features={[
            {
              id: 1,
              title: "Real-Time Collaboration",              description: "Work together seamlessly with your team from anywhere in the world. See changes instantly, leave comments, and iterate faster.",              phoneOne: { imageSrc: "https://img.b2bpic.net/free-photo/modern-man-doing-business-caffe_23-2148956930.jpg" },
              phoneTwo: { imageSrc: "https://img.b2bpic.net/free-photo/high-angle-hands-holding-smartphone_23-2150671604.jpg" }
            },
            {
              id: 2,
              title: "Smart Automation",              description: "Automate your most repetitive tasks and focus on what matters. Create powerful workflows with our no-code automation builder.",              phoneOne: { imageSrc: "https://img.b2bpic.net/free-photo/high-angle-hands-holding-smartphone_23-2150671567.jpg" },
              phoneTwo: { imageSrc: "https://img.b2bpic.net/free-psd/template-travel-mobile-app_145275-349.jpg" }
            }
          ]}
          showStepNumbers={true}
          title="Powerful Features Built for Scale"
          description="Everything you need to manage, collaborate, and grow your business faster than ever before."
          tag="Core Features"
          tagIcon={Zap}
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          buttons={[
            { text: "Explore Features", href: "#pricing" }
          ]}
        />
      </div>

      <div id="pricing" data-section="pricing">
        <PricingCardNine
          plans={[
            {
              id: "starter",              title: "Starter",              price: "$49",              period: "/month",              imageSrc: "https://img.b2bpic.net/free-photo/young-colleagues-sitting-while-work-with-laptops-desk_171337-16969.jpg",              imageAlt: "Starter plan visualization",              button: { text: "Get Started", href: "#contact" },
              features: [
                "Up to 10 team members",                "Core collaboration tools",                "5GB storage",                "Basic analytics",                "Email support"
              ]
            },
            {
              id: "professional",              title: "Professional",              price: "$129",              period: "/month",              imageSrc: "https://img.b2bpic.net/free-photo/creative-group-working-startup-using-laptops_74855-3370.jpg",              imageAlt: "Professional plan visualization",              button: { text: "Get Started", href: "#contact" },
              features: [
                "Up to 50 team members",                "Advanced automation",                "500GB storage",                "Advanced analytics",                "Priority support",                "Custom integrations"
              ]
            },
            {
              id: "enterprise",              title: "Enterprise",              price: "Custom",              period: "/contact us",              imageSrc: "https://img.b2bpic.net/free-photo/group-three-young-multi-ethnic-successful-business-people-sitting-coworking-space-talking-about-new-project-competitor-team-making-plans-bypass-their-project_176420-8311.jpg",              imageAlt: "Enterprise plan visualization",              button: { text: "Contact Sales", href: "#contact" },
              features: [
                "Unlimited team members",                "White-label solution",                "Unlimited storage",                "Custom reporting",                "Dedicated support",                "SLA guarantee",                "Advanced security"
              ]
            }
          ]}
          animationType="slide-up"
          title="Simple, Transparent Pricing"
          description="Choose the perfect plan for your team. All plans include a 14-day free trial with full access to features."
          tag="Pricing"
          tagIcon={DollarSign}
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardThirteen
          testimonials={[
            {
              id: "1",              name: "Sarah Chen",              handle: "@sarahchen",              testimonial: "SaaSync completely transformed how our team works. We've cut our project delivery time in half and our team loves the interface. Highly recommend!",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/happy-professional_1098-12931.jpg",              imageAlt: "Sarah Chen, CEO of TechStart"
            },
            {
              id: "2",              name: "Marcus Johnson",              handle: "@marcusj",              testimonial: "The automation features alone have saved us thousands of hours. It's like having an extra team member working 24/7. Amazing product!",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/content-beautiful-businesswoman-standing-window_1262-1778.jpg",              imageAlt: "Marcus Johnson, Operations Director"
            },
            {
              id: "3",              name: "Emily Rodriguez",              handle: "@emilyrod",              testimonial: "Best investment we made this year. The collaboration tools are intuitive and the support team is incredibly responsive. Worth every penny.",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/smiling-beautiful-middle-aged-business-woman_1262-3085.jpg",              imageAlt: "Emily Rodriguez, Product Manager"
            },
            {
              id: "4",              name: "David Kim",              handle: "@davidkim",              testimonial: "Finally a platform that doesn't require constant training. Our team was productive from day one. The ROI is outstanding.",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/expressive-woman-posing-outdoor_344912-2955.jpg",              imageAlt: "David Kim, Engineering Lead"
            },
            {
              id: "5",              name: "Jessica Martinez",              handle: "@jmartinez",              testimonial: "The analytics dashboard gives us visibility we never had before. Data-driven decisions are now effortless. Couldn't ask for more!",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/studio-portrait-successful-young-businesswoman_1262-5844.jpg",              imageAlt: "Jessica Martinez, Founder"
            },
            {
              id: "6",              name: "Thomas Anderson",              handle: "@tanderson",              testimonial: "Scaled our operations from 10 to 100 people without scaling our tool complexity. SaaSync grew with us seamlessly.",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/business-lady-looking-copyspace-with-interest_1262-2957.jpg",              imageAlt: "Thomas Anderson, VP Growth"
            }
          ]}
          showRating={true}
          title="Loved by Teams Worldwide"
          description="See what customers are saying about how SaaSync transformed their workflow and accelerated their growth."
          tag="Testimonials"
          tagIcon={Heart}
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          animationType="slide-up"
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardTwo
          metrics={[
            { id: "1", value: "10K+", description: "Active Teams" },
            { id: "2", value: "99.9%", description: "Uptime Guarantee" },
            { id: "3", value: "50M+", description: "Tasks Completed" },
            { id: "4", value: "4.9/5", description: "Customer Rating" }
          ]}
          title="By The Numbers"
          description="Metrics that prove SaaSync is the trusted choice for ambitious teams."
          tag="Results"
          tagIcon={TrendingUp}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="scale-rotate"
          gridVariant="uniform-all-items-equal"
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqSplitMedia
          faqs={[
            {
              id: "1",              title: "Does SaaSync offer a free trial?",              content: "Yes! All new accounts get a 14-day free trial with full access to every feature. No credit card required to start."
            },
            {
              id: "2",              title: "Can I switch plans anytime?",              content: "Absolutely. You can upgrade or downgrade your plan at any time. Changes take effect at the start of your next billing cycle."
            },
            {
              id: "3",              title: "What security certifications do you have?",              content: "SaaSync is SOC 2 Type II certified, GDPR compliant, and uses enterprise-grade encryption. Your data is always secure."
            },
            {
              id: "4",              title: "Do you offer integrations with other tools?",              content: "Yes! We integrate with 500+ popular tools including Slack, Salesforce, HubSpot, and more. Custom integrations available for Enterprise plans."
            },
            {
              id: "5",              title: "What happens if I need to cancel?",              content: "You can cancel anytime with no penalties. We'll export all your data in standard formats so you can take it with you."
            },
            {
              id: "6",              title: "Is there a limit to team members?",              content: "No limits on Starter and Professional plans. Enterprise customers can have unlimited team members with advanced permission controls."
            }
          ]}
          title="Frequently Asked Questions"
          description="Find answers to common questions about SaaSync, features, pricing, and support."
          tag="Help & Support"
          tagIcon={HelpCircle}
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          imageSrc="https://img.b2bpic.net/free-photo/young-beautiful-female-support-phone-operator-speaking-consulting-office_176420-957.jpg"
          imageAlt="Customer support illustration"
          mediaPosition="left"
          animationType="smooth"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplitForm
          title="Ready to Transform Your Workflow?"
          description="Join thousands of teams already using SaaSync to collaborate better and work smarter. Start your free 14-day trial today—no credit card required."
          useInvertedBackground="noInvert"
          inputs={[
            { name: "name", type: "text", placeholder: "Your Name", required: true },
            { name: "email", type: "email", placeholder: "work@company.com", required: true },
            { name: "company", type: "text", placeholder: "Company Name", required: true },
            { name: "phone", type: "tel", placeholder: "Phone Number", required: false }
          ]}
          textarea={{ name: "message", placeholder: "Tell us about your needs and goals...", rows: 4, required: false }}
          buttonText="Start Free Trial"
          mediaPosition="right"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoEmphasis
          logoText="SaaSync"
          columns={[
            {
              items: [
                { label: "Product", href: "#features" },
                { label: "Pricing", href: "#pricing" },
                { label: "Security", href: "https://saasync.io/security" },
                { label: "Updates", href: "https://saasync.io/blog" }
              ]
            },
            {
              items: [
                { label: "Company", href: "https://saasync.io/about" },
                { label: "Blog", href: "https://saasync.io/blog" },
                { label: "Careers", href: "https://saasync.io/careers" },
                { label: "Contact", href: "#contact" }
              ]
            },
            {
              items: [
                { label: "Privacy", href: "https://saasync.io/privacy" },
                { label: "Terms", href: "https://saasync.io/terms" },
                { label: "Cookies", href: "https://saasync.io/cookies" },
                { label: "Status", href: "https://status.saasync.io" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}