/**
 * Login Personalizado - By Aló — hoja de estilos de wp-login.php
 *
 * Todo el aspecto sale de variables CSS que imprime el plugin. Esta hoja
 * es fija: cubre el marcado completo del login (núcleo de WordPress,
 * mensajes, medidor de contraseña, selector de idioma) y los añadidos de
 * Wordfence (2FA, passkey y su ventana modal), de modo que ningún elemento
 * quede con el estilo por defecto de WordPress.
 */

/* ------------------------------------------------------------ Respaldos */

:root {
	--alc-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--alc-font-heading: var(--alc-font);
	--alc-base-size: 15px;
	--alc-base-color: #1a1a1a;
	--alc-line-height: 1.5em;

	--alc-bg-color: #f2f2f2;
	--alc-bg-layer: none;
	--alc-bg-image: none;
	--alc-bg-image-mobile: var(--alc-bg-image);
	--alc-bg-size: cover;
	--alc-bg-position: center center;
	--alc-bg-repeat: no-repeat;
	--alc-bg-overlay: rgba(0, 0, 0, 0);
	--alc-bg-blur: 0px;

	--alc-panel-width: 480px;
	--alc-panel-bg: #fff;

	--alc-logo-width: 220px;
	--alc-logo-radius: 0px;
	--alc-logo-gap: 24px;
	--alc-logo-text-color: #1a1a1a;
	--alc-logo-text-size: 28px;
	--alc-logo-text-weight: 700;

	--alc-card-bg: #fff;
	--alc-card-width: 360px;
	--alc-card-padding: 32px;
	--alc-card-radius: 16px;
	--alc-card-border-width: 0px;
	--alc-card-border-color: rgba(0, 0, 0, 0.08);
	--alc-card-shadow: 0 18px 48px rgba(0, 0, 0, 0.12);
	--alc-card-blur: 0px;

	--alc-field-bg: #fff;
	--alc-field-color: #1a1a1a;
	--alc-field-placeholder: rgba(26, 26, 26, 0.45);
	--alc-field-size: 16px;
	--alc-field-height: 48px;
	--alc-field-padding: 0 14px;
	--alc-field-radius: 10px;
	--alc-field-border-width: 1px;
	--alc-field-border-color: rgba(0, 0, 0, 0.16);
	--alc-field-gap: 18px;
	--alc-field-focus-border: #8fab94;
	--alc-field-focus-bg: #fff;
	--alc-field-focus-ring: 0 0 0 3px rgba(143, 171, 148, 0.25);
	--alc-field-icon-color: #6b6b6b;

	--alc-label-color: #1a1a1a;
	--alc-label-size: 14px;
	--alc-label-weight: 500;

	--alc-check-color: #8fab94;
	--alc-check-mark: #fff;
	--alc-check-radius: 4px;
	--alc-check-label-color: #3c3c3c;

	--alc-btn-bg: #8fab94;
	--alc-btn-color: #fff;
	--alc-btn-radius: 10px;
	--alc-btn-height: 48px;
	--alc-btn-width: 100%;
	--alc-btn-size: 15px;
	--alc-btn-weight: 400;
	--alc-btn-transform: none;
	--alc-btn-letter: 0px;
	--alc-btn-border-width: 0px;
	--alc-btn-border-color: rgba(0, 0, 0, 0);
	--alc-btn-shadow: none;
	--alc-btn-gap: 10px;
	--alc-btn-hover-bg: #4f796b;
	--alc-btn-hover-color: #fff;
	--alc-btn-hover-border: rgba(0, 0, 0, 0);
	--alc-btn-hover-shadow: none;

	--alc-btn2-bg: rgba(0, 0, 0, 0);
	--alc-btn2-color: #1a1a1a;
	--alc-btn2-border-color: rgba(0, 0, 0, 0.18);
	--alc-btn2-border-width: 1px;
	--alc-btn2-radius: 10px;
	--alc-btn2-hover-bg: rgba(0, 0, 0, 0.05);
	--alc-btn2-hover-color: #1a1a1a;

	--alc-link-color: #1a1a1a;
	--alc-link-hover: #8fab94;
	--alc-link-size: 14px;
	--alc-link-weight: 400;
	--alc-link-decoration: none;
	--alc-link-shadow: none;

	--alc-msg-radius: 10px;
	--alc-msg-padding: 12px 14px;
	--alc-msg-size: 14px;
	--alc-msg-accent-width: 0px;
	--alc-msg-info-bg: #fff;
	--alc-msg-info-color: #1a1a1a;
	--alc-msg-info-accent: #8fab94;
	--alc-msg-error-bg: #fff5f5;
	--alc-msg-error-color: #8a1c1c;
	--alc-msg-error-accent: #d63638;
	--alc-msg-success-bg: #f2f9f4;
	--alc-msg-success-color: #14401f;
	--alc-msg-success-accent: #4f796b;

	--alc-pw-weak: #d63638;
	--alc-pw-medium: #dba617;
	--alc-pw-strong: #4f796b;

	--alc-wf-overlay-bg: #fff;
	--alc-wf-text-color: #1a1a1a;
	--alc-wf-radius: 12px;
	--alc-wf-divider: rgba(0, 0, 0, 0.14);
	--alc-wf-divider-text: #6b6b6b;
	--alc-wf-icon-color: #1a1a1a;
	--alc-wf-modal-shadow: 0 18px 48px rgba(0, 0, 0, 0.18);
	--alc-wf-code-size: 18px;
	--alc-wf-code-letter: 2px;
}

