"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCTA from '@/components/sections/contact/ContactCTA';
import FeatureCardSixteen from '@/components/sections/feature/FeatureCardSixteen';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import { Award, Calendar, Fish, ShoppingBag, Star } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="icon-arrow"
        defaultTextAnimation="background-highlight"
        borderRadius="pill"
        contentWidth="medium"
        sizing="largeSizeMediumTitles"
        background="aurora"
        cardStyle="glass-depth"
        primaryButtonStyle="gradient"
        secondaryButtonStyle="glass"
        headingFontWeight="normal"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleFullscreen
      navItems={[
        { name: "Home", id: "hero" },
        { name: "About", id: "about" },
        { name: "Shop", id: "products" },
        { name: "Contact", id: "contact" },
      ]}
      brandName="Sheikh 4 Fishing"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroSplitDualMedia
      background={{ variant: "gradient-bars" }}
      title="Sheikh 4 Fishing"
      description="Your premium source for high-quality fishing equipment and expert gear advice."
      tag="Expert Angler Gear"
      mediaItems={[
        {
          imageSrc: "http://img.b2bpic.net/free-photo/blank-tag-hooks-fishing-float-pliers-corkboard-fishing-reel-measuring-tool-wooden-desk_23-2148189225.jpg",          imageAlt: "fishing equipment professional photography"},
        {
          imageSrc: "http://img.b2bpic.net/free-photo/confident-young-handsome-slavic-gardener-uniform-hat-holding-gardener-tools-looking_141793-58190.jpg",          imageAlt: "professional fishing shop interior"}
      ]}
      mediaAnimation="slide-up"
      rating={5}
      ratingText="Rated 5 stars by local anglers"
      tagIcon={Fish}
    />
  </div>

  <div id="about" data-section="about">
      <TestimonialAboutCard
      useInvertedBackground={false}
      tag="About Us"
      title="Dedicated to Quality Fishing"
      description="Sheikh 4 Fishing is a premier provider of professional-grade fishing tackle and gear. We help enthusiasts and experts find exactly what they need for a successful day on the water."
      subdescription="With years of experience, we provide expert guidance and curated products to elevate your fishing journey."
      icon={Star}
      imageSrc="http://img.b2bpic.net/free-photo/bar-concept-with-backview-barman_23-2147798057.jpg"
      mediaAnimation="slide-up"
      imageAlt="professional fishing shop interior"
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardSixteen
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={true}
      negativeCard={{
        items: [
          "Limited local stock elsewhere",          "Generic mass-market gear",          "Long shipping times",          "Poor customer support",          "Overpriced entry-level equipment"],
      }}
      positiveCard={{
        items: [
          "Expertly curated selection",          "Premium brand availability",          "Same-day gear consultation",          "Lifetime warranty on select rods",          "Local expert community advice"],
      }}
      title="Why Choose Our Gear"
      description="We ensure every piece of equipment meets our professional standards for durability and performance."
    />
  </div>

  <div id="products" data-section="products">
      <ProductCardOne
      animationType="slide-up"
      textboxLayout="split"
      gridVariant="uniform-all-items-equal"
      useInvertedBackground={false}
      products={[
        {
          id: "1",          name: "Professional Rod",          price: "$120",          imageSrc: "http://img.b2bpic.net/free-photo/music-instrument-store_23-2150608908.jpg",          imageAlt: "professional fishing rod carbon"},
        {
          id: "2",          name: "Spinning Reel",          price: "$85",          imageSrc: "http://img.b2bpic.net/free-photo/elevated-view-various-fishing-lures-box_23-2147894157.jpg",          imageAlt: "professional fishing rod carbon"},
        {
          id: "3",          name: "Custom Lures",          price: "$25",          imageSrc: "http://img.b2bpic.net/free-photo/close-up-fisherman-with-fresh-catch-fishing-rod_23-2147894205.jpg",          imageAlt: "professional fishing rod carbon"},
      ]}
      title="Our Fishing Gear"
      description="Browse our selection of top-tier fishing tools designed for peak performance."
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardOne
      animationType="slide-up"
      textboxLayout="split"
      gridVariant="uniform-all-items-equal"
      useInvertedBackground={true}
      metrics={[
        {
          id: "m1",          value: "1000+",          title: "Happy Anglers",          description: "Fishing enthusiasts served",          icon: Award,
        },
        {
          id: "m2",          value: "500+",          title: "Products",          description: "Curated tackle items",          icon: ShoppingBag,
        },
        {
          id: "m3",          value: "10",          title: "Years",          description: "Industry expertise",          icon: Calendar,
        },
      ]}
      title="Proven Excellence"
      description="Serving the local community with pride and precision."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardFifteen
      useInvertedBackground={false}
      testimonial="The gear I bought here completely changed my fishing trips. Highly recommended!"
      rating={5}
      author="John Smith"
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/man-beach-opens-coconut_1321-2281.jpg",          alt: "John Smith"},
        {
          src: "http://img.b2bpic.net/free-photo/sideways-man-taking-photos_23-2148243219.jpg",          alt: "Mike Ross"},
      ]}
      ratingAnimation="slide-up"
      avatarsAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactCTA
      useInvertedBackground={true}
      background={{ variant: "plain" }}
      tag="Contact Us"
      title="Visit Us Today"
      description="Have questions? Stop by our shop or get in touch for expert fishing gear advice."
      buttons={[
        {
          text: "Get Directions",          href: "https://maps.app.goo.gl/hfEjFH7fZMRCFUKv7?g_st=ic"},
      ]}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterLogoEmphasis
      columns={[
        {
          items: [
            { label: "Home", href: "#hero" },
            { label: "Shop", href: "#products" },
          ],
        },
        {
          items: [
            { label: "Contact", href: "#contact" },
            { label: "Privacy Policy", href: "#" },
          ],
        },
      ]}
      logoText="Sheikh 4 Fishing"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
