"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import FeatureHoverPattern from '@/components/sections/feature/featureHoverPattern/FeatureHoverPattern';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
import { BarChart, Building2, Clock, Shield, Truck, Zap } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="shift-hover"
        defaultTextAnimation="entrance-slide"
        borderRadius="rounded"
        contentWidth="smallMedium"
        sizing="large"
        background="noiseDiagonalGradient"
        cardStyle="gradient-mesh"
        primaryButtonStyle="diagonal-gradient"
        secondaryButtonStyle="glass"
        headingFontWeight="bold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleCentered
      navItems={[
        {
          name: "الرئيسية",          id: "/"},
        {
          name: "عن الشركة",          id: "#about"},
        {
          name: "خدماتنا",          id: "#services"},
        {
          name: "تواصل معنا",          id: "#contact"},
      ]}
      brandName="مسارات طيبة"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroBillboard
      background={{
        variant: "gradient-bars"}}
      title="نوصي الطاقة لكل مسار باحترافية"
      description="شريكك الموثوق في تزويد الوقود الصناعي بأعلى معايير الجودة والسينمائية."
      buttons={[
        {
          text: "ابدأ الآن",          href: "#contact"},
        {
          text: "تعرف أكثر",          href: "#about"},
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/business-person-planning-alternative-energies_23-2149205411.jpg?_wi=1"
      imageAlt="industrial fuel refinery dark night"
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/wind-farms-fields_23-2149154486.jpg",          alt: "Wind farms fields"},
        {
          src: "http://img.b2bpic.net/free-photo/professional-inspector-suit-reviewing-solar-panel-production-showcasing-leadership-renewable_482257-135429.jpg",          alt: "Professional inspector in a suit reviewing solar panel production showcasing leadership in renewable"},
        {
          src: "http://img.b2bpic.net/free-photo/solar-panels-factory-investors-evaluate-investment-profitability-videocall_482257-123430.jpg",          alt: "Solar panels factory investors evaluate investment profitability in videocall"},
        {
          src: "http://img.b2bpic.net/free-photo/scientists-photovoltaics-factory-experimenting-with-advanced-pv-materials_482257-126689.jpg",          alt: "Scientists in photovoltaics factory experimenting with advanced PV materials"},
        {
          src: "http://img.b2bpic.net/free-photo/teamworking-photovoltaics-factory-engineers-researching-cheaper-solar-solutions_482257-120606.jpg",          alt: "Teamworking photovoltaics factory engineers researching cheaper solar solutions"},
      ]}
      marqueeItems={[
        {
          type: "text",          text: "طاقة موثوقة"},
        {
          type: "text",          text: "جودة عالمية"},
        {
          type: "text",          text: "تسليم دقيق"},
        {
          type: "text",          text: "دعم مستمر"},
        {
          type: "text",          text: "ابتكار صناعي"},
      ]}
    />
  </div>

  <div id="ticker" data-section="ticker">
      <SocialProofOne
      textboxLayout="default"
      useInvertedBackground={false}
      names={[
        "احترافية",        "دقة",        "موثوقية",        "جودة",        "سرعة"]}
      title="شريكك الصناعي المتكامل"
      description="نحن ملتزمون بتوفير أفضل حلول الوقود للطاقة الصناعية بتميز لا يضاهى."
    />
  </div>

  <div id="about" data-section="about">
      <TextSplitAbout
      useInvertedBackground={false}
      title="من نحن"
      description={[
        "نحن مسارات طيبة، الشريك الرائد في توريد الوقود الصناعي.",        "نجمع بين الخبرة العميقة والحلول المبتكرة لتقديم تجربة خدمة سينمائية وفريدة من نوعها تلبي احتياجاتك التشغيلية بدقة."]}
    />
  </div>

  <div id="services" data-section="services">
      <FeatureHoverPattern
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      features={[
        {
          icon: Truck,
          title: "توزيع الوقود",          description: "توصيل آمن وسريع لمختلف المواقع."},
        {
          icon: Building2,
          title: "إدارة الإمدادات",          description: "حلول متقدمة لمراقبة وإدارة الطلبات."},
        {
          icon: Zap,
          title: "استشارات الطاقة",          description: "تحسين استهلاك الطاقة بكفاءة عالية."},
        {
          icon: Shield,
          title: "سلامة التوريد",          description: "الالتزام بأعلى معايير السلامة المهنية."},
        {
          icon: BarChart,
          title: "تحليل الأداء",          description: "تقارير دورية دقيقة للاستهلاك."},
        {
          icon: Clock,
          title: "دعم 24/7",          description: "نحن بجانبك في كل وقت."},
      ]}
      title="خدماتنا المتميزة"
      description="نقدم حلولاً متكاملة للطاقة الصناعية بأسلوب احترافي."
      buttons={[
        {
          text: "تواصل معنا الآن",          href: "#contact"
        }
      ]}
    />
  </div>

  <div id="vision" data-section="vision">
      <TestimonialCardTwo
      animationType="depth-3d"
      textboxLayout="default"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "1",          name: "الابتكار",          role: "هدفنا",          testimonial: "نسعى للريادة في تقديم حلول الوقود الذكية.",          imageSrc: "http://img.b2bpic.net/free-photo/fast-truck_1048-1846.jpg",          imageAlt: "fuel delivery logistics industrial"},
        {
          id: "2",          name: "الجودة",          role: "مبدأنا",          testimonial: "الجودة ليست خياراً بل هي واقع يومي في عملياتنا.",          imageSrc: "http://img.b2bpic.net/free-photo/business-person-planning-alternative-energies_23-2149205411.jpg?_wi=2",          imageAlt: "fuel delivery logistics industrial"},
        {
          id: "3",          name: "السينمائية",          role: "نهجنا",          testimonial: "نقدم خدماتنا بأسلوب فريد يعكس تميز علامتنا التجارية.",          imageSrc: "http://img.b2bpic.net/free-photo/photovoltaics-factory-expert-brainstorms-with-colleague-improve-efficiency_482257-118027.jpg?_wi=1",          imageAlt: "fuel delivery logistics industrial"},
        {
          id: "4",          name: "الاستدامة",          role: "التزامنا",          testimonial: "نلتزم بأفضل معايير الاستدامة البيئية.",          imageSrc: "http://img.b2bpic.net/free-photo/cooling-tower_1127-3440.jpg",          imageAlt: "fuel delivery logistics industrial"},
        {
          id: "5",          name: "الاحترافية",          role: "ثقتكم",          testimonial: "ثقة عملائنا هي الوقود الحقيقي لنجاحنا.",          imageSrc: "http://img.b2bpic.net/free-photo/close-up-fuel-level-gauge-vehicle_23-2150163681.jpg",          imageAlt: "fuel delivery logistics industrial"},
      ]}
      title="رؤيتنا"
      description="نؤمن أن الطاقة هي شريان الصناعة."
    />
  </div>

  <div id="why-us" data-section="why-us">
      <FaqSplitMedia
      textboxLayout="default"
      useInvertedBackground={false}
      faqs={[
        {
          id: "1",          title: "خبرة عريقة",          content: "أكثر من 15 عاماً من التميز في التوريد."},
        {
          id: "2",          title: "موثوقية تامة",          content: "التزام كامل بمواعيد التسليم والجودة."},
        {
          id: "3",          title: "عمليات على مدار الساعة",          content: "دعم فني ولوجستي 24/7."},
        {
          id: "4",          title: "رقابة الجودة",          content: "مختبرات متقدمة لفحص جودة الوقود."},
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/photovoltaics-factory-expert-brainstorms-with-colleague-improve-efficiency_482257-118027.jpg?_wi=2"
      mediaAnimation="opacity"
      title="لماذا نحن"
      description="نحن الخيار الأول في توريد الطاقة."
      faqsAnimation="slide-up"
      imageAlt="industrial engineers team modern facility"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactCenter
      useInvertedBackground={false}
      background={{
        variant: "gradient-bars"}}
      tag="تواصل"
      title="تواصل معنا اليوم"
      description="ابدأ مسارك نحو الوقود الموثوق."
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterLogoEmphasis
      columns={[
        {
          items: [
            {
              label: "الرئيسية",              href: "/"},
            {
              label: "عن الشركة",              href: "#about"},
          ],
        },
        {
          items: [
            {
              label: "خدماتنا",              href: "#services"},
            {
              label: "اتصل بنا",              href: "#contact"},
          ],
        },
      ]}
      logoText="مسارات طيبة"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
