"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 FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
import FooterBase from '@/components/sections/footer/FooterBase';
import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleCarousel';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardSix from '@/components/sections/testimonial/TestimonialCardSix';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="hover-bubble"
        defaultTextAnimation="reveal-blur"
        borderRadius="pill"
        contentWidth="mediumLarge"
        sizing="largeSmallSizeLargeTitles"
        background="grid"
        cardStyle="soft-shadow"
        primaryButtonStyle="gradient"
        secondaryButtonStyle="radial-glow"
        headingFontWeight="medium"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleApple
      navItems={[
        {
          name: "Home",
          id: "#home",
        },
        {
          name: "Fleet",
          id: "#fleet",
        },
        {
          name: "Why Us",
          id: "#why-us",
        },
        {
          name: "Reviews",
          id: "#reviews",
        },
        {
          name: "FAQ",
          id: "#faq",
        },
        {
          name: "Contact",
          id: "#contact",
        },
      ]}
      brandName="M&M"
    />
  </div>

  <div id="home" data-section="home">
      <HeroSplitDoubleCarousel
      background={{
        variant: "plain",
      }}
      title="M&M RENT A CAR"
      description="MUSCAT'S TRUSTED FLEET"
      leftCarouselItems={[
        {
          imageSrc: "http://img.b2bpic.net/free-photo/young-woman-car-looking-into-car-mirror_1303-17040.jpg?_wi=1",
          imageAlt: "dark car silhouette modern",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/blurred-night-lights_23-2148139121.jpg?_wi=1",
          imageAlt: "dark car silhouette modern",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/business-woman-with-phone-car_1303-3823.jpg?_wi=1",
          imageAlt: "dark car silhouette modern",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/lifestyle-young-couple_23-2148140847.jpg?_wi=1",
          imageAlt: "dark car silhouette modern",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/young-man-driving-his-car-night-time-talking-phone_1303-17087.jpg",
          imageAlt: "dark car silhouette modern",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/3d-rendering-car-melting_23-2150083281.jpg",
          imageAlt: "dark car silhouette modern",
        },
      ]}
      rightCarouselItems={[
        {
          imageSrc: "http://img.b2bpic.net/free-photo/futuristic-exploration-dubai-s-evolving-cityscape_23-2151339705.jpg",
          imageAlt: "modern car on road dark",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/motion-blur-bridge-with-vehicles-night_23-2148287839.jpg",
          imageAlt: "modern car on road dark",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/family-car-salon-woman-buying-car-little-african-girl-with-mther-manager-with-clients_1157-45006.jpg",
          imageAlt: "modern car on road dark",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/futuristic-sports-car_23-2151955602.jpg",
          imageAlt: "modern car on road dark",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/off-road-car-fantasy-scenario_23-2151437482.jpg",
          imageAlt: "modern car on road dark",
        },
        {
          imageSrc: "http://img.b2bpic.net/free-photo/stylish-elegant-woman-car-salon_1157-32020.jpg",
          imageAlt: "modern car on road dark",
        },
      ]}
      buttons={[
        {
          text: "WhatsApp Us",
          href: "https://wa.me/96894778666",
        },
        {
          text: "Call Now",
          href: "tel:+96894778666",
        },
      ]}
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/man-sitting-car-night_23-2149001289.jpg",
          alt: "Man sitting next to car at night",
        },
        {
          src: "http://img.b2bpic.net/free-photo/man-sitting-car-night_23-2149001290.jpg",
          alt: "Man sitting next to car at night",
        },
        {
          src: "http://img.b2bpic.net/free-photo/lifestyle-couple-date-night_23-2149131791.jpg",
          alt: "Lifestyle of couple date at night",
        },
        {
          src: "http://img.b2bpic.net/free-photo/man-driving-car-road-talking-phone_1303-17093.jpg",
          alt: "Man driving a car on the road and talking on the phone",
        },
        {
          src: "http://img.b2bpic.net/free-photo/business-woman-car_1303-3813.jpg",
          alt: "Business woman in the car",
        },
      ]}
      avatarText="2500+ Happy Customers in Oman"
      marqueeItems={[
        {
          type: "text",
          text: "BMW",
        },
        {
          type: "text",
          text: "Mercedes-Benz",
        },
        {
          type: "text",
          text: "Toyota",
        },
        {
          type: "text",
          text: "Nissan",
        },
        {
          type: "text",
          text: "Mitsubishi",
        },
        {
          type: "text",
          text: "Lexus",
        },
      ]}
    />
  </div>

  <div id="fleet-types" data-section="fleet-types">
      <SocialProofOne
      textboxLayout="default"
      useInvertedBackground={false}
      names={[
        "Economy Cars (12)",
        "Sedan Cars (20)",
        "SUV Cars (8)",
        "4x4 Cars (5)",
        "Monthly Cars (15)",
        "Premium Cars (7)",
        "Luxury Cars (3)",
      ]}
      title="Browse by Type — Find the perfect ride for any occasion"
      description="Our diverse fleet ensures you find the ideal vehicle, whether for a quick city trip or an adventurous desert journey. Explore popular categories tailored to your needs."
      speed={20}
      showCard={true}
    />
  </div>

  <div id="fleet" data-section="fleet">
      <ProductCardTwo
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="three-columns-all-equal-width"
      useInvertedBackground={true}
      products={[
        {
          id: "economy-sedan-1",
          brand: "Economy",
          name: "Economy Sedan – 2023",
          price: "OMR 10.000 / Daily",
          rating: 4.5,
          reviewCount: "15",
          imageSrc: "http://img.b2bpic.net/free-photo/side-rear-view-mirror-modern-car_1339-3218.jpg",
          imageAlt: "economy sedan car dark",
        },
        {
          id: "toyota-prado-2",
          brand: "Toyota",
          name: "Toyota Prado – 2023",
          price: "OMR 35.000 / Daily",
          rating: 4.8,
          reviewCount: "22",
          imageSrc: "http://img.b2bpic.net/free-photo/vehicle-road_23-2151919268.jpg",
          imageAlt: "toyota prado suv dark",
        },
        {
          id: "nissan-altima-3",
          brand: "Nissan",
          name: "Nissan Altima – 2023",
          price: "OMR 15.000 / Daily",
          rating: 4.6,
          reviewCount: "18",
          imageSrc: "http://img.b2bpic.net/free-photo/elegant-uber-driver-giving-taxi-ride_23-2149241744.jpg",
          imageAlt: "nissan altima sedan dark",
        },
        {
          id: "mitsubishi-pajero-4",
          brand: "Mitsubishi",
          name: "Mitsubishi Pajero – 2023",
          price: "OMR 30.000 / Daily",
          rating: 4.7,
          reviewCount: "20",
          imageSrc: "http://img.b2bpic.net/free-photo/traveling-with-off-road-car_23-2151473100.jpg",
          imageAlt: "mitsubishi pajero 4x4 dark",
        },
        {
          id: "luxury-sedan-5",
          brand: "Luxury",
          name: "Luxury Sedan – 2024",
          price: "OMR 50.000 / Daily",
          rating: 4.9,
          reviewCount: "10",
          imageSrc: "http://img.b2bpic.net/free-photo/young-man-driving-his-car-night-time-talking-phone_1303-17086.jpg",
          imageAlt: "luxury car rental black",
        },
        {
          id: "electric-car-6",
          brand: "Electric",
          name: "Electric Car – 2024",
          price: "OMR 25.000 / Daily",
          rating: 4.7,
          reviewCount: "8",
          imageSrc: "http://img.b2bpic.net/free-photo/view-3d-car-with-trees_23-2151005373.jpg",
          imageAlt: "electric car charging station",
        },
      ]}
      title="Our Fleet — Well-maintained, reliable cars for every need"
      description="Car data below is placeholder and should be replaced with real cars and prices."
      buttons={[
        {
          text: "View All Cars",
          href: "#fleet",
        },
      ]}
    />
  </div>

  <div id="how-it-works" data-section="how-it-works">
      <FeatureCardTen
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      features={[
        {
          title: "1. Choose Your Car",
          description: "Browse our diverse fleet online and pick the perfect vehicle for your trip. We have options for every need.",
          media: {
            imageSrc: "http://img.b2bpic.net/free-photo/woman-traveling-with-her-car_23-2149076683.jpg",
            imageAlt: "car selection icon illustration",
          },
          items: [],
          reverse: false,
          imageSrc: "http://img.b2bpic.net/free-photo/young-woman-car-looking-into-car-mirror_1303-17040.jpg?_wi=2",
          imageAlt: "car selection icon illustration",
        },
        {
          title: "2. Contact & Confirm",
          description: "Reach us via WhatsApp or call to confirm your booking details swiftly. Our team is ready to assist you.",
          media: {
            imageSrc: "http://img.b2bpic.net/free-photo/close-up-woman-taking-notes_23-2148760510.jpg",
            imageAlt: "phone call confirmation booking",
          },
          items: [],
          reverse: false,
          imageSrc: "http://img.b2bpic.net/free-photo/blurred-night-lights_23-2148139121.jpg?_wi=2",
          imageAlt: "car selection icon illustration",
        },
        {
          title: "3. Pick Up & Drive",
          description: "Collect your chosen car from our convenient Athaibah location or arrange a delivery within Muscat.",
          media: {
            imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-man-with-car-key-remote_1150-14285.jpg",
            imageAlt: "car key hand over",
          },
          items: [],
          reverse: false,
          imageSrc: "http://img.b2bpic.net/free-photo/business-woman-with-phone-car_1303-3823.jpg?_wi=2",
          imageAlt: "car selection icon illustration",
        },
      ]}
      title="From Click to Drive — Your Journey in 3 Easy Steps"
      description="Renting a car with M&M Rent A Car is a seamless experience designed for your convenience and peace of mind."
    />
  </div>

  <div id="why-us" data-section="why-us">
      <FeatureCardTen
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={true}
      features={[
        {
          title: "Affordable Daily & Monthly Rates",
          description: "Enjoy competitive pricing for short and long-term rentals, ensuring great value for your money.",
          media: {
            imageSrc: "http://img.b2bpic.net/free-photo/price-tag-front-side_187299-40109.jpg",
            imageAlt: "money coin stack savings",
          },
          items: [],
          reverse: false,
          imageSrc: "http://img.b2bpic.net/free-photo/young-woman-car-looking-into-car-mirror_1303-17040.jpg?_wi=3",
          imageAlt: "money coin stack savings",
        },
        {
          title: "Well-Maintained & Reliable Cars",
          description: "Our entire fleet is regularly serviced and meticulously cleaned for your safety and comfort.",
          media: {
            imageSrc: "http://img.b2bpic.net/free-photo/professional-mechanic-using-contemporary-technology-work_329181-11876.jpg",
            imageAlt: "car maintenance service icon",
          },
          items: [],
          reverse: false,
          imageSrc: "http://img.b2bpic.net/free-photo/blurred-night-lights_23-2148139121.jpg?_wi=3",
          imageAlt: "money coin stack savings",
        },
        {
          title: "Easy Booking & Flexible Terms",
          description: "Benefit from a simple and straightforward rental process with terms designed for your flexibility.",
          media: {
            imageSrc: "http://img.b2bpic.net/free-photo/close-up-smartphone-money-graphs-charts-workplace-office-business-concept_1150-2266.jpg",
            imageAlt: "online booking form success",
          },
          items: [],
          reverse: false,
          imageSrc: "http://img.b2bpic.net/free-photo/business-woman-with-phone-car_1303-3823.jpg?_wi=3",
          imageAlt: "money coin stack savings",
        },
        {
          title: "Friendly & Professional Service",
          description: "Our dedicated team provides excellent customer support, making your rental experience smooth and enjoyable.",
          media: {
            imageSrc: "http://img.b2bpic.net/free-photo/happy-customer-car-dealership-with-seller_23-2149106200.jpg",
            imageAlt: "friendly customer service smile",
          },
          items: [],
          reverse: false,
          imageSrc: "http://img.b2bpic.net/free-photo/lifestyle-young-couple_23-2148140847.jpg?_wi=2",
          imageAlt: "money coin stack savings",
        },
      ]}
      title="At M&M Rent A Car, every rental starts with a smile."
      description="Affordable rates, reliable cars, and stress-free service — that's the M&M difference."
      buttons={[
        {
          text: "WhatsApp Us Now",
          href: "https://wa.me/96894778666",
        },
      ]}
    />
  </div>

  <div id="reviews" data-section="reviews">
      <TestimonialCardSix
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "testimonial-1",
          name: "Soumia",
          handle: "via Google",
          testimonial: "Our experience with this car rental company was more than perfect. The owner impressed us with his kindness and professionalism. The car was clean and comfortable. Highly recommended!",
          imageSrc: "http://img.b2bpic.net/free-photo/young-handsome-man-beige-turtleneck-smiling-cheerfully-showing-teeth_141793-54841.jpg",
          imageAlt: "woman smiling professional portrait",
        },
        {
          id: "testimonial-2",
          name: "Hanane Oudaha",
          handle: "via Google",
          testimonial: "Smooth service! Clean car at very fair prices. The staff was super friendly and helpful throughout the entire rental process.",
          imageSrc: "http://img.b2bpic.net/free-photo/collage-customer-experience-concept_23-2149367138.jpg",
          imageAlt: "man smiling professional portrait",
        },
        {
          id: "testimonial-3",
          name: "Rumaysaa",
          handle: "via Google",
          testimonial: "Rented a car for a week and had a fantastic experience! Spotless vehicle, smooth pickup/drop-off. Definitely my go-to for car rentals in Muscat.",
          imageSrc: "http://img.b2bpic.net/free-photo/excited-joyful-beautiful-woman-gesturing-with-hand_74855-2753.jpg",
          imageAlt: "young woman smiling feedback",
        },
        {
          id: "testimonial-4",
          name: "Ahmed Al-Balushi",
          handle: "via Google",
          testimonial: "Excellent service and well-maintained cars. The booking process was very easy and transparent. Highly satisfied with M&M Rent A Car.",
          imageSrc: "http://img.b2bpic.net/free-photo/blond-man-happy-expression_1194-2919.jpg",
          imageAlt: "happy man car keys",
        },
        {
          id: "testimonial-5",
          name: "Fatima Hassan",
          handle: "via Google",
          testimonial: "Friendly and efficient staff. The car was exactly as described and performed perfectly. I appreciate their professionalism and will be a returning customer.",
          imageSrc: "http://img.b2bpic.net/free-photo/excited-young-woman-looking-camera-holding-funny-conversation-with-colleagues-online-webcam-view-head-shot-young-woman-with-headphones-laughing-having-fun-from-home-office_657921-1275.jpg",
          imageAlt: "woman posing with car",
        },
        {
          id: "testimonial-6",
          name: "Khalid bin Said",
          handle: "via Google",
          testimonial: "Rented for a month, great rates and the car was reliable throughout. Hassle-free experience from start to finish. Highly recommend M&M for long-term rentals.",
          imageSrc: "http://img.b2bpic.net/free-photo/three-friends-sitting-car-hood-taking-self-portrait_23-2147855669.jpg",
          imageAlt: "family with rented car",
        },
      ]}
      title="What Our Customers Say"
      description="⭐ 4.8 / 5 — Rated by 264+ customers on Google"
      speed={40}
      topMarqueeDirection="left"
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqSplitMedia
      textboxLayout="default"
      useInvertedBackground={true}
      faqs={[
        {
          id: "faq-1",
          title: "How do I book a car?",
          content: "Simply call or WhatsApp us at +968 9477 8666 and we'll sort everything out quickly. Our booking process is designed to be fast and efficient.",
        },
        {
          id: "faq-2",
          title: "Do you offer monthly rentals?",
          content: "Yes! We have competitive daily and monthly rental rates for all budgets. Contact us directly to inquire about long-term packages and special deals.",
        },
        {
          id: "faq-3",
          title: "What documents do I need?",
          content: "A valid Omani or international driving license, along with a copy of your ID or passport, are required for all rentals. Please have these ready.",
        },
        {
          id: "faq-4",
          title: "Is the car delivered to me?",
          content: "Contact us to discuss convenient pickup options from our Athaibah location or inquire about delivery services within Muscat for an additional fee.",
        },
        {
          id: "faq-5",
          title: "What payment methods do you accept?",
          content: "For your convenience, we accept cash, major credit cards, and bank transfers. Please confirm preferred payment options during booking.",
        },
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/call-center-agent-uses-artificial-intelligence-enhance-customer-interactions_482257-126113.jpg"
      imageAlt="customer support call center"
      mediaAnimation="slide-up"
      mediaPosition="right"
      title="Frequently Asked Questions"
      description="Find quick answers to common questions about our car rental services. We're here to help make your experience smooth and enjoyable."
      faqsAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactCenter
      useInvertedBackground={false}
      background={{
        variant: "plain",
      }}
      tag="Need a Car?"
      title="Available daily & monthly in Muscat"
      description="Reach out now for a quick quote and rent the difference with M&M Rent A Car. Our friendly team is ready to assist you."
      buttons={[
        {
          text: "Call Us",
          href: "tel:+96894778666",
        },
        {
          text: "WhatsApp Us",
          href: "https://wa.me/96894778666",
        },
      ]}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterBase
      columns={[
        {
          title: "Quick Links",
          items: [
            {
              label: "Home",
              href: "#home",
            },
            {
              label: "Fleet",
              href: "#fleet",
            },
            {
              label: "Why Us",
              href: "#why-us",
            },
            {
              label: "Reviews",
              href: "#reviews",
            },
            {
              label: "FAQ",
              href: "#faq",
            },
            {
              label: "Contact",
              href: "#contact",
            },
          ],
        },
        {
          title: "Fleet Categories",
          items: [
            {
              label: "Economy",
              href: "#fleet",
            },
            {
              label: "Sedan",
              href: "#fleet",
            },
            {
              label: "SUV",
              href: "#fleet",
            },
            {
              label: "4x4",
              href: "#fleet",
            },
            {
              label: "Monthly",
              href: "#fleet",
            },
          ],
        },
        {
          title: "Contact Info",
          items: [
            {
              label: "Behind Al Meera Hypermarket, Athaibah, 48th Street, Building No: 3891, Way No: 4451, Muscat, Oman",
              href: "https://maps.app.goo.gl/example",
            },
            {
              label: "+968 9477 8666",
              href: "tel:+96894778666",
            },
            {
              label: "Open daily until 9:00 PM",
              href: "#",
            },
          ],
        },
        {
          title: "Social Media",
          items: [
            {
              label: "Instagram",
              href: "#",
            },
            {
              label: "Facebook",
              href: "#",
            },
            {
              label: "TikTok",
              href: "#",
            },
          ],
        },
      ]}
      logoText="M&M"
      copyrightText="© 2026 M&M Rent A Car — All Rights Reserved."
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
