"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import FeatureProcessSteps from '@/components/sections/feature/FeatureProcessSteps';
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
import ContactText from '@/components/sections/contact/ContactText';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import { Award, Clock, Sparkles, Star, Users } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="directional-hover"
      defaultTextAnimation="reveal-blur"
      borderRadius="sharp"
      contentWidth="mediumSmall"
      sizing="mediumLarge"
      background="circleGradient"
      cardStyle="solid"
      primaryButtonStyle="primary-glow"
      secondaryButtonStyle="glass"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          brandName="Alexa"
          navItems={[
            { name: "About", id: "about" },
            { name: "Services", id: "services" },
            { name: "Testimonials", id: "testimonials" },
            { name: "Pricing", id: "pricing" },
            { name: "Contact", id: "contact" }
          ]}
          button={{
            text: "Book a Consultation",            href: "#contact"
          }}
        />
      </div>
      
      <div id="hero" data-section="hero">
        <HeroLogoBillboard
          logoText="Alexa"
          description="Elevated culinary experiences curated for Calabasas' most discerning palates. Personalized private chef services that transform your table into a culinary destination."
          imageSrc="https://img.b2bpic.net/free-photo/view-chef-working-kitchen_23-2149728027.jpg"
          imageAlt="Professional private chef Alexa in elegant kitchen setting"
          frameStyle="card"
          logoLineHeight={1.1}
        />
      </div>
      
      <div id="about" data-section="about">
        <InlineImageSplitTextAbout
          heading={[
            { type: "text", content: "Expert culinary craftsmanship meets" },
            { type: "text", content: "personalized service" }
          ]}
          useInvertedBackground="invertDefault"
          buttons={[
            { text: "View Services", href: "#services" },
            { text: "See Testimonials", href: "#testimonials" }
          ]}
        />
      </div>
      
      <div id="services" data-section="services">
        <FeatureProcessSteps
          tag="Our Process"
          tagIcon={Sparkles}
          title="From Concept to Culinary Excellence"
          description="Every meal is a masterpiece. We guide you through a seamless process that transforms your vision into unforgettable dining experiences tailored to your preferences, dietary needs, and lifestyle."
          useInvertedBackground="noInvert"
          steps={[
            {
              number: "01",              title: "Consultation & Menu Design",              tag: "Discovery",              description: "We meet to understand your culinary preferences, dietary requirements, and the occasion. Together we craft a bespoke menu that reflects your taste."
            },
            {
              number: "02",              title: "Premium Ingredient Sourcing",              tag: "Preparation",              description: "Using relationships with local Calabasas suppliers and global sources, we source the finest seasonal ingredients for your exclusive menu."
            },
            {
              number: "03",              title: "Exquisite Preparation & Service",              tag: "Execution",              description: "We arrive prepared to cook in your kitchen, managing every detail. From plating to service, we ensure each course is perfection."
            },
            {
              number: "04",              title: "Memorable Dining Experience",              tag: "Enjoyment",              description: "Sit back and savor. We handle all cooking, plating, and cleanup, allowing you to focus entirely on the experience with your guests."
            }
          ]}
        />
      </div>
      
      <div id="highlights" data-section="highlights">
        <MetricCardOne
          title="Why Choose Alexa"
          description="Proven excellence across years of creating unforgettable culinary moments"
          useInvertedBackground="invertDefault"
          textboxLayout="default"
          animationType="slide-up"
          gridVariant="uniform-all-items-equal"
          metrics={[
            {
              id: "1",              value: "15+",              title: "Years",              description: "of professional culinary experience",              icon: Clock
            },
            {
              id: "2",              value: "500+",              title: "Events",              description: "successfully catered and executed",              icon: Users
            },
            {
              id: "3",              value: "100%",              title: "Satisfaction",              description: "client satisfaction and repeat bookings",              icon: Star
            },
            {
              id: "4",              value: "4.9★",              title: "Rating",              description: "from discerning Calabasas clients",              icon: Award
            }
          ]}
        />
      </div>
      
      <div id="testimonials" data-section="testimonials">
        <TestimonialCardThirteen
          title="What Our Clients Say"
          description="Testimonials from Calabasas residents who have experienced Alexa's culinary artistry"
          useInvertedBackground="noInvert"
          textboxLayout="default"
          animationType="slide-up"
          showRating={true}
          testimonials={[
            {
              id: "1",              name: "Margaret Sterling",              handle: "@margarets",              testimonial: "Alexa transformed our dinner party into an unforgettable evening. The presentation, flavors, and service were absolutely impeccable. She's now our go-to chef for every occasion.",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/portrait-young-woman-with-long-brown-hair-black-t-shirt-white-jacket_613910-8245.jpg",              imageAlt: "Margaret Sterling"
            },
            {
              id: "2",              name: "James Richardson",              handle: "@j_richardson",              testimonial: "Having Alexa cook in our home was like having a Michelin-starred restaurant at our table. Professional, creative, and incredibly attentive to detail.",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/portrait-happy-woman-black-jacket-happy-short-haired-girl-dark-suit-widely-sincerely-smiles-isolated-background_197531-18508.jpg",              imageAlt: "James Richardson"
            },
            {
              id: "3",              name: "Victoria Chen",              handle: "@vchen",              testimonial: "The menu was perfectly tailored to our preferences and dietary needs. Every course was a work of art. Alexa's passion for food is truly evident in every dish.",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/portrait-business-woman-office_1398-6.jpg",              imageAlt: "Victoria Chen"
            }
          ]}
        />
      </div>
      
      <div id="pricing" data-section="pricing">
        <PricingCardThree
          title="Culinary Experiences"
          description="Flexible pricing options tailored to your dining needs and group size"
          useInvertedBackground="invertDefault"
          textboxLayout="default"
          animationType="slide-up"
          plans={[
            {
              id: "intimate",              price: "$400",              name: "Intimate Dinner",              badge: "Perfect for Small Gatherings",              badgeIcon: Sparkles,
              features: [
                "For 2-4 guests",                "Customized 3-course menu",                "Premium ingredient sourcing",                "Professional service and setup",                "Complimentary beverage pairing suggestions"
              ],
              buttons: [
                { text: "Book Now", href: "#contact" },
                { text: "Customize Menu", href: "#contact" }
              ]
            },
            {
              id: "gathering",              price: "$600",              name: "Premium Gathering",              badge: "Most Popular",              badgeIcon: Star,
              features: [
                "For 5-8 guests",                "Bespoke 4-course menu",                "Multi-regional cuisine inspiration",                "Full kitchen service and plating",                "Coordinated table service",                "Custom wine pairing consultation"
              ],
              buttons: [
                { text: "Book Now", href: "#contact" },
                { text: "Customize Menu", href: "#contact" }
              ]
            }
          ]}
        />
      </div>
      
      <div id="contact" data-section="contact">
        <ContactText
          text="Ready to experience elevated culinary artistry? Let's create an unforgettable dining experience tailored exclusively to you. Book your private chef consultation with Alexa today."
          animationType="reveal-blur"
          useInvertedBackground="noInvert"
          buttons={[
            { text: "Schedule Consultation", href: "mailto:hello@alexaprivatechef.com" },
            { text: "Call: (818) 555-0147", href: "tel:+18185550147" }
          ]}
        />
      </div>
      
      <div id="footer" data-section="footer">
        <FooterLogoEmphasis
          logoText="Alexa"
          columns={[
            {
              items: [
                { label: "Services", href: "#services" },
                { label: "Pricing", href: "#pricing" },
                { label: "Testimonials", href: "#testimonials" }
              ]
            },
            {
              items: [
                { label: "About", href: "#about" },
                { label: "Contact", href: "#contact" },
                { label: "Book a Consultation", href: "#contact" }
              ]
            },
            {
              items: [
                { label: "Email: hello@alexaprivatechef.com" },
                { label: "Phone: (818) 555-0147" },
                { label: "Based in Calabasas, CA" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}