/*
 * Page de connexion WordPress personnalisée, identité DCOD.
 * Fond sombre (#121212) + carte blanche pour le formulaire : le fond pose le
 * ton "actif/pro" de la marque, la carte garde les champs de saisie à fort
 * contraste, plus lisibles qu'un formulaire sombre sur sombre.
 */

/* Centrage vertical réel de toute la carte (logo + tagline + formulaire +
   liens) dans la fenêtre, plutôt qu'un margin-top fixe (7vh) qui la
   laissait "collée" près du haut sur les fenêtres hautes - surtout depuis
   que l'en-tête (logo + tagline) tient désormais sur une seule ligne, donc
   plus courte qu'avant. */
body.login {
	background-color: #121212;
	background-image: radial-gradient(circle, rgba(255, 255, 255, 0.06) 1px, transparent 1px);
	background-size: 24px 24px;
	font-family: 'Inter', -apple-system, "Segoe UI", sans-serif;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	/* "safe center" (2e déclaration, ignorée des navigateurs qui ne la
	   comprennent pas - la 1re reste alors active) : sur une fenêtre basse,
	   un centrage classique peut pousser le DÉBUT du contenu au-dessus du
	   haut de l'écran, invisible sans remonter le défilement - exactement
	   "je ne vois plus le logo" en réduisant la fenêtre. "safe" indique au
	   navigateur de replier sur un alignement en haut plutôt que de risquer
	   de cacher du contenu. */
	justify-content: safe center;
	min-height: 100vh;
}

body.login div#login {
	padding: 0;
	width: 368px;
	max-width: calc(100vw - 40px);
	/* Le centrage vient du flex sur body.login ci-dessus ; cette marge n'est
	   qu'un minimum de respiration si le contenu dépasse la hauteur de
	   l'écran (petit mobile, zoom élevé). */
	margin: 10px 0;
	animation: dcod-login-in 0.5s cubic-bezier(0.16, 0.8, 0.3, 1);
}

@media (prefers-reduced-motion: reduce) {
	body.login div#login {
		animation: none;
	}
}

@keyframes dcod-login-in {
	from {
		opacity: 0;
		transform: translateY(10px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

/* Logo + accroche sur une seule ligne, compacts : les deux éléments sont
   des frères directs dans le HTML de WordPress (pas de conteneur commun à
   ajouter), donc mis en ligne (inline-block) plutôt qu'empilés, centrés
   via text-align sur #login - sans risque pour la carte du formulaire
   juste en dessous, qui reste un bloc avec sa propre largeur, insensible
   à text-align. Image de fond posée par dcod_login_style() (functions.php,
   URL du média DCOD réel), texte de secours masqué derrière (text-indent).
   Classe réelle confirmée via le code source de la page en production :
   h1.wp-login-logo (pas seulement "h1" - l'autre h1 de la page,
   .screen-reader-text, ne doit jamais être visée). SVG vert/blanc,
   proportion ~2:1 (150x75), dimensionné en conséquence. */
body.login #login {
	text-align: center;
}

body.login h1.wp-login-logo,
body.login .dcod-login-tagline {
	display: inline-block;
	vertical-align: middle;
	margin: 0 6px 12px;
	padding: 0;
	line-height: 1;
}

body.login h1.wp-login-logo a {
	background-repeat: no-repeat;
	background-position: center;
	background-size: 132px auto;
	width: 132px;
	height: 66px;
	display: block;
	text-indent: -9999px;
	overflow: hidden;
	filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.35));
}

body.login .dcod-login-tagline {
	font-family: 'Space Grotesk', 'Inter', sans-serif;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #9bdd1a;
}

/* Carte du formulaire. */
body.login #loginform {
	background: #ffffff;
	border: none;
	border-radius: 14px;
	box-shadow: 0 20px 50px -14px rgba(0, 0, 0, 0.55);
	padding: 22px 24px 18px;
}

/* Rythme vertical resserré entre les blocs du formulaire (champ
   identifiant, mot de passe, "se souvenir de moi", bouton, séparateur "ou",
   bouton passkey) : WordPress et Really Simple Security posent chacun
   leurs propres marges par défaut sur ces éléments, jamais reprises
   jusqu'ici - d'où l'accumulation de grands espaces. Ciblés directement en
   enfants de #loginform pour ne pas déborder sur d'autres pages/contextes
   qui réutiliseraient les mêmes classes. */
