"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import { Clapperboard, Sparkles, Star, Package } from 'lucide-react';
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';

export default function MoviePlayPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="expand-hover"
      defaultTextAnimation="reveal-blur"
      borderRadius="pill"
      contentWidth="mediumSmall"
      sizing="mediumLargeSizeMediumTitles"
      background="none"
      cardStyle="solid"
      primaryButtonStyle="gradient"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          brandName="Movie Play"
          navItems={[
            { name: "Home", id: "hero" },
            { name: "Movies", id: "products" },
            { name: "About", id: "feature" },
            { name: "Reviews", id: "testimonial" }
          ]}
          button={{
            text: "Book Now",            href: "#contact"
          }}
        />
      </div>

      <div id="products" data-section="products">
        <ProductCardFour
          title="Now Showing"
          description="Check out our latest blockbuster releases and fan-favorite films"
          tag="Featured Movies"
          tagIcon={Star}
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          carouselMode="buttons"
          products={[
            {
              id: "1",              name: "Epic Adventure",              price: "$15",              variant: "2D & IMAX",              imageSrc: "https://img.b2bpic.net/free-photo/musicial-music-live-band-performing-stage-with-different-lights_627829-10063.jpg",              imageAlt: "Epic Adventure movie poster"
            },
            {
              id: "2",              name: "Heart's Echo",              price: "$12",              variant: "Romantic Drama",              imageSrc: "https://img.b2bpic.net/free-photo/man-looking-cinema-screen_23-2147803840.jpg",              imageAlt: "Heart's Echo movie poster"
            },
            {
              id: "3",              name: "Laugh Riot",              price: "$12",              variant: "Comedy",              imageSrc: "https://img.b2bpic.net/free-photo/man-speaking-phone-cinema_23-2147803832.jpg",              imageAlt: "Laugh Riot movie poster"
            },
            {
              id: "4",              name: "Enchanted World",              price: "$13",              variant: "Family Animation",              imageSrc: "https://img.b2bpic.net/free-photo/close-up-hand-holding-clapperboard-front-male-mime_23-2147891564.jpg",              imageAlt: "Enchanted World movie poster"
            }
          ]}
        />
      </div>

      <div id="text_split_about" data-section="text_split_about">
        <TextSplitAbout
          title="Explore Cinematic Magic"
          description={["Discover a world of iconic films and timeless classics.", "Experience the best of cinema with Movie Play."]}
          buttons={[{ label: "View Now Showing", href: "#" }, { label: "Read Reviews", href: "#" }]}
          useInvertedBackground="noInvert"
        />
      </div>
      <div id="footer" data-section="footer">
        <FooterBaseReveal
          columns={[
            {
              title: "Quick Links",              items: [
                { label: "Home", href: "hero" },
                { label: "Now Showing", href: "products" },
                { label: "Features", href: "feature" },
                { label: "Reviews", href: "testimonial" }
              ]
            },
            {
              title: "Information",              items: [
                { label: "About Us", href: "#" },
                { label: "Contact", href: "contact" },
                { label: "Booking Policy", href: "#" },
                { label: "Member Benefits", href: "#" }
              ]
            },
            {
              title: "Connect",              items: [
                { label: "Facebook", href: "#" },
                { label: "Instagram", href: "#" },
                { label: "Twitter", href: "#" },
                { label: "Subscribe", href: "#" }
              ]
            }
          ]}
          copyrightText="© 2025 Movie Play Cinema. All rights reserved."
        />
      </div>
    </ThemeProvider>
  );
}