"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactText from '@/components/sections/contact/ContactText';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import HeroSplitTestimonial from '@/components/sections/hero/HeroSplitTestimonial';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import PricingCardFive from '@/components/sections/pricing/PricingCardFive';
import TestimonialCardTen from '@/components/sections/testimonial/TestimonialCardTen';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="text-stagger"
        defaultTextAnimation="background-highlight"
        borderRadius="pill"
        contentWidth="medium"
        sizing="largeSizeMediumTitles"
        background="grid"
        cardStyle="inset"
        primaryButtonStyle="shadow"
        secondaryButtonStyle="layered"
        headingFontWeight="light"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingOverlay
      navItems={[
        {
          name: "Journey",
          id: "hero",
        },
        {
          name: "Message",
          id: "about",
        },
        {
          name: "Surprises",
          id: "features",
        },
      ]}
      brandName="Ruoooo's Day"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroSplitTestimonial
      useInvertedBackground={false}
      background={{
        variant: "plain",
      }}
      title="Welcome to Ruoooo's Birthday Journey"
      description="Enter the secret password to begin the surprise journey."
      testimonials={[
        {
          name: "Sara",
          handle: "@friend",
          testimonial: "Ruoooo is the sweetest friend ever!",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-curly-haired-young-woman-isolated_273609-48290.jpg",
        },
        {
          name: "Amal",
          handle: "@family",
          testimonial: "Sending so much love to the birthday girl!",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/close-up-shot-pretty-woman-with-surf-zinc-cheeks_273609-44332.jpg",
        },
        {
          name: "Sara",
          handle: "@sis",
          testimonial: "Happy birthday, we love you!",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/young-hispanic-tourist-woman-smiling-happy-drinking-coffee-city_839833-25789.jpg",
        },
        {
          name: "Yarohyy",
          handle: "@best",
          testimonial: "You are my moon, happy birthday!",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/green-eyed-woman-white-t-shirt-pink-jacket-with-snow-white-smile-looks-front-posing-street_197531-17040.jpg",
        },
        {
          name: "Mimi",
          handle: "@buddy",
          testimonial: "Celebrating you today and always!",
          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/young-woman-with-afro-haircut-wearing-yellow-sweater_273609-22989.jpg",
        },
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/candy-canes-heart-shape-with-flowers-table_23-2148017894.jpg"
      mediaAnimation="blur-reveal"
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/portrait-positive-adult-dark-skinned-man-smiling-broadly-while-sitting-park-listening-music-headphones-holding-them-with-hands-hear-better_176420-19808.jpg",
          alt: "Portrait of positive man",
        },
        {
          src: "http://img.b2bpic.net/free-photo/happy-joyful-woman-laughs-happily-keeps-arms-folded-expresses-positive-emotions-grins-from-happiness-dressed-casual-jumper-isolated-blue-wall-has-fun-hears-funny-joke_273609-44695.jpg",
          alt: "Happy joyful woman",
        },
        {
          src: "http://img.b2bpic.net/free-photo/young-woman-with-afro-haircut-wearing-orange-jumper_273609-21593.jpg",
          alt: "Young woman in orange",
        },
        {
          src: "http://img.b2bpic.net/free-photo/joyful-young-blonde-slavic-girl-stucking-her-tongue-gesturing-horns_141793-125402.jpg",
          alt: "Joyful blonde girl",
        },
        {
          src: "http://img.b2bpic.net/free-photo/portrait-attractive-stylish-blond-smiling-woman-straw-red-hat-blouse-summer-fashion-outfit-talking-phone-positive-gesture-emotion_285396-8431.jpg",
          alt: "Stylish blond smiling woman",
        },
      ]}
      marqueeItems={[
        {
          type: "text",
          text: "Happy Birthday!",
        },
        {
          type: "text",
          text: "Ruoooo's Special Day",
        },
        {
          type: "text",
          text: "Joy & Love",
        },
        {
          type: "text",
          text: "Best Day Ever",
        },
        {
          type: "text",
          text: "Forever Young",
        },
      ]}
    />
  </div>

  <div id="about" data-section="about">
      <InlineImageSplitTextAbout
      useInvertedBackground={false}
      heading={[
        {
          type: "text",
          content: "A Letter for You",
        },
        {
          type: "image",
          src: "http://img.b2bpic.net/free-photo/flat-lay-still-life-school-supplies-assortment_23-2148981735.jpg",
          alt: "Envelope",
        },
      ]}
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardTwelve
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      features={[
        {
          id: "1",
          label: "Cutest",
          title: "World's Cutest",
          items: [
            "You are the cutest girl in the world.",
          ],
        },
        {
          id: "2",
          label: "Strong",
          title: "Big Biceps",
          items: [
            "You have very big biceps.",
          ],
        },
        {
          id: "3",
          label: "Height",
          title: "156 cm Tall",
          items: [
            "You're exactly 156 cm tall.",
          ],
        },
        {
          id: "4",
          label: "Lovely",
          title: "So Lovely",
          items: [
            "Everything about you is lovely.",
          ],
        },
        {
          id: "5",
          label: "Soul",
          title: "Positive Soul",
          items: [
            "You have such a positive soul.",
          ],
        },
      ]}
      title="Reasons I Love You"
      description="Just a few reasons why you are special."
    />
  </div>

  <div id="pricing" data-section="pricing">
      <PricingCardFive
      animationType="scale-rotate"
      textboxLayout="default"
      useInvertedBackground={false}
      plans={[
        {
          id: "p1",
          tag: "Active",
          price: "Ruoooo",
          period: "Birthday",
          description: "Enjoy your day to the fullest!",
          button: {
            text: "Celebrate!",
          },
          featuresTitle: "Wishlist",
          features: [
            "Happiness",
            "Joy",
            "Lots of love",
          ],
        },
      ]}
      title="Surprise Status"
      description="Birthday celebration progress."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardTen
      textboxLayout="default"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "t1",
          title: "Birthday Wish",
          quote: "Happy birthday girl!",
          name: "Sara",
          role: "Friend",
          imageSrc: "http://img.b2bpic.net/free-photo/portrait-attractive-caucasian-smiling-woman_93675-135489.jpg",
        },
        {
          id: "t2",
          title: "Best Wishes",
          quote: "You are amazing!",
          name: "Amal",
          role: "Friend",
          imageSrc: "http://img.b2bpic.net/free-photo/young-happy-exited-stylish-woman-with-long-hair-big-eyes-wearing-green-sweater-posing-with-smile-red-wall_291650-770.jpg",
        },
        {
          id: "t3",
          title: "Love",
          quote: "Stay cute forever!",
          name: "Sara",
          role: "Sister",
          imageSrc: "http://img.b2bpic.net/free-photo/sincere-happy-charismatic-redhead-girl-smiling-close-eyes-enjoy-warm-summer-sunbeams-laughing-cheerf_1258-135225.jpg",
        },
        {
          id: "t4",
          title: "Friendship",
          quote: "Love you Ruoooo!",
          name: "Yarohyy",
          role: "Bestie",
          imageSrc: "http://img.b2bpic.net/free-photo/happy-wavy-haired-girl-smiling-camera-outdoors_1262-20568.jpg",
        },
        {
          id: "t5",
          title: "Happy Day",
          quote: "Enjoy your special day!",
          name: "Mom",
          role: "Family",
          imageSrc: "http://img.b2bpic.net/free-photo/trendy-woman-casual-cute-pink-clothes_158538-10124.jpg",
        },
      ]}
      title="Love from Friends"
      description="Warm words from the people who love you."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqSplitMedia
      textboxLayout="default"
      useInvertedBackground={false}
      faqs={[
        {
          id: "q1",
          title: "Will I see you soon?",
          content: "I hope I get to see you very soon, Yarohyy.",
        },
        {
          id: "q2",
          title: "How much do I love you?",
          content: "I love you so so much.",
        },
      ]}
      title="Final Thoughts"
      description="Just a little reminder of how special you are."
      faqsAnimation="blur-reveal"
      imageSrc="http://img.b2bpic.net/free-photo/set-ornament-paper-hearts-pocket-watch_23-2148031548.jpg"
      mediaAnimation="blur-reveal"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactText
      useInvertedBackground={false}
      background={{
        variant: "sparkles-gradient",
      }}
      text="I hope you have the best day ever, ya katkott!"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterLogoReveal
      logoText="Ruoooo's Birthday"
      leftLink={{
        text: "Back to start",
        href: "#hero",
      }}
      rightLink={{
        text: "Made with love",
        href: "#",
      }}
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
