"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
import ContactFaq from '@/components/sections/contact/ContactFaq';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import { Sparkles, Phone } from "lucide-react";

export default function PropertyPage() {
  return (
    <ThemeProvider
      defaultButtonVariant={"text-stagger"}
      defaultTextAnimation={"background-highlight"}
      borderRadius={"rounded"}
      contentWidth={"smallMedium"}
      sizing={"mediumSizeLargeTitles"}
      background={"aurora"}
      cardStyle={"glass-depth"}
      primaryButtonStyle={"double-inset"}
      secondaryButtonStyle={"radial-glow"}
      headingFontWeight={"medium"}
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          brandName="PropertyHub"
          navItems={[
            { name: "Browse", id: "properties" },
            { name: "About", id: "about" },
            { name: "Testimonials", id: "testimonials" },
            { name: "Contact", id: "contact" }
          ]}
          button={{
            text: "List Property",            href: "#contact"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboard
          title="Find Your Dream Home"
          description="Discover premium properties in the most desirable neighborhoods. Search, filter, and connect with professional agents."
          background={{ variant: "sparkles-gradient" }}
          tag="Premium Listings"
          tagIcon={Sparkles}
          buttons={[
            { text: "Browse Properties", href: "#properties" },
            { text: "Schedule Tour", href: "#contact" }
          ]}
          imageSrc="https://img.b2bpic.net/free-photo/design-house-modern-villa-with-open-plan-living-private-bedroom-wing-large-terrace-with-privacy_1258-169750.jpg"
          imageAlt="Luxury modern home"
        />
      </div>

      <div id="search-filters" data-section="search-filters">
        <FeatureCardNineteen
          title="Advanced Search & Filters"
          description="Narrow down your search with powerful filtering options"
          features={[
            {
              id: 1,
              tag: "Price Range",              title: "Set Your Budget",              subtitle: "Filter by minimum and maximum price points",              description: "Easily find properties within your budget range. Our intelligent filter system allows you to set custom price parameters from $100k to $10M+.",              imageSrc: "https://img.b2bpic.net/free-photo/swimming-pool-beach-luxury-hotel-type-entertainment-complex-amara-dolce-vita-luxury-hotel-resort-tekirova-kemer-turkey_146671-18719.jpg",              imageAlt: "Budget filtering interface"
            },
            {
              id: 2,
              tag: "Location",              title: "Choose Your Neighborhood",              subtitle: "Filter by area, city, or district",              description: "Explore properties in specific neighborhoods. Filter by commute time, school districts, amenities, and local features that matter to you.",              imageSrc: "https://img.b2bpic.net/free-photo/relax-house-thai-style_1150-17982.jpg",              imageAlt: "Location filtering on map"
            },
            {
              id: 3,
              tag: "Property Type",              title: "Select Property Type",              subtitle: "Apartments, houses, villas, and more",              description: "Choose from various property types including residential apartments, single-family homes, luxury villas, commercial spaces, and mixed-use properties.",              imageSrc: "https://img.b2bpic.net/free-photo/cool-staircase-with-lights-modern-building_181624-20967.jpg",              imageAlt: "Property type selection"
            },
            {
              id: 4,
              tag: "Amenities",              title: "Find Your Ideal Features",              subtitle: "Swimming pool, garage, garden, gym, etc.",              description: "Filter by specific amenities and features. Select from pools, parking, gardens, fitness centers, security systems, and more.",              imageSrc: "https://img.b2bpic.net/free-photo/black-metal-railings-white-concrete-building_250224-12.jpg",              imageAlt: "Amenities filtering options"
            }
          ]}
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="properties" data-section="properties">
        <ProductCardOne
          title="Featured Properties"
          description="Browse our curated selection of premium listings"
          products={[
            {
              id: "1",              name: "Luxury Downtown Penthouse",              price: "$2,450,000",              imageSrc: "https://img.b2bpic.net/free-photo/swimming-pool-beach-luxury-hotel-type-entertainment-complex-amara-dolce-vita-luxury-hotel-resort-tekirova-kemer-turkey_146671-18719.jpg",              imageAlt: "Modern penthouse with city views"
            },
            {
              id: "2",              name: "Waterfront Villa Estate",              price: "$3,200,000",              imageSrc: "https://img.b2bpic.net/free-photo/relax-house-thai-style_1150-17982.jpg",              imageAlt: "Elegant waterfront villa"
            },
            {
              id: "3",              name: "Contemporary Home",              price: "$1,850,000",              imageSrc: "https://img.b2bpic.net/free-photo/cool-staircase-with-lights-modern-building_181624-20967.jpg",              imageAlt: "Modern residential property"
            },
            {
              id: "4",              name: "Suburban Family Home",              price: "$950,000",              imageSrc: "https://img.b2bpic.net/free-photo/black-metal-railings-white-concrete-building_250224-12.jpg",              imageAlt: "Spacious family residence"
            },
            {
              id: "5",              name: "Beachfront Property",              price: "$2,100,000",              imageSrc: "https://img.b2bpic.net/free-photo/beautiful-shot-resort-lanzarote-spain-sunny-day_181624-23163.jpg",              imageAlt: "Beautiful beachfront home"
            }
          ]}
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="map-integration" data-section="map-integration">
        <MetricSplitMediaAbout
          tag="Map Integration"
          title="Find Properties by Location"
          description="Explore our interactive map interface to discover properties in your preferred areas. Filter by neighborhood, commute time, and nearby amenities for a comprehensive location-based property search experience."
          metrics={[
            { value: "500+", title: "Active Listings" },
            { value: "95%", title: "Client Satisfaction" }
          ]}
          imageSrc="https://img.b2bpic.net/free-photo/close-up-toys-accessories-tourist_23-2148232449.jpg"
          imageAlt="Interactive property map"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardFive
          title="What Our Clients Say"
          description="Real experiences from satisfied homebuyers and sellers"
          testimonials={[
            {
              id: "1",              name: "Sarah Johnson, Homebuyer",              date: "Date: 15 December 2024",              title: "Found our perfect home!",              quote: "PropertyHub made the entire home search process seamless. The advanced filters helped us narrow down from hundreds of listings to our dream home in just two weeks.",              tag: "Buyer",              avatarSrc: "https://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg",              imageSrc: "https://img.b2bpic.net/free-photo/swimming-pool-beach-luxury-hotel-type-entertainment-complex-amara-dolce-vita-luxury-hotel-resort-tekirova-kemer-turkey_146671-18719.jpg"
            },
            {
              id: "2",              name: "Michael Chen, Property Seller",              date: "Date: 20 November 2024",              title: "Sold in record time",              quote: "The professional listing presentation and wide audience reach helped us sell our property 3 weeks ahead of schedule at our asking price.",              tag: "Seller",              avatarSrc: "https://img.b2bpic.net/free-photo/smiling-homosexual-man-official-suit-looking-camera-close-up-shot-happy-gay-getting-dressed-wedding-ceremony-standing-hotel-room-with-his-partner-background-love-emotion-concept_74855-22675.jpg",              imageSrc: "https://img.b2bpic.net/free-photo/relax-house-thai-style_1150-17982.jpg"
            },
            {
              id: "3",              name: "Emily Rodriguez, Investor",              date: "Date: 08 October 2024",              title: "Investment opportunity finder",              quote: "The map integration and detailed property data have been invaluable for our investment portfolio. We've acquired 5 properties through PropertyHub.",              tag: "Investor",              avatarSrc: "https://img.b2bpic.net/free-photo/close-up-competitive-employee_1098-2870.jpg",              imageSrc: "https://img.b2bpic.net/free-photo/cool-staircase-with-lights-modern-building_181624-20967.jpg"
            },
            {
              id: "4",              name: "David Kim, First-time Buyer",              date: "Date: 25 September 2024",              title: "Expert guidance throughout",              quote: "As a first-time homebuyer, I appreciated the transparent pricing and helpful agents. PropertyHub made me feel confident throughout the entire purchase process.",              tag: "Buyer",              avatarSrc: "https://img.b2bpic.net/free-photo/positive-confident-businessman-posing-outside_74855-1183.jpg",              imageSrc: "https://img.b2bpic.net/free-photo/black-metal-railings-white-concrete-building_250224-12.jpg"
            }
          ]}
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="cta" data-section="cta">
        <ContactFaq
          ctaTitle="Ready to Get Started?"
          ctaDescription="Contact our team of expert agents to schedule a property tour or list your home."
          ctaButton={{
            text: "Schedule Consultation",            href: "#contact"
          }}
          ctaIcon={Phone}
          faqs={[
            {
              id: "1",              title: "How do I schedule a property tour?",              content: "You can schedule a tour directly through any property listing by clicking the 'Schedule Tour' button, or contact our team at (555) 123-4567. Tours are typically available within 24-48 hours."
            },
            {
              id: "2",              title: "What are your commission rates?",              content: "Our commission rates are competitive and negotiable. Typically we charge 2.5-3% for buyers and 2.5-3% for sellers. Schedule a consultation to discuss rates specific to your property."
            },
            {
              id: "3",              title: "How long does it take to sell a property?",              content: "On average, properties sell within 30-45 days on our platform. However, this varies by location, price point, and market conditions. We'll provide a custom market analysis."
            },
            {
              id: "4",              title: "Do you offer financing assistance?",              content: "While we don't provide financing directly, we have partnerships with leading mortgage lenders and can connect you with pre-qualified loan officers to discuss options."
            }
          ]}
          useInvertedBackground="noInvert"
          animationType="slide-up"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterSimple
          columns={[
            {
              title: "Browse",              items: [
                { label: "All Properties", href: "#properties" },
                { label: "New Listings", href: "#properties" },
                { label: "Open Houses", href: "#properties" },
                { label: "Price Guides", href: "#" }
              ]
            },
            {
              title: "Company",              items: [
                { label: "About Us", href: "#about" },
                { label: "Our Agents", href: "#" },
                { label: "Careers", href: "#" },
                { label: "Blog", href: "#" }
              ]
            },
            {
              title: "Support",              items: [
                { label: "Contact Us", href: "#contact" },
                { label: "FAQ", href: "#" },
                { label: "Help Center", href: "#" },
                { label: "Support", href: "#" }
              ]
            },
            {
              title: "Legal",              items: [
                { label: "Privacy Policy", href: "#" },
                { label: "Terms of Service", href: "#" },
                { label: "Cookie Policy", href: "#" }
              ]
            }
          ]}
          bottomLeftText="© 2025 PropertyHub. All rights reserved."
          bottomRightText="Your trusted real estate partner"
        />
      </div>
    </ThemeProvider>
  );
}