/* --------------------------------------------------------------- Página */

body.login.alc {
	min-height: 100vh;
	margin: 0;
	background-color: var(--alc-bg-color);
	background-image: var(--alc-bg-layer);
	font-family: var(--alc-font);
	font-size: var(--alc-base-size);
	line-height: var(--alc-line-height);
	color: var(--alc-base-color);
}

/* Capa de la imagen de fondo: separada para poder desenfocarla sin tocar
   el contenido. */
body.login.alc.alc-bg-image::before {
	content: "";
	position: fixed;
	inset: 0;
	z-index: -2;
	background-image: var(--alc-bg-image);
	background-size: var(--alc-bg-size);
	background-position: var(--alc-bg-position);
	background-repeat: var(--alc-bg-repeat);
	filter: blur(var(--alc-bg-blur));
	transform: scale(1.04); /* evita el borde claro que deja el desenfoque */
}

body.login.alc.alc-bg-image::after {
	content: "";
	position: fixed;
	inset: 0;
	z-index: -1;
	background-color: var(--alc-bg-overlay);
	pointer-events: none;
}

/* Composición centrada */
body.login.alc-layout-centered {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 40px 20px;
	box-sizing: border-box;
}

body.login.alc-layout-centered #login {
	width: var(--alc-card-width);
	max-width: 100%;
	padding: 0;
	margin: 0;
}

/* Composición con panel lateral */
body.login.alc-layout-left,
body.login.alc-layout-right {
	display: grid;
	grid-template-rows: 1fr auto;
	min-height: 100vh;
}

body.login.alc-layout-left {
	grid-template-columns: var(--alc-panel-width) 1fr;
}

body.login.alc-layout-right {
	grid-template-columns: 1fr var(--alc-panel-width);
}

body.login.alc-layout-left #login,
body.login.alc-layout-right #login,
body.login.alc-layout-left .language-switcher,
body.login.alc-layout-right .language-switcher {
	background: var(--alc-panel-bg);
	width: 100%;
	max-width: none;
	margin: 0;
	box-sizing: border-box;
}

body.login.alc-layout-left #login,
body.login.alc-layout-right #login {
	grid-row: 1;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 48px 40px;
}

body.login.alc-layout-left .language-switcher,
body.login.alc-layout-right .language-switcher {
	grid-row: 2;
	padding: 0 40px 32px;
}

body.login.alc-layout-left #login,
body.login.alc-layout-left .language-switcher {
	grid-column: 1;
}

body.login.alc-layout-right #login,
body.login.alc-layout-right .language-switcher {
	grid-column: 2;
}

/* En el panel, el contenido se limita al ancho de la tarjeta y se centra. */
body.login.alc-layout-left #login > *,
body.login.alc-layout-right #login > * {
	max-width: var(--alc-card-width);
	width: 100%;
	margin-left: auto;
	margin-right: auto;
}

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

body.login.alc #login h1,
body.login.alc .wp-login-logo {
	margin: 0 0 var(--alc-logo-gap);
	padding: 0;
	text-align: center;
}

