import Background from "../../components/Background/Background";
import styles from "./PageNotFoundPage.module.css"
import { useNavigate } from "react-router";
import { APP_CONFIG } from "../../config/appConfig.js";

export default function PageNotFoundPage() {

    const navigate = useNavigate();

    return <Background>
        <div className={styles.content}>
            <h1 className={styles.title}> Page non trouvée </h1>
            <div className={`${styles.container} glassCard`}>
                <p>
                    Désolé, la page que vous recherchez n'existe pas ou n'est plus disponible. <br/>
                    Vous pouvez : <br/>
                    - Vérifier l'URL pour une éventuelle erreur de saisie. <br/>
                    - Revenir à l'accueil <span onClick={() => navigate("/")} className={styles.redirectSpan}>ici.</span> <br/>

                </p>
                <p> Contact : {APP_CONFIG.contactEmail} </p>
            </div>
        </div>
    </Background>
}