"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import FaqBase from '@/components/sections/faq/FaqBase';
import FooterCard from '@/components/sections/footer/FooterCard';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import PricingCardFive from '@/components/sections/pricing/PricingCardFive';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="icon-arrow"
        defaultTextAnimation="reveal-blur"
        borderRadius="pill"
        contentWidth="medium"
        sizing="mediumLargeSizeLargeTitles"
        background="noise"
        cardStyle="gradient-bordered"
        primaryButtonStyle="diagonal-gradient"
        secondaryButtonStyle="layered"
        headingFontWeight="extrabold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleFullscreen
      navItems={[
        {
          name: "About",
          id: "about",
        },
        {
          name: "Services",
          id: "services",
        },
        {
          name: "Shop",
          id: "shop",
        },
        {
          name: "Testimonials",
          id: "testimonials",
        },
        {
          name: "FAQ",
          id: "faq",
        },
      ]}
      brandName="Iron & Oil"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroBillboard
      background={{
        variant: "radial-gradient",
      }}
      title="Where Craft Meets Sanctuary."
      description="Iron & Oil is more than a barbershop; it's a third space built on century-old techniques and modern ergonomics. Enjoy a precision cut, refined service, and a complimentary pour of small-batch bourbon."
      buttons={[
        {
          text: "Book Appointment",
          href: "#contact",
        },
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/barber-tools-wooden-background-table-with-electric-machines_627829-6252.jpg?_wi=1"
      imageAlt="Luxurious barbershop interior"
      mediaAnimation="blur-reveal"
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/attractive-blond-male-dressed-suit-dark-grey-background_613910-14130.jpg",
          alt: "Client 1",
        },
        {
          src: "http://img.b2bpic.net/free-photo/handsome-sports-man-resting-after-workout_158595-1404.jpg",
          alt: "Client 2",
        },
        {
          src: "http://img.b2bpic.net/free-photo/close-up-unshaven-employee_1098-4075.jpg",
          alt: "Client 3",
        },
        {
          src: "http://img.b2bpic.net/free-photo/close-up-young-businessman-holding-disposable-coffee-cup-hand-looking-camera_23-2148176166.jpg",
          alt: "Client 4",
        },
        {
          src: "http://img.b2bpic.net/free-photo/close-up-portrait-fashionable-bearded-male-with-stylish-haircut-drinks-glass-juice-sitting-cafe-outdoors_613910-6657.jpg",
          alt: "Client 5",
        },
      ]}
      avatarText="Trusted by 1000+ local professionals"
      marqueeItems={[
        {
          type: "text",
          text: "Precision Fades",
        },
        {
          type: "text",
          text: "Straight Razor Shaves",
        },
        {
          type: "text",
          text: "Hot Towel Rituals",
        },
        {
          type: "text",
          text: "Expert Styling",
        },
        {
          type: "text",
          text: "Small-batch Bourbon",
        },
      ]}
    />
  </div>

  <div id="about" data-section="about">
      <InlineImageSplitTextAbout
      useInvertedBackground={true}
      heading={[
        {
          type: "text",
          content: "The Art of the Cut",
        },
        {
          type: "image",
          src: "http://img.b2bpic.net/free-photo/barbecue-utensil-set-wooden-table_23-2148206901.jpg",
          alt: "Barber workbench",
        },
      ]}
    />
  </div>

  <div id="services" data-section="services">
      <PricingCardFive
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      plans={[
        {
          id: "p1",
          tag: "Essential",
          price: "$65",
          period: "45 min",
          description: "Precision haircut, tapered edges, hot towel neck shave, and style.",
          button: {
            text: "Book Now",
            href: "#contact",
          },
          featuresTitle: "Includes",
          features: [
            "Precision Cut",
            "Tapered Edges",
            "Hot Towel Shave",
          ],
        },
        {
          id: "p2",
          tag: "Grooming",
          price: "$45",
          period: "30 min",
          description: "Deep conditioning, free-hand shaping, and straight-razor line work.",
          button: {
            text: "Book Now",
            href: "#contact",
          },
          featuresTitle: "Includes",
          features: [
            "Conditioning",
            "Free-hand Shaping",
            "Straight Razor Line-work",
          ],
        },
        {
          id: "p3",
          tag: "Ritual",
          price: "$110",
          period: "75 min",
          description: "The ultimate package. Haircut, beard trim, charcoal face mask, and scalp massage.",
          button: {
            text: "Book Now",
            href: "#contact",
          },
          featuresTitle: "Includes",
          features: [
            "Full Haircut",
            "Beard Trim",
            "Charcoal Mask",
            "Scalp Massage",
          ],
        },
      ]}
      title="Services"
      description="Precision service for the modern man. Appointments only."
    />
  </div>

  <div id="shop" data-section="shop">
      <ProductCardThree
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="uniform-all-items-equal"
      useInvertedBackground={true}
      products={[
        {
          id: "prod1",
          name: "Foundry No. 1 Pomade",
          price: "$28",
          imageSrc: "http://img.b2bpic.net/free-photo/ecofriendly-beauty-product_23-2150669117.jpg?_wi=1",
        },
        {
          id: "prod2",
          name: "Cast Iron Beard Balm",
          price: "$24",
          imageSrc: "http://img.b2bpic.net/free-photo/front-view-man-holding-glass_23-2150226107.jpg?_wi=1",
        },
        {
          id: "prod3",
          name: "Raw Grain Exfoliant",
          price: "$32",
          imageSrc: "http://img.b2bpic.net/free-photo/wooden-bowl-crispy-black-chips-stone_114579-87794.jpg?_wi=1",
        },
        {
          id: "prod4",
          name: "Burnt Cedar Tonic",
          price: "$26",
          imageSrc: "http://img.b2bpic.net/free-photo/product-branding-packaging_23-2150965824.jpg",
        },
        {
          id: "prod5",
          name: "Leather Travel Case",
          price: "$85",
          imageSrc: "http://img.b2bpic.net/free-photo/serious-bearded-man-sitting-grass-outdoors-getting-tablet-computer-from-his-backpack_171337-12740.jpg",
        },
        {
          id: "prod6",
          name: "Foundry Apron",
          price: "$65",
          imageSrc: "http://img.b2bpic.net/free-photo/father-s-day-composition-with-blank-slate-decorative-cinnamon-sticks_23-2147631266.jpg",
        },
      ]}
      title="Shop Our Apothecary"
      description="The same products we trust in the chair."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardFive
      textboxLayout="default"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "1",
          name: "Julian M.",
          date: "2024",
          title: "Venture Capitalist",
          quote: "Iron & Oil is a sanctuary. Silent service, sharp fades.",
          tag: "Client",
          avatarSrc: "http://img.b2bpic.net/free-photo/attractive-blond-male-dressed-suit-dark-grey-background_613910-14130.jpg",
          imageSrc: "http://img.b2bpic.net/free-photo/barber-tools-wooden-background-table-with-electric-machines_627829-6252.jpg?_wi=2",
          imageAlt: "barbershop interior dark industrial",
        },
        {
          id: "2",
          name: "Kobe W.",
          date: "2024",
          title: "Athlete",
          quote: "The lining is unmatched. Treat the straight razor like surgery.",
          tag: "Client",
          avatarSrc: "http://img.b2bpic.net/free-photo/handsome-sports-man-resting-after-workout_158595-1404.jpg",
          imageSrc: "http://img.b2bpic.net/free-photo/barbecue-utensil-set-wooden-table_23-2148206901.jpg",
          imageAlt: "barber tools rustic workbench",
        },
        {
          id: "3",
          name: "Liam G.",
          date: "2024",
          title: "Software Engineer",
          quote: "Seamless booking, literal work of art, amazing pomade.",
          tag: "Client",
          avatarSrc: "http://img.b2bpic.net/free-photo/close-up-unshaven-employee_1098-4075.jpg",
          imageSrc: "http://img.b2bpic.net/free-photo/ecofriendly-beauty-product_23-2150669117.jpg?_wi=2",
          imageAlt: "pomade jar product photo",
        },
        {
          id: "4",
          name: "Marcus R.",
          date: "2024",
          title: "Architect",
          quote: "Attention to detail is on another level.",
          tag: "Client",
          avatarSrc: "http://img.b2bpic.net/free-photo/close-up-young-businessman-holding-disposable-coffee-cup-hand-looking-camera_23-2148176166.jpg",
          imageSrc: "http://img.b2bpic.net/free-photo/front-view-man-holding-glass_23-2150226107.jpg?_wi=2",
          imageAlt: "beard balm jar minimalist",
        },
        {
          id: "5",
          name: "David L.",
          date: "2024",
          title: "Founder",
          quote: "Best experience I've had in the city.",
          tag: "Client",
          avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-fashionable-bearded-male-with-stylish-haircut-drinks-glass-juice-sitting-cafe-outdoors_613910-6657.jpg",
          imageSrc: "http://img.b2bpic.net/free-photo/wooden-bowl-crispy-black-chips-stone_114579-87794.jpg?_wi=2",
          imageAlt: "face scrub skincare men",
        },
      ]}
      title="Refined Reviews"
      description="What our clients say about the sanctuary."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqBase
      textboxLayout="default"
      useInvertedBackground={true}
      faqs={[
        {
          id: "f1",
          title: "Do you take walk-ins?",
          content: "No. To maintain the atmosphere, we are strictly appointment-only.",
        },
        {
          id: "f2",
          title: "Is there parking?",
          content: "Yes, private parking is available behind the Foundry building.",
        },
        {
          id: "f3",
          title: "What is your cancellation policy?",
          content: "We require 24-hour notice, as our chairs are in high demand.",
        },
      ]}
      title="Shop Information"
      description="Common questions about your visit."
      faqsAnimation="slide-up"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterCard
      logoText="Iron & Oil"
      copyrightText="© 2025 Iron & Oil Barbershop."
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}