body.login.alc #login h1 a,
body.login.alc .wp-login-logo a {
	display: inline-block;
	width: auto;
	height: auto;
	max-width: 100%;
	margin: 0 auto;
	padding: 0;
	background: none;
	font-size: 0;
	line-height: 0;
	text-indent: 0;
	outline-offset: 4px;
}

/* El alto lo resuelve el navegador con la proporción real del archivo. */
body.login.alc #login h1 a .alc-logo {
	display: block;
	width: var(--alc-logo-width);
	height: auto;
	max-width: 100%;
	margin: 0 auto;
	border-radius: var(--alc-logo-radius);
}

/* Respaldo por si la imagen del logo no carga. */
body.login.alc #login h1 a .alc-logo-fallback {
	display: none;
}

body.login.alc #login h1.alc-logo-failed a .alc-logo {
	display: none;
}

body.login.alc #login h1.alc-logo-failed a .alc-logo-fallback {
	display: block;
	font-family: var(--alc-font-heading);
	font-size: var(--alc-logo-text-size);
	font-weight: var(--alc-logo-text-weight);
	line-height: 1.2;
	color: var(--alc-logo-text-color);
}

/* Logo en texto: se muestra el nombre del sitio en vez de la imagen. */
body.login.alc.alc-logo-text #login h1 a {
	width: auto;
	height: auto;
	font-family: var(--alc-font-heading);
	font-size: var(--alc-logo-text-size);
	font-weight: var(--alc-logo-text-weight);
	line-height: 1.2;
	color: var(--alc-logo-text-color);
	text-indent: 0;
	text-decoration: none;
	overflow: visible;
}

body.login.alc.alc-logo-none #login h1 {
	display: none;
}

/* -------------------------------------------------------------- Tarjeta */

body.login.alc #login form {
	box-sizing: border-box;
	margin: 0;
	padding: var(--alc-card-padding);
	background: var(--alc-card-bg);
	border: var(--alc-card-border-width) solid var(--alc-card-border-color);
	border-radius: var(--alc-card-radius);
	box-shadow: var(--alc-card-shadow);
	backdrop-filter: blur(var(--alc-card-blur));
	-webkit-backdrop-filter: blur(var(--alc-card-blur));
	font-family: var(--alc-font);
	font-size: var(--alc-base-size);
	color: var(--alc-base-color);
	overflow: visible;
}

/* El selector de idioma no es un formulario "tarjeta". */
body.login.alc #language-switcher,
body.login.alc .language-switcher form {
	padding: 0;
	background: none;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
}

/* Mensajes libres del plugin */
body.login.alc .alc-intro,
body.login.alc .alc-footer,
body.login.alc .alc-custom-html {
	margin: 0 auto var(--alc-logo-gap);
	max-width: var(--alc-card-width);
	width: 100%;
	color: var(--alc-base-color);
	font-size: var(--alc-base-size);
	text-align: center;
}

body.login.alc .alc-intro p:last-child,
body.login.alc .alc-footer p:last-child {
	margin-bottom: 0;
}

body.login.alc .alc-footer,
body.login.alc .alc-custom-html {
	margin: 24px auto 0;
	font-size: var(--alc-link-size);
}

/* --------------------------------------------------------------- Campos */

body.login.alc #login form p,
body.login.alc #login form .user-pass-wrap {
	margin: 0 0 var(--alc-field-gap);
}

body.login.alc #login form p:last-child,
body.login.alc #login form .submit {
	margin-bottom: 0;
}

body.login.alc #login form label,
body.login.alc #login form legend {
	display: block;
	margin-bottom: 6px;
	color: var(--alc-label-color);
	font-family: var(--alc-font);
	font-size: var(--alc-label-size);
	font-weight: var(--alc-label-weight);
	line-height: 1.4;
}

body.login.alc #login form input[type="text"],
body.login.alc #login form input[type="email"],
body.login.alc #login form input[type="password"],
body.login.alc #login form input[type="tel"],
body.login.alc #login form input[type="number"],
body.login.alc #login form textarea,
body.login.alc #login form select,
body.login.alc #login form .input {
	box-sizing: border-box;
	display: block;
	width: 100%;
	height: var(--alc-field-height);
	margin: 0;
	padding: var(--alc-field-padding);
	background: var(--alc-field-bg);
	color: var(--alc-field-color);
	border: var(--alc-field-border-width) solid var(--alc-field-border-color);
	border-radius: var(--alc-field-radius);
	box-shadow: none;
	font-family: var(--alc-font);
	font-size: var(--alc-field-size);
	line-height: 1.4;
	transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

