"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleMinimal from '@/components/navbar/NavbarStyleMinimal';
import ContactSplit from '@/components/sections/contact/ContactSplit';
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
import FooterBase from '@/components/sections/footer/FooterBase';
import { Phone, Clock } from 'lucide-react';

export default function ContactPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-bubble"
      defaultTextAnimation="entrance-slide"
      borderRadius="rounded"
      contentWidth="compact"
      sizing="mediumLargeSizeLargeTitles"
      background="none"
      cardStyle="outline"
      primaryButtonStyle="flat"
      secondaryButtonStyle="layered"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleMinimal
          brandName="Kapital"
          button={{
            text: "Schedule Consultation",
            href: "/contact"
          }}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplit
          tag="Get Started"
          title="Ready to Build Your Wealth?"
          description="Schedule a complimentary consultation with one of our investment advisors. We'll discuss your financial goals and create a personalized investment strategy."
          useInvertedBackground="noInvert"
          imageSrc="https://img.b2bpic.net/free-photo/workers-long-wooden-table_1262-810.jpg"
          imageAlt="Investment consultation meeting"
          mediaPosition="right"
          tagIcon={Phone}
          inputPlaceholder="your@email.com"
          buttonText="Schedule Consultation"
          termsText="By scheduling a consultation, you agree to our Terms of Service and Privacy Policy. We'll contact you within 24 business hours."
        />
      </div>

      <div id="contact-metrics" data-section="contact-metrics">
        <MetricCardTwo
          title="Why Choose Kapital?"
          description="Join thousands of satisfied clients who trust us with their wealth"
          tag="Client Success"
          tagIcon={Clock}
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          metrics={[
            { id: "1", value: "24hrs", description: "Average Response Time to New Inquiries" },
            { id: "2", value: "15min", description: "Time to Schedule Your First Consultation" },
            { id: "3", value: "100%", description: "Complimentary Initial Consultation" },
            { id: "4", value: "30days", description: "Personalized Strategy Development" }
          ]}
        />
      </div>

      <div id="alternative-contact" data-section="alternative-contact">
        <ContactSplit
          tag="Alternative Contact"
          title="Prefer to Speak Directly?"
          description="Call our wealth management team directly to discuss your investment needs. Our advisors are available during business hours to answer your questions."
          useInvertedBackground="noInvert"
          imageSrc="https://img.b2bpic.net/free-photo/business-meeting-office_1268-21517.jpg"
          imageAlt="Direct consultation with Kapital advisors"
          mediaPosition="left"
          tagIcon={Phone}
          inputPlaceholder="your-phone@email.com"
          buttonText="Request Call Back"
          termsText="By requesting a callback, you agree to our Terms of Service and Privacy Policy. We'll call you within 4 business hours during market hours."
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBase
          logoText="Kapital"
          copyrightText="© 2025 Kapital Investment Agency. All rights reserved."
          columns={[
            {
              title: "Services",
              items: [
                { label: "Wealth Management", href: "/services" },
                { label: "Portfolio Management", href: "/services" },
                { label: "Financial Planning", href: "/services" },
                { label: "Alternative Investments", href: "/services" }
              ]
            },
            {
              title: "Company",
              items: [
                { label: "About Us", href: "/about" },
                { label: "Our Team", href: "/about" },
                { label: "Blog", href: "#" },
                { label: "Careers", href: "#" }
              ]
            },
            {
              title: "Support",
              items: [
                { label: "FAQ", href: "/support" },
                { label: "Contact Us", href: "/contact" },
                { label: "Privacy Policy", href: "#" },
                { label: "Terms of Service", href: "#" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}