body.login #loginform > p,
body.login #loginform > div.user-pass-wrap {
	margin: 0 0 12px;
}

body.login #loginform > p.forgetmenot {
	margin: 0 0 14px;
}

body.login #loginform > p.submit {
	margin: 0;
}

body.login #loginform .or-divider {
	margin: 12px 0 !important;
}

body.login #loginform #rsssl-passkey-button-container {
	margin-top: 2px !important;
}

body.login #loginform label {
	font-family: 'Space Grotesk', 'Inter', sans-serif;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: #52514e;
}

body.login #loginform .input,
body.login #loginform input[type="text"],
body.login #loginform input[type="password"] {
	border: 1.5px solid #e2e5dc;
	border-radius: 8px;
	padding: 11px 12px;
	font-size: 15px;
	box-shadow: none;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

body.login #loginform .input:focus,
body.login #loginform input[type="text"]:focus,
body.login #loginform input[type="password"]:focus {
	border-color: #88cc00;
	box-shadow: 0 0 0 3px rgba(136, 204, 0, 0.25);
}

body.login .forgetmenot label {
	text-transform: none;
	letter-spacing: normal;
	font-weight: 400;
	font-size: 13px;
	color: #52514e;
}

/* Bouton : vert de marque plein, même traitement que les CTA de la carte de
   sécurité (modules/securitytxt-map/assets/css/map.css).
   BUG CORRIGÉ (v1.0.26 -> v1.0.27) : ".wp-core-ui" est une classe posée sur
   <body> elle-même (confirmé via le code source réel), pas sur un
   conteneur autour du formulaire - "body.login .wp-core-ui .button-primary"
   exigeait donc que .wp-core-ui soit un DESCENDANT de body.login, ce qu'il
   n'est jamais (même élément), et ne correspondait donc à rien : le bouton
   restait bleu par défaut. Sélecteur simplifié, sans cette classe inutile. */
/* "!important" désormais sur TOUTES ces propriétés (pas seulement
   couleur/fond) : la parité de hauteur avec #passkey-login-button
   (plus bas) en dépend - si une seule des deux règles laisse passer une
   valeur non protégée, une feuille de style tierce (WordPress core, Really
   Simple Security) peut la court-circuiter sur un seul des deux boutons et
   rompre l'alignement. Les deux règles doivent rester strictement
   identiques sur padding/font-size/line-height/height/width. */
body.login .button-primary {
	background: #88cc00 !important;
	border: none !important;
	color: #121212 !important;
	font-family: 'Space Grotesk', 'Inter', sans-serif !important;
	font-weight: 700 !important;
	font-size: 13px !important;
	line-height: normal !important;
	letter-spacing: 0.02em !important;
	text-transform: uppercase !important;
	text-shadow: none !important;
	box-shadow: none !important;
	border-radius: 8px !important;
	padding: 11px 0 !important;
	height: auto !important;
	width: 100% !important;
	box-sizing: border-box !important;
	transition: background-color 0.15s ease, transform 0.15s ease;
}

body.login .button-primary:hover,
body.login .button-primary:focus {
	background: #79b800 !important;
	color: #121212 !important;
	transform: translateY(-1px);
	box-shadow: 0 6px 16px -6px rgba(136, 204, 0, 0.6);
}

body.login .button-primary:active {
	transform: translateY(0);
}

/* Liens sous la carte : discrets sur fond sombre. */
body.login #nav,
body.login #backtoblog {
	text-align: center;
	margin: 8px 0 0;
}

body.login #nav a,
body.login #backtoblog a {
	color: rgba(255, 255, 255, 0.72);
	font-size: 12.5px;
	text-decoration: none;
}

body.login #nav a:hover,
body.login #backtoblog a:hover {
	color: #ffffff;
	text-decoration: underline;
}

/* Messages d'erreur/info WordPress (identifiants invalides, etc.). */
body.login #login_error,
body.login .message,
body.login .success {
	border-radius: 10px;
	border: none;
	border-left: 4px solid #d63638;
	background: #ffffff;
	box-shadow: 0 10px 30px -12px rgba(0, 0, 0, 0.4);
	font-size: 13px;
	padding: 12px 14px;
}

body.login .message,
body.login .success {
	border-left-color: #88cc00;
}

body.login p.forgetmenot input {
	accent-color: #88cc00;
}