body.login.alc #login form textarea {
	height: auto;
	padding: 12px 14px;
}

body.login.alc #login form input::placeholder,
body.login.alc #login form textarea::placeholder {
	color: var(--alc-field-placeholder);
	opacity: 1;
}

body.login.alc #login form input:focus,
body.login.alc #login form textarea:focus,
body.login.alc #login form select:focus,
body.login.alc #login form .input:focus {
	background: var(--alc-field-focus-bg);
	border-color: var(--alc-field-focus-border);
	box-shadow: var(--alc-field-focus-ring);
	outline: none;
}

/* Autocompletado del navegador: conserva el color de texto elegido. */
body.login.alc #login form input:-webkit-autofill,
body.login.alc #login form input:-webkit-autofill:focus {
	-webkit-text-fill-color: var(--alc-field-color);
	transition: background-color 100000s ease-in-out 0s;
}

/* Contraseña con botón de ver/ocultar */
body.login.alc #login .user-pass-wrap .wp-pwd {
	position: relative;
	display: block;
}

body.login.alc #login .user-pass-wrap .wp-pwd input {
	padding-right: calc(var(--alc-field-height) + 4px);
}

body.login.alc #login .wp-hide-pw {
	position: absolute;
	top: 0;
	right: 0;
	width: var(--alc-field-height);
	height: var(--alc-field-height);
	min-height: 0;
	padding: 0;
	background: none;
	border: 0;
	border-radius: 0 var(--alc-field-radius) var(--alc-field-radius) 0;
	box-shadow: none;
	color: var(--alc-field-icon-color);
	cursor: pointer;
}

body.login.alc #login .wp-hide-pw:hover,
body.login.alc #login .wp-hide-pw:focus {
	background: none;
	box-shadow: none;
	color: var(--alc-field-focus-border);
	outline: none;
}

body.login.alc #login .wp-hide-pw .dashicons {
	width: 20px;
	height: 20px;
	font-size: 20px;
	line-height: 20px;
	vertical-align: middle;
}

body.login.alc.alc-hide-pwtoggle #login .wp-hide-pw {
	display: none;
}

body.login.alc.alc-hide-pwtoggle #login .user-pass-wrap .wp-pwd input {
	padding-right: 14px;
}

/* Recordarme */
body.login.alc #login form .forgetmenot {
	display: flex;
	align-items: center;
	gap: 8px;
	float: none;
	margin-bottom: var(--alc-field-gap);
	font-weight: 400;
}

body.login.alc #login form .forgetmenot label {
	display: inline;
	margin: 0;
	color: var(--alc-check-label-color);
	font-size: var(--alc-link-size);
	font-weight: 400;
	line-height: 1.3;
}

/* WordPress deja el checkbox sin apariencia nativa y dibuja la marca él mismo,
   con una imagen en ::before. Forzar la apariencia nativa hace que se vean dos
   marcas superpuestas: la del navegador y la de WordPress. Por eso acá se
   mantiene sin apariencia nativa y se dibuja una sola marca, que además sigue
   el color elegido (la de WordPress es blanca fija). */
body.login.alc #login form input[type="checkbox"] {
	position: relative;
	appearance: none;
	-webkit-appearance: none;
	width: 18px;
	height: 18px;
	min-width: 18px;
	margin: 0;
	padding: 0;
	background: var(--alc-field-bg);
	border: 1px solid var(--alc-field-border-color);
	border-radius: var(--alc-check-radius);
	box-shadow: none;
	cursor: pointer;
	transition: background-color 0.15s ease, border-color 0.15s ease;
}

body.login.alc #login form input[type="checkbox"]:checked {
	background: var(--alc-check-color);
	border-color: var(--alc-check-color);
}

body.login.alc #login form input[type="checkbox"]::before,
body.login.alc #login form input[type="checkbox"]:checked::before {
	content: "";
	position: absolute;
	top: 45%;
	left: 50%;
	float: none;
	width: 5px;
	height: 9px;
	margin: 0;
	border: solid var(--alc-check-mark);
	border-width: 0 2px 2px 0;
	border-radius: 0;
	transform: translate(-50%, -50%) rotate(45deg);
	opacity: 0;
	transition: opacity 0.12s ease;
}

