// app/not-found.tsx
import Link from "next/link";
import { ArrowLeft, Sparkles } from "lucide-react";

export default function NotFound() {
  return (
    <div className="min-h-[75vh] flex flex-col items-center justify-center text-center px-4">
      <span className="text-6xl font-black text-indigo-500 tracking-tight mb-2">404</span>
      <h2 className="text-2xl font-bold text-white mb-2">Page Not Found</h2>
      <p className="text-xs text-zinc-400 max-w-sm mb-6">
        The template or page you are looking for might have been moved, renamed, or is currently unavailable.
      </p>
      <Link
        href="/"
        className="flex items-center gap-2 px-5 py-2.5 rounded-xl bg-indigo-600 hover:bg-indigo-500 text-white text-xs font-semibold transition shadow-lg shadow-indigo-600/30"
      >
        <ArrowLeft className="h-4 w-4" /> Return to Store
      </Link>
    </div>
  );
}