"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import TeamCardTen from '@/components/sections/team/TeamCardTen';
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
import { Award, Calendar, Users } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="icon-arrow"
        defaultTextAnimation="entrance-slide"
        borderRadius="pill"
        contentWidth="small"
        sizing="mediumSizeLargeTitles"
        background="none"
        cardStyle="subtle-shadow"
        primaryButtonStyle="diagonal-gradient"
        secondaryButtonStyle="solid"
        headingFontWeight="bold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleCentered
      navItems={[
        {
          name: "Home",          id: "hero"},
        {
          name: "About",          id: "about"},
        {
          name: "Services",          id: "features"},
        {
          name: "Team",          id: "team"},
        {
          name: "Reviews",          id: "testimonials"},
        {
          name: "Contact",          id: "contact"},
      ]}
      brandName="One of One Hairs Studio"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroSplitKpi
      background={{
        variant: "gradient-bars"}}
      title="One of One Hairs Studio"
      description="Top quality cuts, braiding, and styling in the heart of Hemet. Experience the best atmosphere in town where quality meets professionalism."
      kpis={[
        {
          value: "4.9",          label: "Google Rating"},
        {
          value: "66+",          label: "Verified Reviews"},
        {
          value: "Exp.",          label: "All Hair Textures"},
      ]}
      enableKpiAnimation={true}
      buttons={[
        {
          text: "Book Now",          href: "#contact"},
      ]}
      imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Dau8SLXepIyfYPkmT8oQk4zcz8/uploaded-1778532694257-dg8e6don.png"
      imageAlt="One of One Hairs Studio professional"
      mediaAnimation="slide-up"
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/barber-shop-retro-vintage-style_1150-17931.jpg",          alt: "barber shop retro vintage style"},
        {
          src: "http://img.b2bpic.net/free-photo/young-man-barber-s-shop-getting-his-beard-trimmed_23-2149186494.jpg",          alt: "Young man at the barber's shop getting his beard trimmed"},
        {
          src: "http://img.b2bpic.net/free-photo/brown-vintage-leather-chair-stylish-barber-shop_627829-6180.jpg",          alt: "Brown vintage leather chair at stylish barber shop"},
        {
          src: "http://img.b2bpic.net/free-photo/male-barber-giving-his-client-nice-haircut_23-2149186489.jpg",          alt: "Male barber giving his client a nice haircut"},
        {
          src: "http://img.b2bpic.net/free-photo/hairdresser-getting-ready-their-clients_23-2149205931.jpg",          alt: "Hairdresser getting ready for their clients"},
      ]}
      marqueeItems={[
        {
          type: "text",          text: "Premium Grooming"},
        {
          type: "text",          text: "Precision Fades"},
        {
          type: "text",          text: "Professional Braiding"},
        {
          type: "text",          text: "Modern Studio"},
        {
          type: "text",          text: "Local Favorite"},
      ]}
    />
  </div>

  <div id="about" data-section="about">
      <InlineImageSplitTextAbout
      useInvertedBackground={false}
      heading={[
        {
          type: "text",          content: "Welcome to "},
        {
          type: "image",          src: "http://img.b2bpic.net/free-photo/mustache-guy-barbershop_140725-7723.jpg",          alt: "Studio Interior"},
        {
          type: "text",          content: "One of One Hairs Studio"},
      ]}
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardTwentyFour
      animationType="slide-up"
      textboxLayout="split"
      useInvertedBackground={false}
      features={[
        {
          id: "1",          title: "Taper Fades",          author: "Mateo",          description: "Precision taper fades delivered with meticulous attention to detail.",          tags: [
            "Haircut",            "Fade"],
          imageSrc: "http://img.b2bpic.net/free-photo/hairstylist-giving-haircut-customer_23-2148506233.jpg"},
        {
          id: "2",          title: "Custom Braiding",          author: "Michelle",          description: "Professional braiding and cornrows for all hair textures.",          tags: [
            "Braiding",            "Style"],
          imageSrc: "http://img.b2bpic.net/free-photo/african-american-woman-with-braided-hair-standing-pink-background-standing-backwards-looking-away-with-crossed-arms_839833-2085.jpg"},
        {
          id: "3",          title: "Hair Styling",          author: "Staff",          description: "Creative hair styling tailored to your unique look.",          tags: [
            "Styling",            "Grooming"],
          imageSrc: "http://img.b2bpic.net/free-photo/brunette-female-hairdresser-washing-hair-bearded-men-client-saloon_613910-14581.jpg"},
      ]}
      title="Our Services"
      description="Expert grooming and styling services for all hair types and textures."
    />
  </div>

  <div id="team" data-section="team">
      <TeamCardTen
      useInvertedBackground={false}
      title="Meet Our Barbers"
      tag="Expert Stylists"
      membersAnimation="slide-up"
      members={[
        {
          id: "m1",          name: "Mateo (@mateohairprof)",          imageSrc: "http://img.b2bpic.net/free-photo/pleased-young-caucasian-male-barber-wearing-glasses-wavy-hair-band-uniform-holding-comb-scissors-isolated-white-background_141793-31598.jpg"},
        {
          id: "m2",          name: "Michelle (@flame_stylez)",          imageSrc: "http://img.b2bpic.net/free-photo/hairdresser-putting-foam-face-client_23-2147737016.jpg"},
        {
          id: "m3",          name: "Lead Stylist",          imageSrc: "http://img.b2bpic.net/free-photo/smiling-slavic-middle-aged-male-barber-uniform-holding-scissors-crossing-hands-isolated-purple-wall_141793-83015.jpg"},
      ]}
      memberVariant="card"
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardThree
      animationType="slide-up"
      textboxLayout="split"
      useInvertedBackground={false}
      metrics={[
        {
          id: "m1",          title: "Clients Served",          value: "1000+",          icon: Users,
        },
        {
          id: "m2",          title: "Years Est.",          value: "5+",          icon: Calendar,
        },
        {
          id: "m3",          title: "Satisfaction",          value: "100%",          icon: Award,
        },
      ]}
      title="Our Impact"
      description="Consistent quality for every client, every time."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardTwelve
      useInvertedBackground={false}
      testimonials={[
        {
          id: "t1",          name: "Meetch Merch",          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-men-shaking-hands_23-2149141784.jpg"},
        {
          id: "t2",          name: "Charles Davis",          imageSrc: "http://img.b2bpic.net/free-photo/latino-hair-salon-owner-preparing-clients_23-2150286080.jpg"},
        {
          id: "t3",          name: "Alisha Castaneda",          imageSrc: "http://img.b2bpic.net/free-photo/front-view-woman-with-afro-hairstyle_23-2150908602.jpg"},
        {
          id: "t4",          name: "John Doe",          imageSrc: "http://img.b2bpic.net/free-photo/side-view-man-teaching-kid-shave_23-2149450928.jpg"},
        {
          id: "t5",          name: "Jane Smith",          imageSrc: "http://img.b2bpic.net/free-photo/studio-portrait-blond-male-with-crossed-tattooed-arms-dressed-plaid-shirt-isolated-grey-vignette-background_613910-11801.jpg"},
      ]}
      cardTitle="Client Reviews"
      cardTag="What They Say"
      cardAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactSplitForm
      useInvertedBackground={false}
      title="Book Your Appointment"
      description="Ready for your next fresh cut? Reach out today."
      inputs={[
        {
          name: "name",          type: "text",          placeholder: "Your Name",          required: true,
        },
        {
          name: "email",          type: "email",          placeholder: "Email Address",          required: true,
        },
        {
          name: "phone",          type: "tel",          placeholder: "Phone Number",          required: true,
        },
      ]}
      textarea={{
        name: "message",        placeholder: "Tell us about your appointment request",        rows: 4,
        required: true,
      }}
      imageSrc="http://img.b2bpic.net/free-photo/special-clean-up-after-shaving-process_23-2148298348.jpg"
      imageAlt="Clean barber setup"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterLogoEmphasis
      columns={[
        {
          items: [
            {
              label: "Home",              href: "#hero"},
            {
              label: "Services",              href: "#features"},
            {
              label: "Contact",              href: "#contact"},
          ],
        },
        {
          items: [
            {
              label: "645 N San Jacinto St, Hemet, CA",              href: "#"},
            {
              label: "(951) 766-2100",              href: "tel:9517662100"},
          ],
        },
      ]}
      logoText="One of One"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}