body.login.alc #login form input[type="checkbox"]:checked::before {
	opacity: 1;
}

body.login.alc #login form input[type="checkbox"]:focus {
	border-color: var(--alc-field-focus-border);
	box-shadow: var(--alc-field-focus-ring);
	outline: none;
}

body.login.alc.alc-hide-remember #login form .forgetmenot {
	display: none;
}

/* Globo de ayuda de "Recordarme" */
body.login.alc #login .wp-tooltip__toggle {
	padding: 0;
	background: none;
	border: 0;
	box-shadow: none;
	color: var(--alc-field-icon-color);
	line-height: 1;
	cursor: pointer;
}

body.login.alc #login .wp-tooltip__bubble {
	max-width: 320px;
	padding: 12px 14px;
	background: var(--alc-card-bg);
	color: var(--alc-base-color);
	border: 1px solid var(--alc-card-border-color);
	border-radius: var(--alc-msg-radius);
	box-shadow: var(--alc-card-shadow);
	font-family: var(--alc-font);
	font-size: var(--alc-msg-size);
}

body.login.alc.alc-hide-helptip #login .wp-tooltip {
	display: none;
}

/* -------------------------------------------------------------- Botones */

body.login.alc #login form .submit {
	margin-top: var(--alc-btn-gap);
}

body.login.alc #login .button-primary,
body.login.alc #login input[type="submit"].button-primary,
body.login.alc #wp-submit {
	box-sizing: border-box;
	display: block;
	float: none;
	width: var(--alc-btn-width);
	max-width: 100%;
	height: var(--alc-btn-height);
	min-height: 0;
	margin: 0;
	padding: 0 16px;
	background: var(--alc-btn-bg);
	color: var(--alc-btn-color);
	border: var(--alc-btn-border-width) solid var(--alc-btn-border-color);
	border-radius: var(--alc-btn-radius);
	box-shadow: var(--alc-btn-shadow);
	text-shadow: none;
	font-family: var(--alc-font);
	font-size: var(--alc-btn-size);
	font-weight: var(--alc-btn-weight);
	line-height: 1;
	text-transform: var(--alc-btn-transform);
	letter-spacing: var(--alc-btn-letter);
	text-align: center;
	cursor: pointer;
	transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

body.login.alc #login .button-primary:hover,
body.login.alc #login .button-primary:focus,
body.login.alc #login .button-primary:active,
body.login.alc #wp-submit:hover,
body.login.alc #wp-submit:focus,
body.login.alc #wp-submit:active {
	background: var(--alc-btn-hover-bg);
	color: var(--alc-btn-hover-color);
	border-color: var(--alc-btn-hover-border);
	box-shadow: var(--alc-btn-hover-shadow);
	text-shadow: none;
	transform: none;
}

body.login.alc #login .button-primary:focus-visible {
	outline: 2px solid var(--alc-field-focus-border);
	outline-offset: 2px;
}

/* Botón secundario: passkey, "Cambiar" del idioma, etc. */
body.login.alc #login .button:not(.button-primary):not(.wp-hide-pw),
body.login.alc .language-switcher .button,
body.login.alc .wfls-passkey-submit {
	box-sizing: border-box;
	height: var(--alc-btn-height);
	min-height: 0;
	padding: 0 16px;
	background: var(--alc-btn2-bg);
	color: var(--alc-btn2-color);
	border: var(--alc-btn2-border-width) solid var(--alc-btn2-border-color);
	border-radius: var(--alc-btn2-radius);
	box-shadow: none;
	text-shadow: none;
	font-family: var(--alc-font);
	font-size: var(--alc-btn-size);
	font-weight: var(--alc-btn-weight);
	line-height: 1;
	cursor: pointer;
	transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

body.login.alc #login .button:not(.button-primary):not(.wp-hide-pw):hover,
body.login.alc .language-switcher .button:hover,
body.login.alc .wfls-passkey-submit:hover,
body.login.alc .wfls-passkey-submit:focus {
	background: var(--alc-btn2-hover-bg);
	color: var(--alc-btn2-hover-color);
	border-color: var(--alc-btn2-border-color);
}

/* -------------------------------------------------------------- Enlaces */

body.login.alc #nav,
body.login.alc #backtoblog,
body.login.alc .privacy-policy-page-link {
	margin: 16px 0 0;
	padding: 0;
	text-align: center;
	font-size: var(--alc-link-size);
}

body.login.alc #backtoblog {
	margin-top: 8px;
}

