/* UOL Acceso: pantalla de ingreso, registro y recuperación de contraseña. Las variables --uola-* salen de Ajustes > Acceso UOL. */

body.login.uol-acceso {
	background: var(--uola-fondo) var(--uola-fondo-img) center / cover no-repeat;
	color: var(--uola-texto);
	font-family: var(--uola-fuente);
	font-size: 16px;
	line-height: 1.5;
	min-height: 100vh;
	padding: 0;
	display: block;
}

.uol-acceso .uol-acceso__marco {
	display: flex;
	min-height: 100vh;
}

/* Panel de marca */
.uol-acceso .uol-acceso__panel {
	flex: 0 0 var(--uola-panel-ancho);
	max-width: var(--uola-panel-ancho);
	box-sizing: border-box;
	background: var(--uola-panel);
	color: var(--uola-panel-txt);
	padding: clamp(32px, 5vw, 72px);
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 40px;
	position: relative;
	overflow: hidden;
}
.uol-acceso .uol-acceso__panel::after {
	/* Tres luces del semáforo UOL, discretas, en la esquina */
	content: "";
	position: absolute;
	right: clamp(24px, 4vw, 56px);
	top: clamp(32px, 5vw, 72px);
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: #2fbf71;
	box-shadow: -18px 0 0 #f2b705, -36px 0 0 #e5484d;
}
.uol-acceso .uol-acceso__panel-logo img {
	display: block;
	width: var(--uola-logo-ancho);
	max-width: 100%;
	height: auto;
}
.uol-acceso .uol-acceso__panel-logo:focus {
	box-shadow: none;
	outline: 2px solid var(--uola-acento);
	outline-offset: 4px;
}
.uol-acceso .uol-acceso__eslogan {
	font-family: var(--uola-fuente-tit);
	font-size: clamp(32px, 3.7vw, 58px);
	font-weight: 800;
	line-height: 1.02;
	letter-spacing: -0.015em;
	text-transform: uppercase;
	margin: 0 0 24px;
	max-width: 13ch;
}
.uol-acceso .uol-acceso__eslogan::before {
	content: "";
	display: block;
	width: 56px;
	height: 5px;
	background: var(--uola-acento);
	margin-bottom: 28px;
}
.uol-acceso .uol-acceso__bajada {
	font-size: 18px;
	line-height: 1.55;
	opacity: .86;
	margin: 0 0 24px;
	max-width: 44ch;
}
.uol-acceso .uol-acceso__puntos {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 12px;
	max-width: 46ch;
}
.uol-acceso .uol-acceso__puntos li {
	position: relative;
	padding-left: 26px;
	font-size: 15px;
	line-height: 1.5;
	opacity: .9;
}
.uol-acceso .uol-acceso__puntos li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .55em;
	width: 12px;
	height: 2px;
	background: var(--uola-acento);
}
.uol-acceso .uol-acceso__pie {
	font-size: 13px;
	opacity: .6;
	margin: 0;
}

/* Zona del formulario */
.uol-acceso .uol-acceso__zona {
	flex: 1 1 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: clamp(24px, 5vw, 64px) 16px;
	box-sizing: border-box;
	min-width: 0;
}
.uol-acceso #login {
	width: var(--uola-ancho);
	max-width: 100%;
	margin: var(--uola-margen);
	padding: 0;
	box-sizing: border-box;
}

.uol-acceso .wp-login-logo { margin: 0 0 28px; }
.uol-acceso.uol-acceso--dividido .wp-login-logo { display: none; }
.uol-acceso .wp-login-logo a {
	background: none;
	width: auto;
	height: auto;
	text-indent: 0;
	overflow: visible;
	margin: 0;
	display: inline-block;
}
.uol-acceso .wp-login-logo img {
	display: block;
	width: var(--uola-logo-ancho);
	max-width: 100%;
	height: auto;
}
.uol-acceso.uol-acceso--centrado .wp-login-logo { text-align: center; }

.uol-acceso .uol-acceso__titulo {
	font-family: var(--uola-fuente-tit);
	font-size: 30px;
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -0.01em;
	color: var(--uola-texto);
	margin: 0 0 20px;
	padding: 0;
}
.uol-acceso.uol-acceso--centrado .uol-acceso__titulo { text-align: center; }

