"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
import ContactSplit from "@/components/sections/contact/ContactSplit";
import FaqSplitText from "@/components/sections/faq/FaqSplitText";
import FooterCard from "@/components/sections/footer/FooterCard";
import { Phone, Mail, MapPin } from "lucide-react";

export default function ContactPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="directional-hover"
      defaultTextAnimation="background-highlight"
      borderRadius="rounded"
      contentWidth="medium"
      sizing="large"
      background="circleGradient"
      cardStyle="gradient-radial"
      primaryButtonStyle="flat"
      secondaryButtonStyle="glass"
      headingFontWeight="normal"
    >
      {/* Navbar */}
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          brandName="Esilos Print & Design"
          navItems={[
            { name: "Home", id: "/" },
            { name: "Services", id: "how-it-works" },
            { name: "Portfolio", id: "/portfolio" },
            { name: "Contact", id: "/contact" },
          ]}
        />
      </div>

      {/* Contact Form Section */}
      <div id="contact-form" data-section="contact-form">
        <ContactSplit
          tag="Let's Connect"
          title="Ready to Transform Your Business?"
          description="Get your professional website today and start getting more customers. Our team is ready to help you succeed online. Contact us through the form below or call us directly."
          background={{ variant: "sparkles-gradient" }}
          useInvertedBackground={false}
          imageSrc="http://img.b2bpic.net/free-photo/businessman-pointing-his-finger-growth-graph_53876-96227.jpg?_wi=2"
          imageAlt="Business growth and success"
          mediaAnimation="slide-up"
          inputPlaceholder="your@email.com"
          buttonText="Get Started"
          termsText="We respect your privacy. Unsubscribe anytime. By signing up, you agree to our Terms."
        />
      </div>

      {/* Contact FAQ Section */}
      <div id="contact-faq" data-section="contact-faq">
        <FaqSplitText
          sideTitle="Questions About Our Services?"
          sideDescription="Find answers to common questions about our web design process, pricing, and support."
          textPosition="left"
          useInvertedBackground={false}
          animationType="smooth"
          faqsAnimation="slide-up"
          faqs={[
            {
              id: "1",
              title: "How can I schedule a consultation?",
              content: "Simply fill out the form above or call us at 519-792-3115. We offer free initial consultations to discuss your business needs and how we can help.",
            },
            {
              id: "2",
              title: "What is the best way to reach you?",
              content: "You can reach us by phone at 519-792-3115, email at esilosprint@gmail.com, or through the contact form on this page. We typically respond within 24 hours.",
            },
            {
              id: "3",
              title: "Do you offer a free consultation?",
              content: "Yes! We offer a free initial consultation to understand your business goals and discuss how a professional website can help you grow.",
            },
          ]}
        />
      </div>

      {/* Footer */}
      <div id="footer" data-section="footer">
        <FooterCard
          logoText="Esilos"
          copyrightText="© 2025 Esilos Print & Design. All rights reserved. | Local Web Design for Ontario Businesses"
          socialLinks={[
            {
              icon: Phone,
              href: "tel:519-792-3115",
              ariaLabel: "Call us at 519-792-3115",
            },
            {
              icon: Mail,
              href: "mailto:esilosprint@gmail.com",
              ariaLabel: "Email us at esilosprint@gmail.com",
            },
            {
              icon: MapPin,
              href: "#",
              ariaLabel: "Visit us in Ontario",
            },
          ]}
        />
      </div>
    </ThemeProvider>
  );
}