body.login.alc #nav a,
body.login.alc #backtoblog a,
body.login.alc .privacy-policy-page-link a,
body.login.alc .alc-footer a,
body.login.alc .alc-intro a {
	color: var(--alc-link-color);
	font-size: var(--alc-link-size);
	font-weight: var(--alc-link-weight);
	text-decoration: var(--alc-link-decoration);
	text-shadow: var(--alc-link-shadow);
	transition: color 0.15s ease;
}

body.login.alc #nav a:hover,
body.login.alc #backtoblog a:hover,
body.login.alc .privacy-policy-page-link a:hover,
body.login.alc #nav a:focus,
body.login.alc #backtoblog a:focus,
body.login.alc .privacy-policy-page-link a:focus {
	color: var(--alc-link-hover);
}

body.login.alc.alc-hide-nav #nav {
	display: none;
}

body.login.alc.alc-hide-backtoblog #backtoblog {
	display: none;
}

body.login.alc.alc-hide-privacy .privacy-policy-page-link {
	display: none;
}

/* ------------------------------------------------------------- Mensajes */

body.login.alc #login .notice,
body.login.alc #login .message,
body.login.alc #login #login_error,
body.login.alc #login .wfls-login-message {
	box-sizing: border-box;
	margin: 0 0 var(--alc-field-gap);
	padding: var(--alc-msg-padding);
	background: var(--alc-msg-info-bg);
	color: var(--alc-msg-info-color);
	border: var(--alc-msg-accent-width) solid var(--alc-msg-info-accent);
	border-radius: var(--alc-msg-radius);
	box-shadow: none;
	font-family: var(--alc-font);
	font-size: var(--alc-msg-size);
	line-height: 1.5;
	word-break: break-word;
}

body.login.alc #login .notice p,
body.login.alc #login .message p,
body.login.alc #login #login_error p {
	margin: 0 0 6px;
	padding: 0;
}

body.login.alc #login .notice p:last-child,
body.login.alc #login .message p:last-child,
body.login.alc #login #login_error p:last-child {
	margin-bottom: 0;
}

body.login.alc #login .notice a,
body.login.alc #login .message a,
body.login.alc #login #login_error a {
	color: inherit;
	text-decoration: underline;
}

body.login.alc #login .notice-error,
body.login.alc #login #login_error {
	background: var(--alc-msg-error-bg);
	color: var(--alc-msg-error-color);
	border-color: var(--alc-msg-error-accent);
}

body.login.alc #login .notice-success,
body.login.alc #login .message.notice-success,
body.login.alc #login .login-info {
	background: var(--alc-msg-success-bg);
	color: var(--alc-msg-success-color);
	border-color: var(--alc-msg-success-accent);
}

/* Medidor de fuerza de la contraseña */
body.login.alc #login #pass-strength-result {
	box-sizing: border-box;
	width: 100%;
	margin: 8px 0 0;
	padding: 8px 12px;
	background: var(--alc-field-bg);
	border: 1px solid var(--alc-field-border-color);
	border-radius: var(--alc-msg-radius);
	color: var(--alc-base-color);
	font-family: var(--alc-font);
	font-size: var(--alc-msg-size);
	text-align: center;
}

body.login.alc #login #pass-strength-result.short,
body.login.alc #login #pass-strength-result.bad {
	border-color: var(--alc-pw-weak);
	color: var(--alc-pw-weak);
}

body.login.alc #login #pass-strength-result.good {
	border-color: var(--alc-pw-medium);
	color: var(--alc-pw-medium);
}

body.login.alc #login #pass-strength-result.strong {
	border-color: var(--alc-pw-strong);
	color: var(--alc-pw-strong);
}

body.login.alc #login .indicator-hint,
body.login.alc #login .description,
body.login.alc #login .pw-weak {
	color: var(--alc-base-color);
	font-size: var(--alc-msg-size);
	opacity: 0.75;
}

/* --------------------------------------------------- Selector de idioma */