/* Mensajes y errores */
.uol-acceso .message,
.uol-acceso .notice,
.uol-acceso #login_error {
	background: var(--uola-tarjeta);
	border: 1px solid var(--uola-borde);
	border-left: 4px solid var(--uola-acento);
	border-radius: 8px;
	box-shadow: none;
	color: var(--uola-texto);
	font-size: 14px;
	padding: 12px 16px;
	margin: 0 0 16px;
}
.uol-acceso #login_error,
.uol-acceso .notice-error { border-left-color: #d63638; }
.uol-acceso .message a,
.uol-acceso .notice a,
.uol-acceso #login_error a { color: var(--uola-acento); }

/* Tarjeta */
.uol-acceso #loginform,
.uol-acceso #registerform,
.uol-acceso #lostpasswordform,
.uol-acceso #resetpassform {
	background: var(--uola-tarjeta);
	border: 1px solid var(--uola-borde);
	border-radius: var(--uola-radio);
	box-shadow: 0 18px 40px -24px rgba(17, 24, 39, .28);
	padding: var(--uola-relleno);
	margin: 0;
	overflow: visible;
	font-weight: 400;
}
.uol-acceso form p { margin-bottom: 16px; }
.uol-acceso label {
	color: var(--uola-texto);
	font-size: 14px;
	font-weight: 600;
	line-height: 1.4;
	margin-bottom: 6px;
	display: inline-block;
}
.uol-acceso form .input,
.uol-acceso input[type="text"],
.uol-acceso input[type="email"],
.uol-acceso input[type="password"] {
	font-family: var(--uola-fuente);
	font-size: 16px;
	line-height: 1.4;
	min-height: 46px;
	padding: 10px 14px;
	margin: 0 0 18px;
	border: 1px solid var(--uola-borde);
	border-radius: 8px;
	background: #fff;
	color: var(--uola-texto);
	box-shadow: none;
	width: 100%;
}
.uol-acceso form .input:focus,
.uol-acceso input:focus {
	border-color: var(--uola-acento);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--uola-acento) 22%, transparent);
	outline: none;
}
.uol-acceso .user-pass-wrap { margin-bottom: 16px; }
.uol-acceso .wp-pwd { position: relative; }
.uol-acceso .wp-pwd .input { padding-right: 46px; margin-bottom: 0; }
.uol-acceso .button.wp-hide-pw {
	color: var(--uola-suave);
	height: 46px;
	min-height: 46px;
	width: 46px;
	top: 0;
	right: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
}
.uol-acceso .button.wp-hide-pw:focus { box-shadow: 0 0 0 2px var(--uola-acento); }
.uol-acceso input[type="checkbox"] {
	border-color: var(--uola-borde);
	border-radius: 4px;
}
.uol-acceso input[type="checkbox"]:checked::before { filter: hue-rotate(0); }
.uol-acceso .forgetmenot {
	float: none;
	display: flex;
	align-items: center;
	gap: 6px;
	margin-bottom: 20px;
}
.uol-acceso .forgetmenot label { font-weight: 400; margin: 0; }
.uol-acceso #registerform label:has(input[type="checkbox"]) {
	display: flex;
	gap: 8px;
	align-items: flex-start;
	font-weight: 400;
	font-size: 13px;
	color: var(--uola-suave);
}
.uol-acceso #registerform label:has(input[type="checkbox"]) input { margin-top: 2px; flex: none; }
.uol-acceso #reg_passmail { display: none; }
.uol-acceso .wp-tooltip__toggle { color: var(--uola-suave); }

/* Botón principal */
.uol-acceso p.submit { margin: 0; }
.uol-acceso .button-primary,
.uol-acceso .button.button-large {
	float: none;
	width: 100%;
	min-height: 48px;
	height: auto;
	padding: 10px 18px;
	font-family: var(--uola-fuente-tit);
	font-size: 16px;
	font-weight: 700;
	letter-spacing: .01em;
	line-height: 1.3;
	color: #fff;
	background: var(--uola-acento);
	border: 0;
	border-radius: 8px;
	box-shadow: none;
	text-shadow: none;
	transition: filter .15s ease, transform .15s ease;
}
.uol-acceso .button-primary:hover,
.uol-acceso .button-primary:focus {
	background: var(--uola-acento);
	color: #fff;
	filter: brightness(.92);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--uola-acento) 25%, transparent);
}
.uol-acceso .button-primary:active { transform: translateY(1px); }
.uol-acceso .button-secondary:not(.wp-hide-pw) {
	color: var(--uola-acento);
	border-color: var(--uola-acento);
	border-radius: 8px;
}

/* Enlaces debajo de la tarjeta */
.uol-acceso #nav,
.uol-acceso #backtoblog {
	margin: 18px 0 0;
	padding: 0;
	text-align: center;
	font-size: 14px;
	color: var(--uola-suave);
}
.uol-acceso #backtoblog { margin-top: 10px; }
.uol-acceso #nav a,
.uol-acceso #backtoblog a,
.uol-acceso .privacy-policy-page-link a {
	color: var(--uola-suave);
	text-decoration: none;
}
.uol-acceso #nav a { color: var(--uola-acento); font-weight: 600; }
.uol-acceso #nav a:hover,
.uol-acceso #backtoblog a:hover { text-decoration: underline; }
.uol-acceso .privacy-policy-page-link { margin: 18px 0 0; text-align: center; font-size: 13px; }

/* Botones de redes de Loginizer: centrados y con el mismo radio */
.uol-acceso #lz-social-login-btns { margin: 4px auto 8px; }
.uol-acceso .loginizer-social-button { border-radius: 8px !important; }

.uol-acceso .language-switcher { display: none; }

/* Ventana de "vuelva a ingresar" dentro del escritorio: solo el formulario */
.uol-acceso.interim-login .uol-acceso__panel { display: none; }
.uol-acceso.interim-login .uol-acceso__marco { min-height: 0; }

/* Tablet y celular: el panel pasa arriba como franja */
@media (max-width: 900px) {
	.uol-acceso .uol-acceso__marco { flex-direction: column; }
	.uol-acceso .uol-acceso__panel {
		flex: 0 0 auto;
		max-width: none;
		padding: 22px 20px 24px;
		gap: 14px;
	}
	.uol-acceso .uol-acceso__panel::after { top: 30px; right: 20px; }
	.uol-acceso .uol-acceso__panel-logo img { width: min(var(--uola-logo-ancho), 120px); }
	.uol-acceso .uol-acceso__eslogan { font-size: clamp(20px, 5.4vw, 30px); max-width: none; margin: 0; }
	.uol-acceso .uol-acceso__eslogan::before { width: 36px; height: 4px; margin-bottom: 12px; }
	.uol-acceso .uol-acceso__bajada,
	.uol-acceso .uol-acceso__puntos,
	.uol-acceso .uol-acceso__pie { display: none; }
	.uol-acceso .uol-acceso__zona { align-items: flex-start; padding: 28px 16px 40px; }
	.uol-acceso .uol-acceso__titulo { font-size: 24px; }
}
@media (max-width: 480px) {
	.uol-acceso #loginform,
	.uol-acceso #registerform,
	.uol-acceso #lostpasswordform,
	.uol-acceso #resetpassform { padding: 24px 20px; }
}