import Link from "next/link"
import { Button } from "@/components/ui/button"
import { Navbar } from "@/components/navbar"
import { Footer } from "@/components/footer"
import { ArrowLeft } from "lucide-react"

export default function BlogPostNotFound() {
  return (
    <div className="flex min-h-screen flex-col">
      <Navbar />

      <main className="flex-1 flex items-center justify-center">
        <div className="container px-4 md:px-6 py-24 flex flex-col items-center text-center">
          <h1 className="text-4xl font-bold tracking-tighter sm:text-5xl text-primary-900 dark:text-primary-300 mb-4">
            Post non trovato
          </h1>
          <p className="max-w-[600px] text-gray-500 dark:text-gray-400 md:text-xl/relaxed mb-8">
            Il post che cercavi potrebbe essere stato eliminato o spostato.
          </p>
          <Link href="/blog">
            <Button className="bg-primary-900 hover:bg-primary-800 dark:bg-primary-700 dark:hover:bg-primary-600">
              <ArrowLeft />
              Blog
            </Button>
          </Link>
        </div>
      </main>

      <Footer />
    </div>
  )
}