"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import ContactText from '@/components/sections/contact/ContactText';
import FooterBase from '@/components/sections/footer/FooterBase';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="hover-bubble"
        defaultTextAnimation="background-highlight"
        borderRadius="soft"
        contentWidth="mediumSmall"
        sizing="largeSmallSizeLargeTitles"
        background="grid"
        cardStyle="inset"
        primaryButtonStyle="primary-glow"
        secondaryButtonStyle="radial-glow"
        headingFontWeight="normal"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingOverlay
      navItems={[
        {
          name: "Home",
          id: "/",
        },
        {
          name: "About Us",
          id: "/about",
        },
        {
          name: "Products",
          id: "/products",
        },
        {
          name: "Services",
          id: "/services",
        },
        {
          name: "Blog",
          id: "/blog",
        },
        {
          name: "Testimonials",
          id: "/testimonials",
        },
        {
          name: "FAQ",
          id: "/faq",
        },
        {
          name: "Contact",
          id: "/contact",
        },
      ]}
      brandName="Smart QHSE System"
      button={{
        text: "Get a Quote",
        href: "/contact",
      }}
    />
  </div>

  <div id="contact-form" data-section="contact-form">
      <ContactSplitForm
      useInvertedBackground={false}
      title="Get In Touch With Us"
      description="Fill out the form below to request a quote, schedule a demo, or get support. Our team will get back to you promptly."
      inputs={[
        {
          name: "fullName",
          type: "text",
          placeholder: "Full Name",
          required: true,
        },
        {
          name: "email",
          type: "email",
          placeholder: "Email Address",
          required: true,
        },
        {
          name: "company",
          type: "text",
          placeholder: "Company Name",
          required: false,
        },
        {
          name: "phone",
          type: "tel",
          placeholder: "Phone Number",
          required: false,
        },
      ]}
      textarea={{
        name: "message",
        placeholder: "Tell us about your QHSE needs or inquiry...",
        rows: 5,
        required: true,
      }}
      imageSrc="http://img.b2bpic.net/free-photo/people-working-call-center_23-2149288167.jpg"
      imageAlt="modern contact us interface digital"
      mediaAnimation="slide-up"
      mediaPosition="right"
      buttonText="Send Message"
    />
  </div>

  <div id="contact-additional-info" data-section="contact-additional-info">
      <ContactText
      useInvertedBackground={false}
      background={{
        variant: "radial-gradient",
      }}
      text="Prefer a Direct Conversation?"
      buttons={[
        {
          text: "Call Us",
          href: "tel:+1234567890",
        },
        {
          text: "Email Us",
          href: "mailto:info@smartqhse.com",
        },
      ]}
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterBase
      columns={[
        {
          title: "Services",
          items: [
            {
              label: "QHSE Consulting",
              href: "/services#consulting",
            },
            {
              label: "Custom Docs",
              href: "/services#documentation",
            },
            {
              label: "Training Programs",
              href: "/services#training",
            },
            {
              label: "Digital Platforms",
              href: "/services#platforms",
            },
          ],
        },
        {
          title: "Company",
          items: [
            {
              label: "About Us",
              href: "/about",
            },
            {
              label: "Careers",
              href: "/careers",
            },
            {
              label: "Blog",
              href: "/blog",
            },
            {
              label: "Contact",
              href: "/contact",
            },
          ],
        },
        {
          title: "Legal",
          items: [
            {
              label: "Privacy Policy",
              href: "/privacy",
            },
            {
              label: "Terms of Service",
              href: "/terms",
            },
          ],
        },
      ]}
      logoText="Professional Digital QHSE Solutions"
      copyrightText="© 2024 Professional Digital QHSE Solutions. All rights reserved."
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
