import Link from "next/link";
import { Compass, Home } from "lucide-react";

export default function NotFound() {
  return (
    <div className="max-w-md mx-auto text-center py-20 sm:py-28">
      <span
        className="inline-flex w-16 h-16 rounded-full items-center justify-center mb-6"
        style={{ background: "var(--accent-soft)", color: "var(--accent)" }}
      >
        <Compass size={30} />
      </span>
      <p className="text-[15px] font-extrabold tracking-wide mb-1" style={{ color: "var(--accent)" }}>
        404
      </p>
      <h1 className="text-2xl font-extrabold mb-2" style={{ color: "var(--ink)" }}>
        这一页走丢了
      </h1>
      <p className="text-sm mb-8" style={{ color: "var(--ink-2)" }}>
        链接可能已失效，或帖子已被作者删除
      </p>
      <div className="flex items-center justify-center gap-3">
        <Link href="/" className="btn btn-primary">
          <Home size={15} /> 返回首页
        </Link>
        <Link href="/" className="btn btn-line">
          逛逛讨论
        </Link>
      </div>
    </div>
  );
}