"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import FeatureCardSixteen from '@/components/sections/feature/FeatureCardSixteen';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import ContactForm from '@/components/form/ContactForm';
import { Sparkles } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="text-shift"
        defaultTextAnimation="reveal-blur"
        borderRadius="soft"
        contentWidth="smallMedium"
        sizing="mediumLargeSizeMediumTitles"
        background="noise"
        cardStyle="subtle-shadow"
        primaryButtonStyle="flat"
        secondaryButtonStyle="solid"
        headingFontWeight="semibold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleApple
      navItems={[
        { name: "الرئيسية", id: "hero" },
        { name: "الشنط", id: "products" },
        { name: "عنا", id: "about" },
        { name: "اتصل بنا", id: "contact" },
      ]}
      brandName="Anfal Shopping"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroBillboardCarousel
      background={{ variant: "plain" }}
      title="Anfal Shopping | الرقي يبدأ هنا"
      description="تجربة تسوق فاخرة تليق بذوقك الرفيع. اكتشفي أحدث صيحات الموضة من دور الأزياء العالمية."
      buttons={[{ text: "تسوقي الآن", href: "#products" }]}
      mediaItems={[
        { imageSrc: "http://img.b2bpic.net/free-photo/abstract-store-with-futuristic-concept-architecture_23-2150862184.jpg", imageAlt: "luxury boutique interior" },
        { imageSrc: "http://img.b2bpic.net/free-photo/winsome-brunette-woman-holding-hangers-with-sparkle-party-clothes_197531-7139.jpg", imageAlt: "evening dress" },
        { imageSrc: "http://img.b2bpic.net/free-photo/woman-selecting-accessories-jewelry-section_107420-96188.jpg", imageAlt: "retail showcase" },
        { imageSrc: "http://img.b2bpic.net/free-photo/person-shopping-second-hand-market_23-2149353684.jpg", imageAlt: "fashion display" },
        { imageSrc: "http://img.b2bpic.net/free-photo/small-purse-studio-still-life_23-2151046470.jpg", imageAlt: "handbag photography" },
        { imageSrc: "http://img.b2bpic.net/free-photo/mannequins-with-womenswear_1203-830.jpg", imageAlt: "boutique display" },
      ]}
    />
  </div>

  <div id="about" data-section="about">
      <TestimonialAboutCard
      useInvertedBackground={true}
      tag="عن أنفال"
      title="جوهر الأناقة الفاخرة"
      description="نحن نؤمن بأن الأناقة هي لغة تعبر عن ذاتك. أنفال شوبينق يجمع لكِ قطعاً حصرية تعكس ذوقكِ الخاص وتمنحكِ ثقة لا تضاهى."
      subdescription="نهتم بأدق التفاصيل لضمان حصولكِ على تجربة تسوق استثنائية."
      icon={Sparkles}
      imageSrc="http://img.b2bpic.net/free-photo/detail-brown-black-feather-backgrounds_23-2148114526.jpg"
      mediaAnimation="slide-up"
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardSixteen
      animationType="depth-3d"
      textboxLayout="default"
      useInvertedBackground={false}
      negativeCard={{ items: ["تأخير في الشحن التقليدي", "منتجات غير أصلية", "خدمة عملاء بطيئة", "أسعار مبالغ فيها", "غياب ضمان الجودة"] }}
      positiveCard={{ items: ["توصيل فائق السرعة", "ضمان الجودة والأصالة", "دعم عملاء حصري 24/7", "أسعار تنافسية", "تجربة تسوق آمنة"] }}
      title="لماذا تختارين أنفال؟"
      description="نقدم مزيجاً فريداً من الفخامة والخدمة الاحترافية التي تستحقينها."
    />
  </div>

  <div id="products" data-section="products">
      <ProductCardOne
      animationType="slide-up"
      textboxLayout="split"
      gridVariant="uniform-all-items-equal"
      useInvertedBackground={true}
      products={[
        { id: "1", name: "حقيبة ديور الفاخرة", price: "12,500 SAR", imageSrc: "http://img.b2bpic.net/free-photo/happy-father-s-day-composition-father-s-day-top-view_185193-109772.jpg" },
        { id: "2", name: "حذاء غوتشي الكلاسيكي", price: "4,200 SAR", imageSrc: "http://img.b2bpic.net/free-photo/closeup-photo-stylish-shoes-store_627829-6034.jpg" },
        { id: "3", name: "فستان سهرة ملكي", price: "8,900 SAR", imageSrc: "http://img.b2bpic.net/free-photo/young-man-shopping-menswear-shop_1303-19869.jpg" },
        { id: "4", name: "حقيبة لويس فيتون", price: "14,000 SAR", imageSrc: "http://img.b2bpic.net/free-photo/old-black-background-grunge-texture-dark-wallpaper-blackboard-chalkboard-concrete_1258-79076.jpg" },
        { id: "5", name: "حذاء فيندي الأنيق", price: "5,500 SAR", imageSrc: "http://img.b2bpic.net/free-photo/cinematic-style-mall_23-2151551262.jpg" },
        { id: "6", name: "اكسسوارات فاخرة", price: "2,100 SAR", imageSrc: "http://img.b2bpic.net/free-photo/fashion-luxurious-arrangement-table_23-2148229209.jpg" },
      ]}
      title="مجموعتنا الحصرية"
      description="استعرضي أحدث ما وصل من دور الأزياء العالمية المختارة بعناية."
    />
  </div>

  <div id="pricing" data-section="pricing">
      <PricingCardThree
      animationType="scale-rotate"
      textboxLayout="split"
      useInvertedBackground={false}
      plans={[
        { id: "silver", name: "الفضية", price: "999 SAR", features: ["خصم 5% دائم", "توصيل مجاني"], buttons: [{ text: "اشتركي الآن" }] },
        { id: "gold", name: "الذهبية", price: "1,999 SAR", features: ["خصم 15% دائم", "توصيل أولوية", "دعم خاص"], buttons: [{ text: "اشتركي الآن" }] },
        { id: "platinum", name: "البلاتينية", price: "3,999 SAR", features: ["خصم 25% دائم", "هدية خاصة", "دعم حصري 24/7"], buttons: [{ text: "اشتركي الآن" }] },
      ]}
      title="باقات العضوية الحصرية"
      description="ارتقي بتجربة تسوقك مع باقاتنا المخصصة للنخبة."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardTwelve
        cardTitle="آراء عملائنا"
        cardTag="قصص نجاح"
        cardAnimation="slide-up"
        useInvertedBackground={true}
        testimonials={[
          { id: "t1", name: "سارة المحمد", imageSrc: "http://img.b2bpic.net/free-photo/joyful-woman-black-jacket-liking-lip-posing-isolated-background-charming-lady-dark-suit-smiling-white-backdrop_197531-18516.jpg" },
          { id: "t2", name: "نورة خالد", imageSrc: "http://img.b2bpic.net/free-photo/fashion-expert-worker-selecting-variety-trendy-items-client_482257-118401.jpg" },
          { id: "t3", name: "فاطمة العتيبي", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-cartoon-woman-portrait_23-2151839615.jpg" }
        ]}
      />
  </div>

  <div id="faq" data-section="faq">
      <FaqDouble
        title="مركز مساعدة أنفال"
        description="إجابات على أكثر أسئلتك تكراراً"
        faqs={[
            { id: "f1", title: "هل المنتجات أصلية؟", content: "نعم، جميع منتجاتنا أصلية 100% ومستوردة مباشرة من الوكلاء المعتمدين." },
            { id: "f2", title: "سياسة الاسترجاع؟", content: "نوفر سياسة استرجاع مرنة خلال 14 يوماً من استلام الطلب." },
            { id: "f3", title: "كيف أتواصل معكم؟", content: "يمكنكِ التواصل معنا عبر الواتساب أو البريد الإلكتروني في أي وقت." }
        ]}
        faqsAnimation="blur-reveal"
        textboxLayout="split-description"
        useInvertedBackground={false}
      />
  </div>

  <div id="contact" data-section="contact">
      <ContactForm
        title="تواصلي معنا"
        description="نحن هنا للإجابة على جميع استفساراتك."
        tag="الدعم الفني"
        centered={true}
      />
  </div>

  <div id="footer" data-section="footer">
      <FooterLogoEmphasis
        logoText="أنفال شوبينق"
        columns={[
            { items: [{ label: "الرئيسية", href: "#nav" }, { label: "المتجر", href: "#products" }] },
            { items: [{ label: "الأسئلة الشائعة", href: "#faq" }, { label: "اتصل بنا", href: "#contact" }] }
        ]}
      />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}