"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import FeatureHoverPattern from '@/components/sections/feature/featureHoverPattern/FeatureHoverPattern';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
import { Award, Briefcase, Clock, Compass, ShieldCheck, Sparkles, Star, Waves } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="shift-hover"
        defaultTextAnimation="entrance-slide"
        borderRadius="rounded"
        contentWidth="medium"
        sizing="largeSmall"
        background="grid"
        cardStyle="layered-gradient"
        primaryButtonStyle="diagonal-gradient"
        secondaryButtonStyle="layered"
        headingFontWeight="medium"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingOverlay
      navItems={[
        {
          name: "Home",
          id: "hero",
        },
        {
          name: "Fleet",
          id: "fleet",
        },
        {
          name: "Experiences",
          id: "services",
        },
        {
          name: "Contact",
          id: "contact",
        },
      ]}
      brandName="Best Yachts"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroSplitKpi
      background={{
        variant: "gradient-bars",
      }}
      title="Experience Luxury at Sea with Best Yachts"
      description="Exclusive yacht charter experiences across the Turkish Riviera. Discover unparalleled comfort, privacy, and service."
      kpis={[
        {
          value: "20+",
          label: "Luxury Yachts",
        },
        {
          value: "150+",
          label: "Happy Clients",
        },
        {
          value: "10+",
          label: "Years Experience",
        },
      ]}
      enableKpiAnimation={true}
      buttons={[
        {
          text: "Book Now",
          href: "#contact",
        },
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/boats-south-atlantic-ocean-near-shore-florianopolis-brazil_181624-55870.jpg"
      mediaAnimation="blur-reveal"
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/ferry-boat-river-quebec-city-with-blue-sky_649448-2163.jpg",
          alt: "Luxury travel guest",
        },
        {
          src: "http://img.b2bpic.net/free-photo/beautiful-port-view-cannes-france_1268-36269.jpg",
          alt: "Happy yacht client",
        },
        {
          src: "http://img.b2bpic.net/free-photo/beautiful-photo-sea-waves_58702-11199.jpg",
          alt: "Satisfied luxury client",
        },
        {
          src: "http://img.b2bpic.net/free-photo/old-boat-looks-from-water_1304-4624.jpg",
          alt: "Professional crew member",
        },
        {
          src: "http://img.b2bpic.net/free-photo/boat-trip-bali-young-woman-sunglasses-is-sailing-boat-nearby-island_1321-3292.jpg",
          alt: "Yacht charter traveler",
        },
      ]}
      avatarText="Trusted by 500+ premium travelers"
      marqueeItems={[
        {
          type: "text",
          text: "Turkish Riviera Excellence",
        },
        {
          type: "text-icon",
          text: "24/7 Concierge",
          icon: Clock,
        },
        {
          type: "text",
          text: "Private Yacht Charters",
        },
        {
          type: "text-icon",
          text: "Verified Crew",
          icon: ShieldCheck,
        },
        {
          type: "text",
          text: "Luxury Amenities",
        },
      ]}
    />
  </div>

  <div id="fleet" data-section="fleet">
      <ProductCardTwo
      animationType="slide-up"
      textboxLayout="split"
      gridVariant="uniform-all-items-equal"
      useInvertedBackground={false}
      products={[
        {
          id: "1",
          brand: "Luxury",
          name: "Motor Yachts",
          price: "From $500",
          rating: 5,
          reviewCount: "12",
          imageSrc: "http://img.b2bpic.net/free-photo/futuristic-representation-fast-water-vehicle_23-2151048089.jpg",
        },
        {
          id: "2",
          brand: "Exclusive",
          name: "Mega Yachts",
          price: "From $2000",
          rating: 5,
          reviewCount: "8",
          imageSrc: "http://img.b2bpic.net/free-photo/summer-terrace-landscape-wooden-building_1203-4725.jpg",
        },
        {
          id: "3",
          brand: "VIP",
          name: "VIP Yachts",
          price: "From $1200",
          rating: 5,
          reviewCount: "15",
          imageSrc: "http://img.b2bpic.net/free-photo/scenic-view-sandy-beach-beach-with-sun-beds-umbrellas-open-against-sea-mountains-hotel-resort-tekirova-kemer-turkey_146671-18877.jpg",
        },
        {
          id: "4",
          brand: "Lifestyle",
          name: "Party Yachts",
          price: "From $800",
          rating: 4,
          reviewCount: "20",
          imageSrc: "http://img.b2bpic.net/free-photo/successful-stylish-man-dressed-modern-elegant-clothes-sitting-table-outdoor-cafe-against-background-city-wharf_613910-21036.jpg",
        },
        {
          id: "5",
          brand: "Casual",
          name: "Daily Charters",
          price: "From $300",
          rating: 5,
          reviewCount: "40",
          imageSrc: "http://img.b2bpic.net/free-photo/high-angle-shot-roundhouse-park-by-water-captured-toronto-canada_181624-18490.jpg",
        },
        {
          id: "6",
          brand: "Extended",
          name: "Weekly Charters",
          price: "From $5000",
          rating: 5,
          reviewCount: "25",
          imageSrc: "http://img.b2bpic.net/free-photo/marine-parking-boats-yachts-turkey-yacht-docked-sea-port_158595-6950.jpg",
        },
      ]}
      title="Our Exclusive Fleet"
      description="From sophisticated day cruisers to majestic mega yachts."
    />
  </div>

  <div id="services" data-section="services">
      <FeatureHoverPattern
      animationType="slide-up"
      textboxLayout="split"
      useInvertedBackground={true}
      features={[
        {
          icon: Sparkles,
          title: "Yacht Weddings",
          description: "Unforgettable ceremonies with a stunning sea backdrop.",
        },
        {
          icon: Award,
          title: "Birthday Parties",
          description: "Celebrate in style with full DJ setups and catering.",
        },
        {
          icon: Waves,
          title: "Sunset Cruises",
          description: "Experience the magic of Turkish sunsets on water.",
        },
        {
          icon: Star,
          title: "Marriage Proposals",
          description: "Create the perfect moment on private waters.",
        },
        {
          icon: Briefcase,
          title: "Corporate Events",
          description: "Impress your partners with exclusive yacht meetings.",
        },
        {
          icon: Compass,
          title: "VIP Transfers",
          description: "Seamless transition from airport to your private yacht.",
        },
      ]}
      title="Luxury Experiences & Services"
      description="Custom curated events on the Mediterranean sea."
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardFourteen
      useInvertedBackground={false}
      title="Our Global Reach"
      tag="Performance"
      metrics={[
        {
          id: "m1",
          value: "98%",
          description: "Client Satisfaction",
        },
        {
          id: "m2",
          value: "450+",
          description: "Successfully Hosted Events",
        },
        {
          id: "m3",
          value: "24/7",
          description: "Concierge Support",
        },
      ]}
      metricsAnimation="blur-reveal"
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardFive
      textboxLayout="split"
      useInvertedBackground={true}
      testimonials={[
        {
          id: "t1",
          name: "Sarah Johnson",
          date: "Oct 2023",
          title: "Unforgettable",
          quote: "The best experience on the Aegean sea.",
          tag: "Wedding",
          avatarSrc: "http://img.b2bpic.net/free-photo/girl-with-cocktails_1157-8896.jpg",
          imageSrc: "http://img.b2bpic.net/free-photo/boats-south-atlantic-ocean-near-shore-florianopolis-brazil_181624-55870.jpg",
          imageAlt: "happy yacht client portrait",
        },
        {
          id: "t2",
          name: "Michael Chen",
          date: "Sep 2023",
          title: "Luxury defined",
          quote: "Top-tier crew and stunning vessel.",
          tag: "Holiday",
          avatarSrc: "http://img.b2bpic.net/free-photo/young-smiling-happy-man-woman-traveling-bicycles-taking-selfie-photo-phone-camera_285396-655.jpg",
          imageSrc: "http://img.b2bpic.net/free-photo/futuristic-representation-fast-water-vehicle_23-2151048089.jpg",
          imageAlt: "happy yacht client portrait",
        },
        {
          id: "t3",
          name: "Elena Rossi",
          date: "Aug 2023",
          title: "Perfect sunset",
          quote: "The sunset cruise was pure magic.",
          tag: "Couple",
          avatarSrc: "http://img.b2bpic.net/free-photo/tourist-with-binoculars_1385-2747.jpg",
          imageSrc: "http://img.b2bpic.net/free-photo/summer-terrace-landscape-wooden-building_1203-4725.jpg",
          imageAlt: "happy yacht client portrait",
        },
        {
          id: "t4",
          name: "David Smith",
          date: "Jul 2023",
          title: "Professional",
          quote: "Everything went smoothly and elegantly.",
          tag: "Corporate",
          avatarSrc: "http://img.b2bpic.net/free-photo/smiling-middle-aged-woman-showing-ok-sign_1262-17571.jpg",
          imageSrc: "http://img.b2bpic.net/free-photo/scenic-view-sandy-beach-beach-with-sun-beds-umbrellas-open-against-sea-mountains-hotel-resort-tekirova-kemer-turkey_146671-18877.jpg",
          imageAlt: "happy yacht client portrait",
        },
        {
          id: "t5",
          name: "Amina Al-Farsi",
          date: "Jun 2023",
          title: "Exceptional",
          quote: "Best hospitality I have received in Turkey.",
          tag: "Vacation",
          avatarSrc: "http://img.b2bpic.net/free-photo/two-smiling-sisters-looking-camera-doing-frame-by-hands_624325-3173.jpg",
          imageSrc: "http://img.b2bpic.net/free-photo/successful-stylish-man-dressed-modern-elegant-clothes-sitting-table-outdoor-cafe-against-background-city-wharf_613910-21036.jpg",
          imageAlt: "happy yacht client portrait",
        },
      ]}
      title="Client Reviews"
      description="What our guests say about Best Yachts."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqSplitMedia
      textboxLayout="split"
      useInvertedBackground={false}
      faqs={[
        {
          id: "f1",
          title: "What's included in the charter?",
          content: "Our charters include captain, crew, fuel, and premium amenities.",
        },
        {
          id: "f2",
          title: "Can I request catering?",
          content: "Yes, we offer premium catering packages for all yacht types.",
        },
        {
          id: "f3",
          title: "Where is Teos Marina?",
          content: "Located in Seferihisar, İzmir, Turkey. Perfect access to nearby islands.",
        },
        {
          id: "f4",
          title: "How do I book?",
          content: "Use our booking form here or reach out via WhatsApp 24/7.",
        },
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/details-yacht-deck-reflection-sky_72229-283.jpg"
      mediaAnimation="slide-up"
      title="Frequently Asked Questions"
      description="Common inquiries about our luxury charters."
      faqsAnimation="blur-reveal"
    />
  </div>

  <div id="social" data-section="social">
      <SocialProofOne
      textboxLayout="default"
      useInvertedBackground={true}
      names={[
        "Teos Marina",
        "Aegean Yachting",
        "Riviera Luxury",
        "Marine Experts",
        "Turkish Yacht Council",
        "International Maritime",
        "VIP Cruises",
      ]}
      title="Trusted Partners"
      description="Collaborating with premium marine brands and local marinas."
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactCenter
      useInvertedBackground={false}
      background={{
        variant: "gradient-bars",
      }}
      tag="Ready to Sail?"
      title="Book Your Charter Today"
      description="Get an instant quote or reach out on WhatsApp."
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterLogoEmphasis
      columns={[
        {
          items: [
            {
              label: "Motor Yachts",
              href: "#",
            },
            {
              label: "Mega Yachts",
              href: "#",
            },
            {
              label: "Daily Charters",
              href: "#",
            },
          ],
        },
        {
          items: [
            {
              label: "About",
              href: "#",
            },
            {
              label: "Services",
              href: "#",
            },
            {
              label: "Contact",
              href: "#",
            },
          ],
        },
        {
          items: [
            {
              label: "WhatsApp",
              href: "https://wa.me/905356744346",
            },
            {
              label: "Instagram",
              href: "#",
            },
            {
              label: "Teos Marina",
              href: "#",
            },
          ],
        },
      ]}
      logoText="Best Yachts"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
