import type {FunctionComponent} from 'react'
import Link from 'next/link'
import {Button} from '@/components/ui/button'

const NotFound: FunctionComponent = () => {
  return (
    <div className="flex h-screen items-center justify-center">
      <div className="text-center">
        <h1 className="text-7xl font-bold text-gray-800">404</h1>
        <p className="mt-4 text-lg text-gray-600">Oops! The page you're looking for doesn't exist.</p>
        <div className="mt-6">
          <Link href="/">
            <Button>Take me home</Button>
          </Link>
        </div>
      </div>
    </div>
  )
}

export default NotFound
