import { useTranslations } from "next-intl";
import Image from "next/image";
import Link from "next/link";

export const runtime = 'edge';


export default function NotFoundPage() {
    const t = useTranslations("NotFoundPage");
    return (
        <main className="relative h-screen w-full">
            <div className="absolute inset-0 m-4 flex items-center justify-center">
                <Image
                    priority
                    className="rounded-3xl object-cover"
                    src="/tardis.jpg"
                    fill={true}
                    alt="TARDIS"
                />
                <div className="text-container absolute right-4 p-4 md:right-20">
                    <h1 className="text-2xl font-bold opacity-80 md:text-5xl">
                        {t("h1_490-590_404NotFound")}
                    </h1>
                    <p className="text-lg opacity-60 md:text-base">
                        {t("p_601-665_TARDISERROR")}
                    </p>
                    <Link href={"/"} className="text-2xl opacity-80 md:text-3xl">
                        {t("Link_676-775_Doctor")}
                    </Link>
                </div>
            </div>
        </main>
    );
}
