"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import HeroOverlay from "@/components/sections/hero/HeroOverlay";
import ProductCardOne from "@/components/sections/product/ProductCardOne";
import AboutMetric from "@/components/sections/about/AboutMetric";
import TestimonialCardSix from "@/components/sections/testimonial/TestimonialCardSix";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
import { Award, CheckCircle, Globe, Sparkles } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="expand-hover"
      defaultTextAnimation="entrance-slide"
      borderRadius="pill"
      contentWidth="mediumLarge"
      sizing="mediumLargeSizeMediumTitles"
      background="fluid"
      cardStyle="glass-depth"
      primaryButtonStyle="flat"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          brandName="Chronos"
          navItems={[
            { name: "Collections", id: "products" },
            { name: "About", id: "about" },
            { name: "Testimonials", id: "testimonials" },
            { name: "Contact", id: "contact" }
          ]}
          button={{ text: "Shop Now", href: "products" }}
          animateOnLoad={true}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroOverlay
          title="Timeless Elegance"
          description="Discover our curated collection of luxury watches, meticulously crafted to define sophistication and precision."
          tag="Premium Collection"
          imageSrc="http://img.b2bpic.net/free-photo/businessman-looking-his-watch-closeup_53876-176905.jpg?_wi=1"
          imageAlt="Luxury watch collection"
          textPosition="bottom-left"
          showBlur={true}
          showDimOverlay={false}
          buttons={[
            { text: "Explore Collection", href: "products" },
            { text: "Learn More", href: "about" }
          ]}
        />
      </div>

      <div id="products" data-section="products">
        <ProductCardOne
          title="Signature Collection"
          description="Handpicked timepieces that embody luxury and precision engineering."
          tag="Featured"
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground={false}
          gridVariant="three-columns-all-equal-width"
          products={[
            {
              id: "1",              name: "Elegancia Pro",              price: "$4,850",              imageSrc: "http://img.b2bpic.net/free-photo/businessman-looking-his-watch-closeup_53876-176905.jpg?_wi=2",              imageAlt: "Elegancia Pro luxury watch"
            },
            {
              id: "2",              name: "Chronos Steel",              price: "$3,650",              imageSrc: "http://img.b2bpic.net/free-photo/modern-black-watch-wrist-man-sitting-car_181624-58251.jpg",              imageAlt: "Chronos Steel premium watch"
            },
            {
              id: "3",              name: "Heritage Classic",              price: "$5,200",              imageSrc: "http://img.b2bpic.net/free-photo/businessman-looking-his-watch-closeup_53876-176905.jpg?_wi=3",              imageAlt: "Heritage Classic dress watch"
            }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <AboutMetric
          title="Crafted with purpose. Worn with passion. A legacy of refined watchmaking since 1985."
          useInvertedBackground={true}
          metricsAnimation="slide-up"
          metrics={[
            { icon: Award, label: "Years of Expertise", value: "40+" },
            { icon: Globe, label: "Collectors Worldwide", value: "15,000+" },
            { icon: Sparkles, label: "Premium Models", value: "120+" },
            { icon: CheckCircle, label: "Satisfaction Guarantee", value: "100%" }
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardSix
          title="Loved by Watch Enthusiasts"
          description="Hear from collectors and connoisseurs who trust Chronos for their timepiece journey."
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground={false}
          testimonials={[
            {
              id: "1",              name: "Marcus Sterling",              handle: "@marcusw_collector",              testimonial: "The attention to detail and quality is unmatched. Chronos has become my trusted source for authentic luxury watches.",              imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=1",              imageAlt: "Marcus Sterling"
            },
            {
              id: "2",              name: "Elena Rossi",              handle: "@elenatimekeeper",              testimonial: "Exceptional service and an exquisite collection. Every piece tells a story of precision and craftsmanship.",              imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=2",              imageAlt: "Elena Rossi"
            },
            {
              id: "3",              name: "David Chen",              handle: "@davidcollects",              testimonial: "From classic dress watches to modern sports models, the curation is impeccable. Highly recommended.",              imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=3",              imageAlt: "David Chen"
            },
            {
              id: "4",              name: "Sophie Laurent",              handle: "@sophieuxury",              testimonial: "The minimalist aesthetic of Chronos' store reflects the elegance of their collection. A truly refined experience.",              imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=4",              imageAlt: "Sophie Laurent"
            },
            {
              id: "5",              name: "James Mitchell",              handle: "@jamestiming",              testimonial: "Outstanding craftsmanship and authentic timepieces. Chronos is my go-to for investment-grade watches.",              imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=5",              imageAlt: "James Mitchell"
            },
            {
              id: "6",              name: "Victoria Wu",              handle: "@victoriawatches",              testimonial: "Impeccable presentation, premium selection, and world-class customer service. Exactly what luxury deserves.",              imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=6",              imageAlt: "Victoria Wu"
            }
          ]}
          speed={40}
        />
      </div>

      <div id="contact" data-section="contact">
        <div className="mx-auto px-4 md:px-6 py-24 text-center">
          <h2 className="text-4xl md:text-5xl font-bold mb-4">Get in Touch</h2>
          <p className="text-lg text-gray-600 max-w-2xl mx-auto">Have questions about our collection? We'd love to hear from you.</p>
        </div>
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoReveal
          logoText="Chronos"
          leftLink={{ text: "Privacy Policy", href: "#" }}
          rightLink={{ text: "Terms of Service", href: "#" }}
        />
      </div>
    </ThemeProvider>
  );
}
