"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
import TeamCardOne from '@/components/sections/team/TeamCardOne';
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import { Scissors, Award, Sparkles, CheckCircle, Users, Star, Mail } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="background-highlight"
      borderRadius="rounded"
      contentWidth="mediumSmall"
      sizing="largeSizeMediumTitles"
      background="blurBottom"
      cardStyle="gradient-mesh"
      primaryButtonStyle="primary-glow"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="normal"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          brandName="Brother's Barber Shop"
          navItems={[
            { name: "Services", id: "services" },
            { name: "About", id: "about" },
            { name: "Team", id: "team" },
            { name: "Testimonials", id: "testimonials" },
            { name: "Contact", id: "contact" }
          ]}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroLogoBillboard
          logoText="Brother's Barber Shop"
          description="Timeless craftsmanship meets modern grooming. Step into an experience where tradition and excellence converge in every cut, every shave, and every detail."
          buttons={[
            { text: "Book Your Appointment", href: "#contact" },
            { text: "Discover Our Services", href: "#services" }
          ]}
          buttonAnimation="blur-reveal"
          background={{ variant: "sparkles-gradient" }}
          imageSrc="https://img.b2bpic.net/free-photo/stylish-haircut-barbershop_1163-2012.jpg"
          imageAlt="Premium barbershop interior with professional barbers"
          frameStyle="card"
          mediaAnimation="blur-reveal"
          ariaLabel="Hero section - Brother's Barber Shop"
        />
      </div>

      <div id="about" data-section="about">
        <TestimonialAboutCard
          tag="Our Story"
          tagIcon={Scissors}
          title="Crafting Excellence Since 2010"
          description="Marcus & Julian"
          subdescription="Brother Founders"
          icon={Award}
          imageSrc="https://img.b2bpic.net/free-photo/stylish-man-sitting-barbershop_1157-21716.jpg"
          imageAlt="Brother's Barber Shop heritage and tradition"
          mediaAnimation="blur-reveal"
          useInvertedBackground={false}
          ariaLabel="About section - Our story"
        />
      </div>

      <div id="services" data-section="services">
        <FeatureCardTen
          title="Our Premium Services"
          description="Each service is delivered with meticulous attention to detail and tailored to your unique style preferences"
          tag="Services"
          tagIcon={Sparkles}
          features={[
            {
              id: "1",              title: "Classic Haircuts",              description: "Master the art of precision cutting. Our barbers use traditional techniques combined with contemporary styling to deliver haircuts that define your character and enhance your personal style.",              reverse: false,
              media: {
                imageSrc: "https://img.b2bpic.net/free-photo/handsome-hipster-bearded-male-sitting-armchair-barber-shop-while-hairdresser-shaves-his-beard-with-dangerous-razor_613910-18507.jpg",                imageAlt: "Professional haircut service"
              },
              items: [
                { icon: CheckCircle, text: "Personalized consultation" },
                { icon: CheckCircle, text: "Premium product finishing" },
                { icon: CheckCircle, text: "Expert blending and fading" }
              ]
            },
            {
              id: "2",              title: "Beard Grooming & Shaping",              description: "Transform your beard into a statement of sophistication. Our specialists provide expert trimming, shaping, and conditioning to keep your facial hair healthy and impeccably styled.",              reverse: true,
              media: {
                imageSrc: "https://img.b2bpic.net/free-photo/professional-barber-working-with-client-hairdressing-salon-uses-hair-dryer-men-s-haircut-barbershop_613910-5061.jpg",                imageAlt: "Beard grooming and shaping service"
              },
              items: [
                { icon: CheckCircle, text: "Precision beard sculpting" },
                { icon: CheckCircle, text: "Conditioning treatments" },
                { icon: CheckCircle, text: "Professional beard oil application" }
              ]
            },
            {
              id: "3",              title: "Traditional Hot Shaves",              description: "Experience the ultimate luxury of a traditional hot shave. Using premium straight razors and hand-lathered cream, we deliver a close, comfortable shave that's as much art as it is grooming.",              reverse: false,
              media: {
                imageSrc: "https://img.b2bpic.net/free-photo/master-hairdresser-prepares-face-shaving-smears-face-with-foam-hairdressing-salon_613910-18410.jpg",                imageAlt: "Traditional hot shave service"
              },
              items: [
                { icon: CheckCircle, text: "Hot towel preparation" },
                { icon: CheckCircle, text: "Straight razor mastery" },
                { icon: CheckCircle, text: "Aftershave balm treatment" }
              ]
            }
          ]}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground={false}
          ariaLabel="Services section"
        />
      </div>

      <div id="team" data-section="team">
        <TeamCardOne
          title="Meet Our Master Barbers"
          description="Expert craftsmen dedicated to delivering exceptional grooming experiences with passion and precision"
          tag="Team"
          tagIcon={Users}
          members={[
            {
              id: "1",              name: "Marcus",              role: "Head Barber & Co-Founder",              imageSrc: "https://img.b2bpic.net/free-photo/man-hair-salon-looking-sideways_23-2148242781.jpg",              imageAlt: "Marcus, Head Barber"
            },
            {
              id: "2",              name: "Julian",              role: "Senior Barber & Co-Founder",              imageSrc: "https://img.b2bpic.net/free-photo/handsome-man-hair-salon-facing-camera_23-2148242826.jpg",              imageAlt: "Julian, Senior Barber"
            },
            {
              id: "3",              name: "David",              role: "Master Stylist",              imageSrc: "https://img.b2bpic.net/free-photo/attractive-pensive-man-is-waiting-his-turn-get-haircut-busy-barbershop_613910-21489.jpg",              imageAlt: "David, Master Stylist"
            },
            {
              id: "4",              name: "Alex",              role: "Premium Barber",              imageSrc: "https://img.b2bpic.net/free-photo/handsome-businessman-barber-shop_1157-21514.jpg",              imageAlt: "Alex, Premium Barber"
            }
          ]}
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          ariaLabel="Team section - Meet our barbers"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardTwo
          title="What Our Clients Say"
          description="Real stories from satisfied customers who trust us with their grooming journey"
          tag="Testimonials"
          tagIcon={Star}
          testimonials={[
            {
              id: "1",              name: "James Mitchell",              role: "Business Executive",              testimonial: "Brother's Barber Shop has become my sanctuary. The professionalism, attention to detail, and warm atmosphere make every visit exceptional. Marcus and his team truly understand the art of grooming.",              imageSrc: "https://img.b2bpic.net/free-photo/man-hair-salon-facing-camera_23-2148242763.jpg",              imageAlt: "James Mitchell"
            },
            {
              id: "2",              name: "Christopher Lee",              role: "Creative Professional",              testimonial: "I've been coming here for three years. The consistency in quality and the genuine care they show for their clients is unmatched. My haircut has become my signature look.",              imageSrc: "https://img.b2bpic.net/free-photo/serious-elegant-bearded-male-wearing-classic-waistcoat-slim-bow-tie_613910-1520.jpg",              imageAlt: "Christopher Lee"
            },
            {
              id: "3",              name: "Robert Chen",              role: "Entrepreneur",              testimonial: "The traditional hot shave experience at Brother's is absolutely incredible. It's not just a service—it's a ritual. I always leave feeling refreshed and rejuvenated.",              imageSrc: "https://img.b2bpic.net/free-photo/handsome-bearded-man-barbershop-barber-work_627829-7271.jpg",              imageAlt: "Robert Chen"
            },
            {
              id: "4",              name: "Michael Torres",              role: "Finance Professional",              testimonial: "Exceptional craftsmanship paired with outstanding customer service. Brother's Barber Shop sets the standard for what a premium barbershop should be.",              imageSrc: "https://img.b2bpic.net/free-photo/portrait-pensive-man-with-receive-moustache-beard-trimming-procedure-barbershop_613910-15042.jpg",              imageAlt: "Michael Torres"
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          ariaLabel="Testimonials section"
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqSplitText
          sideTitle="Frequently Asked Questions"
          sideDescription="Everything you need to know about booking your appointment and our services"
          faqs={[
            {
              id: "1",              title: "How do I book an appointment?",              content: "You can book an appointment through our contact form below, call us directly, or visit us in person. We recommend booking in advance to secure your preferred time slot with your preferred barber."
            },
            {
              id: "2",              title: "What is your walk-in policy?",              content: "We welcome walk-ins based on availability. However, appointments take priority. We typically accommodate walk-ins on a first-come, first-served basis during off-peak hours."
            },
            {
              id: "3",              title: "How long does a typical appointment take?",              content: "A classic haircut typically takes 30-40 minutes, beard grooming 20-30 minutes, and a traditional hot shave experience 45-60 minutes. We never rush our work to ensure premium quality."
            },
            {
              id: "4",              title: "Do you offer gift certificates?",              content: "Yes! Gift certificates are available for any amount. They make excellent presents for the grooming enthusiast in your life. Contact us for details."
            },
            {
              id: "5",              title: "What products do you use?",              content: "We exclusively use premium, professional-grade grooming products. All our barbers are trained to recommend products suited to your specific hair type and skin condition."
            }
          ]}
          textPosition="left"
          useInvertedBackground={false}
          animationType="smooth"
          faqsAnimation="slide-up"
          ariaLabel="FAQ section"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplit
          tag="Get In Touch"
          tagIcon={Mail}
          title="Ready for Your Transformation"
          description="Book your appointment today and experience the Brother's Barber Shop difference. Our team is ready to deliver excellence."
          background={{ variant: "sparkles-gradient" }}
          useInvertedBackground={false}
          imageSrc="https://img.b2bpic.net/free-photo/handsome-hipster-bearded-male-sitting-armchair-barber-shop-while-hairdresser-shaves-his-beard-with-dangerous-razor_613910-18437.jpg"
          imageAlt="Welcoming barbershop interior"
          mediaAnimation="blur-reveal"
          mediaPosition="right"
          inputPlaceholder="Enter your email"
          buttonText="Book Now"
          termsText="We'll be in touch within 24 hours to confirm your appointment. Your information is kept secure and confidential."
          ariaLabel="Contact section"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoEmphasis
          logoText="Brother's Barber Shop"
          columns={[
            {
              items: [
                { label: "Services", href: "#services" },
                { label: "Team", href: "#team" },
                { label: "About", href: "#about" }
              ]
            },
            {
              items: [
                { label: "Testimonials", href: "#testimonials" },
                { label: "FAQ", href: "#faq" },
                { label: "Contact", href: "#contact" }
              ]
            },
            {
              items: [
                { label: "Instagram", href: "https://instagram.com" },
                { label: "Facebook", href: "https://facebook.com" },
                { label: "Google Reviews", href: "https://google.com" }
              ]
            }
          ]}
          ariaLabel="Site footer"
        />
      </div>
    </ThemeProvider>
  );
}