import Link from "next/link";

/**
 * Product-specific 404 when slug is invalid or product not found / not active
 * at /shop/[category]/[subCategory]/[slug].
 */
export default function ProductNotFound() {
  return (
    <div className="mx-auto max-w-2xl px-4 py-16 text-center">
      <h1 className="font-[family-name:var(--font-fraunces)] text-2xl font-bold text-[var(--foreground)] md:text-3xl">
        Product not found
      </h1>
      <p className="mt-3 text-[var(--muted)]">
        This product doesn&apos;t exist or is no longer available. Try browsing
        the shop.
      </p>
      <Link
        href="/shop"
        className="mt-6 inline-block rounded-lg bg-[var(--brand-dark)] px-6 py-3 text-sm font-medium text-white transition-colors hover:bg-[var(--brand-hover)] w-full md:w-auto"
      >
        Back to Shop
      </Link>
    </div>
  );
}
