"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
import ContactCenter from "@/components/sections/contact/ContactCenter";
import FooterLogoEmphasis from "@/components/sections/footer/FooterLogoEmphasis";
import { Rocket } from "lucide-react";

export default function ContactPage() {
  const navItems = [
    { name: "Início", id: "/" },
    { name: "Empresa", id: "/empresa" },
    { name: "Produtos", id: "/produtos" },
    { name: "Segmentos", id: "/segmentos" },
    { name: "Contato", id: "/contato" },
  ];

  const footerColumns = [
    {
      items: [
        { label: "Início", href: "/" },
        { label: "Sobre Nós", href: "/empresa" },
        { label: "Produtos", href: "/produtos" },
      ],
    },
    {
      items: [
        { label: "Segmentos", href: "/segmentos" },
        { label: "Diferenciais", href: "/empresa" },
        { label: "Suporte", href: "/suporte" },
      ],
    },
    {
      items: [
        { label: "Contato", href: "/contato" },
        { label: "WhatsApp", href: "https://wa.me/55" },
        { label: "E-mail", href: "mailto:contato@fabrijet.com.br" },
      ],
    },
    {
      items: [
        { label: "Política de Privacidade", href: "#" },
        { label: "Termos & Condições", href: "#" },
        { label: "Compliance", href: "#" },
      ],
    },
  ];

  return (
    <ThemeProvider
      defaultButtonVariant="icon-arrow"
      defaultTextAnimation="entrance-slide"
      borderRadius="pill"
      contentWidth="small"
      sizing="largeSizeMediumTitles"
      background="floatingGradient"
      cardStyle="gradient-bordered"
      primaryButtonStyle="radial-glow"
      secondaryButtonStyle="layered"
      headingFontWeight="semibold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleFullscreen
          navItems={navItems}
          brandName="Fabrijet"
          bottomLeftText="Soluções em Impressão Digital"
          bottomRightText="contato@fabrijet.com.br"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCenter
          tag="Próximo Passo"
          tagIcon={Rocket}
          title="Entre em Contato com Nossa Equipe"
          description="Fale com um especialista da Fabrijet e descubra como nossas soluções podem transformar sua produção. Atendimento disponível 24/7 em todo o Brasil."
          background={{ variant: "floatingGradient" }}
          useInvertedBackground={false}
          inputPlaceholder="seu@email.com"
          buttonText="Solicitar Contato"
          termsText="Respeitamos sua privacidade. Você receberá apenas comunicações relevantes sobre soluções Fabrijet."
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoEmphasis columns={footerColumns} logoText="Fabrijet" />
      </div>
    </ThemeProvider>
  );
}