"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import { ShoppingBag } from 'lucide-react';

export default function ShopPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="directional-hover"
      defaultTextAnimation="entrance-slide"
      borderRadius="pill"
      contentWidth="small"
      sizing="mediumLarge"
      background="floatingGradient"
      cardStyle="gradient-mesh"
      primaryButtonStyle="inset-glow"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="light"
    >
      <NavbarLayoutFloatingOverlay
        brandName="Luxury Hotels"
        navItems={[
          { name: "Home", id: "/" },
          { name: "Shop", id: "/shop" }
        ]}
        button={{
          text: "Book Now",          href: "/"
        }}
      />
      
      <main className="min-h-screen">
        <ProductCardOne
          products={[
            {
              id: "1",              name: "Luxury Bath Collection",              price: "$89",              imageSrc: "https://images.unsplash.com/photo-1584464491033-06628f3a6b7b?w=500&h=500&fit=crop",              imageAlt: "Luxury bath collection",              onProductClick: () => console.log("Product clicked"),
              onFavorite: () => console.log("Favorited"),
              isFavorited: false
            },
            {
              id: "2",              name: "Premium Spa Towels",              price: "$65",              imageSrc: "https://images.unsplash.com/photo-1564069114553-7215e1ff1890?w=500&h=500&fit=crop",              imageAlt: "Premium spa towels",              onProductClick: () => console.log("Product clicked"),
              onFavorite: () => console.log("Favorited"),
              isFavorited: false
            },
            {
              id: "3",              name: "Silk Pillow Set",              price: "$125",              imageSrc: "https://images.unsplash.com/photo-1586023492125-27b2c045efd7?w=500&h=500&fit=crop",              imageAlt: "Silk pillow set",              onProductClick: () => console.log("Product clicked"),
              onFavorite: () => console.log("Favorited"),
              isFavorited: false
            },
            {
              id: "4",              name: "Aromatherapy Diffuser",              price: "$95",              imageSrc: "https://images.unsplash.com/photo-1600821419762-a1dd2b39ad40?w=500&h=500&fit=crop",              imageAlt: "Aromatherapy diffuser",              onProductClick: () => console.log("Product clicked"),
              onFavorite: () => console.log("Favorited"),
              isFavorited: false
            },
            {
              id: "5",              name: "Cashmere Throw",              price: "$185",              imageSrc: "https://images.unsplash.com/photo-1506439773649-6e0eb8cfb237?w=500&h=500&fit=crop",              imageAlt: "Cashmere throw",              onProductClick: () => console.log("Product clicked"),
              onFavorite: () => console.log("Favorited"),
              isFavorited: false
            },
            {
              id: "6",              name: "Crystal Wine Glasses",              price: "$75",              imageSrc: "https://images.unsplash.com/photo-1546171753-97d7676e4602?w=500&h=500&fit=crop",              imageAlt: "Crystal wine glasses",              onProductClick: () => console.log("Product clicked"),
              onFavorite: () => console.log("Favorited"),
              isFavorited: false
            }
          ]}
          title="Luxury Hotel Shop"
          description="Bring the luxury of our hotel experience to your home with our curated collection of premium products"
          tag="Premium Collection"
          tagIcon={ShoppingBag}
          buttons={[
            {
              text: "View All Products",              href: "/shop"
            }
          ]}
          textboxLayout="default"
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          useInvertedBackground="noInvert"
          carouselMode="buttons"
          ariaLabel="Luxury hotel shop products"
        />
      </main>
      
      <FooterLogoEmphasis
        logoText="Luxury Hotels"
        columns={[
          {
            items: [
              { label: "About Us", href: "/" },
              { label: "Our Rooms", href: "/" },
              { label: "Amenities", href: "/" }
            ]
          },
          {
            items: [
              { label: "Pricing", href: "/" },
              { label: "Testimonials", href: "/" },
              { label: "Contact", href: "/" }
            ]
          },
          {
            items: [
              { label: "Privacy Policy", href: "/" },
              { label: "Terms of Service", href: "/" },
              { label: "Careers", href: "/" }
            ]
          },
          {
            items: [
              { label: "Email: info@luxuryhotels.com", href: "mailto:info@luxuryhotels.com" },
              { label: "Phone: +1 (555) 123-4567", href: "tel:+15551234567" },
              { label: "Address: 123 Resort Lane", href: "/" }
            ]
          }
        ]}
      />
    </ThemeProvider>
  );
}