"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import TextAbout from '@/components/sections/about/TextAbout';
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
import TeamCardTen from '@/components/sections/team/TeamCardTen';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';
import FaqBase from '@/components/sections/faq/FaqBase';
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FooterBase from '@/components/sections/footer/FooterBase';

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="background-highlight"
      borderRadius="sharp"
      contentWidth="small"
      sizing="large"
      background="aurora"
      cardStyle="outline"
      primaryButtonStyle="diagonal-gradient"
      secondaryButtonStyle="solid"
      headingFontWeight="semibold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered 
          brandName="Prime Cuts"
          navItems={[
            { name: "Home", id: "home" },
            { name: "Services", id: "services" },
            { name: "About", id: "about" },
            { name: "Team", id: "team" },
            { name: "Contact", id: "contact" }
          ]}
          button={{
            text: "Book Appointment",            href: "contact"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboard 
          title="Premium Barbershop in London"
          description="Experience precision grooming and timeless style at Prime Cuts. Our expert barbers deliver classic cuts, beard shaping, and traditional shaves in an authentic environment."
          background={{ variant: "sparkles-gradient" }}
          tag="Est. 2015"
          imageSrc="https://img.b2bpic.net/free-photo/handsome-hipster-bearded-male-sitting-armchair-barber-shop-while-hairdresser-shaves-his-beard-with-dangerous-razor_613910-18491.jpg"
          imageAlt="Professional barber cutting hair with precision"
          buttons={[
            { text: "Book Now", href: "contact" },
            { text: "Explore Services", href: "services" }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <TextAbout 
          title="Craftsmanship meets tradition. At Prime Cuts, we honour the barber's legacy with meticulous attention to detail, premium products, and an unwavering commitment to excellence in every cut."
          useInvertedBackground="invertDefault"
          buttons={[
            { text: "Learn More", href: "services" }
          ]}
        />
      </div>

      <div id="services" data-section="services">
        <FeatureCardOne 
          title="Our Services"
          description="We offer a complete range of grooming services tailored to your style and preferences"
          tag="Premium Services"
          features={[
            {
              title: "Classic Haircut",              description: "Timeless cuts with precision styling, tailored to suit your face shape and personal style. Using traditional techniques perfected over decades.",              imageSrc: "https://img.b2bpic.net/free-photo/bearded-male-sitting-armchair-barber-shop-while-hairdresser-modeling-beard-with-scissors-comb-barbershop_613910-4343.jpg",              imageAlt: "Classic barbershop haircut in progress",              button: { text: "Book Haircut", href: "contact" }
            },
            {
              title: "Beard Grooming",              description: "Expert beard shaping, trimming, and conditioning. We help you achieve and maintain the perfect beard with personalised grooming advice.",              imageSrc: "https://img.b2bpic.net/free-photo/professional-barber-working-with-client-hairdressing-salon_613910-5075.jpg",              imageAlt: "Professional beard grooming and shaping",              button: { text: "Book Beard Care", href: "contact" }
            },
            {
              title: "Traditional Shave",              description: "Experience the luxury of a traditional hot towel shave with straight razor technique. A relaxing ritual that delivers superior results and deep conditioning.",              imageSrc: "https://img.b2bpic.net/free-photo/professional-hairdresser-modeling-beard-with-scissors-comb-barbershop-close-up-photo_613910-18538.jpg",              imageAlt: "Traditional straight razor shaving technique",              button: { text: "Book Shave", href: "contact" }
            }
          ]}
          textboxLayout="default"
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          useInvertedBackground="invertDefault"
        />
      </div>

      <div id="team" data-section="team">
        <TeamCardTen 
          title="Meet our experienced barbers. With over 15 years of combined expertise, our team brings precision, passion, and tradition to every appointment."
          tag="Expert Team"
          members={[
            {
              id: "1",              name: "Marcus Stone",              imageSrc: "https://img.b2bpic.net/free-photo/groomed-bearded-man-with-tattooes-is-posing-dark-photo-studio_613910-3659.jpg",              imageAlt: "Marcus Stone, Head Barber"
            },
            {
              id: "2",              name: "James Turner",              imageSrc: "https://img.b2bpic.net/free-photo/positive-bearded-black-male-with-tattoo-cross-arms-dressed-white-shirt_613910-15917.jpg",              imageAlt: "James Turner, Senior Barber"
            },
            {
              id: "3",              name: "David Collins",              imageSrc: "https://img.b2bpic.net/free-photo/portrait-man-with-tattoo-his-face-with-crossed-arms-dressed-white-shirt-grey-background_613910-1374.jpg",              imageAlt: "David Collins, Master Barber"
            }
          ]}
          memberVariant="card"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardSix 
          testimonials={[
            {
              id: "1",              name: "Alexander Price",              handle: "@alexgroomed",              testimonial: "Absolutely fantastic barbershop. Marcus knows exactly what I need without asking twice. The attention to detail is exceptional.",              imageSrc: "https://img.b2bpic.net/free-photo/stylish-blond-bearded-male-with-crossed-arms-dressed-brown-leather-pilot-jacket_613910-11192.jpg",              imageAlt: "Alexander Price"
            },
            {
              id: "2",              name: "Christopher James",              handle: "@chris_styles",              testimonial: "The traditional shave experience here is unmatched. Professional, relaxing, and results speak for themselves. Highly recommended.",              imageSrc: "https://img.b2bpic.net/free-photo/portrait-male-hairdresser-with-scissors_23-2147839778.jpg",              imageAlt: "Christopher James"
            },
            {
              id: "3",              name: "Robert Mitchell",              handle: "@robcut_london",              testimonial: "Been coming for 3 years now. Consistent quality, friendly staff, and they always understand exactly what I want. Worth every penny.",              imageSrc: "https://img.b2bpic.net/free-photo/man-hair-salon-looking-sideways_23-2148242781.jpg",              imageAlt: "Robert Mitchell"
            },
            {
              id: "4",              name: "Thomas Wright",              handle: "@tom_barbershop",              testimonial: "Finally found a barbershop that takes pride in their craft. David's expertise and the premium products they use make all the difference.",              imageSrc: "https://img.b2bpic.net/free-photo/people-lifestyle-concept-isolated-handsome-fashionable-tattooed-man-with-fuzzy-beard-shaved-head-posing-indoors-with-arms-folded-having-confident-facial-expression_343059-1711.jpg",              imageAlt: "Thomas Wright"
            },
            {
              id: "5",              name: "Michael Harrison",              handle: "@mike_grooming",              testimonial: "The level of professionalism here is outstanding. Every visit feels special and I always leave feeling refreshed and confident.",              imageSrc: "https://img.b2bpic.net/free-photo/portrait-bearded-black-man-with-tattooed-arm-wearing-white-shirt_613910-1888.jpg",              imageAlt: "Michael Harrison"
            },
            {
              id: "6",              name: "Edward Clarke",              handle: "@ed_lifestyle",              testimonial: "Prime Cuts isn't just a barbershop, it's an experience. The attention to detail, the ambiance, the expertise - everything is perfect.",              imageSrc: "https://img.b2bpic.net/free-photo/portrait-male-hairdresser-with-razor_23-2147839800.jpg",              imageAlt: "Edward Clarke"
            }
          ]}
          title="What Our Clients Say"
          description="Hear from the men who trust Prime Cuts for their grooming needs"
          tag="Reviews"
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="invertDefault"
          speed={40}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqBase 
          title="Frequently Asked Questions"
          description="Everything you need to know about booking and our services"
          tag="FAQs"
          textboxLayout="default"
          useInvertedBackground="noInvert"
          faqs={[
            {
              id: "1",              title: "How do I book an appointment?",              content: "You can book directly through our contact form or call us during business hours. We offer same-day bookings for walk-ins when available. For weekend appointments, booking in advance is recommended due to high demand."
            },
            {
              id: "2",              title: "What's your cancellation policy?",              content: "We require 24 hours notice for cancellations. Late cancellations or no-shows within 24 hours will be charged 50% of the service fee. This policy ensures we can accommodate other clients and respect our barbers' time."
            },
            {
              id: "3",              title: "Do you accept card payments?",              content: "Yes, we accept all major credit and debit cards as well as contactless payments. We also accept cash for your convenience. Digital payments are preferred for faster transactions."
            },
            {
              id: "4",              title: "What products do you use?",              content: "We exclusively use premium grooming products from industry-leading brands. All products are professional-grade and suited for various hair types and skin sensitivities. Ask any barber for product recommendations."
            },
            {
              id: "5",              title: "How long do appointments typically take?",              content: "A classic haircut usually takes 30-40 minutes, a full beard groom takes 25-35 minutes, and a traditional shave experience takes 45-60 minutes. Prices and timing may vary based on hair length and complexity."
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplit 
          tag="Get in Touch"
          title="Book Your Appointment"
          description="Join hundreds of satisfied clients and experience premium barbershop craftsmanship. Book your appointment today and step into our world of timeless grooming."
          useInvertedBackground="invertDefault"
          imageSrc="https://img.b2bpic.net/free-photo/barber-shop-retro-vintage-style_1150-17931.jpg"
          imageAlt="Prime Cuts Barbershop interior in London"
          mediaPosition="right"
          inputPlaceholder="your@email.com"
          buttonText="Book Now"
          termsText="By clicking Book Now, you agree to receive appointment confirmations and grooming tips. We respect your privacy."
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBase 
          logoText="Prime Cuts"
          copyrightText="© 2025 Prime Cuts Barbershop. All rights reserved."
          columns={[
            {
              title: "Services",              items: [
                { label: "Haircuts", href: "services" },
                { label: "Beard Grooming", href: "services" },
                { label: "Traditional Shave", href: "services" }
              ]
            },
            {
              title: "About",              items: [
                { label: "Our Story", href: "about" },
                { label: "Team", href: "team" },
                { label: "Reviews", href: "testimonials" }
              ]
            },
            {
              title: "Connect",              items: [
                { label: "Book Appointment", href: "contact" },
                { label: "Contact Us", href: "contact" },
                { label: "FAQ", href: "faq" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}