"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import Link from 'next/link';

export default function ContactPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="directional-hover"
      defaultTextAnimation="reveal-blur"
      borderRadius="soft"
      contentWidth="medium"
      sizing="mediumLarge"
      background="none"
      cardStyle="soft-shadow"
      primaryButtonStyle="flat"
      secondaryButtonStyle="solid"
      headingFontWeight="light"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          navItems={[
            { name: 'Properties', id: 'properties' },
            { name: 'About', id: 'about' },
            { name: 'Services', id: 'services' },
            { name: 'Contact', id: 'contact' }
          ]}
          button={{ text: 'Schedule Tour', href: 'contact' }}
          brandName="Prestige Dubai"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplit
          tag="Stay Informed"
          title="Get Exclusive Market Insights"
          description="Subscribe to our exclusive newsletter for market analysis, property highlights, and investment opportunities delivered directly to your inbox."
          useInvertedBackground="noInvert"
          imageSrc="https://img.b2bpic.net/free-photo/river-modern-buildings-against-sky_1359-152.jpg"
          imageAlt="Professional real estate office"
          mediaPosition="right"
          inputPlaceholder="your@email.com"
          buttonText="Subscribe"
          termsText="We respect your privacy. Unsubscribe anytime. Read our privacy policy."
        />
      </div>

      <FooterLogoReveal logoText="Prestige Dubai" />
    </ThemeProvider>
  );
}