"use client";

import Link from "next/link";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
import SplitAbout from "@/components/sections/about/SplitAbout";
import FaqSplitText from "@/components/sections/faq/FaqSplitText";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
import { MessageSquare, Mail, Phone } from "lucide-react";

const ContactPage = () => {
  const navItems = [
    { name: "Home", id: "/" },
    { name: "Services", id: "/services" },
    { name: "Case Studies", id: "/case-studies" },
    { name: "About", id: "/about" },
    { name: "Contact", id: "/contact" },
  ];

  return (
    <ThemeProvider
      defaultButtonVariant="icon-arrow"
      defaultTextAnimation="entrance-slide"
      borderRadius="rounded"
      contentWidth="small"
      sizing="largeSizeMediumTitles"
      background="fluid"
      cardStyle="subtle-shadow"
      primaryButtonStyle="flat"
      secondaryButtonStyle="layered"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple brandName="ROI Capital" navItems={navItems} />
      </div>

      <div id="contact-intro" data-section="contact-intro">
        <SplitAbout
          title="Get In Touch"
          description="Ready to transform your marketing and drive measurable results? We'd love to hear about your business goals and discuss how ROI Capital can help you achieve them. Reach out today for a free consultation."
          tag="Contact Us"
          tagIcon={MessageSquare}
          tagAnimation="slide-up"
          bulletPoints={[
            {
              title: "Email Us",              description: "hello@roicapital.com - We respond within 24 hours with personalized insights.",              icon: Mail,
            },
            {
              title: "Schedule a Call",              description: "Book a free 30-minute consultation with our team to discuss your marketing challenges.",              icon: Phone,
            },
            {
              title: "Visit Our Office",              description: "1234 Marketing Drive, San Francisco, CA 94105 - We're located in the heart of the tech district.",              icon: MessageSquare,
            },
          ]}
          imageSrc="http://img.b2bpic.net/free-photo/focused-business-colleagues-working-together-sitting-workplace-speaking-cellphone-using-computer-teamwork-communication-concept_74855-11707.jpg"
          imageAlt="ROI Capital contact and communication"
          mediaAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          buttons={[
            { text: "Schedule Consultation", href: "#" },
          ]}
        />
      </div>

      <div id="contact-faq" data-section="contact-faq">
        <FaqSplitText
          sideTitle="Contact Questions"
          sideDescription="Find answers to common questions about working with us"
          faqs={[
            {
              id: "1",              title: "What should I prepare for our consultation?",              content: "Gather information about your current marketing efforts, business goals, budget, and target audience. We'll review this together and provide recommendations tailored to your situation."},
            {
              id: "2",              title: "Do you offer a free initial consultation?",              content: "Yes! We offer a complimentary 30-minute consultation where we assess your marketing needs, discuss your goals, and recommend the best approach for your business."},
            {
              id: "3",              title: "What's your typical response time?",              content: "We respond to all inquiries within 24 business hours. For urgent matters, feel free to call our office directly at the number provided on this page."},
          ]}
          faqsAnimation="slide-up"
          textPosition="left"
          useInvertedBackground={false}
          animationType="smooth"
          showCard={true}
          ariaLabel="Contact FAQ"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoReveal
          logoText="ROI CAPITAL"
          leftLink={{ text: "Privacy Policy", href: "/privacy" }}
          rightLink={{ text: "Terms of Service", href: "/terms" }}
          ariaLabel="Site footer"
        />
      </div>
    </ThemeProvider>
  );
};

export default ContactPage;
