"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
import TextSplitAbout from "@/components/sections/about/TextSplitAbout";
import MetricCardSeven from "@/components/sections/metrics/MetricCardSeven";
import ContactText from "@/components/sections/contact/ContactText";
import FooterSimple from "@/components/sections/footer/FooterSimple";
import Link from "next/link";

export default function ForBusinessPage() {
  const navItems = [
    { name: "Etusivu", id: "/" },
    { name: "Palvelut", id: "/palvelut" },
    { name: "Yrityksille", id: "/yrityksille" },
    { name: "Yhteystiedot", id: "/yhteys" },
  ];

  const footerColumns = [
    {
      title: "Palvelu",
      items: [
        { label: "Etusivu", href: "/" },
        { label: "Palvelut", href: "/palvelut" },
        { label: "Lähetä tarjouspyyntö", href: "/tarjouspyynto" },
        { label: "Oma tili", href: "/dashboard" },
      ],
    },
    {
      title: "Tietoa",
      items: [
        { label: "Yrityksille", href: "/yrityksille" },
        { label: "Yhteystiedot", href: "/yhteys" },
        { label: "Usein kysytyt kysymykset", href: "#faq" },
      ],
    },
    {
      title: "Oikeudellinen",
      items: [
        { label: "Tietosuojaseloste", href: "/tietosuoja" },
        { label: "Käyttöehdot", href: "#" },
        { label: "Evästeet", href: "#" },
      ],
    },
  ];

  return (
    <ThemeProvider
      defaultButtonVariant="hover-magnetic"
      defaultTextAnimation="reveal-blur"
      borderRadius="rounded"
      contentWidth="smallMedium"
      sizing="mediumSizeLargeTitles"
      background="none"
      cardStyle="gradient-mesh"
      primaryButtonStyle="primary-glow"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          brandName="Tarjouspyyntö"
          navItems={navItems.map((item) => ({
            name: item.name,
            id: item.id,
          }))}
          button={{ text: "Kirjaudu", href: "/kirjaudu" }}
        />
      </div>

      <div id="business-overview" data-section="business-overview">
        <TextSplitAbout
          title="Yrityksille"
          description={[
            "Oletko palveluntarjoaja, joka haluaa tavoittaa uusia asiakkaita? Alustamme yhdistää sinut potentiaalisiin asiakkaisiin, jotka aktiivisesti etsivät palveluitasi.",
            "Rekisteröidyt yritykset voivat selata saapuvia tarjouspyyntöjä, lähettää kilpailukykyisiä tarjouksia ja kasvattaa liiketoimintaansa.",
            "Ota yhteyttä saadaksesi lisää tietoa yritysten jäsenyyspaketin ominaisuuksista ja eduista.",
          ]}
          buttons={[{ text: "Ota yhteyttä", href: "/yhteys" }]}
          useInvertedBackground={false}
          showBorder={true}
        />
      </div>

      <div id="business-benefits" data-section="business-benefits">
        <MetricCardSeven
          title="Yritysten edut"
          description="Liity tuhansien palveluntarjoajien joukkoon ja kasvata liiketoimintaasi."
          metrics={[
            {
              id: "1",
              value: "1000+",
              title: "Aktiivisia asiakkaita",
              items: [
                "Päivittäin saapuvia tarjouspyyntöjä",
                "Läpi koko Suomen",
                "Monipuolisten palvelujen tarve",
              ],
            },
            {
              id: "2",
              value: "24/7",
              title: "Jatkuva toiminta",
              items: [
                "Tarjouspyynnöt saapuvat 24 tuntia päivässä",
                "Nopeampi vastaus = enemmän asiakkaita",
                "Reaaliaikainen ilmoitukset",
              ],
            },
            {
              id: "3",
              value: "↑50%",
              title: "Liikevaihdon kasvu",
              items: [
                "Keskimäärin 50% kasvu kuuden kuukauden sisällä",
                "Uusia asiakkaita ilman hakumainontaa",
                "Luotettava kasvun kanava",
              ],
            },
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
          tag="Edut"
          tagAnimation="slide-up"
          uniformGridCustomHeightClasses="min-h-80"
        />
      </div>

      <div id="business-cta" data-section="business-cta">
        <ContactText
          text="Liity alustalle tänään ja aloita uusien asiakkaiden tavoittaminen. Maksuton rekisteröinti, ilmainen ensimmäinen kuukausi."
          animationType="entrance-slide"
          buttons={[
            { text: "Rekisteröidy yritytenä", href: "/kirjaudu" },
            { text: "Lisätietoja", href: "/yhteys" },
          ]}
          background={{ variant: "plain" }}
          useInvertedBackground={false}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterSimple
          columns={footerColumns}
          bottomLeftText="© 2025 Tarjouspyyntöalusta. Kaikki oikeudet pidätetään."
          bottomRightText="Luotu yksinkertaisuuden nimissä"
        />
      </div>
    </ThemeProvider>
  );
}