"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import HeroLogo from '@/components/sections/hero/HeroLogo';
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
import FeatureCardOne from '@/components/sections/feature/FeatureCardOne';
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FooterBase from '@/components/sections/footer/FooterBase';
import { Sparkles } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="background-highlight"
      borderRadius="rounded"
      contentWidth="compact"
      sizing="largeSmallSizeLargeTitles"
      background="aurora"
      cardStyle="subtle-shadow"
      primaryButtonStyle="diagonal-gradient"
      secondaryButtonStyle="glass"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          brandName="CutStudio"
          navItems={[
            { name: "Services", id: "services" },
            { name: "About", id: "about" },
            { name: "Testimonials", id: "testimonials" },
            { name: "Contact", id: "contact" }
          ]}
          button={{
            text: "Book Appointment",            href: "contact"
          }}
          className="backdrop-blur-md bg-white/80 border border-accent/20"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroLogo
          logoText="Premium Haircuts. Honest Prices. Zero Ego."
          description="West Campus's most trusted salon for clean cuts, expert styling, and genuine service. Walk-ins welcome. Your hair. Done right."
          buttons={[
            {
              text: "Book Appointment",              href: "contact"
            },
            {
              text: "View Services",              href: "services"
            }
          ]}
          imageSrc="https://img.b2bpic.net/free-photo/side-view-leather-barber-shop-chair_23-2148242807.jpg"
          imageAlt="Modern, clean salon interior with professional styling stations"
          showDimOverlay={true}
          logoLineHeight={1.2}
          ariaLabel="Hero section with salon branding"
        />
      </div>

      <div id="about" data-section="about">
        <TextSplitAbout
          title="Why We're Different"
          description={[
            "We believe haircuts shouldn't be complicated. Our stylists listen first, cut second, and always prioritize your confidence over ego.",            "Located a block from campus with easy parking and zero wait-list drama. Friendly atmosphere, quality results, fair pricing—that's the CutStudio promise.",            "Whether you need a classic fade, creative color, or weekly touch-ups, we've got you covered without the premium salon gatekeeping."
          ]}
          buttons={[
            {
              text: "Meet Our Team",              href: "#team"
            }
          ]}
          showBorder={false}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="services" data-section="services">
        <FeatureCardOne
          title="Our Services"
          description="Premium haircuts and styling tailored to your look and lifestyle. Every service backed by honest pricing and expert craftsmanship."
          tag="Core Offerings"
          textboxLayout="default"
          animationType="slide-up"
          features={[
            {
              title: "Classic Haircuts",              description: "Clean fades, textured cuts, and traditional styles. Perfect for students and professionals who want timeless looks.",              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 haircut scissor cut technique clean fade barber service"
            },
            {
              title: "Styling & Styling",              description: "Professional blow-outs, styling for events, and maintenance cuts. Get ready for anything.",              imageSrc: "https://img.b2bpic.net/free-photo/professional-hairdresser-modeling-beard-with-scissors-comb-barbershop-close-up-photo_613910-18538.jpg",              imageAlt: "hair styling blowout service professional styling salon styling"
            },
            {
              title: "Color Treatments",              description: "Vibrant color, subtle highlights, or full transformations. Expert application with premium products.",              imageSrc: "https://img.b2bpic.net/free-photo/handsome-stylish-bearded-male-with-tattoo-arm-dressed-flannel-shirt-holding-juice-while-getting-haircut_613910-14751.jpg",              imageAlt: "hair color treatment salon coloring hair dye application color service"
            },
            {
              title: "Beard Grooming",              description: "Detailed beard trims, shaping, and conditioning. Leave with confidence and clean lines.",              imageSrc: "https://img.b2bpic.net/free-photo/barber-applying-cream-clients-beard_107420-94778.jpg",              imageAlt: "beard grooming beard trim men beard care barbershop grooming"
            }
          ]}
          gridVariant="two-columns-alternating-heights"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardEleven
          title="Trusted By The Community"
          description="Consistently rated top salon in the area by real customers who demand quality and honesty."
          tag="Our Impact"
          textboxLayout="default"
          animationType="slide-up"
          metrics={[
            {
              id: "1",              value: "4.6★",              title: "Average Rating",              description: "From 226+ verified customer reviews across all platforms",              imageSrc: "https://img.b2bpic.net/free-photo/smiling-man-sitting-cafe-table-gesturing_1262-1141.jpg",              imageAlt: "happy customer satisfied client smiling person positive feedback"
            },
            {
              id: "2",              value: "98%",              title: "Return Customers",              description: "Clients come back because they trust our quality and pricing",              imageSrc: "https://img.b2bpic.net/free-photo/blonde-sisters-little-chat_329181-10653.jpg",              imageAlt: "great haircut result before after transformation quality styling perfect cut"
            },
            {
              id: "3",              value: "Campus Favorite",              title: "Student Approved",              description: "Located on West Campus with easy walk-in access and flexible hours",              imageSrc: "https://img.b2bpic.net/free-photo/people-standing-holding-notebooks-looking-smartphones_23-2147657151.jpg",              imageAlt: "college campus university area student neighborhood west campus"
            }
          ]}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardOne
          title="What Our Clients Say"
          description="Real feedback from students, professionals, and locals who trust CutStudio for their grooming needs."
          tag="Testimonials"
          textboxLayout="default"
          animationType="slide-up"
          testimonials={[
            {
              id: "1",              name: "Marcus Johnson",              role: "Computer Science Major",              company: "Local Student",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/close-up-portrait-bearded-smiling-black-man-wool-suit_613910-16049.jpg",              imageAlt: "happy man portrait smiling professional confident person portrait photo"
            },
            {
              id: "2",              name: "Sarah Chen",              role: "Marketing Manager",              company: "Local Professional",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/smiling-handsome-bearded-african-american-businessman-brown-classic-jacket-isolated-dark-background_613910-6626.jpg",              imageAlt: "young woman portrait smiling girl friendly face portrait headshot"
            },
            {
              id: "3",              name: "David Rodriguez",              role: "Business Owner",              company: "West Campus Regular",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/smiling-businessman-standing-airport_107420-85035.jpg",              imageAlt: "diverse man portrait confident male smiling person professional headshot"
            },
            {
              id: "4",              name: "Alex Thompson",              role: "Engineering Student",              company: "Campus Regular",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1689.jpg",              imageAlt: "young man portrait smiling student friendly face casual headshot"
            },
            {
              id: "5",              name: "Emily Jackson",              role: "Fashion Designer",              company: "Local Creative",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/portrait-man-black-suit_23-2148401442.jpg",              imageAlt: "woman smiling portrait happy lady professional woman portrait photo"
            },
            {
              id: "6",              name: "Jessica Lee",              role: "Graduate Student",              company: "Campus Community",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1563.jpg",              imageAlt: "diverse woman portrait confident woman smiling face headshot photo"
            }
          ]}
          gridVariant="three-columns-all-equal-width"
          carouselMode="buttons"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="gallery" data-section="gallery">
        <FeatureCardOne
          title="Gallery"
          description="A glimpse into our clean, professional space and the quality work we deliver every day."
          tag="Inside CutStudio"
          textboxLayout="default"
          animationType="opacity"
          features={[
            {
              title: "Storefront & Entrance",              description: "Welcoming modern facade with easy access right on campus.",              imageSrc: "https://img.b2bpic.net/free-photo/group-people-chatting-courtyard_23-2147679223.jpg",              imageAlt: "modern salon storefront barbershop entrance salon facade shop exterior"
            },
            {
              title: "Professional Stations",              description: "Well-lit, comfortable chairs and mirrors for your styling session.",              imageSrc: "https://img.b2bpic.net/free-photo/barbershop-washbasin-with-professional-chairs_23-2148298338.jpg",              imageAlt: "salon chairs barber station salon interior design professional chairs"
            },
            {
              title: "Expert Setup",              description: "Premium tools, lighting, and hygiene standards that matter.",              imageSrc: "https://img.b2bpic.net/free-photo/full-shot-man-getting-haircut_23-2149141753.jpg",              imageAlt: "salon mirrors professional lighting mirror station salon setup"
            },
            {
              title: "Results Speak",              description: "Clean lines, sharp fades, and styles that make you look sharp.",              imageSrc: "https://img.b2bpic.net/free-photo/two-handsome-young-unshaved-men-with-hipster-beards-dressed-stylish-checkered-shirts-standing-with-arms-folded-gray-concrete-wall-looking-with-serious-face-expression-squinting-eyes_273609-5967.jpg",              imageAlt: "perfect haircut style great hair look styled hair result professional finish"
            },
            {
              title: "Stylists at Work",              description: "Our team focused on delivering quality cuts and styling.",              imageSrc: "https://img.b2bpic.net/free-photo/stylish-man-sitting-barbershop_1157-21713.jpg",              imageAlt: "barber working stylist cutting hair professional service haircut in progress"
            },
            {
              title: "Happy Clients",              description: "Confidence boost and satisfaction guaranteed after every visit.",              imageSrc: "https://img.b2bpic.net/free-photo/handsome-man-making-ok-sign_1368-6336.jpg",              imageAlt: "satisfied client happy customer client smiling positive experience"
            }
          ]}
          gridVariant="bento-grid"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCenter
          tag="Book Now"
          title="Your Haircut. Done Right."
          description="Ready to experience the CutStudio difference? Book your appointment online or just walk in. We're here for you."
          tagIcon={Sparkles}
          useInvertedBackground="noInvert"
          inputPlaceholder="your@email.com"
          buttonText="Get Started"
          termsText="We'll send appointment confirmations and styling tips to your email. No spam. Ever."
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBase
          logoText="CutStudio"
          copyrightText="© 2025 CutStudio. All rights reserved."
          columns={[
            {
              title: "Services",              items: [
                { label: "Haircuts", href: "services" },
                { label: "Styling", href: "services" },
                { label: "Color", href: "services" },
                { label: "Beard Grooming", href: "services" }
              ]
            },
            {
              title: "Company",              items: [
                { label: "About Us", href: "about" },
                { label: "Testimonials", href: "testimonials" },
                { label: "Gallery", href: "gallery" },
                { label: "Contact", href: "contact" }
              ]
            },
            {
              title: "Hours",              items: [
                { label: "Monday–Friday: 10am–8pm", href: "#" },
                { label: "Saturday: 9am–6pm", href: "#" },
                { label: "Sunday: Closed", href: "#" },
                { label: "Walk-ins always welcome", href: "#" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}