import Link from "next/link";

export default function OfflinePage() {
  return (
    <div className="flex min-h-screen flex-col items-center justify-center gap-4 p-8 text-center">
      <h1 className="text-2xl font-semibold">You're offline</h1>
      <p className="max-w-sm text-muted-foreground">
        Your recently visited recipes are available. Connect to internet to load new content.
      </p>
      <Link
        href="/recipes"
        className="mt-2 underline underline-offset-4 hover:text-primary"
      >
        Back to my recipes
      </Link>
    </div>
  );
}