"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import HeroBillboardCarouselSplit from '@/components/sections/hero/HeroBillboardCarouselSplit';
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
import FeatureCardSixteen from '@/components/sections/feature/FeatureCardSixteen';
import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
import TestimonialCardEight from '@/components/sections/testimonial/TestimonialCardEight';
import ContactCenterForm from '@/components/sections/contact/ContactCenterForm';
import FooterSplit from '@/components/sections/footer/FooterSplit';
import { Utensils, Heart, MapPin, Phone, Mail } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="icon-arrow"
      defaultTextAnimation="reveal-blur"
      borderRadius="pill"
      contentWidth="large"
      sizing="smallSizeLargeTitles"
      background="noiseGradient"
      cardStyle="glass-outline"
      primaryButtonStyle="gradient"
      secondaryButtonStyle="outline"
      headingFontWeight="normal"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleFullscreen
          navItems={[
            { name: "Home", id: "home" },
            { name: "About", id: "about" },
            { name: "Menu", id: "menu" },
            { name: "Reservations", id: "contact" },
            { name: "Contact", id: "footer" }
          ]}
          logoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766183827933-jsmix0wr.jpg"
          logoAlt="Italian Restaurant Logo"
          brandName="La Bella Italia"
          bottomLeftText="Ticino, Switzerland"
          bottomRightText="info@labellaItalia.ch"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboardCarouselSplit
          title="Experience Authentic Italian Cuisine in Switzerland"
          mediaItems={[
            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766183829154-9c5vkkws.jpg", imageAlt: "Signature pasta dish" },
            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766183829918-12xa97ao.jpg", imageAlt: "Creamy risotto" },
            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766183830869-g93nmh02.jpg", imageAlt: "Traditional Italian pizza" },
            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766183832020-sqgzqvxa.jpg", imageAlt: "Homemade tiramisu" },
            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766183833897-i2cgqm4f.jpg", imageAlt: "Italian wine selection" },
            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766183834735-9ooktc3n.jpg", imageAlt: "Fresh seafood pasta" }
          ]}
          buttons={[
            { text: "Make a Reservation", href: "contact" },
            { text: "View Menu", href: "menu" }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <TestimonialAboutCard
          tag="Our Story"
          tagIcon={Utensils}
          title="Bringing Italy to the Heart of Switzerland"
          description="Established in 2010"
          subdescription="La Bella Italia Restaurant"
          icon={Heart}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766183836608-3tf0vxxx.jpg"
          imageAlt="Cozy restaurant interior"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardSixteen
          title="Why Choose La Bella Italia"
          description="Discover what makes our restaurant unique in the Swiss dining scene"
          tag="Dining Excellence"
          negativeCard={{
            title: "Without Us",
            items: [
              "Impersonal dining experiences",
              "Frozen or processed ingredients",
              "Limited authentic Italian options",
              "Inconsistent quality"
            ]
          }}
          positiveCard={{
            title: "With La Bella Italia",
            items: [
              "Warm, family-style atmosphere",
              "Fresh ingredients imported daily from Italy",
              "Traditional recipes from multiple Italian regions",
              "Consistent excellence every visit"
            ]
          }}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="pricing" data-section="pricing">
        <PricingCardNine
          title="Dining Packages"
          description="Choose the perfect experience for your occasion"
          tag="Pricing"
          plans={[
            {
              id: "classic",
              title: "Classic Dinner",
              price: "CHF 35",
              period: "per person",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766183835554-u0l6uy1i.jpg",
              imageAlt: "Classic dinner plate",
              features: [
                "Appetizer or salad",
                "Main course selection",
                "House wine or soft drink",
                "Dessert"
              ],
              button: { text: "Reserve Now", href: "contact" }
            },
            {
              id: "romantic",
              title: "Romantic Evening",
              price: "CHF 65",
              period: "per couple",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766183839130-uny71l1o.jpg",
              imageAlt: "Romantic candlelit dinner",
              features: [
                "Antipasti selection",
                "Two main courses (chef's special)",
                "Premium wine pairing",
                "Dessert with prosecco",
                "Complimentary aperitivo"
              ],
              button: { text: "Book Your Evening", href: "contact" }
            },
            {
              id: "family",
              title: "Family Feast",
              price: "CHF 45",
              period: "per person",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766183829154-9c5vkkws.jpg",
              imageAlt: "Family style sharing plates",
              features: [
                "Shared antipasti platter",
                "Choice of 3 main courses",
                "Family-style sides",
                "Dessert selection",
                "Complimentary digestivo"
              ],
              button: { text: "Plan Your Visit", href: "contact" }
            }
          ]}
          animationType="slide-up"
          variant="card"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardEight
          title="Guest Experiences"
          description="Hear what our guests say about dining with us"
          tag="Reviews"
          testimonials={[
            {
              id: "1",
              name: "Marco Rossi",
              role: "Local Food Critic",
              company: "Swiss Culinary Review",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140152452-p4x3ah4p.jpg",
              imageAlt: "Marco Rossi portrait"
            },
            {
              id: "2",
              name: "Elena Bernardi",
              role: "Restaurant Owner",
              company: "Zurich Hospitality Group",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766183841431-v1xtegko.jpg",
              imageAlt: "Elena Bernardi portrait"
            },
            {
              id: "3",
              name: "Giovanni Ferri",
              role: "Chef",
              company: "Culinary Institute",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766154635301-vse33sxl.jpg",
              imageAlt: "Giovanni Ferri portrait"
            },
            {
              id: "4",
              name: "Sophie Dubois",
              role: "Event Planner",
              company: "Elegant Events",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766183842429-uezzjpov.jpg",
              imageAlt: "Sophie Dubois portrait"
            },
            {
              id: "5",
              name: "Andrea Moretti",
              role: "Regular Guest",
              company: "Local Community",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766183843211-zal0n8gj.jpg",
              imageAlt: "Andrea Moretti portrait"
            },
            {
              id: "6",
              name: "Thomas Mueller",
              role: "Business Executive",
              company: "Corporate Client",
              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766183844045-gbini56u.jpg",
              imageAlt: "Thomas Mueller portrait"
            }
          ]}
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCenterForm
          title="Reserve Your Table"
          description="Book your dining experience with us. We look forward to welcoming you."
          inputs={[
            { name: "name", type: "text", placeholder: "Your Name", required: true },
            { name: "email", type: "email", placeholder: "Your Email", required: true },
            { name: "phone", type: "tel", placeholder: "Your Phone Number", required: true },
            { name: "date", type: "date", placeholder: "Preferred Date", required: true }
          ]}
          textarea={{
            name: "message",
            placeholder: "Special requests or dietary preferences",
            rows: 4,
            required: false
          }}
          useInvertedBackground="noInvert"
          buttonText="Confirm Reservation"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterSplit
          logoText="La Bella Italia"
          title="Taste the authentic flavors of Italy in the heart of Switzerland"
          columns={[
            {
              title: "Restaurant",
              items: [
                { label: "About Us", href: "about" },
                { label: "Menu", href: "menu" },
                { label: "Reservations", href: "contact" }
              ]
            },
            {
              title: "Hours",
              items: [
                { label: "Mon-Fri: 11:30 AM - 11 PM", href: "#" },
                { label: "Sat: 12 PM - 12 AM", href: "#" },
                { label: "Sun: 12 PM - 10 PM", href: "#" }
              ]
            },
            {
              title: "Follow Us",
              items: [
                { label: "Instagram", href: "https://instagram.com" },
                { label: "Facebook", href: "https://facebook.com" },
                { label: "TripAdvisor", href: "https://tripadvisor.com" }
              ]
            }
          ]}
          contactItems={[
            { icon: MapPin, text: "Via Roma 45, Ticino, Switzerland" },
            { icon: Phone, text: "+41 91 XXX XXXX" },
            { icon: Mail, text: "info@labellaItalia.ch" }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}