"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactText from '@/components/sections/contact/ContactText';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import FeatureCardThree from '@/components/sections/feature/featureCardThree/FeatureCardThree';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import HeroLogo from '@/components/sections/hero/HeroLogo';
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import PricingCardEight from '@/components/sections/pricing/PricingCardEight';
import TeamCardFive from '@/components/sections/team/TeamCardFive';
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="text-shift"
        defaultTextAnimation="reveal-blur"
        borderRadius="pill"
        contentWidth="small"
        sizing="largeSmallSizeLargeTitles"
        background="none"
        cardStyle="glass-depth"
        primaryButtonStyle="diagonal-gradient"
        secondaryButtonStyle="glass"
        headingFontWeight="semibold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleApple
      navItems={[
        {
          name: "Home",          id: "hero"},
        {
          name: "About",          id: "about"},
        {
          name: "Services",          id: "pricing"},
        {
          name: "Contact",          id: "contact"},
      ]}
      brandName="Empire Barbers"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroLogo
      logoText="EMPIRE BARBERS"
      description="Precision fades, signature beard work, and a relaxed vibe that's been perfecting LA grooming for over a decade. Book your next cut with barbers who know their craft."
      buttons={[
        {
          text: "Book Your Appointment",          href: "#contact"},
        {
          text: "Walk-Ins Welcome",          href: "#"},
      ]}
      buttonAnimation="slide-up"
      imageSrc="http://img.b2bpic.net/free-photo/handsome-barber-cutting-hair-customer-barbershop_1303-20962.jpg"
    />
  </div>

  <div id="about" data-section="about">
      <MetricCardSeven
      animationType="slide-up"
      textboxLayout="split"
      useInvertedBackground={false}
      metrics={[
        {
          id: "1",          value: "10+",          title: "Years in LA",          items: [
            "Serving Hollywood",            "Trusted Community",            "Expertise Guaranteed"],
        },
        {
          id: "2",          value: "48",          title: "Star Rating",          items: [
            "Consistent Quality",            "Top Reviews",            "Happy Clients"],
        },
        {
          id: "3",          value: "24/7",          title: "Availability",          items: [
            "Always Open",            "Flexible Bookings",            "Ready for You"],
        },
      ]}
      title="A Decade of Precision"
      description="More than just a haircut—we are a Hollywood grooming institution."
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardThree
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="three-columns-all-equal-width"
      useInvertedBackground={true}
      features={[
        {
          title: "Precision Fades",          description: "Expertly crafted tapers and fades that stand out.",          imageSrc: "http://img.b2bpic.net/free-photo/handsome-man-shaving-beard-barbershop_1303-26260.jpg"},
        {
          title: "Signature Beards",          description: "Crisp lines and groomed excellence every time.",          imageSrc: "http://img.b2bpic.net/free-photo/sideways-customer-with-eyes-closed_23-2148256865.jpg"},
        {
          title: "Classic Shaves",          description: "Indulge in a hot towel treatment and straight razor finish.",          imageSrc: "http://img.b2bpic.net/free-photo/handsome-hipster-bearded-male-sitting-armchair-barber-shop-while-hairdresser-shaves-his-beard-with-dangerous-razor_613910-18507.jpg"},
      ]}
      title="The Empire Standard"
      description="We blend traditional techniques with modern style precision."
    />
  </div>

  <div id="pricing" data-section="pricing">
      <PricingCardEight
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      plans={[
        {
          id: "1",          badge: "Essential",          price: "$45",          subtitle: "Precision Haircut",          buttons: [
            {
              text: "Book Now",              href: "#contact"},
          ],
          features: [
            "Classic cut",            "Wash & Style",            "Neck shave"],
        },
        {
          id: "2",          badge: "Signature",          price: "$65",          subtitle: "Hair & Beard Sculpt",          buttons: [
            {
              text: "Book Now",              href: "#contact"},
          ],
          features: [
            "Classic cut",            "Beard trim",            "Straight razor edge-up"],
        },
        {
          id: "3",          badge: "Luxury",          price: "$85",          subtitle: "The Full Empire",          buttons: [
            {
              text: "Book Now",              href: "#contact"},
          ],
          features: [
            "Full haircut",            "Signature beard sculpt",            "Hot towel service",            "Premium scalp massage"],
        },
      ]}
      title="Grooming Services"
      description="Choose the perfect cut for your style."
    />
  </div>

  <div id="team" data-section="team">
      <TeamCardFive
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={true}
      team={[
        {
          id: "1",          name: "Jaxson Reed",          role: "Master Barber",          imageSrc: "http://img.b2bpic.net/free-photo/portrait-brutal-bearded-male-with-tattoos-his-crossed-arms_613910-9532.jpg"},
        {
          id: "2",          name: "Leo Thorne",          role: "Fade Specialist",          imageSrc: "http://img.b2bpic.net/free-photo/senior-client-estimating-work-barber-mirror_23-2148181883.jpg"},
        {
          id: "3",          name: "Marco Silva",          role: "Senior Groomer",          imageSrc: "http://img.b2bpic.net/free-photo/male-barber-sitting-his-shop_23-2149186520.jpg"},
      ]}
      title="Meet Your Barbers"
      description="The talent behind our 48-star reputation."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardTen
      textboxLayout="split-description"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "1",          title: "Best in LA",          quote: "I've been coming here for 5 years. Jaxson is a master.",          name: "Sarah Miller",          role: "Creative Director",          imageSrc: "http://img.b2bpic.net/free-photo/person-wearing-colorful-fashion_23-2151038235.jpg"},
        {
          id: "2",          title: "Reliable",          quote: "The 24-hour service saved my shoot more than once.",          name: "David Chen",          role: "Actor",          imageSrc: "http://img.b2bpic.net/free-photo/handsome-bearded-african-american-businessman-brown-classic-jacket-isolated-dark-background_613910-6597.jpg"},
        {
          id: "3",          title: "Detail Oriented",          quote: "Signature beard work is unmatched anywhere in the city.",          name: "Jordan P.",          role: "Entrepreneur",          imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-well-dressed-male-leaning-against-wall-looking-camera_181624-15421.jpg"},
        {
          id: "4",          title: "Inclusive",          quote: "Always feel welcome and respected. Great atmosphere.",          name: "Alex R.",          role: "Professional",          imageSrc: "http://img.b2bpic.net/free-photo/handsome-man-portrait_158595-3857.jpg"},
        {
          id: "5",          title: "Top Tier",          quote: "Hands down the best fade in Hollywood. Five stars.",          name: "Sam B.",          role: "Actor",          imageSrc: "http://img.b2bpic.net/free-photo/handsome-black-male-dressed-suit-from-wool_613910-15983.jpg"},
      ]}
      title="Voices of the Community"
      description="Why Hollywood keeps coming back."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqDouble
      textboxLayout="default"
      useInvertedBackground={true}
      faqs={[
        {
          id: "1",          title: "Do you accept walk-ins?",          content: "Yes, we welcome walk-ins anytime, day or night."},
        {
          id: "2",          title: "What are your hours?",          content: "We operate 24 hours a day, 7 days a week."},
        {
          id: "3",          title: "How do I book online?",          content: "Use the booking link at the top of the page."},
      ]}
      title="Common Inquiries"
      description="Everything you need to know about our services."
      faqsAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactText
      useInvertedBackground={false}
      background={{
        variant: "gradient-bars"}}
      text="Ready for your best cut yet? Book your appointment today or drop by for a walk-in."
      buttons={[
        {
          text: "Book Now",          href: "#contact"},
      ]}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterBaseCard
      logoText="EMPIRE BARBERS"
      columns={[
        {
          title: "Navigate",          items: [
            {
              label: "Home",              href: "#hero"},
            {
              label: "Services",              href: "#pricing"},
            {
              label: "Team",              href: "#team"},
          ],
        },
        {
          title: "Legal",          items: [
            {
              label: "Privacy Policy",              href: "#"},
            {
              label: "Terms of Service",              href: "#"},
          ],
        },
      ]}
      copyrightText="© 2025 Empire Barbers | Hollywood, LA"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}