"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import Link from "next/link";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';

export default function ContactPage() {
  const handleFormSubmit = (data: Record<string, string>) => {
    console.log('Form submitted:', data);
    // Handle form submission logic here
  };

  return (
    <ThemeProvider
      defaultButtonVariant="text-stagger"
      defaultTextAnimation="reveal-blur"
      borderRadius="rounded"
      contentWidth="mediumLarge"
      sizing="mediumLarge"
      background="aurora"
      cardStyle="soft-shadow"
      primaryButtonStyle="primary-glow"
      secondaryButtonStyle="glass"
      headingFontWeight="light"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          navItems={[
            { name: "Home", id: "/" },
            { name: "Services", id: "/services" },
            { name: "Team", id: "/team" },
            { name: "Insights", id: "/insights" },
            { name: "Contact", id: "/contact" }
          ]}
          brandName="Next Year"
        />
      </div>

      <div id="contact-form" data-section="contact-form">
        <ContactSplitForm
          title="Let's Connect"
          description="Ready to start your wealth journey with Next Year? Schedule a consultation with our investment advisors to discuss your financial goals and explore how we can help."
          inputs={[
            { name: "fullName", type: "text", placeholder: "Full Name", required: true },
            { name: "email", type: "email", placeholder: "Email Address", required: true },
            { name: "phone", type: "tel", placeholder: "Phone Number", required: true },
            { name: "companyName", type: "text", placeholder: "Company/Organization", required: false }
          ]}
          textarea={{
            name: "message",            placeholder: "Tell us about your investment goals and how we can help...",            rows: 5,
            required: true
          }}
          useInvertedBackground="noInvert"
          imageSrc="https://img.b2bpic.net/free-photo/talk-financiers_1098-15804.jpg"
          imageAlt="Professional meeting and consultation"
          mediaPosition="right"
          buttonText="Schedule Consultation"
          onSubmit={handleFormSubmit}
        />
      </div>

      <footer className="bg-foreground text-background py-12">
        <div className="mx-auto px-4 md:px-6 max-w-7xl">
          <div className="grid grid-cols-1 md:grid-cols-4 gap-8">
            <div className="md:col-span-2">
              <h3 className="text-xl font-semibold mb-4">Next Year</h3>
              <p className="text-background/80 mb-4">
                Transforming wealth through intelligent investment strategies and expert guidance.
              </p>
            </div>
            <div>
              <h4 className="font-semibold mb-4">Navigation</h4>
              <nav className="space-y-2">
                <Link href="/" className="block text-background/80 hover:text-background transition-colors">
                  Home
                </Link>
                <Link href="/services" className="block text-background/80 hover:text-background transition-colors">
                  Services
                </Link>
                <Link href="/team" className="block text-background/80 hover:text-background transition-colors">
                  Team
                </Link>
                <Link href="/insights" className="block text-background/80 hover:text-background transition-colors">
                  Insights
                </Link>
                <Link href="/contact" className="block text-background/80 hover:text-background transition-colors">
                  Contact
                </Link>
              </nav>
            </div>
            <div>
              <h4 className="font-semibold mb-4">Contact</h4>
              <div className="text-background/80">
                <p>Schedule a consultation to discuss your investment goals.</p>
              </div>
            </div>
          </div>
          <div className="border-t border-background/20 mt-8 pt-8 text-center text-background/60">
            <p>&copy; 2025 Next Year Investment Agency. All rights reserved.</p>
          </div>
        </div>
      </footer>
    </ThemeProvider>
  );
}