"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import HeroLogoBillboard from '@/components/sections/hero/HeroLogoBillboard';
import MediaSplitTabsAbout from '@/components/sections/about/MediaSplitTabsAbout';
import FeatureCardSeven from '@/components/sections/feature/FeatureCardSeven';
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
import FaqBase from '@/components/sections/faq/FaqBase';
import ContactText from '@/components/sections/contact/ContactText';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
import { Heart, Zap, Award, Globe } from "lucide-react";

export default function VitaliyPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="text-shift"
      defaultTextAnimation="background-highlight"
      borderRadius="pill"
      contentWidth="compact"
      sizing="largeSmallSizeMediumTitles"
      background="floatingGradient"
      cardStyle="outline"
      primaryButtonStyle="radial-glow"
      secondaryButtonStyle="layered"
      headingFontWeight="normal"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          brandName="VITALIY"
          navItems={[
            { name: "About", id: "about" },
            { name: "Fabulous", id: "features" },
            { name: "Community", id: "testimonials" },
            { name: "FAQ", id: "faq" },
            { name: "Contact", id: "contact" },
          
            { name: "Blog", id: "/blog" },
]}
        />
      </div>

      <div id="pricing" data-section="pricing">
        <PricingCardTwo />
      </div>

      <div id="hero" data-section="hero">
        <HeroLogoBillboard
          logoText="VITALIY"
          description="The gayest gay and the most fabulous Pride Icon. Celebrating authenticity, confidence, and unapologetic self-expression with fierce style and unforgettable performances."
          background={{ variant: "sparkles-gradient" }}
          imageSrc="http://img.b2bpic.net/free-vector/flat-pride-day-badge-collection_23-2148942219.jpg"
          imageAlt="Vitaliy - Fabulous Pride Icon"
          frameStyle="card"
          logoLineHeight={1.1}
        />
      </div>

      <div id="about" data-section="about">
        <MediaSplitTabsAbout
          title="Meet Vitaliy"
          description="A force of nature in the world of entertainment and LGBTQ+ advocacy."
          tabs={[
            {
              id: "icon",              label: "The Icon",              description: "Vitaliy is more than just a performer—he's a beacon of hope and authenticity for millions. With unmatched charisma and an unwavering commitment to living his truth, Vitaliy has become the ultimate symbol of fabulous self-expression and pride."
            },
            {
              id: "journey",              label: "The Journey",              description: "From humble beginnings to becoming a celebrated Pride Icon, Vitaliy's journey is one of courage, transformation, and triumph. Every performance, every appearance, every moment on stage reinforces his message: be yourself, unapologetically."
            },
            {
              id: "impact",              label: "The Impact",              description: "Vitaliy's influence extends far beyond entertainment. Through activism, community engagement, and powerful performances, he's creating real change and inspiring millions to embrace their true selves and celebrate the diversity of human expression."
            }
          ]}
          imageSrc="http://img.b2bpic.net/free-vector/pride-day-labels-collection_23-2148183233.jpg"
          imageAlt="Vitaliy on stage"
          imagePosition="right"
          useInvertedBackground="invertDefault"
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardSeven
          title="What Makes Vitaliy Fabulous"
          description="Discover the qualities that make Vitaliy the gayest gay and most fabulous Pride Icon of our time."
          tag="The Essence"
          features={[
            {
              id: 1,
              title: "Unmatched Confidence",              description: "Vitaliy walks into every room with an aura of self-assurance that's infectious. His confidence isn't just about appearance—it's a deep conviction in the power of being authentically himself.",              imageSrc: "http://img.b2bpic.net/free-vector/flat-pride-day-badge-collection_23-2148942219.jpg",              imageAlt: "Unmatched Confidence"
            },
            {
              id: 2,
              title: "Fierce Performances",              description: "Every show is a spectacle. Vitaliy brings energy, artistry, and raw emotion to the stage, leaving audiences breathless and inspired. His performances are legendary for a reason.",              imageSrc: "http://img.b2bpic.net/free-vector/pride-day-labels-collection_23-2148183233.jpg",              imageAlt: "Fierce Performances"
            },
            {
              id: 3,
              title: "Authentic Advocacy",              description: "Beyond the glitter and glamour, Vitaliy is a passionate advocate for LGBTQ+ rights and visibility. He uses his platform to amplify marginalized voices and fight for equality.",              imageSrc: "http://img.b2bpic.net/free-vector/flat-pride-day-badge-collection_23-2148942219.jpg",              imageAlt: "Authentic Advocacy"
            }
          ]}
          textboxLayout="default"
          animationType="blur-reveal"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardTwelve
          cardTitle="Join thousands of fans and community members who celebrate Vitaliy as the ultimate fabulous Pride Icon and cultural beacon."
          cardTag="What Fans Say"
          testimonials={[
            {
              id: "1",              name: "Marcus Johnson",              imageSrc: "http://img.b2bpic.net/free-vector/pride-day-labels-concept_23-2148513636.jpg",              imageAlt: "Marcus Johnson"
            },
            {
              id: "2",              name: "Sophia Chen",              imageSrc: "http://img.b2bpic.net/free-vector/pride-day-labels-collection_52683-9995.jpg",              imageAlt: "Sophia Chen"
            },
            {
              id: "3",              name: "David Martinez",              imageSrc: "http://img.b2bpic.net/free-vector/pride-day-labels-collection_23-2148175513.jpg",              imageAlt: "David Martinez"
            },
            {
              id: "4",              name: "Alex Thompson",              imageSrc: "http://img.b2bpic.net/free-vector/illustrations-pride-day-neon-signs-collection_23-2148519377.jpg",              imageAlt: "Alex Thompson"
            },
            {
              id: "5",              name: "Jordan Lee",              imageSrc: "http://img.b2bpic.net/free-vector/pride-day-labels-style_23-2148516536.jpg",              imageAlt: "Jordan Lee"
            },
            {
              id: "6",              name: "Casey Williams",              imageSrc: "http://img.b2bpic.net/free-vector/pride-day-flat-label-collection_23-2148199008.jpg",              imageAlt: "Casey Williams"
            }
          ]}
          useInvertedBackground="invertDefault"
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardThree
          title="By The Numbers"
          description="Vitaliy's impact and reach across the globe."
          metrics={[
            {
              id: "1",              icon: Heart,
              title: "Million Fans",              value: "2.5M+"
            },
            {
              id: "2",              icon: Zap,
              title: "Live Performances",              value: "500+"
            },
            {
              id: "3",              icon: Award,
              title: "Community Events",              value: "100+"
            },
            {
              id: "4",              icon: Globe,
              title: "Countries Reached",              value: "45+"
            }
          ]}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqBase
          title="Frequently Asked Questions"
          description="Everything you need to know about Vitaliy and his fabulous journey."
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          animationType="smooth"
          faqs={[
            {
              id: "1",              title: "Where can I see Vitaliy perform?",              content: "Vitaliy performs at major Pride events, nightclubs, concert venues, and special appearances around the world. Check the tour schedule and event calendar for upcoming performances in your area."
            },
            {
              id: "2",              title: "How does Vitaliy support the LGBTQ+ community?",              content: "Beyond entertainment, Vitaliy is deeply committed to LGBTQ+ advocacy. He supports various organizations, participates in Pride events, mentors emerging performers, and uses his platform to amplify voices of the community."
            },
            {
              id: "3",              title: "What makes Vitaliy the 'gayest gay' icon?",              content: "It's a celebration of Vitaliy's unapologetic authenticity, fierce confidence, and unmatched fabulous energy. He represents the fullest expression of self-love and pride, inspiring others to embrace their true identity without hesitation."
            },
            {
              id: "4",              title: "Can I book Vitaliy for events?",              content: "Yes! Vitaliy is available for private events, corporate functions, Pride celebrations, and special occasions. Contact our team through the website for booking inquiries and rates."
            },
            {
              id: "5",              title: "How can I support Vitaliy?",              content: "Follow on social media, attend performances, purchase merchandise, and share the message. Every share, every ticket, and every word of support helps amplify the fabulous message of authenticity and pride."
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactText
          text="Ready to celebrate with Vitaliy? Let's make it fabulous. Reach out for bookings, collaborations, or just to say hello."
          animationType="entrance-slide"
          buttons={[
            {
              text: "Get in Touch",              href: "mailto:hello@vitaliyicon.com"
            },
            {
              text: "Follow on Social",              href: "https://instagram.com"
            }
          ]}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoEmphasis
          logoText="VITALIY"
          columns={[
            {
              items: [
                { label: "About", href: "about" },
                { label: "Fabulous Facts", href: "features" },
                { label: "Community", href: "testimonials" }
              ]
            },
            {
              items: [
                { label: "Events", href: "https://events.example.com" },
                { label: "Merchandise", href: "https://shop.example.com" },
                { label: "Contact", href: "contact" }
              ]
            },
            {
              items: [
                { label: "Instagram", href: "https://instagram.com/vitaliy" },
                { label: "Twitter", href: "https://twitter.com/vitaliy" },
                { label: "TikTok", href: "https://tiktok.com/@vitaliy" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}