"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
import HeroSplitKpi from "@/components/sections/hero/HeroSplitKpi";
import ProductCardFour from "@/components/sections/product/ProductCardFour";
import InlineImageSplitTextAbout from "@/components/sections/about/InlineImageSplitTextAbout";
import FeatureBorderGlow from "@/components/sections/feature/featureBorderGlow/FeatureBorderGlow";
import TestimonialCardOne from "@/components/sections/testimonial/TestimonialCardOne";
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
import Link from "next/link";
import { Sparkles, Package, Crown, Star, Badge, Mail } from "lucide-react";

export default function HomePage() {
  const navItems = [
    { name: "Home", id: "/" },
    { name: "Shop", id: "/shop" },
    { name: "About", id: "/about" },
    { name: "Contact", id: "/contact" },
    { name: "Cart", id: "/cart" },
  ];

  const footerColumns = [
    {
      items: [
        { label: "Home", href: "/" },
        { label: "Shop", href: "/shop" },
        { label: "About Us", href: "/about" },
        { label: "Contact", href: "/contact" },
      ],
    },
    {
      items: [
        { label: "Collections", href: "/shop" },
        { label: "Custom Orders", href: "/contact" },
        { label: "Bulk Pricing", href: "/contact" },
        { label: "Care Guide", href: "#" },
      ],
    },
    {
      items: [
        { label: "WhatsApp Support", href: "#" },
        { label: "Email Us", href: "#" },
        { label: "Location", href: "#" },
        { label: "Returns", href: "#" },
      ],
    },
    {
      items: [
        { label: "Privacy Policy", href: "#" },
        { label: "Terms & Conditions", href: "#" },
        { label: "Shipping Info", href: "#" },
        { label: "FAQ", href: "/contact" },
      ],
    },
  ];

  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="entrance-slide"
      borderRadius="soft"
      contentWidth="compact"
      sizing="largeSmall"
      background="fluid"
      cardStyle="soft-shadow"
      primaryButtonStyle="shadow"
      secondaryButtonStyle="glass"
      headingFontWeight="normal"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple brandName="Atwab Al Hjaji" navItems={navItems} />
      </div>

      <div id="hero" data-section="hero">
        <HeroSplitKpi
          title="Premium Moroccan Salon Fabrics for Elegant Homes"
          description="Experience the timeless elegance of authentic Moroccan textiles. Atwab Al Hjaji brings centuries of craftsmanship to your living spaces with handpicked salon fabrics featuring traditional zellige patterns and luxurious textures."
          background={{ variant: "fluid" }}
          kpis={[
            { value: "25+", label: "Years of Craftsmanship" },
            { value: "100%", label: "Authentic Moroccan" },
            { value: "500+", label: "Satisfied Clients" },
          ]}
          enableKpiAnimation={true}
          tag="Luxury Collection"
          tagIcon={Sparkles}
          tagAnimation="slide-up"
          buttons={[
            { text: "Discover Collection", href: "/shop" },
            { text: "Learn More", href: "/about" },
          ]}
          buttonAnimation="slide-up"
          imageSrc="http://img.b2bpic.net/free-photo/decoration-with-sweater-ice-skates-hanger_23-2148350148.jpg"
          imageAlt="Moroccan salon fabric showcase with 3D textures"
          mediaAnimation="slide-up"
          imagePosition="right"
        />
      </div>

      <div id="featured-products" data-section="featured-products">
        <ProductCardFour
          title="Featured Collections"
          description="Explore our curated selection of premium Moroccan salon fabrics, each piece showcasing authentic craftsmanship and timeless elegance."
          tag="New Arrivals"
          tagIcon={Package}
          tagAnimation="slide-up"
          buttons={[{ text: "View All Products", href: "/shop" }]}
          buttonAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          products={[
            {
              id: "1",
              name: "Traditional Moroccan Salon Fabric - Deep Red",
              price: "45 DH/meter",
              variant: "Red • Geometric Pattern • Premium Wool",
              imageSrc: "http://img.b2bpic.net/free-photo/overhead-view-circle-made-with-lace-fabric_23-2147882417.jpg?_wi=1",
              imageAlt: "Traditional red Moroccan fabric with geometric zellige pattern",
              isFavorited: false,
            },
            {
              id: "2",
              name: "Modern Moroccan Salon Fabric - Azure Blue",
              price: "52 DH/meter",
              variant: "Blue • Contemporary Design • Silk Blend",
              imageSrc: "http://img.b2bpic.net/free-photo/pillow-sofa-chair_1203-3493.jpg?_wi=1",
              imageAlt: "Modern blue Moroccan fabric with contemporary pattern",
              isFavorited: false,
            },
            {
              id: "3",
              name: "Luxury Velvet Fabric - Gold Embossed",
              price: "85 DH/meter",
              variant: "Gold • Embroidered • Premium Velvet",
              imageSrc: "http://img.b2bpic.net/free-photo/solid-curvy-glitter-yellow-fabrics-curtains_23-2148516064.jpg?_wi=1",
              imageAlt: "Luxury gold velvet Moroccan fabric with embossed details",
              isFavorited: false,
            },
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <InlineImageSplitTextAbout
          heading={[
            { type: "text", content: "Atwab Al Hjaji: Preserving" },
            {
              type: "image",
              src: "http://img.b2bpic.net/free-photo/woman-choosing-colorful-sari-market_53876-48915.jpg",
              alt: "Moroccan artisan craftsmanship",
            },
            { type: "text", content: "Moroccan Heritage Through Premium Fabrics" },
          ]}
          useInvertedBackground={false}
          buttons={[
            { text: "Our Story", href: "/about" },
            { text: "Shop Now", href: "/shop" },
          ]}
          buttonAnimation="slide-up"
        />
      </div>

      <div id="features" data-section="features">
        <FeatureBorderGlow
          title="Why Choose Atwab Al Hjaji"
          description="Experience luxury and authenticity in every fabric we offer."
          tag="Premium Quality"
          tagIcon={Crown}
          tagAnimation="slide-up"
          features={[
            {
              icon: Sparkles,
              title: "Authentic Moroccan Craftsmanship",
              description: "Each fabric is handpicked from master artisans in Morocco, preserving centuries-old traditional weaving techniques.",
            },
            {
              icon: Package,
              title: "Premium Quality Guaranteed",
              description: "Rigorous quality control ensures durability, color fastness, and exceptional textile performance for lasting elegance.",
            },
            {
              icon: Badge,
              title: "Exclusive Designs",
              description: "Unique geometric patterns inspired by traditional zellige tilework create one-of-a-kind salon interiors.",
            },
            {
              icon: Crown,
              title: "Sustainable Practice",
              description: "We work directly with Moroccan artisans, supporting fair trade and sustainable textile production.",
            },
            {
              icon: Package,
              title: "Fast Delivery",
              description: "Nationwide delivery across Morocco with secure packaging to protect your premium fabrics.",
            },
            {
              icon: Star,
              title: "Expert Consultation",
              description: "Our textile specialists provide personalized guidance to find the perfect fabric for your salon design.",
            },
          ]}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground={false}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardOne
          title="Client Testimonials"
          description="Discover what our satisfied customers say about their experience with Atwab Al Hjaji fabrics."
          tag="Customer Reviews"
          tagIcon={Star}
          tagAnimation="slide-up"
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          testimonials={[
            {
              id: "1",
              name: "Fatima Al-Mansouri",
              role: "Interior Designer",
              company: "Marrakech Luxury Homes",
              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/closeup-smiling-beautiful-adult-businesswoman_1262-1760.jpg?_wi=1",
              imageAlt: "Fatima Al-Mansouri, Interior Designer",
            },
            {
              id: "2",
              name: "Hassan Al-Qadi",
              role: "Boutique Owner",
              company: "Fez Premium Décor",
              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/smiling-millennial-man-looking-camera-cafe-headshot-portrait_1163-5163.jpg?_wi=1",
              imageAlt: "Hassan Al-Qadi, Boutique Owner",
            },
            {
              id: "3",
              name: "Leila Bennis",
              role: "Hospitality Manager",
              company: "Atlas Hotel Group",
              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/closeup-smiling-beautiful-adult-businesswoman_1262-1760.jpg?_wi=2",
              imageAlt: "Leila Bennis, Hospitality Manager",
            },
            {
              id: "4",
              name: "Ahmed El-Fassi",
              role: "Architect",
              company: "Modern Maroc Design",
              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/smiling-young-businessman-suit-looking-camera-meeting_1163-4654.jpg",
              imageAlt: "Ahmed El-Fassi, Architect",
            },
            {
              id: "5",
              name: "Noor Al-Idrissi",
              role: "Fashion Designer",
              company: "Tangier Collections",
              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/happy-satisfied-customer-making-ok-gesture_74855-2298.jpg",
              imageAlt: "Noor Al-Idrissi, Fashion Designer",
            },
            {
              id: "6",
              name: "Karim Bennani",
              role: "Gallery Curator",
              company: "Casablanca Art Spaces",
              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/smiling-man-sitting-cafe-table-gesturing_1262-1141.jpg",
              imageAlt: "Karim Bennani, Gallery Curator",
            },
          ]}
        />
      </div>

      <div id="social-proof" data-section="social-proof">
        <SocialProofOne
          title="Trusted by Premium Brands"
          description="Atwab Al Hjaji fabrics are chosen by leading interior designers, luxury hotels, and premium boutiques across Morocco and beyond."
          tag="Industry Partners"
          tagIcon={Badge}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          names={[
            "Marrakech Luxury Homes",
            "Fez Premium Décor",
            "Atlas Hotel Group",
            "Modern Maroc Design",
            "Tangier Collections",
            "Casablanca Art Spaces",
            "Essaouira Boutiques",
          ]}
          speed={40}
          showCard={true}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoEmphasis logoText="Atwab Al Hjaji" columns={footerColumns} />
      </div>
    </ThemeProvider>
  );
}