"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import ContactCTA from '@/components/sections/contact/ContactCTA';
import AboutMetric from '@/components/sections/about/AboutMetric';
import FeatureHoverPattern from '@/components/sections/feature/featureHoverPattern/FeatureHoverPattern';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import { Phone, Mail, MapPin, Clock, MessageSquare, Calendar, Users } from 'lucide-react';
import Link from 'next/link';

export default function ContactPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-bubble"
      defaultTextAnimation="entrance-slide"
      borderRadius="sharp"
      contentWidth="medium"
      sizing="mediumLargeSizeMediumTitles"
      background="fluid"
      cardStyle="solid"
      primaryButtonStyle="double-inset"
      secondaryButtonStyle="layered"
      headingFontWeight="light"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          brandName="Dubai Realty"
          navItems={[
            { name: "Properties", id: "/properties" },
            { name: "Services", id: "services" },
            { name: "About", id: "/about" },
            { name: "Contact", id: "/contact" }
          ]}
          button={{
            text: "Schedule Tour",            href: "/contact"
          }}
        />
      </div>

      <div id="contact-hero" data-section="contact-hero">
        <ContactCTA
          tag="Get Started Today"
          tagIcon={Phone}
          title="Ready to Find Your Perfect Property in Dubai?"
          description="Contact our expert real estate consultants today. We'll guide you through every step of your property journey in Dubai with personalized service and market insights."
          buttons={[
            { text: "Schedule Consultation", href: "tel:+971123456789" },
            { text: "Email Us Now", href: "mailto:info@dubairealty.com" }
          ]}
          background={{ variant: "plain" }}
          useInvertedBackground={false}
        />
      </div>

      <div id="contact-methods" data-section="contact-methods">
        <FeatureHoverPattern
          title="Multiple Ways to Reach Us"
          description="Choose the most convenient way to connect with our Dubai real estate experts"
          features={[
            {
              icon: Phone,
              title: "Call Us Direct",              description: "Speak with our real estate specialists immediately. Available 24/7 for urgent inquiries and property viewings."
            },
            {
              icon: MessageSquare,
              title: "Live Chat Support",              description: "Get instant answers to your questions through our live chat system. Perfect for quick property inquiries."
            },
            {
              icon: Calendar,
              title: "Schedule Meeting",              description: "Book a personalized consultation at our Dubai office or arrange a property tour at your convenience."
            },
            {
              icon: Mail,
              title: "Email Inquiry",              description: "Send detailed property requirements and receive comprehensive market reports and property recommendations."
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="contact-info" data-section="contact-info">
        <AboutMetric
          title="Dubai Realty is conveniently located in the heart of Dubai's business district, providing easy access for all your real estate consultation needs"
          metrics={[
            {
              icon: MapPin,
              label: "Office Location",              value: "DIFC"
            },
            {
              icon: Clock,
              label: "Operating Hours",              value: "24/7"
            },
            {
              icon: Phone,
              label: "Response Time",              value: "<1Hr"
            },
            {
              icon: Users,
              label: "Expert Consultants",              value: "25+"
            }
          ]}
          metricsAnimation="slide-up"
          useInvertedBackground={false}
        />
      </div>

      <FooterBaseReveal
        columns={[
          {
            title: "Company",            items: [
              { label: "About Us", href: "/about" },
              { label: "Our Team", href: "/about" },
              { label: "Careers", href: "#" },
              { label: "Blog", href: "#" }
            ]
          },
          {
            title: "Services",            items: [
              { label: "Buy Property", href: "/properties" },
              { label: "Sell Property", href: "#" },
              { label: "Property Management", href: "#" },
              { label: "Investment Advisory", href: "#" }
            ]
          },
          {
            title: "Support",            items: [
              { label: "Contact Us", href: "/contact" },
              { label: "FAQ", href: "#" },
              { label: "Privacy Policy", href: "#" },
              { label: "Terms & Conditions", href: "#" }
            ]
          }
        ]}
        copyrightText="© 2025 Dubai Realty. All rights reserved. | Dubai, UAE"
      />
    </ThemeProvider>
  );
}
