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

export default function NotFound() {
  return (
    <div className="flex flex-col items-center
    gap-4
    justify-center min-h-screen bg-white text-black dark:bg-black dark:text-white">
      <div className="text-6xl font-bold text-red-500">404</div>
      <h2 className="text-xl font-semibold">Not Found</h2>
      <p className="text-gray-600 dark:text-gray-400">Could not find requested resource</p>
      <Button variant="secondary">
        <Link href="/">
          Return Home
        </Link>
      </Button>
    </div>
    // <div><style>body{color:#000;background:#fff;margin:0}.next-error-h1{border - right:1px solid rgba(0,0,0,.3)}@media (prefers-color-scheme:dark){body{color:#fff;background:#000}.next-error-h1{border - right:1px solid rgba(255,255,255,.3)}}</style><h1 class="next-error-h1" style="display: inline-block; margin: 0px 20px 0px 0px; padding: 0px 23px 0px 0px; font-size: 24px; font-weight: 500; vertical-align: top; line-height: 49px;">404</h1><div style="display: inline-block;"><h2 style="font-size: 14px; font-weight: 400; line-height: 49px; margin: 0px;">This page could not be found.</h2></div></div>
  )
}