"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import HeroBillboardTestimonial from "@/components/sections/hero/HeroBillboardTestimonial";
import ContactFaq from "@/components/sections/contact/ContactFaq";
import FooterBase from "@/components/sections/footer/FooterBase";
import { MessageCircle } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="text-stagger"
      defaultTextAnimation="reveal-blur"
      borderRadius="soft"
      contentWidth="small"
      sizing="mediumLargeSizeMediumTitles"
      background="grid"
      cardStyle="subtle-shadow"
      primaryButtonStyle="gradient"
      secondaryButtonStyle="solid"
      headingFontWeight="semibold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          brandName="Contact"
          navItems={[
            { name: "Home", id: "hero" },
            { name: "Get in Touch", id: "contact" },
            { name: "FAQ", id: "faq" }
          ]}
          button={{
            text: "Contact Us",            href: "#contact"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboardTestimonial
          title="Get in Touch With Us"
          description="We'd love to hear from you. Send us a message and we'll respond as soon as possible."
          background={{ variant: "plain" }}
          testimonials={[
            {
              name: "Sarah Mitchell",              handle: "@sarahmitchell",              testimonial: "Great support team! Responded to my inquiry within hours.",              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=88usu9&_wi=1",              imageAlt: "Sarah Mitchell"
            },
            {
              name: "James Rodriguez",              handle: "@jamesrodriguez",              testimonial: "Professional and courteous. Highly recommended!",              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=88usu9&_wi=2",              imageAlt: "James Rodriguez"
            },
            {
              name: "Emily Chen",              handle: "@emilychen",              testimonial: "Easy to reach and always helpful with any questions.",              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=88usu9&_wi=3",              imageAlt: "Emily Chen"
            },
            {
              name: "Michael Thompson",              handle: "@michaelthompson",              testimonial: "Best customer service I've experienced. Will definitely reach out again.",              rating: 5,
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=88usu9&_wi=4",              imageAlt: "Michael Thompson"
            }
          ]}
          buttons={[
            { text: "Send Message", href: "#contact" }
          ]}
          useInvertedBackground={false}
          ariaLabel="Hero section for contact form"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactFaq
          faqs={[
            {
              id: "1",              title: "What's your response time?",              content: "We aim to respond to all inquiries within 24 business hours. During weekends and holidays, responses may take slightly longer."
            },
            {
              id: "2",              title: "How can I reach you?",              content: "You can contact us through this form, email at hello@example.com, or call us at 1-800-CONTACT during business hours."
            },
            {
              id: "3",              title: "What information do you need?",              content: "Please provide your name, email, phone number (optional), and a detailed message about your inquiry. The more information you share, the better we can assist you."
            },
            {
              id: "4",              title: "Is my information secure?",              content: "Yes, we use industry-standard encryption to protect your personal information. Your data is never shared with third parties without your consent."
            },
            {
              id: "5",              title: "Do you offer phone support?",              content: "Yes, our support team is available via phone Monday through Friday, 9 AM to 6 PM EST. Emergency support is available 24/7 for existing clients."
            },
            {
              id: "6",              title: "Can I schedule a callback?",              content: "Absolutely! Let us know your preferred time in the contact form and we'll arrange a time that works best for you."
            }
          ]}
          ctaTitle="Ready to Connect?"
          ctaDescription="Fill out the form above or use any of our contact methods to reach out. We're here to help!"
          ctaButton={{
            text: "Contact Us Now",            href: "#contact"
          }}
          ctaIcon={MessageCircle}
          useInvertedBackground={false}
          animationType="slide-up"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBase
          logoText="Contact"
          columns={[
            {
              title: "Company",              items: [
                { label: "About Us", href: "#" },
                { label: "Our Team", href: "#" },
                { label: "Careers", href: "#" },
                { label: "Blog", href: "#" }
              ]
            },
            {
              title: "Support",              items: [
                { label: "Help Center", href: "#" },
                { label: "Contact Us", href: "#contact" },
                { label: "FAQ", href: "#faq" },
                { label: "Status", href: "#" }
              ]
            },
            {
              title: "Legal",              items: [
                { label: "Privacy Policy", href: "#" },
                { label: "Terms of Service", href: "#" },
                { label: "Cookie Policy", href: "#" },
                { label: "Contact", href: "#contact" }
              ]
            }
          ]}
          copyrightText="© 2025 Contact Form. All rights reserved."
        />
      </div>
    </ThemeProvider>
  );
}