"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
import ProductCardFour from "@/components/sections/product/ProductCardFour";
import FaqBase from "@/components/sections/faq/FaqBase";
import FooterSimple from "@/components/sections/footer/FooterSimple";
import {
  HelpCircle,
} from "lucide-react";
import Link from "next/link";

export default function CollectionsPage() {
  const navItems = [
    { name: "Home", id: "home" },
    { name: "Streetwear", id: "streetwear" },
    { name: "Casuals", id: "casuals" },
    { name: "Specials", id: "specials" },
    { name: "Collections", id: "collections" },
    { name: "About", id: "about" },
  ];

  const footerColumns = [
    {
      title: "Shop",
      items: [
        { label: "Streetwear", href: "#streetwear" },
        { label: "Casuals", href: "#casuals" },
        { label: "Specials", href: "#specials" },
        { label: "Seasonal Drops", href: "#seasonal" },
        { label: "New Arrivals", href: "#new" },
      ],
    },
    {
      title: "Company",
      items: [
        { label: "About Us", href: "/collections" },
        { label: "Our Story", href: "#story" },
        { label: "Careers", href: "#careers" },
        { label: "Press", href: "#press" },
        { label: "Blog", href: "#blog" },
      ],
    },
    {
      title: "Support",
      items: [
        { label: "Contact Us", href: "#contact" },
        { label: "FAQ", href: "#faq" },
        { label: "Shipping Info", href: "#shipping" },
        { label: "Returns", href: "#returns" },
        { label: "Track Order", href: "#track" },
      ],
    },
    {
      title: "Legal",
      items: [
        { label: "Privacy Policy", href: "#privacy" },
        { label: "Terms of Service", href: "#terms" },
        { label: "Refund Policy", href: "#refund" },
        { label: "Cookie Policy", href: "#cookies" },
        { label: "Accessibility", href: "#accessibility" },
      ],
    },
  ];

  return (
    <ThemeProvider
      defaultButtonVariant="hover-bubble"
      defaultTextAnimation="entrance-slide"
      borderRadius="soft"
      contentWidth="mediumSmall"
      sizing="mediumLargeSizeMediumTitles"
      background="aurora"
      cardStyle="soft-shadow"
      primaryButtonStyle="shadow"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav" className="mx-auto px-4 md:px-6">
        <NavbarStyleFullscreen
          navItems={navItems}
          brandName="DripDrop"
          bottomLeftText="Luxury Fashion Curator"
          bottomRightText="hello@dripdrop.com"
        />
      </div>

      <div id="streetwear-collection" data-section="streetwear-collection" className="mx-auto px-4 md:px-6">
        <ProductCardFour
          title="Streetwear Collection"
          description="Premium streetwear pieces that blend luxury with urban style. From oversized hoodies to tailored jackets, each item is curated for the modern fashion enthusiast."
          tag="PREMIUM STREETWEAR"
          tagAnimation="slide-up"
          buttons={[{ text: "Back to Home", href: "/" }]}
          buttonAnimation="blur-reveal"
          textboxLayout="default"
          useInvertedBackground={false}
          gridVariant="bento-grid"
          animationType="slide-up"
          products={[
            {
              id: "street-1",
              name: "Premium Black Hoodie",
              price: "₹8,999",
              variant: "Luxury Streetwear",
              imageSrc:
                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B9da18ZzGfu5qtsyVlZQDXliWw/a-high-end-designer-hoodie-in-black-with-1773905420917-6167dd9c.png?_wi=3",
              imageAlt: "Premium black luxury hoodie",
            },
            {
              id: "street-2",
              name: "Designer Jacket",
              price: "₹15,499",
              variant: "Exclusive Outerwear",
              imageSrc:
                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B9da18ZzGfu5qtsyVlZQDXliWw/a-luxury-designer-jacket-or-outerwear-pi-1773905419357-a4758cb0.png?_wi=3",
              imageAlt: "Premium designer jacket",
            },
            {
              id: "street-3",
              name: "Exclusive Summer Collection T-Shirt",
              price: "₹4,999",
              variant: "Limited Edition",
              imageSrc:
                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B9da18ZzGfu5qtsyVlZQDXliWw/a-premium-t-shirt-or-casual-shirt-in-a-l-1773905419262-62043441.png?_wi=3",
              imageAlt: "Trending luxury t-shirt",
            },
            {
              id: "street-4",
              name: "Premium Tailored Trousers",
              price: "₹9,999",
              variant: "Seasonal Drop",
              imageSrc:
                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B9da18ZzGfu5qtsyVlZQDXliWw/a-luxury-pair-of-pants-or-trousers-in-a--1773905419958-31e31783.png?_wi=3",
              imageAlt: "Premium tailored trousers",
            },
            {
              id: "street-5",
              name: "Designer Sneakers",
              price: "₹11,499",
              variant: "Exclusive Footwear",
              imageSrc:
                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B9da18ZzGfu5qtsyVlZQDXliWw/a-luxury-sneaker-or-footwear-item-in-a-p-1773905419919-e94895b9.png?_wi=3",
              imageAlt: "Premium designer sneakers",
            },
          ]}
          ariaLabel="Streetwear collection products"
        />
      </div>

      <div id="casual-collection" data-section="casual-collection" className="mx-auto px-4 md:px-6">
        <ProductCardFour
          title="Casual Collection"
          description="Elevated everyday wear that combines comfort with premium quality. Perfect for those who appreciate understated luxury in their daily wardrobe."
          tag="EVERYDAY LUXURY"
          tagAnimation="slide-up"
          buttons={[{ text: "View All", href: "#" }]}
          buttonAnimation="blur-reveal"
          textboxLayout="default"
          useInvertedBackground={false}
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          products={[
            {
              id: "casual-1",
              name: "Premium Casual Shirt",
              price: "₹5,499",
              variant: "Versatile Collection",
              imageSrc:
                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B9da18ZzGfu5qtsyVlZQDXliWw/a-premium-t-shirt-or-casual-shirt-in-a-l-1773905419262-62043441.png?_wi=4",
              imageAlt: "Premium casual luxury shirt",
            },
            {
              id: "casual-2",
              name: "Luxury Trousers",
              price: "₹10,999",
              variant: "Premium Selection",
              imageSrc:
                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B9da18ZzGfu5qtsyVlZQDXliWw/a-luxury-pair-of-pants-or-trousers-in-a--1773905419958-31e31783.png?_wi=4",
              imageAlt: "Premium luxury trousers",
            },
            {
              id: "casual-3",
              name: "Luxury Belt & Accessories",
              price: "₹6,999",
              variant: "Statement Collection",
              imageSrc:
                "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3B9da18ZzGfu5qtsyVlZQDXliWw/a-luxury-accessory-or-complementary-fash-1773905419444-022fd6a5.png?_wi=2",
              imageAlt: "Premium luxury accessories",
            },
          ]}
          ariaLabel="Casual collection products"
        />
      </div>

      <div id="faq" data-section="faq" className="mx-auto px-4 md:px-6">
        <FaqBase
          title="Collections FAQ"
          description="Have questions about our collections? We've got answers to help you find the perfect pieces."
          tag="HELP & SUPPORT"
          tagIcon={HelpCircle}
          tagAnimation="slide-up"
          buttons={[{ text: "Contact Support", href: "#contact" }]}
          buttonAnimation="blur-reveal"
          textboxLayout="default"
          useInvertedBackground={false}
          faqsAnimation="blur-reveal"
          faqs={[
            {
              id: "coll-faq-1",
              title: "What makes our collections special?",
              content:
                "Each collection is carefully curated by our expert stylists, featuring pieces from the world's most exclusive luxury brands. We focus on quality, exclusivity, and timeless style that transcends seasonal trends.",
            },
            {
              id: "coll-faq-2",
              title: "How often are new collections released?",
              content:
                "We release new collections every month with seasonal drops and limited-edition pieces. Subscribe to our newsletter to stay updated on the latest releases and exclusive previews.",
            },
            {
              id: "coll-faq-3",
              title: "Can I pre-order items?",
              content:
                "Yes! We offer pre-order options for upcoming collections. Pre-order items receive priority processing and exclusive early access to new pieces. Contact our VIP team for details.",
            },
          ]}
          ariaLabel="Collections FAQ section"
        />
      </div>

      <div id="footer" data-section="footer" className="mx-auto px-4 md:px-6">
        <FooterSimple
          columns={footerColumns}
          bottomLeftText="© 2024 DripDrop. All rights reserved. Premium fashion, worldwide."
          bottomRightText="Secure checkout powered by Razorpay & Stripe"
          ariaLabel="Site footer with navigation and legal information"
        />
      </div>
    </ThemeProvider>
  );
}