import Link from 'next/link';
import { NAV, NAV_GROUPS } from '@/config/nav';
import { Logo } from './site-header';

export function SiteFooter() {
  return (
    <footer className="mt-16 border-t border-border bg-sunken">
      <div className="mx-auto max-w-[1440px] px-4 py-10 sm:px-6">
        <div className="grid grid-cols-2 gap-x-6 gap-y-8 md:grid-cols-6">
          <div className="col-span-2 md:col-span-2">
            <Logo />
            <p className="mt-3 max-w-xs text-xs leading-relaxed text-muted">The global data layer for collectible assets: prices, sales, listings, rarity, liquidity and indices across marketplaces and auction houses.</p>
            <p className="mt-3 flex items-center gap-1.5 text-[11px] text-subtle">
              <span className="live-dot inline-block h-1.5 w-1.5 rounded-full bg-gain" aria-hidden />
              Pipelines running · data refreshed continuously
            </p>
          </div>
          {NAV_GROUPS.filter((g) => g.id !== 'discover').map((g) => (
            <div key={g.id}>
              <p className="t-label mb-2">{g.label}</p>
              <ul className="space-y-1.5">
                {NAV.filter((n) => n.group === g.id).map((n) => (
                  <li key={n.href}>
                    <Link href={n.href} className="text-xs text-muted hover:text-fg">
                      {n.label}
                    </Link>
                  </li>
                ))}
              </ul>
            </div>
          ))}
        </div>
        <div className="mt-8 border-t border-border pt-5 text-[11px] leading-relaxed text-subtle">
          <p>
            RareIndex is an information platform. Valuations are estimates derived from observed public data and carry a confidence level; listing prices are not confirmed transactions; past performance does not guarantee future results. RareIndex does not authenticate items. Third-party names and marks belong to their owners; data is attributed to its source.{' '}
            <Link href="/about#disclaimers" className="underline hover:text-fg">
              Read the full disclaimers
            </Link>
            .
          </p>
          <p className="mt-2 flex flex-wrap items-center gap-x-3 gap-y-1">
            <span>© {new Date().getFullYear()} RareIndex.io</span>
            <Link href="/data" className="hover:text-fg">
              Methodology
            </Link>
            <Link href="/api-docs" className="hover:text-fg">
              API
            </Link>
            <Link href="/about" className="hover:text-fg">
              About
            </Link>
            <a href="mailto:contact@spboucher.ai" className="hover:text-fg">
              contact@spboucher.ai
            </a>
          </p>
          <p className="mt-1 flex flex-wrap items-center gap-x-3 gap-y-1">
            <span>Built by Simon-Pierre Boucher</span>
            <span aria-hidden>·</span>
            <span>
              Hosted on{' '}
              <a href="https://www.maclustr.io" target="_blank" rel="noopener noreferrer" className="underline hover:text-fg">
                MacLustr
              </a>{' '}
              (www.maclustr.io)
            </span>
          </p>
        </div>
      </div>
    </footer>
  );
}