"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import HeroLogo from '@/components/sections/hero/HeroLogo';
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TeamCardEleven from '@/components/sections/team/TeamCardEleven';
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
import TextAbout from '@/components/sections/about/TextAbout';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="text-stagger"
        defaultTextAnimation="entrance-slide"
        borderRadius="rounded"
        contentWidth="medium"
        sizing="mediumLargeSizeMediumTitles"
        background="none"
        cardStyle="subtle-shadow"
        primaryButtonStyle="primary-glow"
        secondaryButtonStyle="glass"
        headingFontWeight="semibold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleCentered
      navItems={[
        {
          name: "Home",          id: "#home"},
        {
          name: "Services",          id: "#services"},
        {
          name: "Barbers",          id: "#barbers"},
        {
          name: "Pricing",          id: "#pricing"},
        {
          name: "Testimonials",          id: "#testimonials"},
        {
          name: "FAQ",          id: "#faq"},
      ]}
      button={{
        text: "Book Now",        href: "#contact"}}
      brandName="The Modern Cut"
    />
  </div>

  <div id="home" data-section="home">
      <HeroLogo
      logoText="The Modern Cut"
      description="Experience unparalleled grooming with precision cuts, classic shaves, and a style tailored just for you. Your destination for a timeless look."
      buttons={[
        {
          text: "Book an Appointment",          href: "#contact"},
        {
          text: "View Services",          href: "#services"},
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/vintage-wooden-table-with-beard-shaping-salon-tools_53876-127084.jpg"
      imageAlt="Luxurious barber chair in a modern barbershop"
    />
  </div>

  <div id="about" data-section="about">
      <TextAbout
      useInvertedBackground={true}
      tag="Our Legacy"
      title="Crafting Sharp Looks Since 2005"
    />
  </div>

  <div id="services" data-section="services">
      <FeatureCardNine
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      features={[
        {
          title: "Signature Haircut",          description: "Experience a bespoke haircut tailored to your head shape and style preferences, including a refreshing wash and finish.",          phoneOne: {
            imageSrc: "http://img.b2bpic.net/free-photo/close-up-hairstylist-giving-haircut-client_23-2148506196.jpg",            imageAlt: "Barber giving a detailed haircut"},
          phoneTwo: {
            imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-getting-his-hair-cut_23-2148256900.jpg",            imageAlt: "Barber styling a client's hair"}
        },
        {
          title: "Traditional Hot Shave",          description: "Indulge in the ultimate classic hot towel shave, performed with a straight razor for an incredibly close and smooth finish.",          phoneOne: {
            imageSrc: "http://img.b2bpic.net/free-photo/master-hairdresser-prepares-face-shaving-smears-face-with-foam-hairdressing-salon_613910-18406.jpg",            imageAlt: "Barber performing a hot towel shave"},
          phoneTwo: {
            imageSrc: "http://img.b2bpic.net/free-photo/front-view-man-shaving-home_23-2150226092.jpg",            imageAlt: "Barber trimming a man's beard"}
        },
        {
          title: "Beard Trim & Shape",          description: "Keep your beard looking its best with a professional trim, shaping, and conditioning, designed to complement your facial features.",          phoneOne: {
            imageSrc: "http://img.b2bpic.net/free-photo/years-one-color-communication-30-35_1296-315.jpg",            imageAlt: "Barber applying styling product"},
          phoneTwo: {
            imageSrc: "http://img.b2bpic.net/free-photo/isolated-view-bald-caucasian-hipster-male-with-thick-bushy-beard-tattoo-raising-eyebrows-crossing-arms-chest-his-closed-posture-look-expressing-distrust-body-language_343059-1709.jpg?_wi=1",            imageAlt: "Man admiring his styled hair in mirror"}
        },
      ]}
      showStepNumbers={true}
      title="Precision Grooming, Unmatched Style"
      description="Discover a range of services designed to perfect your look, from classic cuts to modern styling and meticulous beard care."
      tag="Our Expertise"
    />
  </div>

  <div id="pricing" data-section="pricing">
      <PricingCardTwo
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={true}
      plans={[
        {
          id: "standard-cut",          badge: "Popular",          price: "$45",          subtitle: "Essential Grooming",          buttons: [
            {
              text: "Book Now",              href: "#contact"},
          ],
          features: [
            "Precision Haircut",            "Hot Lather Neck Shave",            "Styling & Finish"],
        },
        {
          id: "full-experience",          badge: "Best Value",          price: "$80",          subtitle: "The Ultimate Pamper",          buttons: [
            {
              text: "Book Now",              href: "#contact"},
          ],
          features: [
            "Signature Haircut",            "Traditional Hot Shave",            "Beard Trim & Shape",            "Facial Massage"],
        },
        {
          id: "beard-express",          badge: "Quick Fix",          price: "$30",          subtitle: "Beard Perfection",          buttons: [
            {
              text: "Book Now",              href: "#contact"},
          ],
          features: [
            "Beard Trim",            "Line-up & Fade",            "Beard Conditioning"],
        },
      ]}
      title="Invest in Your Look"
      description="Choose from our range of premium grooming packages designed to fit your needs and keep you looking sharp."
      tag="Our Rates"
    />
  </div>

  <div id="barbers" data-section="barbers">
      <TeamCardEleven
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      groups={[
        {
          id: "master-barbers",          groupTitle: "Expert Stylists",          members: [
            {
              id: "barber-john",              title: "John 'The Blade' Doe",              subtitle: "Lead Stylist & Founder",              detail: "With over 15 years of experience, John is a true master of classic cuts and modern fades. His passion for barbering shines through every detail.",              imageSrc: "http://img.b2bpic.net/free-photo/isolated-view-bald-caucasian-hipster-male-with-thick-bushy-beard-tattoo-raising-eyebrows-crossing-arms-chest-his-closed-posture-look-expressing-distrust-body-language_343059-1709.jpg?_wi=2",              imageAlt: "Portrait of John, lead stylist"},
            {
              id: "barber-jane",              title: "Jane 'The Artisan' Smith",              subtitle: "Senior Barber & Colorist",              detail: "Jane specializes in intricate beard designs and bold transformations. Her artistic eye ensures a unique style for every client.",              imageSrc: "http://img.b2bpic.net/free-photo/portrait-man-with-tattoo-his-face-arms-dressed-white-shirt-grey-background_613910-8168.jpg",              imageAlt: "Portrait of Jane, senior barber"},
            {
              id: "barber-mike",              title: "Mike 'The Smooth' Johnson",              subtitle: "Specialist in Shaves",              detail: "Mike's traditional hot towel shaves are legendary. He guarantees the closest, smoothest shave you'll ever experience.",              imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-professional-chef-posing_23-2151232223.jpg",              imageAlt: "Portrait of Mike, shave specialist"},
          ]
        },
      ]}
      title="Meet Our Master Barbers"
      description="Our team of skilled professionals is dedicated to providing you with the highest quality grooming experience, rooted in passion and expertise."
      tag="Our Talents"
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardTen
      textboxLayout="default"
      useInvertedBackground={true}
      testimonials={[
        {
          id: "1",          title: "Best haircut in years!",          quote: "John always delivers an impeccable haircut. The attention to detail is unmatched, and the atmosphere is incredibly welcoming. Highly recommend!",          name: "Alex P.",          role: "Regular Client",          imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-positive-blond-bearded-male-dressed-red-fleece-shirt-makes-conversation_613910-13394.jpg",          imageAlt: "Alex P."},
        {
          id: "2",          title: "Fantastic hot shave experience",          quote: "Mike's hot towel shave is pure bliss. It's not just a shave; it's a relaxing ritual. My skin feels amazing every time.",          name: "Ben C.",          role: "Executive",          imageSrc: "http://img.b2bpic.net/free-photo/man-with-long-beard-mustache-showing-thumbs-up-standing-front-grey-wall_181624-26654.jpg",          imageAlt: "Ben C."},
        {
          id: "3",          title: "Jane styled my beard perfectly",          quote: "I always struggled to find someone who understood my beard vision until I met Jane. She's an artist! My beard has never looked better.",          name: "Chris D.",          role: "Creative Director",          imageSrc: "http://img.b2bpic.net/free-photo/smiley-woman-home-getting-ready-haircut_23-2148817221.jpg",          imageAlt: "Chris D."},
        {
          id: "4",          title: "Consistently excellent service",          quote: "The Modern Cut is my go-to. Every barber here is highly skilled, and they make you feel right at home. A truly professional establishment.",          name: "David L.",          role: "Business Owner",          imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-combing-beard-senior-client-salon_23-2148182003.jpg",          imageAlt: "David L."},
        {
          id: "5",          title: "A true gem of a barbershop",          quote: "From the moment you walk in, you know you're in good hands. The quality of the cut and the friendly staff make every visit a pleasure.",          name: "Emily R.",          role: "Photographer",          imageSrc: "http://img.b2bpic.net/free-photo/closeup-smiling-goodlooking-man-showing-thumbs-up-praising-good-job-recommending-company-standing_1258-159836.jpg",          imageAlt: "Emily R."},
        {
          id: "6",          title: "My new favorite spot!",          quote: "I tried The Modern Cut on a recommendation and haven't looked back. The best barbershop experience I've had in years. Always leave feeling fresh.",          name: "Frank S.",          role: "Student",          imageSrc: "http://img.b2bpic.net/free-photo/shaving-concept-with-attractive-young-man_23-2148121910.jpg",          imageAlt: "Frank S."},
      ]}
      title="Voices of Satisfaction"
      description="Hear directly from our valued clients who trust The Modern Cut for their grooming needs and exceptional service."
      tag="What Clients Say"
    />
  </div>

  <div id="social-proof" data-section="social-proof">
      <SocialProofOne
      textboxLayout="default"
      useInvertedBackground={false}
      names={[
        "GQ Magazine",        "Men's Health",        "Barber's Journal",        "Local Style Awards",        "CityLife Magazine",        "Grooming Today",        "The Daily Trim"]}
      title="Recognized for Excellence"
      description="Our commitment to quality grooming has been acknowledged by leading publications and local community awards."
      tag="Featured In"
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqDouble
      textboxLayout="default"
      useInvertedBackground={true}
      faqs={[
        {
          id: "faq-1",          title: "How do I book an appointment?",          content: "You can easily book an appointment through our website's 'Book Now' button, or by calling us directly during business hours. We recommend booking in advance."},
        {
          id: "faq-2",          title: "Do you accept walk-ins?",          content: "While we prioritize appointments to ensure timely service, we do accept walk-ins based on availability. Calling ahead is always advised."},
        {
          id: "faq-3",          title: "What products do you use?",          content: "We use only premium grooming products from trusted brands, selected for their quality and effectiveness in maintaining healthy hair and skin."},
        {
          id: "faq-4",          title: "Can I request a specific barber?",          content: "Yes, you can request your preferred barber when booking your appointment online or over the phone. Availability varies by barber."},
        {
          id: "faq-5",          title: "What is your cancellation policy?",          content: "We require at least 24 hours notice for cancellations or rescheduling. Late cancellations may incur a fee."},
        {
          id: "faq-6",          title: "Do you offer gift cards?",          content: "Yes, gift cards are available for purchase in-store and can be used towards any of our services."},
      ]}
      title="Frequently Asked Questions"
      description="Find quick answers to common questions about our services, booking, and barbershop policies."
      tag="Need Answers?"
      faqsAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactCTA
      useInvertedBackground={false}
      background={{
        variant: "plain"}}
      tag="Ready for a Fresh Look?"
      title="Book Your Next Appointment"
      description="Don't wait! Schedule your visit to The Modern Cut today and experience the difference of expert grooming."
      buttons={[
        {
          text: "Book Online Now",          href: "#"},
        {
          text: "Call Us: (123) 456-7890",          href: "tel:+1234567890"},
      ]}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterBaseReveal
      logoText="The Modern Cut"
      columns={[
        {
          title: "Services",          items: [
            {
              label: "Haircuts",              href: "#services"},
            {
              label: "Shaves",              href: "#services"},
            {
              label: "Beard Trims",              href: "#services"},
            {
              label: "Styling",              href: "#services"},
          ],
        },
        {
          title: "Company",          items: [
            {
              label: "About Us",              href: "#about"},
            {
              label: "Our Team",              href: "#barbers"},
            {
              label: "Pricing",              href: "#pricing"},
            {
              label: "Contact",              href: "#contact"},
          ],
        },
        {
          title: "Support",          items: [
            {
              label: "FAQ",              href: "#faq"},
            {
              label: "Privacy Policy",              href: "#"},
            {
              label: "Terms of Service",              href: "#"},
          ],
        },
      ]}
      copyrightText="© 2024 The Modern Cut. All rights reserved."
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}