"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleMinimal from '@/components/navbar/NavbarStyleMinimal';
import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import FeatureCardTwenty from '@/components/sections/feature/FeatureCardTwenty';
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';

export default function StrangerThingsPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="entrance-slide"
      borderRadius="rounded"
      contentWidth="mediumLarge"
      sizing="largeSmall"
      background="aurora"
      cardStyle="spotlight"
      primaryButtonStyle="outline"
      secondaryButtonStyle="layered"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleMinimal
          brandName="STRANGER THINGS"
          button={{
            text: "Join the Upside Down",
            href: "contact"
          }}
        />
      </div>
      
      <div id="hero" data-section="hero">
        <HeroCarouselLogo
          logoText="STRANGER THINGS"
          description="Experience the supernatural mystery that captivated millions. Enter a world where nothing is as it seems."
          buttons={[
            {
              text: "Watch Now",
              href: "https://www.netflix.com"
            },
            {
              text: "Explore Universe",
              href: "about"
            }
          ]}
          slides={[
            {
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766508753765-3pfmozxg.jpg",
              imageAlt: "Stranger Things Upside Down"
            },
            {
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766508756075-khdynat4.jpg",
              imageAlt: "Stranger Things Characters"
            },
            {
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766508752218-v1i2cs9a.jpg",
              imageAlt: "Stranger Things Neon Aesthetic"
            }
          ]}
          autoplayDelay={5000}
          showDimOverlay={true}
        />
      </div>
      
      <div id="about" data-section="about">
        <InlineImageSplitTextAbout
          heading={[
            {
              type: "text",
              content: "Discover the mystery of"
            },
            {
              type: "image",
              src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=zp9zi1",
              alt: "Hawkins"
            },
            {
              type: "text",
              content: "and the"
            },
            {
              type: "image",
              src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766508753765-3pfmozxg.jpg",
              alt: "Upside Down"
            }
          ]}
          useInvertedBackground="noInvert"
          buttons={[
            {
              text: "Learn More",
              href: "contact"
            }
          ]}
        />
      </div>
      
      <div id="features" data-section="features">
        <FeatureCardTwenty
          images={[
            {
              id: 1,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766508769422-8liceni3.jpg",
              imageAlt: "Main Cast"
            },
            {
              id: 2,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766161714211-z0wyola8.jpg",
              imageAlt: "Character Moments"
            },
            {
              id: 3,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=a4anr0",
              imageAlt: "Dramatic Scenes"
            },
            {
              id: 4,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766162558151-cbkqv5ok.jpg",
              imageAlt: "Hawkins Lab"
            }
          ]}
          title="Unforgettable Moments"
          description="From the beginning in 2016 to the epic conclusion, Stranger Things has delivered spine-tingling supernatural encounters, heartwarming friendships, and mind-bending mysteries that keep audiences on the edge of their seats."
          tag="Fan Favorite"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>
      
      <div id="testimonials" data-section="testimonials">
        <TestimonialCardTen
          title="What Fans Are Saying"
          description="Join millions of viewers who have been captivated by the supernatural world of Stranger Things"
          testimonials={[
            {
              id: "1",
              title: "Absolute Masterpiece",
              quote: "Stranger Things redefined what television can be. Every season exceeded my expectations with incredible storytelling, character development, and those unforgettable cliffhangers.",
              name: "Emily Rodriguez",
              role: "Devoted Fan",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766662881397-kmy1tetm.jpg",
              imageAlt: "Emily Rodriguez"
            },
            {
              id: "2",
              title: "The Best Show Ever Made",
              quote: "The nostalgia, the mystery, the perfectly cast ensemble - Stranger Things captured lightning in a bottle. I've watched every season multiple times and still get chills.",
              name: "David Chen",
              role: "Long-time Viewer",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766662881397-kmy1tetm.jpg",
              imageAlt: "David Chen"
            }
          ]}
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>
      
      <div id="faq" data-section="faq">
        <FaqSplitMedia
          title="Frequently Asked Questions"
          description="Everything you need to know about Stranger Things"
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766508753765-3pfmozxg.jpg"
          imageAlt="Mysterious Atmosphere"
          mediaPosition="right"
          faqs={[
            {
              id: "1",
              title: "How many seasons are there?",
              content: "Stranger Things has 4 complete seasons available on Netflix, with the series concluding after season 4. Each season builds upon the mystery and expands the supernatural world."
            },
            {
              id: "2",
              title: "Where can I watch Stranger Things?",
              content: "All seasons of Stranger Things are exclusively available on Netflix. You can stream all episodes with a Netflix subscription."
            }
          ]}
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>
      
      <div id="contact" data-section="contact">
        <ContactSplitForm
          title="Join the Fan Community"
          description="Stay updated with the latest Stranger Things news, theories, and exclusive content. Subscribe to our newsletter for discussions about your favorite moments."
          inputs={[
            {
              name: "name",
              type: "text",
              placeholder: "Your Name",
              required: true
            },
            {
              name: "email",
              type: "email",
              placeholder: "Email Address",
              required: true
            }
          ]}
          textarea={{
            name: "message",
            placeholder: "What's your favorite Stranger Things moment?",
            rows: 4,
            required: false
          }}
          videoSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=7f6plz"
          videoAriaLabel="Stranger Things Atmospheric Scene"
          mediaPosition="left"
          buttonText="Subscribe"
          useInvertedBackground="noInvert"
        />
      </div>
      
      <div id="footer" data-section="footer">
        <FooterLogoReveal
          logoText="STRANGER THINGS"
        />
      </div>
    </ThemeProvider>
  );
}