body.login.alc .language-switcher {
	margin: 20px auto 0;
	text-align: center;
}

body.login.alc .language-switcher form {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	flex-wrap: wrap;
}

body.login.alc .language-switcher label {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin: 0;
	color: var(--alc-link-color);
	font-size: var(--alc-link-size);
	text-shadow: var(--alc-link-shadow);
}

body.login.alc .language-switcher select {
	box-sizing: border-box;
	height: var(--alc-field-height);
	max-width: 220px;
	padding: 0 32px 0 12px;
	background-color: var(--alc-field-bg);
	color: var(--alc-field-color);
	border: var(--alc-field-border-width) solid var(--alc-field-border-color);
	border-radius: var(--alc-field-radius);
	box-shadow: none;
	font-family: var(--alc-font);
	font-size: var(--alc-link-size);
}

/* ------------------------------------------- Wordfence Login Security */

/* Ventana que reemplaza el formulario al pedir el segundo factor. */
body.login.alc #wfls-prompt-overlay {
	box-sizing: border-box;
	padding: var(--alc-card-padding);
	background: var(--alc-wf-overlay-bg);
	color: var(--alc-wf-text-color);
	border-radius: var(--alc-card-radius);
	font-family: var(--alc-font);
}

body.login.alc #wfls-prompt-wrapper {
	color: var(--alc-wf-text-color);
}

body.login.alc .wfls-modal {
	background: var(--alc-wf-overlay-bg);
	color: var(--alc-wf-text-color);
	border-radius: var(--alc-wf-radius);
	box-shadow: var(--alc-wf-modal-shadow);
	font-family: var(--alc-font);
	overflow: hidden;
}

body.login.alc .wfls-modal-header,
body.login.alc .wfls-modal-footer {
	background: transparent;
	border-color: var(--alc-wf-divider);
}

body.login.alc .wfls-modal-title strong,
body.login.alc .wfls-modal-content {
	color: var(--alc-wf-text-color);
	font-family: var(--alc-font);
}

body.login.alc .wfls-btn,
body.login.alc .wfls-btn-default {
	background: var(--alc-btn2-bg);
	color: var(--alc-btn2-color);
	border: var(--alc-btn2-border-width) solid var(--alc-btn2-border-color);
	border-radius: var(--alc-btn2-radius);
	box-shadow: none;
	text-shadow: none;
	font-family: var(--alc-font);
	font-weight: var(--alc-btn-weight);
}

body.login.alc .wfls-btn-primary {
	background: var(--alc-btn-bg);
	color: var(--alc-btn-color);
	border: var(--alc-btn-border-width) solid var(--alc-btn-border-color);
	border-radius: var(--alc-btn-radius);
}

body.login.alc .wfls-btn-primary:hover,
body.login.alc .wfls-btn-primary:focus {
	background: var(--alc-btn-hover-bg);
	color: var(--alc-btn-hover-color);
}

/* Campo del código de verificación */
body.login.alc #wfls-token,
body.login.alc input#wfls-token {
	font-size: var(--alc-wf-code-size);
	letter-spacing: var(--alc-wf-code-letter);
	text-align: center;
}

body.login.alc .wfls-token-error {
	color: var(--alc-msg-error-color);
}

body.login.alc .wfls-textarea {
	box-sizing: border-box;
	width: 100%;
	background: var(--alc-field-bg);
	color: var(--alc-field-color);
	border: var(--alc-field-border-width) solid var(--alc-field-border-color);
	border-radius: var(--alc-field-radius);
	font-family: var(--alc-font);
	font-size: var(--alc-field-size);
}

/* "Recordar este dispositivo" */
body.login.alc #login form .wfls-remember-device-wrapper,
body.login.alc .wfls-remember-device-wrapper {
	display: flex;
	align-items: center;
	gap: 8px;
	float: none;
	margin: 0 0 var(--alc-field-gap);
}

body.login.alc #login form .wfls-remember-device-wrapper label,
body.login.alc .wfls-remember-device-wrapper label {
	margin: 0;
	color: var(--alc-check-label-color);
	font-size: var(--alc-link-size);
	font-weight: 400;
	line-height: 1.3;
}

/* Acceso con huella / passkey */
body.login.alc .wfls-passkey-container {
	clear: both;
	display: block;
	margin-top: var(--alc-field-gap);
	text-align: center;
}