/* Bouton "afficher le mot de passe" (icône œil) : natif WordPress, jamais
   ciblé jusqu'ici - il retombe donc sur le bleu du thème d'admin
   "admin-color-modern" (classe posée sur <body>, confirmée via le code
   source réel). Les deux états de l'icône (dashicons-visibility = affiché,
   dashicons-hidden = masqué) sont couverts, WordPress bascule de l'un à
   l'autre au clic. */
body.login .wp-hide-pw {
	background: transparent;
	border: none;
	box-shadow: none;
}

body.login .wp-hide-pw .dashicons-visibility,
body.login .wp-hide-pw .dashicons-hidden {
	color: #83887e;
}

body.login .wp-hide-pw:hover .dashicons-visibility,
body.login .wp-hide-pw:hover .dashicons-hidden {
	color: #121212;
}

/* Bouton "Se connecter avec Clé d'accès" (passkey/WebAuthn, Really Simple
   Security Pro) : balisage réel confirmé -
   <button id="passkey-login-button" class="button button-primary">
   Il porte donc DÉJÀ la classe .button-primary (règle plus haut) : le
   fond vert s'appliquait déjà, mais pas nécessairement la taille exacte
   (font-size/padding), le plugin pouvant reposer les siennes avec une
   spécificité au moins égale sur ce même élément. Sélecteur par ID pour
   garantir une parité totale avec "Se connecter", quel que soit l'ordre
   de chargement des feuilles de style.
   BUG CORRIGÉ (v1.0.27 -> v1.0.28) : le sélecteur précédent
   ([class*="passkey"]) ne correspondait à RIEN sur ce bouton réel - sa
   classe ne contient jamais "passkey", seul son id le contient. Conservé
   ci-dessous en repli défensif pour d'autres contextes du même plugin,
   mais la règle par id est désormais la source de vérité pour ce bouton. */
body.login #passkey-login-button {
	background: #88cc00 !important;
	border: none !important;
	color: #121212 !important;
	font-family: 'Space Grotesk', 'Inter', sans-serif !important;
	font-weight: 700 !important;
	font-size: 13px !important;
	line-height: normal !important;
	letter-spacing: 0.02em !important;
	text-transform: uppercase !important;
	text-shadow: none !important;
	box-shadow: none !important;
	border-radius: 8px !important;
	padding: 11px 0 !important;
	height: auto !important;
	width: 100% !important;
	box-sizing: border-box !important;
}

body.login #passkey-login-button:hover,
body.login #passkey-login-button:focus {
	background: #79b800 !important;
	color: #121212 !important;
}

body.login #passkey-login-button .dashicons {
	color: #121212 !important;
	font-size: 15px;
	width: auto;
	height: auto;
	line-height: 1;
}

/* Repli défensif (classe contenant "passkey"), pour d'autres boutons du
   même plugin ailleurs sur cette page - voir le commentaire ci-dessus. */
body.login button[class*="passkey" i],
body.login a[class*="passkey" i],
body.login input[class*="passkey" i] {
	background: #88cc00 !important;
	border: none !important;
	color: #121212 !important;
	box-shadow: none !important;
	border-radius: 8px !important;
	font-family: 'Space Grotesk', 'Inter', sans-serif !important;
	font-weight: 700 !important;
	font-size: 13px !important;
	text-transform: none !important;
}

body.login button[class*="passkey" i]:hover,
body.login a[class*="passkey" i]:hover,
body.login input[class*="passkey" i]:hover {
	background: #79b800 !important;
	color: #121212 !important;
}

/* Le conteneur éventuel autour d'un tel bouton ne doit lui-même porter ni
   bordure ni fond - seul le bouton en a un. */
body.login div[class*="passkey" i],
body.login span[class*="passkey" i] {
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
}

/* Lien "Politique de confidentialité" : classe réelle confirmée
   (.privacy-policy-link) - le bleu WordPress par défaut (#2271b1) est
   quasi invisible sur le fond sombre de cette page. */
body.login .privacy-policy-page-link {
	text-align: center;
	margin-top: 8px;
}

body.login .privacy-policy-link {
	color: rgba(255, 255, 255, 0.55);
	font-size: 11.5px;
	text-decoration: underline;
	text-decoration-color: rgba(255, 255, 255, 0.3);
}

body.login .privacy-policy-link:hover {
	color: #ffffff;
	text-decoration-color: #ffffff;
}

/* Le sélecteur de langue est désactivé côté PHP (login_display_language_dropdown,
   functions.php) - jamais rendu, donc plus rien à styler ici. */