/**
 * AISI — Habillage de la page de connexion.
 *
 * Charte reprise du site vitrine :
 *   Primary    #31a3dd   bleu AISI, boutons et focus
 *   Primary B  #f06a36   orange, réservé aux alertes
 *   Secondary  #566d8f   bleu-gris, liens secondaires
 *   Text       #2b2c28   texte courant
 *   Alt White  #eff4fb   fond de page
 *   Grey       #999999   mentions discrètes
 * Typographie : Nunito (courante) et Saira (titres), comme sur le site.
 */

:root {
	--aisi-primary: #31a3dd;
	--aisi-primary-fonce: #2489bd;
	--aisi-alerte: #f06a36;
	--aisi-secondary: #566d8f;
	--aisi-texte: #2b2c28;
	--aisi-fond: #eff4fb;
	--aisi-gris: #999999;
	--aisi-rayon: 3px;
	--aisi-sans: "Nunito", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	--aisi-titre: "Saira", var(--aisi-sans);
}

/* ------------------------------------------------------------------ Page */

body.login {
	background: var(--aisi-fond);
	font-family: var(--aisi-sans);
	color: var(--aisi-texte);
	/* Halo bleu très diffus en haut de page, écho au dégradé du site. */
	background-image:
		radial-gradient( ellipse 80% 50% at 50% -10%, rgba( 49, 163, 221, 0.18 ), transparent 70% ),
		radial-gradient( ellipse 60% 40% at 100% 100%, rgba( 86, 109, 143, 0.10 ), transparent 70% );
	background-repeat: no-repeat;
	background-attachment: fixed;
}

body.login #login {
	width: 340px;
	max-width: calc( 100vw - 2.5rem );
	padding: 6vh 0 1.25rem;
}

/* ------------------------------------------------------------------ Logo */

body.login h1.wp-login-logo,
body.login h1:has( > a ) {
	margin-bottom: 1.75rem;
}

body.login .wp-login-logo a,
body.login h1 a {
	background-image: url( "logo-aisi.png" );
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	width: 216px;
	height: 76px;
	margin: 0 auto;
	/* Neutralise le libellé « Propulsé par WordPress » du cœur. */
	text-indent: -9999em;
	overflow: hidden;
}

/* --------------------------------------------------------------- Le bloc */

body.login form {
	background: #ffffff;
	border: 1px solid rgba( 86, 109, 143, 0.14 );
	border-radius: 6px;
	box-shadow: 0 1px 2px rgba( 43, 44, 40, 0.04 ), 0 12px 32px -12px rgba( 86, 109, 143, 0.22 );
	padding: 1.75rem 1.5rem 1.5rem;
	margin-top: 0;
}

body.login form label {
	font-size: 0.8125rem;
	font-weight: 600;
	color: var(--aisi-secondary);
	letter-spacing: 0.01em;
}

body.login form .input,
body.login input[type="text"],
body.login input[type="password"] {
	background: #ffffff;
	border: 1px solid rgba( 86, 109, 143, 0.28 );
	border-radius: var(--aisi-rayon);
	color: var(--aisi-texte);
	font-family: var(--aisi-sans);
	font-size: 0.9375rem;
	padding: 0.5rem 0.6rem;
	box-shadow: none;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

body.login form .input:focus,
body.login input[type="text"]:focus,
body.login input[type="password"]:focus {
	border-color: var(--aisi-primary);
	box-shadow: 0 0 0 3px rgba( 49, 163, 221, 0.16 );
	outline: none;
}

body.login .wp-pwd button.wp-hide-pw .dashicons {
	color: var(--aisi-secondary);
}

body.login .wp-pwd button.wp-hide-pw:hover .dashicons,
body.login .wp-pwd button.wp-hide-pw:focus .dashicons {
	color: var(--aisi-primary);
}

body.login .wp-pwd button.wp-hide-pw:focus {
	box-shadow: 0 0 0 2px rgba( 49, 163, 221, 0.35 );
	border-radius: var(--aisi-rayon);
}

/* ---------------------------------------------------------------- Bouton */

body.login .button-primary,
body.login #wp-submit {
	background: var(--aisi-primary);
	border: 1px solid var(--aisi-primary);
	border-radius: var(--aisi-rayon);
	box-shadow: none;
	color: #ffffff;
	font-family: var(--aisi-titre);
	font-size: 0.9375rem;
	font-weight: 600;
	letter-spacing: 0.02em;
	text-shadow: none;
	height: auto;
	padding: 0.55rem 1.1rem;
	width: 100%;
	transition: background-color 0.15s ease, border-color 0.15s ease;
}

