"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
import ContactSplit from "@/components/sections/contact/ContactSplit";
import FaqBase from "@/components/sections/faq/FaqBase";
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
import { Mail, HelpCircle, Badge } from "lucide-react";

export default function ContactPage() {
  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: "/" },
      ],
    },
  ];

  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="contact-newsletter" data-section="contact-newsletter">
        <ContactSplit
          tag="Newsletter"
          title="Stay Connected with Atwab Al Hjaji"
          description="Subscribe to receive exclusive fabric releases, design inspiration from Morocco, and special offers for new collections."
          tagIcon={Mail}
          tagAnimation="slide-up"
          background={{ variant: "sparkles-gradient" }}
          useInvertedBackground={false}
          imageSrc="http://img.b2bpic.net/free-vector/abstract-pattern-design_1010-595.jpg?_wi=2"
          imageAlt="Moroccan geometric pattern"
          mediaAnimation="slide-up"
          mediaPosition="right"
          inputPlaceholder="Enter your email address"
          buttonText="Subscribe"
          termsText="We respect your privacy. Unsubscribe at any time. No spam, only curated fabric collections and design tips."
        />
      </div>

      <div id="contact-faq" data-section="contact-faq">
        <FaqBase
          title="Contact & Support"
          description="Answers to common questions about reaching our team and getting support."
          tag="Help"
          tagIcon={HelpCircle}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          faqsAnimation="slide-up"
          faqs={[
            {
              id: "1",
              title: "How can I contact Atwab Al Hjaji?",
              content: "You can reach us via WhatsApp for direct communication, email for detailed inquiries, or visit our physical locations in Morocco. Our team responds within 24 hours.",
            },
            {
              id: "2",
              title: "Do you offer custom fabric orders?",
              content: "Yes! We specialize in custom orders for large projects. Contact our team with your specifications, and we'll provide detailed pricing and timelines.",
            },
            {
              id: "3",
              title: "What are your bulk pricing options?",
              content: "We offer competitive bulk pricing for orders of 50+ meters. Contact us directly via WhatsApp or email to discuss your project needs and get a custom quote.",
            },
          ]}
        />
      </div>

      <div id="contact-partners" data-section="contact-partners">
        <SocialProofOne
          title="Industry Partnerships"
          description="Trusted by leading design professionals and premium brands across Morocco and the region."
          tag="Our 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>
  );
}