"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FaqBase from '@/components/sections/faq/FaqBase';
import FeatureCardMedia from '@/components/sections/feature/FeatureCardMedia';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import HeroCentered from '@/components/sections/hero/HeroCentered';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import { Heart, Sparkles } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="elastic-effect"
        defaultTextAnimation="reveal-blur"
        borderRadius="rounded"
        contentWidth="mediumSmall"
        sizing="mediumLargeSizeMediumTitles"
        background="floatingGradient"
        cardStyle="soft-shadow"
        primaryButtonStyle="primary-glow"
        secondaryButtonStyle="layered"
        headingFontWeight="extrabold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleApple
      navItems={[
        {
          name: "الرئيسية",          id: "hero"},
        {
          name: "عنا",          id: "about"},
        {
          name: "المميزات",          id: "features"},
        {
          name: "المنتجات",          id: "products"},
        {
          name: "الآراء",          id: "testimonials"},
        {
          name: "تواصل معنا",          id: "contact"},
      ]}
      brandName="منتج مغربي"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroCentered
      background={{
        variant: "radial-gradient"}}
      title="اكتشف منتجاتنا المغربية الأصيلة"
      description="تجربة فريدة تجمع بين التقاليد العريقة والجودة العصرية. منتجات مصنوعة بحب لتعكس جمال المغرب."
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/young-confident-stylish-man-coat-intently-looking-away-outdoor_574295-1325.jpg",          alt: "Customer 1"},
        {
          src: "http://img.b2bpic.net/free-photo/beautiful-smiling-model-with-afro-curls-hairstyle-dressed-summer-hipster-white-dress_158538-714.jpg",          alt: "Customer 2"},
        {
          src: "http://img.b2bpic.net/free-photo/pleased-super-hero-businessman-red-cape-looking-front-smiling-broadly-showing-ok-sign-standing-orange-wall_141793-53037.jpg",          alt: "Satisfied Moroccan customer"},
        {
          src: "http://img.b2bpic.net/free-photo/beautiful-smiling-model-with-afro-curls-hairstyle-dressed-summer-hipster-white-dress-hat_158538-807.jpg",          alt: "Happy Moroccan shopper"},
        {
          src: "http://img.b2bpic.net/free-photo/close-up-woman-holding-pomegranate_23-2148846843.jpg",          alt: "Moroccan product user"},
      ]}
      avatarText="+1000 عميل سعيد"
      buttons={[
        {
          text: "اطلب الآن",          href: "#products"},
        {
          text: "تعرف علينا",          href: "#about"},
      ]}
      buttonAnimation="slide-up"
      marqueeItems={[
        {
          type: "text",          text: "منتجات يدوية الصنع"},
        {
          type: "text-icon",          text: "جودة فاخرة",          icon: Sparkles,
        },
        {
          type: "text",          text: "شحن سريع لجميع المدن"},
        {
          type: "text-icon",          text: "دعم الحرفيين",          icon: Heart,
        },
        {
          type: "text",          text: "أصالة لا تضاهى"},
      ]}
      marqueeSpeed={30}
    />
  </div>

  <div id="about" data-section="about">
      <InlineImageSplitTextAbout
      useInvertedBackground={false}
      heading={[
        {
          type: "text",          content: "قصتنا: شغف مغربي يلتقي بالجودة العالمية"},
      ]}
      buttons={[
        {
          text: "اكتشف المزيد"},
      ]}
      buttonAnimation="slide-up"
      imageSrc="http://img.b2bpic.net/free-photo/realistic-scene-from-neighborhood-yard-sale-miscellaneous-items_23-2151238349.jpg"
      imageAlt="Moroccan artisan crafting a product"
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardMedia
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      features={[
        {
          id: "quality",          title: "جودة لا مثيل لها",          description: "نستخدم فقط أجود المكونات والمواد، لضمان متانة وطول عمر كل منتج.",          tag: "متميز",          imageSrc: "http://img.b2bpic.net/free-photo/portrait-man-working-pottery-stoneware_23-2151686510.jpg",          imageAlt: "High quality moroccan ingredients"},
        {
          id: "authentic",          title: "أصالة مغربية",          description: "كل قطعة مصممة لتعكس الفن والثقافة المغربية العريقة، مما يضيف لمسة سحرية.",          tag: "تقليدي",          imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-man-grey-shirt-summer-hat-lookign-aside-with-arms-out-happy-excited_141793-54938.jpg",          imageAlt: "Moroccan family enjoying product"},
        {
          id: "sustainable",          title: "استدامة ودعم محلي",          description: "نلتزم بالممارسات المستدامة وندعم الحرفيين المحليين لضمان مستقبل أفضل.",          tag: "صديق للبيئة",          imageSrc: "http://img.b2bpic.net/free-photo/ancient-kettle-with-wooden-plate-nuts-marble_114579-30252.jpg",          imageAlt: "Moroccan product elegant packaging"},
      ]}
      title="لماذا تختار منتجاتنا؟"
      description="تتميز منتجاتنا بعدة جوانب تجعلها الخيار الأمثل لك."
    />
  </div>

  <div id="products" data-section="products">
      <ProductCardFour
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="three-columns-all-equal-width"
      useInvertedBackground={true}
      carouselMode="buttons"
      products={[
        {
          id: "argan-oil",          name: "زيت الأركان النقي",          price: "350 درهم",          variant: "100 مل",          imageSrc: "http://img.b2bpic.net/free-photo/front-view-argan-oil-arrangement_23-2148955758.jpg",          imageAlt: "Pure Moroccan Argan Oil"},
        {
          id: "spice-blend",          name: "خلطة توابل ملكية",          price: "80 درهم",          variant: "200 جرام",          imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-spoons-with-spices-arrangement_23-2149439560.jpg",          imageAlt: "Royal Moroccan Spice Blend"},
        {
          id: "leather-bag",          name: "حقيبة جلدية يدوية",          price: "950 درهم",          variant: "متوسط",          imageSrc: "http://img.b2bpic.net/free-photo/closeup-inside-finger-nice-infant_1304-916.jpg",          imageAlt: "Handmade Moroccan Leather Bag"},
        {
          id: "mint-tea",          name: "مجموعة الشاي المغربي",          price: "400 درهم",          variant: "مع ابريق",          imageSrc: "http://img.b2bpic.net/free-photo/tea-black-tea-with-teapot-turkish-delight-tray_140725-11017.jpg",          imageAlt: "Moroccan Mint Tea Set"},
        {
          id: "ceramic-plate",          name: "طبق سيراميك مزخرف",          price: "200 درهم",          variant: "قطر 30 سم",          imageSrc: "http://img.b2bpic.net/free-photo/paper-plates-with-pictures_23-2147654606.jpg",          imageAlt: "Decorated Ceramic Plate"},
        {
          id: "berber-rug",          name: "سجادة بربرية أصيلة",          price: "2500 درهم",          variant: "1.5م x 2م",          imageSrc: "http://img.b2bpic.net/free-photo/carpets-market-morocco_23-2148129914.jpg",          imageAlt: "Authentic Berber Rug"},
      ]}
      title="استكشف مجموعتنا المتنوعة"
      description="اكتشف منتجاتنا المغربية المصنوعة بحب وعناية، كل قطعة تحكي قصة."
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardEleven
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      metrics={[
        {
          id: "customers",          value: "+10K",          title: "عميل سعيد",          description: "في جميع أنحاء المغرب، يثق بنا الآلاف.",          imageSrc: "http://img.b2bpic.net/free-photo/freelance-accountant-analyzing-charts_1262-5053.jpg",          imageAlt: "Community growth data"},
        {
          id: "satisfaction",          value: "98%",          title: "رضا العملاء",          description: "نسعى دائمًا لتقديم أفضل تجربة تسوق.",          imageSrc: "http://img.b2bpic.net/free-photo/side-view-smiley-friends-with-smartphone_23-2150233616.jpg",          imageAlt: "Customer satisfaction survey"},
        {
          id: "cities",          value: "+50",          title: "مدينة مغربية",          description: "وصلنا إلى أكثر من 50 مدينة وقرية مغربية.",          imageSrc: "http://img.b2bpic.net/free-photo/side-view-rich-woman-holding-smartphone_23-2149684327.jpg",          imageAlt: "Moroccan product reach map"},
      ]}
      title="أرقام تتحدث عن نفسها"
      description="نحن نؤمن بالشفافية والنجاح الذي بنيناه مع عملائنا."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardFifteen
      useInvertedBackground={true}
      testimonial="منتجات رائعة تعكس الجمال المغربي الأصيل. الجودة تفوق التوقعات وخدمة العملاء ممتازة. أوصي بها بشدة!"
      rating={5}
      author="فاطمة الزهراء، الرباط"
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/young-smiling-woman-cafe-drinking-coffee-date-looking-camera_197531-22708.jpg",          alt: "Fatima Zahra"},
        {
          src: "http://img.b2bpic.net/free-photo/cheerful-tanned-student-with-thick-beard-having-good-coffee-lunch-smiling-happily-enjoying-summer-vacations-tropical-country_273609-1756.jpg",          alt: "Ahmed El Mansour"},
        {
          src: "http://img.b2bpic.net/free-photo/close-up-happy-muslim-woman-pretty-young-woman-grey-hijab-with-good-make-up-looking-camera-smiling-standing-park-trees-background-beauty-happiness-concept_74855-21331.jpg",          alt: "Family from Casablanca"},
        {
          src: "http://img.b2bpic.net/free-photo/young-woman-smiling-confident-listening-audio-message-by-smartphone-street_839833-21362.jpg",          alt: "Yassine Benali"},
        {
          src: "http://img.b2bpic.net/free-photo/vegan-man-specialty-food-supermarket_482257-81587.jpg",          alt: "Dr. Amina Rachidi"},
      ]}
      ratingAnimation="blur-reveal"
      avatarsAnimation="blur-reveal"
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqBase
      textboxLayout="default"
      useInvertedBackground={false}
      faqs={[
        {
          id: "q1",          title: "ما هي طرق الدفع المتاحة؟",          content: "نقبل الدفع عند الاستلام، والتحويل البنكي، والبطاقات الائتمانية عبر بوابات دفع آمنة."},
        {
          id: "q2",          title: "كم تستغرق عملية التوصيل؟",          content: "تختلف مدة التوصيل حسب المدينة، عادة ما تتراوح بين 2-5 أيام عمل داخل المغرب."},
        {
          id: "q3",          title: "هل يمكنني إرجاع أو استبدال المنتج؟",          content: "نعم، يمكنك إرجاع أو استبدال المنتج خلال 7 أيام من تاريخ الاستلام، بشرط أن يكون بحالته الأصلية."},
        {
          id: "q4",          title: "هل منتجاتكم يدوية الصنع؟",          content: "معظم منتجاتنا مصنوعة يدوياً من قبل حرفيين مغاربة مهرة، لضمان الأصالة والجودة."},
        {
          id: "q5",          title: "هل تقدمون خصومات للطلبات الكبيرة؟",          content: "نعم، نقدم خصومات خاصة للطلبات الكبيرة وللعملاء الدائمين. يرجى التواصل معنا للمزيد من التفاصيل."},
      ]}
      title="الأسئلة الشائعة"
      description="هل لديك أسئلة؟ ربما تجد الإجابة هنا."
      faqsAnimation="slide-up"
    />
  </div>

  <div id="social-proof" data-section="social-proof">
      <SocialProofOne
      textboxLayout="default"
      useInvertedBackground={true}
      names={[
        "وزارة الصناعة والتجارة المغربية",        "سوق ممتاز المغرب",        "القناة الثانية",        "جمعية الحرفيين المغاربة",        "هيئة مراقبة الجودة",        "مبادرة المغرب الأخضر",        "بنك المغرب"]}
      title="شركاؤنا وشهاداتنا"
      description="بناء الثقة هو جوهر عملنا، وشركاؤنا يدعمون رؤيتنا."
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactSplit
      useInvertedBackground={false}
      background={{
        variant: "downward-rays-animated"}}
      tag="تواصل"
      title="تواصل معنا"
      description="يسعدنا الإجابة على جميع استفساراتكم واقتراحاتكم. فريقنا متاح لمساعدتك."
      imageSrc="http://img.b2bpic.net/free-photo/vibrant-night-market-cultural-abundance-motion-generated-by-ai_188544-15232.jpg"
      imageAlt="Moroccan city skyline at sunset"
      mediaAnimation="slide-up"
      mediaPosition="right"
      inputPlaceholder="أدخل بريدك الإلكتروني"
      buttonText="اشترك الآن"
      termsText="بالاشتراك، أنت توافق على شروطنا وأحكامنا."
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterMedia
      imageSrc="http://img.b2bpic.net/free-vector/ornamental-mandalas-lace-round-patterns-ramadan-kareem-ornament_271628-651.jpg"
      imageAlt="Moroccan patterns"
      logoSrc="http://img.b2bpic.net/free-photo/biohazard-sign-ai-generated_268835-18740.jpg"
      logoAlt="Moroccan Product Logo"
      logoText="منتجات مغربية أصيلة"
      columns={[
        {
          title: "روابط سريعة",          items: [
            {
              label: "الرئيسية",              href: "#hero"},
            {
              label: "عنا",              href: "#about"},
            {
              label: "المنتجات",              href: "#products"},
            {
              label: "الأسئلة الشائعة",              href: "#faq"},
          ],
        },
        {
          title: "تواصل",          items: [
            {
              label: "تواصل معنا",              href: "#contact"},
            {
              label: "الدعم",              href: "#"},
            {
              label: "الشركاء",              href: "#social-proof"},
          ],
        },
        {
          title: "قانوني",          items: [
            {
              label: "سياسة الخصوصية",              href: "#"},
            {
              label: "شروط الخدمة",              href: "#"},
          ],
        },
      ]}
      copyrightText="© 2024 منتجات مغربية. جميع الحقوق محفوظة."
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
