"use client";

import Link from 'next/link';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import { HelpCircle } from "lucide-react";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FaqBase from '@/components/sections/faq/FaqBase';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';

export default function ContactPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="directional-hover"
      defaultTextAnimation="background-highlight"
      borderRadius="rounded"
      contentWidth="small"
      sizing="mediumLargeSizeLargeTitles"
      background="none"
      cardStyle="subtle-shadow"
      primaryButtonStyle="diagonal-gradient"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="normal"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleFullscreen
          navItems={[
            { name: "Home", id: "/" },
            { name: "Properties", id: "/properties" },
            { name: "About", id: "/about" },
            { name: "Contact", id: "/contact" }
          ]}
          brandName="Luxe Properties"
          bottomLeftText="Dubai, United Arab Emirates"
          bottomRightText="hello@luxeproperties.ae"
        />
      </div>

      <div id="contact-form" data-section="contact-form">
        <ContactSplitForm
          title="Let's Find Your Dream Property"
          description="Connect with our luxury real estate specialists to schedule a private viewing, discuss investment opportunities, or ask any questions about Dubai's premium properties."
          inputs={[
            {
              name: "name",
              type: "text",
              placeholder: "Full Name",
              required: true
            },
            {
              name: "email",
              type: "email",
              placeholder: "Email Address",
              required: true
            },
            {
              name: "phone",
              type: "tel",
              placeholder: "Phone Number",
              required: true
            },
            {
              name: "propertyType",
              type: "text",
              placeholder: "Property Type of Interest",
              required: false
            }
          ]}
          textarea={{
            name: "message",
            placeholder: "Tell us about your property requirements and investment goals...",
            rows: 5,
            required: true
          }}
          useInvertedBackground="noInvert"
          imageSrc="https://img.b2bpic.net/free-photo/business-urban-beautiful-landscape-night_1122-1702.jpg"
          imageAlt="Dubai Luxury Real Estate"
          mediaPosition="right"
          buttonText="Schedule Consultation"
          onSubmit={(data) => console.log('Contact form submitted:', data)}
        />
      </div>

      <div id="contact-faq" data-section="contact-faq">
        <FaqBase
          title="Frequently Asked Questions"
          description="Find answers to common questions about buying, selling, and investing in Dubai's luxury real estate market"
          tag="Support"
          tagIcon={HelpCircle}
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          animationType="smooth"
          faqs={[
            {
              id: "1",
              title: "What is the current market trend in Dubai luxury real estate?",
              content: "Dubai's luxury real estate market remains robust with strong demand from international investors. Prime locations in Downtown Dubai, Palm Jumeirah, and Emirates Hills continue to appreciate. We provide regular market analysis to help clients make informed decisions."
            },
            {
              id: "2",
              title: "How long does a typical property purchase take?",
              content: "The average transaction timeline is 4-8 weeks from offer to completion, depending on financing arrangements and due diligence requirements. Our team manages all administrative processes to ensure a smooth and timely closing."
            },
            {
              id: "3",
              title: "Are there financing options available for property purchases?",
              content: "Yes, we work with leading UAE banks and international financing institutions. Most banks offer up to 80% loan-to-value for residential properties. We connect you with mortgage specialists to secure the best rates."
            },
            {
              id: "4",
              title: "What are the costs and fees associated with buying property in Dubai?",
              content: "Costs typically include transfer fees (4%), agent commission (1-2%), and legal fees. We provide detailed cost breakdowns upfront so there are no surprises. All fees are transparent and clearly outlined in our consultations."
            },
            {
              id: "5",
              title: "Can foreign nationals buy property in Dubai?",
              content: "Yes, foreign nationals can purchase property in designated freehold areas. Most luxury properties in Downtown Dubai and Palm Jumeirah are available to international buyers. We guide you through all regulatory requirements."
            },
            {
              id: "6",
              title: "What rental yields can I expect from investment properties?",
              content: "Luxury residential properties typically offer 3-5% gross annual rental yields, depending on location and property type. Our investment specialists provide detailed yield analysis and projections for each property."
            }
          ]}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoEmphasis
          logoText="Luxe Properties"
          columns={[
            {
              items: [
                { label: "About", href: "/about" },
                { label: "Properties", href: "/properties" },
                { label: "Contact", href: "/contact" }
              ]
            },
            {
              items: [
                { label: "How We Work", href: "#" },
                { label: "Market Insights", href: "#" },
                { label: "Investment Guide", href: "#" }
              ]
            },
            {
              items: [
                { label: "Schedule Viewing", href: "/contact" },
                { label: "Support", href: "#" }
              ]
            },
            {
              items: [
                { label: "Privacy Policy", href: "#" },
                { label: "Terms & Conditions", href: "#" },
                { label: "Legal", href: "#" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}