"use client"
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
import MediaSplitTabsAbout from '@/components/sections/about/MediaSplitTabsAbout';
import FeatureCardEight from '@/components/sections/feature/FeatureCardEight';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import MetricCardSix from '@/components/sections/metrics/MetricCardSix';
import TestimonialCardEleven from '@/components/sections/testimonial/TestimonialCardEleven';
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import { Building2, Compass, Star, Home, TrendingUp, ThumbsUp, Award, Phone } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="icon-arrow"
      defaultTextAnimation="background-highlight"
      borderRadius="sharp"
      contentWidth="medium"
      sizing="largeSmallSizeLargeTitles"
      background="floatingGradient"
      cardStyle="gradient-mesh"
      primaryButtonStyle="shadow"
      secondaryButtonStyle="layered"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          brandName="Luxe Properties Dubai"
          navItems={[
            { name: "Properties", id: "properties" },
            { name: "About", id: "about" },
            { name: "Process", id: "process" },
            { name: "Testimonials", id: "testimonials" },
            { name: "Contact", id: "contact" }
          ]}
          button={{
            text: "Schedule Tour",            href: "contact"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboardScroll
          title="Discover Luxury Living in Dubai"
          description="Explore Dubai's most exclusive properties with expert guidance. Find your perfect home in the world's most dynamic real estate market."
          tag="Premium Real Estate"
          tagIcon={Building2}
          imageSrc="https://img.b2bpic.net/free-photo/luxury-architecture-exterior-design_23-2151920931.jpg"
          imageAlt="Luxury penthouse with city skyline view"
          buttons={[
            { text: "Explore Properties", href: "properties" },
            { text: "Contact Specialist", href: "contact" }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <MediaSplitTabsAbout
          title="Why Choose Luxe Properties Dubai"
          description="With over 15 years of expertise in Dubai's luxury real estate market, we deliver unmatched service and premium property solutions."
          tabs={[
            {
              id: "expertise",              label: "Market Expertise",              description: "Our team possesses deep knowledge of Dubai's neighborhoods, price trends, and investment opportunities. We guide clients through every market nuance to ensure optimal decisions."
            },
            {
              id: "service",              label: "Personalized Service",              description: "From initial consultation to property handover, we provide white-glove service tailored to your specific needs and investment goals."
            },
            {
              id: "network",              label: "Exclusive Access",              description: "Access to off-market luxury properties, pre-launch opportunities, and exclusive Dubai real estate through our extensive network of developers and sellers."
            }
          ]}
          imageSrc="https://img.b2bpic.net/free-photo/cheerful-business-team-watching-presentation-laptop-sitting-workplace-staring-display-smiling-copy-space-business-meeting-concept_74855-11583.jpg"
          imageAlt="Professional real estate team in office"
          imagePosition="right"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="process" data-section="process">
        <FeatureCardEight
          title="Your Property Investment Journey"
          description="We streamline the real estate process into simple, manageable steps designed for your success."
          tag="Four-Step Process"
          tagIcon={Compass}
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          features={[
            {
              id: 1,
              title: "Consultation & Assessment",              description: "We understand your needs, budget, and investment objectives through comprehensive consultation to identify ideal properties.",              imageSrc: "https://img.b2bpic.net/free-photo/urban-working-lights-complex-wonderful_1122-1692.jpg",              imageAlt: "Consultation meeting with real estate agent"
            },
            {
              id: 2,
              title: "Property Viewing & Evaluation",              description: "Experience curated property viewings with detailed analysis of location, amenities, market value, and future appreciation potential.",              imageSrc: "https://img.b2bpic.net/free-photo/glass-skyscraper-against-blue-sky-view-from-bottom_93675-134753.jpg",              imageAlt: "Professional property tour"
            },
            {
              id: 3,
              title: "Documentation & Negotiation",              description: "We handle all legal documentation, negotiate on your behalf, and ensure transparent transactions with Dubai Land Department compliance.",              imageSrc: "https://img.b2bpic.net/free-photo/skyscrapers-from-low-angle-view_1359-1073.jpg",              imageAlt: "Property handover and key delivery"
            },
            {
              id: 4,
              title: "Investment Growth Support",              description: "Post-purchase support including property management guidance, rental optimization strategies, and future investment opportunities.",              imageSrc: "https://img.b2bpic.net/free-photo/futuristic-cityspace-night_116348-69.jpg",              imageAlt: "Investment growth and returns visualization"
            }
          ]}
        />
      </div>

      <div id="properties" data-section="properties">
        <ProductCardFour
          title="Featured Properties"
          description="Handpicked luxury properties representing the finest real estate opportunities in Dubai."
          tag="Exclusive Listings"
          tagIcon={Star}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          products={[
            {
              id: "prop-1",              name: "Palm Jumeirah Penthouse",              price: "AED 12,500,000",              variant: "4 Beds • 5,200 sqft • Sea View",              imageSrc: "https://img.b2bpic.net/free-photo/modern-interior-architecture-tokyo-international-forum_326561-8.jpg",              imageAlt: "Luxury penthouse interior with modern design"
            },
            {
              id: "prop-2",              name: "Downtown Dubai Luxury Apartment",              price: "AED 8,750,000",              variant: "3 Beds • 3,800 sqft • Burj Khalifa View",              imageSrc: "https://img.b2bpic.net/free-photo/futuristic-landscape-dubai_23-2151339807.jpg",              imageAlt: "Modern villa with contemporary architecture"
            },
            {
              id: "prop-3",              name: "Emirates Hills Villa",              price: "AED 15,200,000",              variant: "5 Beds • 8,100 sqft • Golf Course View",              imageSrc: "https://img.b2bpic.net/free-photo/building-with-modern-design_1127-2238.jpg",              imageAlt: "Master bedroom with luxury finishes"
            },
            {
              id: "prop-4",              name: "Marina Waterfront Residence",              price: "AED 6,900,000",              variant: "2 Beds • 2,600 sqft • Marina View",              imageSrc: "https://img.b2bpic.net/free-photo/luxury-architecture-exterior-design_23-2151920926.jpg",              imageAlt: "High-rise apartment with city skyline view"
            }
          ]}
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardSix
          title="Our Track Record"
          description="Proven success in Dubai's competitive luxury real estate market."
          textboxLayout="default"
          useInvertedBackground="invertCard"
          gridVariant="uniform-all-items-equal"
          animationType="scale-rotate"
          metrics={[
            {
              id: "1",              value: "850+",              tag: "Properties Sold",              tagIcon: Home,
              title: "Successful transactions completed"
            },
            {
              id: "2",              value: "2.4B",              tag: "AED Transacted",              tagIcon: TrendingUp,
              title: "Total property value managed"
            },
            {
              id: "3",              value: "98%",              tag: "Client Satisfaction",              tagIcon: ThumbsUp,
              title: "Repeat and referral business rate"
            },
            {
              id: "4",              value: "15+",              tag: "Years Experience",              tagIcon: Award,
              title: "In Dubai real estate market"
            }
          ]}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardEleven
          title="What Our Clients Say"
          description="Real stories from satisfied property investors and homeowners in Dubai."
          tag="Client Success"
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          testimonials={[
            {
              id: "1",              nameTitle: "Ahmed Al Maktoum, Business Executive",              quote: "Luxe Properties Dubai transformed my property search into a seamless experience. Their expertise in Dubai's market and personalized approach helped me find the perfect investment property. Highly recommended!",              imageSrc: "https://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1649.jpg",              imageAlt: "Ahmed Al Maktoum, satisfied client"
            },
            {
              id: "2",              nameTitle: "Sophia Martinez, International Investor",              quote: "As a foreign investor, I was uncertain about Dubai's real estate process. The team guided me through every step with transparency and professionalism. My property has already appreciated significantly.",              imageSrc: "https://img.b2bpic.net/free-photo/man-portrait-posing-loft-modern-space_158595-5369.jpg",              imageAlt: "Sophia Martinez, international client"
            },
            {
              id: "3",              nameTitle: "James & Caroline Wilson, Expatriate Family",              quote: "We moved to Dubai for work and needed a home quickly. Luxe Properties found us the perfect villa within our timeline and budget. Their service didn't end at purchase—they continue to support our rental management.",              imageSrc: "https://img.b2bpic.net/free-photo/portrait-grey-haired-businessman-standing_74855-10324.jpg",              imageAlt: "James and Caroline Wilson with new home"
            },
            {
              id: "4",              nameTitle: "Mohammed Hassan, Real Estate Developer",              quote: "Working with Luxe Properties as a partner has been excellent. Their network, credibility, and sales acumen move properties quickly and fairly. We trust them completely with our premium projects.",              imageSrc: "https://img.b2bpic.net/free-photo/man-portrait-posing-loft-modern-space_158595-5365.jpg",              imageAlt: "Mohammed Hassan, developer partner"
            },
            {
              id: "5",              nameTitle: "Priya Sharma, Entrepreneur",              quote: "I invested in multiple properties through them over three years. Their market insight and investment strategy recommendations have been invaluable for my portfolio growth.",              imageSrc: "https://img.b2bpic.net/free-photo/portrait-confident-businessman_1098-21013.jpg",              imageAlt: "Priya Sharma, successful investor"
            },
            {
              id: "6",              nameTitle: "David Chen, Corporate Relocation",              quote: "The level of service was exceptional. They understood my corporate relocation timeline and delivered a luxury apartment that exceeded expectations. Best real estate experience I've had.",              imageSrc: "https://img.b2bpic.net/free-photo/portrait-successful-young-businessman-with-his-arms-crossed-looking-camera_23-2148176207.jpg",              imageAlt: "David Chen, corporate client"
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCenter
          tag="Get In Touch"
          title="Ready to Find Your Dream Property?"
          description="Schedule a consultation with our real estate specialists to explore exclusive properties tailored to your investment goals."
          tagIcon={Phone}
          useInvertedBackground="invertCard"
          inputPlaceholder="your@email.com"
          buttonText="Contact Specialist"
          termsText="We'll reach out within 24 hours. Your privacy is guaranteed. We never share client information."
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBaseCard
          logoText="Luxe Properties Dubai"
          columns={[
            {
              title: "Properties",              items: [
                { label: "Featured Listings", href: "#properties" },
                { label: "Investment Opportunities", href: "#properties" },
                { label: "Market Updates", href: "#" },
                { label: "Price Guide", href: "#" }
              ]
            },
            {
              title: "Company",              items: [
                { label: "About Us", href: "#about" },
                { label: "Our Process", href: "#process" },
                { label: "Team", href: "#" },
                { label: "Blog", href: "#" }
              ]
            },
            {
              title: "Resources",              items: [
                { label: "Buyer's Guide", href: "#" },
                { label: "Investment Guide", href: "#" },
                { label: "Market Reports", href: "#" },
                { label: "FAQ", href: "#" }
              ]
            },
            {
              title: "Contact",              items: [
                { label: "Schedule Tour", href: "#contact" },
                { label: "Phone: +971 4 XXX XXXX", href: "tel:+971400000000" },
                { label: "Email: info@luxeproperties.ae", href: "mailto:info@luxeproperties.ae" },
                { label: "Office Locations", href: "#" }
              ]
            }
          ]}
          copyrightText="© 2025 Luxe Properties Dubai. All rights reserved."
        />
      </div>
    </ThemeProvider>
  );
}