@charset "UTF-8";
/* recrut.css (25/10/2026) : test de recrutement. Inclus par 3 pages seulement : mon_test_candidat.php (le
   candidat), resultatsRecrut.php (le patron) et simulateur.php en mode recrut (chrono de recrutSimu.js).
   Le reste vient de global.css (fdblanc, arrondi2 pour les cadres, arrondi7 pour les boutons, ombreflotte2, padd10,
   gras, vert, orange...). */

/* --- Page du candidat --- */
.recrutRegles{max-width:760px;margin-left:auto;margin-right:auto;text-align:left;box-sizing:border-box;}/* 29/10/2026 : plus de « margin:0 auto », qui annulait le top10 / marge10 de global.css (cadres collés) */
.recrutRegles ul{margin:6px 0 0 0;padding-left:1.4em;}
.recrutListe{max-width:760px;margin:12px auto;padding-left:2.4em;text-align:left;box-sizing:border-box;}
.recrutListe li{margin:8px 0;padding:8px 10px;border-radius:7px;background-color:#fff;box-shadow:2px 2px 6px #bbb;}
.recrutListe li.recrutFaite{opacity:0.75;}
.recrutListe li.recrutProchaine{box-shadow:0 0 0 3px #4c0,2px 2px 6px #bbb;}

/* --- Simulateur en mode recrut : chrono en pastille, en bas au centre (en haut : Vérifier, plan, HUD ;
   en bas à gauche la poubelle, à droite l'énoncé). Au dépannage, au-dessus du socle de boutons. --- */
#recrutChrono{position:fixed;left:50%;bottom:6px;transform:translateX(-50%);z-index:61;padding:4px 12px;white-space:nowrap;}
#recrutChrono.recrutDep{bottom:80px;}
#recrutChrono.recrutUrgent{background-color:#c20;}
#recrutChrono .recrutStop{margin-left:12px;text-decoration:underline;}
/* Voile de fin d'épreuve (réussie, temps écoulé, abandon) ou de confirmation : au-dessus de tout le labo
   (plein écran 50, boutons 58-59, plan 70), il bloque les clics ; un seul bouton pour revenir au test. */
#recrutVoile{position:fixed;top:0;left:0;right:0;bottom:0;z-index:75;background-color:rgba(0,16,32,0.75);display:flex;align-items:center;justify-content:center;}
#recrutVoile > div{max-width:560px;width:92vw;box-sizing:border-box;}

/* --- Résultats du patron --- */
.recrutDefile{overflow-x:auto;max-width:100%;}   /* sur téléphone, le tableau défile dans son cadre, pas toute la page */
.recrutTable{border-collapse:collapse;margin:8px auto;}
.recrutTable th,.recrutTable td{border:1px solid #ccd;padding:4px 8px;text-align:left;vertical-align:top;}
.recrutTable th{background-color:#e8f0f8;}
.recrutCandidat{max-width:1000px;margin:18px auto;box-sizing:border-box;text-align:left;break-inside:avoid;page-break-inside:avoid;}
.recrutCandidat meter{width:80px;vertical-align:middle;}
.recrutTable td.recrutRes{white-space:nowrap;}

@media print{
	#recrutChrono,#recrutVoile,.recrutNoPrint{display:none;}
	.recrutCandidat{box-shadow:none;}
}