"use client";

import Link from "next/link";
import { LanguageSwitcher } from "@/components/shared/language-switcher";
import { useTranslations, useLocale } from "@/lib/i18n/i18n-provider";
import type { Locale } from "@/lib/i18n/config";

export function MarketingFooter() {
  const t = useTranslations();
  const locale = useLocale();

  return (
    <footer className="border-t border-ink-100 bg-ink-50/40">
      <div className="mx-auto flex max-w-6xl flex-col gap-6 px-4 py-10 md:flex-row md:items-center md:justify-between md:px-6">
        <div className="flex items-center gap-2">
          <div className="h-5 w-5 rounded-md bg-brand-600" />
          <span className="text-sm font-semibold">Tidyly</span>
          <span className="text-xs text-ink-400">
            © {new Date().getFullYear()} Tidyly. {t("marketing.footer.rights")}
          </span>
        </div>

        <nav className="flex flex-wrap items-center gap-5 text-sm text-ink-600">
          <Link href={`/${locale}/privacy`} className="hover:text-ink-900">
            {t("marketing.footer.privacy")}
          </Link>
          <Link href={`/${locale}/terms`} className="hover:text-ink-900">
            {t("marketing.footer.terms")}
          </Link>
          <Link href={`/${locale}/cookies`} className="hover:text-ink-900">
            {t("marketing.footer.cookies")}
          </Link>
          <Link href={`/${locale}/contact`} className="hover:text-ink-900">
            {t("marketing.footer.contact")}
          </Link>
          <LanguageSwitcher currentLocale={locale as Locale} />
        </nav>
      </div>
    </footer>
  );
}