"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import HeroCarouselLogo from '@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo';
import SplitAboutCards from '@/components/sections/about/SplitAboutCards';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterBaseSocial from '@/components/sections/footer/FooterBaseSocial';
import { Facebook, Globe, Home, Instagram, Linkedin, Twitter, Zap } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-bubble"
      defaultTextAnimation="reveal-blur"
      borderRadius="soft"
      contentWidth="mediumSmall"
      sizing="largeSizeMediumTitles"
      background="aurora"
      cardStyle="elevated"
      primaryButtonStyle="gradient"
      secondaryButtonStyle="glass"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleFullscreen
          brandName="PRIMESTATE"
          navItems={[
            { name: "Properties", id: "properties" },
            { name: "Why Us", id: "about" },
            { name: "Process", id: "process" },
            { name: "Contact", id: "contact" },
            { name: "FAQ", id: "faq" }
          ]}
          bottomLeftText="Premium Real Estate"
          bottomRightText="hello@primestate.com"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroCarouselLogo
          logoText="PRIMESTATE"
          description="Carefully selected properties in prime locations with verified documentation and end-to-end support."
          buttons={[
            { text: "View Properties", href: "properties" },
            { text: "Schedule Tour", href: "contact" }
          ]}
          slides={[
            { 
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767717779085-50vqh5db.jpg", 
              imageAlt: "Luxury apartment interior" 
            },
            { 
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767717788118-n2pwtw3g.jpg", 
              imageAlt: "Modern villa exterior" 
            },
            { 
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767717789967-65mmi17p.jpg", 
              imageAlt: "Penthouse with city view" 
            }
          ]}
          autoplayDelay={5000}
          showDimOverlay={true}
          logoLineHeight={1.15}
          containerClassName="w-full"
          descriptionClassName="text-lg font-medium tracking-wide"
        />
      </div>

      <div id="announcement" data-section="announcement">
        <SplitAboutCards
          title="Trusted by 1,500+ Buyers & Investors"
          description="Only 3 premium units left this quarter • New listings added weekly • Investment opportunities available now"
          tag="URGENT"
          tagIcon={Zap}
          features={[
            {
              id: "verified",              title: "Verified Listings",              description: "100% legal documentation and property verification completed before listing.",              label: "Legal Assured"
            },
            {
              id: "support",              title: "Expert Support",              description: "Dedicated property advisors guide you through every step of the purchase or rental process.",              label: "24/7 Available"
            }
          ]}
          useInvertedBackground="noInvert"
          containerClassName="relative z-10 -mt-12"
          titleClassName="text-2xl font-bold"
          descriptionClassName="text-base font-light leading-relaxed"
        />
      </div>

      <div id="properties" data-section="properties">
        <ProductCardFour
          title="Featured Properties"
          description="Handpicked selection of premium properties across prime locations. View details, schedule tours, and compare options."
          tag="Available Now"
          tagIcon={Home}
          textboxLayout="default"
          animationType="slide-up"
          gridVariant="uniform-all-items-equal"
          useInvertedBackground="invertDefault"
          products={[
            {
              id: "apt-001",              name: "Modern City Apartment",              price: "€450,000",              variant: "3BR • 2BA • 125 sqm",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767717792878-teh4xlyn.jpg",              imageAlt: "Modern city apartment"
            },
            {
              id: "villa-001",              name: "Luxury Suburban Villa",              price: "€750,000",              variant: "4BR • 3BA • 280 sqm",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767717799831-74bn25y0.jpg",              imageAlt: "Luxury villa with garden"
            },
            {
              id: "pent-001",              name: "Downtown Penthouse",              price: "€1,200,000",              variant: "3BR • 2.5BA • 200 sqm",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767717801488-r4xnhpss.jpg",              imageAlt: "Penthouse with city views"
            },
            {
              id: "house-001",              name: "Contemporary Family Home",              price: "€580,000",              variant: "4BR • 3BA • 240 sqm",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767717795700-db580lpa.jpg",              imageAlt: "Contemporary family house"
            },
            {
              id: "studio-001",              name: "Compact City Studio",              price: "€280,000",              variant: "1BR • 1BA • 45 sqm",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767717808918-pqg0utgz.jpg",              imageAlt: "Modern studio apartment"
            },
            {
              id: "town-001",              name: "Premium Townhouse",              price: "€620,000",              variant: "3BR • 2.5BA • 165 sqm",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767718589961-8r2wvb35.jpg",              imageAlt: "Modern townhouse"
            }
          ]}
          containerClassName="w-full"
          cardNameClassName="text-lg font-semibold"
          cardPriceClassName="text-2xl font-bold text-primary-cta"
        />
      </div>

      <div id="about" data-section="about">
        <FeatureCardTwelve
          title="Why Invest With PrimeState"
          description="We handle every aspect of your property journey with transparency, expertise, and verified results."
          tag="Our Difference"
          textboxLayout="default"
          animationType="opacity"
          useInvertedBackground="noInvert"
          features={[
            {
              id: "verification",              label: "Verified",              title: "100% Legal & Verified Properties",              items: [
                "Complete documentation verified",                "Transparent pricing with no hidden fees",                "Title deeds checked by legal experts"
              ]
            },
            {
              id: "process",              label: "Simplified",              title: "Simple 3-Step Process",              items: [
                "Step 1: Choose your property",                "Step 2: Private viewing & due diligence",                "Step 3: Purchase or rental agreement"
              ]
            },
            {
              id: "support",              label: "Dedicated",              title: "Expert Property Advisors",              items: [
                "Personalized property matching",                "End-to-end transaction handling",                "Post-purchase support included"
              ]
            }
          ]}
          containerClassName="w-full"
          titleClassName="text-3xl font-bold"
          descriptionClassName="text-base leading-relaxed"
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardFourteen
          title="Proven track record of successful property transactions across multiple markets with high investor satisfaction."
          tag="Our Impact"
          useInvertedBackground="invertCard"
          metrics={[
            {
              id: "sold",              value: "2,847",              description: "Properties successfully sold or rented to satisfied clients"
            },
            {
              id: "days",              value: "14 days",              description: "Average deal completion time from viewing to closing"
            },
            {
              id: "countries",              value: "12+",              description: "Countries and major cities where we operate"
            },
            {
              id: "roi",              value: "8.5%",              description: "Average annual ROI for our investment properties"
            }
          ]}
          containerClassName="w-full"
          titleClassName="text-2xl font-bold"
          tagClassName="text-sm font-semibold uppercase tracking-wider"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardFifteen
          testimonial="PrimeState made the entire process seamless. From viewing to closing in just 14 days! Highly recommended for serious investors."
          rating={5}
          author="Sarah Mitchell, Investor"
          avatars={[
            { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767707512375-5uxmzsjq.jpg", alt: "Sarah Mitchell" },
            { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767707511590-ys5q268i.jpg", alt: "Michael Chen" },
            { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767707513887-mw7rlupn.jpg", alt: "Emily Rodriguez" },
            { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767707516587-6e5udn4d.jpg", alt: "David Kim" },
            { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767718421030-1af32xl0.jpg", alt: "Jessica Anderson" },
            { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767707514660-4p7l6a6w.jpg", alt: "Robert Thompson" }
          ]}
          useInvertedBackground="noInvert"
          containerClassName="py-20"
          testimonialClassName="text-2xl font-light leading-relaxed"
          avatarGroupClassName="mt-8 justify-center"
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqDouble
          title="Frequently Asked Questions"
          description="Find answers to common questions about our properties, investment process, and legal assurances."
          tag="Help & Guidance"
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          animationType="smooth"
          faqs={[
            {
              id: "1",              title: "How long does the property verification process take?",              content: "Our complete legal verification typically takes 3-5 business days. We check all documentation, ownership records, and conduct property inspections before listing. This ensures you only see fully verified properties."
            },
            {
              id: "2",              title: "What is your average deal completion time?",              content: "From viewing to final closing, our average is 14 days. This includes all negotiations, legal paperwork, and fund transfers. The process can be faster with qualified investors."
            },
            {
              id: "3",              title: "Are there any hidden fees in the pricing?",              content: "No. Our pricing is completely transparent. The listed price includes all applicable taxes and our service fee. We provide a detailed cost breakdown before you commit to any purchase."
            },
            {
              id: "4",              title: "What financing options are available?",              content: "We partner with major banks and financial institutions to offer flexible financing. We can assist with mortgage applications and can often arrange up to 80% financing for qualified buyers."
            },
            {
              id: "5",              title: "Can I rent instead of buy?",              content: "Yes! We offer both purchase and rental options. Our rental properties are fully vetted and include property management services. Rental yields typically range from 5-7% annually."
            },
            {
              id: "6",              title: "What support do you provide after purchase?",              content: "We offer 2 years of post-purchase support including property management assistance, maintenance referrals, and rental management services if needed. Your dedicated advisor remains your contact throughout."
            }
          ]}
          containerClassName="w-full"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplitForm
          title="Schedule Your Private Viewing"
          description="Tell us which properties interest you, and our dedicated advisor will arrange a personalized tour at your preferred time."
          inputs={[
            { name: "name", type: "text", placeholder: "Your full name", required: true },
            { name: "email", type: "email", placeholder: "Email address", required: true },
            { name: "phone", type: "tel", placeholder: "Phone number", required: true },
            { name: "property", type: "text", placeholder: "Preferred property or type", required: true }
          ]}
          textarea={{
            name: "message",            placeholder: "Tell us more about your investment goals and timeline...",            rows: 4,
            required: false
          }}
          useInvertedBackground="noInvert"
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1767717779085-50vqh5db.jpg"
          imageAlt="Luxury living space"
          mediaPosition="right"
          buttonText="Request Viewing"
          containerClassName="w-full py-16"
          formCardClassName="rounded-lg"
          titleClassName="text-3xl font-bold mb-4"
          descriptionClassName="text-base leading-relaxed text-foreground/80"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBaseSocial
          logoText="PRIMESTATE"
          description="Premium real estate platform connecting investors and homeowners with verified properties across 12+ countries. Expert guidance. Transparent process. Trusted results."
          copyrightText="© 2025 PrimeState. All rights reserved."
          columns={[
            {
              title: "Company",              items: [
                { label: "About Us", href: "about" },
                { label: "Our Team", href: "#" },
                { label: "Careers", href: "#" },
                { label: "Blog", href: "#" }
              ]
            },
            {
              title: "Properties",              items: [
                { label: "Buy Properties", href: "properties" },
                { label: "Rental Options", href: "#" },
                { label: "Investment Portfolio", href: "#" },
                { label: "Market Insights", href: "#" }
              ]
            },
            {
              title: "Support",              items: [
                { label: "FAQ", href: "faq" },
                { label: "Contact Us", href: "contact" },
                { label: "Schedule Tour", href: "contact" },
                { label: "Support Center", href: "#" }
              ]
            },
            {
              title: "Legal",              items: [
                { label: "Privacy Policy", href: "#" },
                { label: "Terms of Service", href: "#" },
                { label: "Legal Disclosure", href: "#" },
                { label: "Compliance", href: "#" }
              ]
            }
          ]}
          socialLinks={[
            { icon: Facebook, href: "https://facebook.com/primestate", ariaLabel: "Facebook" },
            { icon: Twitter, href: "https://twitter.com/primestate", ariaLabel: "Twitter" },
            { icon: Linkedin, href: "https://linkedin.com/company/primestate", ariaLabel: "LinkedIn" },
            { icon: Instagram, href: "https://instagram.com/primestate", ariaLabel: "Instagram" },
            { icon: Globe, href: "https://primestate.com", ariaLabel: "Website" }
          ]}
          containerClassName="bg-primary-cta text-background py-20"
        />
      </div>
    </ThemeProvider>
  );
}