import Link from 'next/link'

export default function TagNotFound() {
  return (
    <div className="min-h-screen bg-slate-950 text-slate-100 flex items-center justify-center">
      <div className="max-w-2xl mx-auto px-6">
        <div className="border-4 border-red-900 bg-red-950 p-12 text-center">
          <div className="border-2 border-red-800 bg-red-900 p-4 mb-6 inline-block">
            <p className="font-mono text-6xl font-bold text-red-400">404</p>
          </div>
          <p className="font-mono text-xs text-red-600 uppercase tracking-widest mb-2">
            ERROR: TAG NOT FOUND
          </p>
          <h1 className="font-mono text-3xl font-bold uppercase mb-4 text-red-400">
            TAG DOES NOT EXIST
          </h1>
          <p className="font-mono text-sm text-red-300 mb-8 max-w-md mx-auto">
            &gt; THE REQUESTED TAG COULD NOT BE LOCATED IN THE DATABASE
            <br />
            &gt; IT MAY HAVE BEEN REMOVED OR NEVER EXISTED
          </p>
          <div className="flex gap-4 justify-center flex-wrap">
            <Link
              href="/tags"
              className="inline-block px-6 py-3 font-mono text-xs uppercase border-2 border-cyan-400 bg-cyan-900 text-cyan-100 hover:bg-cyan-800 transition"
            >
              &gt; VIEW ALL TAGS
            </Link>
            <Link
              href="/blog"
              className="inline-block px-6 py-3 font-mono text-xs uppercase border-2 border-slate-600 bg-slate-900 text-slate-300 hover:bg-slate-800 transition"
            >
              &gt; VIEW ALL POSTS
            </Link>
          </div>
        </div>
      </div>
    </div>
  )
}