body.login .button-primary:hover,
body.login #wp-submit:hover,
body.login .button-primary:focus,
body.login #wp-submit:focus {
	background: var(--aisi-primary-fonce);
	border-color: var(--aisi-primary-fonce);
	box-shadow: 0 0 0 3px rgba( 49, 163, 221, 0.22 );
	color: #ffffff;
}

body.login .forgetmenot label {
	font-weight: 400;
	color: var(--aisi-texte);
}

body.login input[type="checkbox"]:checked::before {
	content: "";
}

body.login input[type="checkbox"]:checked {
	background: var(--aisi-primary);
	border-color: var(--aisi-primary);
}

/* ----------------------------------------------------------- Liens & pied */

body.login #nav,
body.login #backtoblog {
	padding: 0;
	text-align: center;
	font-size: 0.8125rem;
}

body.login #nav {
	margin: 1.15rem 0 0.35rem;
}

body.login #backtoblog {
	margin: 0;
}

body.login #nav a,
body.login #backtoblog a {
	color: var(--aisi-secondary);
	text-decoration: none;
	transition: color 0.15s ease;
}

body.login #nav a:hover,
body.login #backtoblog a:hover,
body.login #nav a:focus,
body.login #backtoblog a:focus {
	color: var(--aisi-primary);
	text-decoration: underline;
}

body.login #nav a:focus,
body.login #backtoblog a:focus,
body.login h1 a:focus {
	box-shadow: none;
	outline: 2px solid var(--aisi-primary);
	outline-offset: 3px;
	border-radius: 2px;
}

/* Lien vers la politique de confidentialité, ajouté par le cœur. */
body.login .privacy-policy-page-link {
	margin: 0.9rem 0 0;
	text-align: center;
}

body.login .privacy-policy-page-link a,
body.login .privacy-policy-page-link .privacy-policy-link {
	color: var(--aisi-gris);
	font-size: 0.75rem;
	text-decoration: none;
	transition: color 0.15s ease;
}

body.login .privacy-policy-page-link a:hover,
body.login .privacy-policy-page-link a:focus {
	color: var(--aisi-primary);
	text-decoration: underline;
}

/* Sélecteur de langue : le back-office est francophone, il n'a pas d'usage ici. */
body.login .language-switcher {
	display: none;
}

/* Mention de pied ajoutée par le mu-plugin. */
.aisi-mention {
	margin: 1rem 0 0;
	text-align: center;
	font-size: 0.75rem;
	line-height: 1.6;
	color: var(--aisi-gris);
}

.aisi-mention strong {
	display: block;
	font-family: var(--aisi-titre);
	font-size: 0.8125rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--aisi-secondary);
	font-weight: 600;
}

/* ------------------------------------------------------------- Messages */

body.login .message,
body.login .notice,
body.login #login_error {
	border-radius: var(--aisi-rayon);
	border-left-width: 3px;
	box-shadow: 0 1px 2px rgba( 43, 44, 40, 0.05 );
	font-size: 0.875rem;
	padding: 0.75rem 0.9rem;
}

body.login #login_error {
	border-left-color: var(--aisi-alerte);
	background: #fff6f2;
	color: var(--aisi-texte);
}

body.login .message,
body.login .notice-info {
	border-left-color: var(--aisi-primary);
	background: #f2f9fd;
	color: var(--aisi-texte);
}

body.login .success {
	border-left-color: var(--aisi-primary);
}

/* --------------------------------------------------------- Cas de figure */

/* Écran « mot de passe oublié » et réinitialisation. */
body.login-action-lostpassword form,
body.login-action-rp form,
body.login-action-resetpass form {
	padding-top: 1.5rem;
}

body.login .description,
body.login .indicator-hint {
	color: var(--aisi-gris);
	font-size: 0.8125rem;
}

/* Fenêtre de reconnexion affichée par-dessus l'admin : pas de fond de page. */
body.interim-login #login {
	padding-top: 1.5rem;
}

body.interim-login .wp-login-logo a,
body.interim-login h1 a {
	width: 150px;
	height: 52px;
}

/* --------------------------------------------------------- Petits écrans */

@media screen and ( max-width: 480px ) {
	body.login #login {
		padding-top: 3vh;
	}

	body.login .wp-login-logo a,
	body.login h1 a {
		width: 165px;
		height: 58px;
	}
}

/* ------------------------------------------------- Préférences système */

@media ( prefers-reduced-motion: reduce ) {
	body.login *,
	body.login *::before,
	body.login *::after {
		transition: none !important;
	}
}
