"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import ContactCTA from "@/components/sections/contact/ContactCTA";
import TextAbout from "@/components/sections/about/TextAbout";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
import { Mail, Phone } from "lucide-react";

export default function ContactPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="bounce-effect"
      defaultTextAnimation="background-highlight"
      borderRadius="pill"
      contentWidth="mediumSmall"
      sizing="large"
      background="fluid"
      cardStyle="gradient-mesh"
      primaryButtonStyle="primary-glow"
      secondaryButtonStyle="glass"
      headingFontWeight="semibold"
    >
      {/* Navigation */}
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          brandName="JMN"
          navItems={[
            { name: "Services", id: "services" },
            { name: "About", id: "about" },
            { name: "Team", id: "team" },
            { name: "Contact", id: "contact" },
          ]}
          button={{ text: "Get in Touch", href: "/contact" }}
          animateOnLoad={true}
        />
      </div>

      {/* Contact Heading */}
      <div id="contact-heading" data-section="contact-heading">
        <TextAbout
          tag="Contact Us"
          title="Get in Touch with JMN Investments Research. Our team is ready to discuss your research needs and explore how we can support your firm's success."
          useInvertedBackground={false}
          buttons={[{ text: "Back to Home", href: "/" }]}
        />
      </div>

      {/* Main Contact CTA */}
      <div id="contact-main" data-section="contact-main">
        <ContactCTA
          tag="Partnership Opportunities"
          tagIcon={Mail}
          title="Let's Work Together"
          description="JMN Investments Research is committed to building long-term partnerships with leading financial institutions. Contact our team to discuss your research requirements, pricing, or to schedule a meeting with our leadership."
          buttons={[
            { text: "Email: bala@jmnirl.com", href: "mailto:bala@jmnirl.com" },
            { text: "Schedule a Call", href: "#" },
          ]}
          background={{ variant: "plain" }}
          useInvertedBackground={false}
        />
      </div>

      {/* Footer */}
      <div id="footer" data-section="footer">
        <FooterLogoReveal
          logoText="JMN"
          leftLink={{ text: "Privacy Policy", href: "#" }}
          rightLink={{ text: "Terms of Service", href: "#" }}
        />
      </div>
    </ThemeProvider>
  );
}