import Link from "next/link";
import { Page } from "@/components/ui/section";
import { SearchButton } from "@/components/layout/search-dialog";

export default function NotFound() {
  return (
    <Page className="py-20 text-center">
      <p className="text-[11px] font-medium uppercase tracking-wide text-ink-3">404</p>
      <h1 className="mt-2 text-3xl font-semibold tracking-tight">Not on the map</h1>
      <p className="mx-auto mt-2 max-w-md text-sm text-ink-2">This instrument, venue or page is not in the atlas. Try the universal search — symbols, names, exchanges and countries all resolve.</p>
      <div className="mt-6 flex justify-center gap-2">
        <SearchButton />
        <Link href="/markets" className="inline-flex h-11 items-center rounded-md bg-ink px-4 text-sm font-medium text-canvas">
          Markets overview
        </Link>
      </div>
    </Page>
  );
}