body.login.alc .wfls-passkey-container .wfls-passkey-divider {
	display: flex;
	align-items: center;
	margin: var(--alc-field-gap) 0;
}

body.login.alc .wfls-passkey-container .wfls-passkey-divider::before,
body.login.alc .wfls-passkey-container .wfls-passkey-divider::after {
	content: "";
	flex: auto;
	border-top: 1px solid var(--alc-wf-divider);
}

body.login.alc .wfls-passkey-container .wfls-passkey-divider-label {
	display: inline-block;
	padding: 0 12px;
	line-height: 1;
}

body.login.alc .wfls-passkey-container .wfls-passkey-submit {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin: 0 auto;
}

body.login.alc .wfls-passkey-container .wfls-passkey-divider {
	color: var(--alc-wf-divider-text);
	font-size: var(--alc-link-size);
}

body.login.alc .wfls-passkey-container .wfls-passkey-divider::before,
body.login.alc .wfls-passkey-container .wfls-passkey-divider::after {
	border-top-color: var(--alc-wf-divider);
}

body.login.alc .wfls-passkey-container .wfls-passkey-divider-label {
	background: var(--alc-card-bg);
	color: var(--alc-wf-divider-text);
}

body.login.alc .wfls-passkey-container .wfls-passkey-submit {
	width: var(--alc-btn-width);
	max-width: 100%;
}

body.login.alc .wfls-passkey-icon,
body.login.alc .wfls-passkey-icon svg {
	color: var(--alc-wf-icon-color);
	fill: var(--alc-wf-icon-color);
}

body.login.alc .wfls-passkey-label {
	font-family: var(--alc-font);
	font-weight: var(--alc-btn-weight);
}

body.login.alc .wfls-2fa-code-help,
body.login.alc .wfls-tooltip-trigger {
	color: var(--alc-field-icon-color);
}

/* En la ventana de 2FA el separador se apoya sobre el fondo de la ventana. */
body.login.alc #wfls-prompt-overlay .wfls-passkey-divider-label {
	background: var(--alc-wf-overlay-bg);
}

/* ------------------------------------------------------------ reCAPTCHA */

body.login.alc.alc-hide-recaptcha .grecaptcha-badge {
	visibility: hidden;
}

/* Wordfence coloca esta ventana en posición absoluta sobre el formulario.
   En la vista previa el formulario está sustituido, así que no hay nada
   debajo que le dé altura: ahí se muestra en el flujo. */
body.login.alc.alc-preview #wfls-prompt-overlay {
	position: static;
	inset: auto;
}

/* --------------------------------------------- Login intermedio (modal) */

/* Cuando la sesión caduca, WordPress abre wp-login.php dentro de un iframe
   pequeño en el escritorio. Ahí no corresponde ni pantalla completa ni
   fondo: solo la tarjeta. */
body.login.alc.interim-login {
	min-height: 0;
	padding: 0;
	display: block;
	background: none;
}

body.login.alc.interim-login::before,
body.login.alc.interim-login::after {
	display: none;
}

body.login.alc.interim-login #login {
	width: auto;
	max-width: 100%;
	padding: 0;
}

body.login.alc.interim-login #login form {
	box-shadow: none;
	border: 0;
	padding: 16px;
}

body.login.alc.interim-login .alc-footer,
body.login.alc.interim-login .alc-custom-html,
body.login.alc.interim-login #backtoblog {
	display: none;
}

/* ------------------------------------------------------------ Responsive */

@media screen and (max-width: 782px) {
	body.login.alc.alc-bg-image::before {
		background-image: var(--alc-bg-image-mobile);
	}

	body.login.alc-layout-left,
	body.login.alc-layout-right {
		display: flex;
		flex-direction: column;
		justify-content: center;
	}

	body.login.alc-layout-left #login,
	body.login.alc-layout-right #login {
		padding: 40px 24px;
	}

	body.login.alc-layout-left .language-switcher,
	body.login.alc-layout-right .language-switcher {
		padding: 0 24px 24px;
	}

	body.login.alc #login form {
		padding: 24px;
	}
}

/* Respeta la preferencia de menos movimiento. */
@media (prefers-reduced-motion: reduce) {
	body.login.alc * {
		transition: none !important;
	}
}