/* Fondo moderno con gradiente sutil */
body.login {
	background: linear-gradient(135deg, #F8F9FA 0%, #E5E7EB 100%) !important;
	color: #1a1a1a !important;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
}

/* Ocultar enlaces de navegación */
.login #nav,
.login #backtoblog {
	display: none !important;
}

/* Contenedor principal del login */
#login {
	width: 100%;
	max-width: 420px;
	padding: 20px;
}

/* Logo personalizado */
.login h1 {
	margin-bottom: 40px !important;
}

.login h1 a {
	transition: transform 0.3s ease;
}

.login h1 a:hover {
	transform: scale(1.05);
}

/* Formulario moderno - Oculto por defecto */
.login form#loginform {
	margin-top: 20px !important;
	border: none !important;
	border-radius: 16px !important;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1), 0 2px 8px rgba(0, 0, 0, 0.08) !important;
	background-color: #FFFFFF !important;
	padding: 40px 35px !important;
	-webkit-border-radius: 16px !important;
	-moz-border-radius: 16px !important;
	-ms-border-radius: 16px !important;
	-o-border-radius: 16px !important;
	display: none !important;
}

/* Mostrar formulario cuando tiene la clase activa */
.login form#loginform.is-visible {
	display: block !important;
}

/* Labels */
.login form label {
	color: #1a1a1a !important;
	font-weight: 600 !important;
	font-size: 14px !important;
	margin-bottom: 8px !important;
	display: block;
}

/* Inputs modernos */
.login form .input,
.login input[type="password"],
.login input[type="text"] {
	border-radius: 8px !important;
	border: 2px solid #E5E7EB !important;
	background-color: #FFFFFF !important;
	padding: 12px 16px !important;
	font-size: 15px !important;
	color: #1a1a1a !important;
	width: 100% !important;
	box-sizing: border-box !important;
	transition: all 0.3s ease !important;
	margin-bottom: 20px !important;
}

.login form .input:focus,
.login input[type="password"]:focus,
.login input[type="text"]:focus {
	outline: none !important;
	border-color: #0B7BBB !important;
	box-shadow: 0 0 0 3px rgba(11, 123, 187, 0.1) !important;
}

.login form .input::placeholder,
.login input[type="password"]::placeholder,
.login input[type="text"]::placeholder {
	color: #9CA3AF !important;
}

/* Checkbox recordar */
.login form .forgetmenot {
	margin-bottom: 24px !important;
}

.login form .forgetmenot label {
	font-weight: 400 !important;
	font-size: 14px !important;
	color: #4B5563 !important;
}

.login form input[type="checkbox"] {
	width: 18px !important;
	height: 18px !important;
	accent-color: #0B7BBB !important;
	margin-right: 8px !important;
}

/* Botón de envío moderno */
.login #wp-submit {
	background: linear-gradient(135deg, #0B7BBB 0%, #0070C1 100%) !important;
	border: none !important;
	width: 100% !important;
	border-radius: 8px !important;
	padding: 14px 24px !important;
	font-size: 16px !important;
	font-weight: 600 !important;
	color: #FFFFFF !important;
	cursor: pointer !important;
	transition: all 0.3s ease !important;
	box-shadow: 0 4px 12px rgba(11, 123, 187, 0.3) !important;
	text-transform: none !important;
	letter-spacing: 0.3px !important;
}

.login #wp-submit:hover {
	background: linear-gradient(135deg, #0070C1 0%, #005A9E 100%) !important;
	box-shadow: 0 6px 16px rgba(11, 123, 187, 0.4) !important;
	transform: translateY(-1px);
}

.login #wp-submit:active {
	transform: translateY(0);
	box-shadow: 0 2px 8px rgba(11, 123, 187, 0.3) !important;
}

/* Mensaje informativo */
form#loginform.is-visible:after {
	content: "El acceso a la administración de este sitio web es exclusivamente para personal autorizado por AEF. Si no recuerda la contraseña, póngase en contacto con la entidad que se la proporcionó. Si no tiene acceso, abandone esta página. Gracias por su cooperación.";
	display: block;
	color: #6B7280;
	margin-top: 30px;
	text-align: center !important;
	font-size: 13px;
	line-height: 1.6;
	padding-top: 24px;
	border-top: 1px solid #E5E7EB;
	pointer-events: none !important;
}

/* Mensajes de error/éxito */
.login .message,
.login #login_error {
	border-radius: 8px !important;
	border-left: 4px solid #0B7BBB !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
	padding: 16px !important;
	margin-bottom: 20px !important;
}

.login #login_error {
	border-left-color: #DC2626 !important;
	background-color: #FEF2F2 !important;
	color: #991B1B !important;
}

/* Botón de acceso AEF (OIDC) - Destacado */
.openid-connect-login-button {
	margin: 40px 0 30px 0 !important;
	text-align: center !important;
}

.aef-login-button {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 12px !important;
	background: linear-gradient(135deg, #0B7BBB 0%, #0070C1 100%) !important;
	border: none !important;
	border-radius: 12px !important;
	padding: 18px 32px !important;
	font-size: 17px !important;
	font-weight: 600 !important;
	color: #FFFFFF !important;
	text-decoration: none !important;
	cursor: pointer !important;
	transition: all 0.3s ease !important;
	box-shadow: 0 6px 20px rgba(11, 123, 187, 0.35) !important;
	letter-spacing: 0.2px !important;
	width: 100% !important;
	max-width: 100% !important;
	box-sizing: border-box !important;
}

.aef-login-button:hover {
	background: linear-gradient(135deg, #0070C1 0%, #005A9E 100%) !important;
	box-shadow: 0 8px 24px rgba(11, 123, 187, 0.45) !important;
	transform: translateY(-2px) !important;
	color: #FFFFFF !important;
	text-decoration: none !important;
}

.aef-login-button:active {
	transform: translateY(0) !important;
	box-shadow: 0 4px 12px rgba(11, 123, 187, 0.35) !important;
}

.aef-login-icon {
	flex-shrink: 0 !important;
	width: 22px !important;
	height: 22px !important;
}

.aef-login-text {
	flex: 1 !important;
}

/* Enlace para mostrar formulario tradicional */
.aef-toggle-traditional-login {
	display: block !important;
	text-align: center !important;
	margin-top: 24px !important;
	margin-bottom: 0 !important;
	padding: 12px !important;
	color: #6B7280 !important;
	font-size: 14px !important;
	text-decoration: none !important;
	cursor: pointer !important;
	transition: color 0.2s ease !important;
	border: none !important;
	background: none !important;
	width: 100% !important;
}

.aef-toggle-traditional-login:hover {
	color: #0B7BBB !important;
	text-decoration: underline !important;
}

.aef-toggle-traditional-login:focus {
	outline: 2px solid #0B7BBB !important;
	outline-offset: 2px !important;
	border-radius: 4px !important;
}

/* Contenedor del botón OIDC con mensaje */
.login-method-container {
	background-color: #FFFFFF !important;
	border-radius: 16px !important;
	box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1), 0 2px 8px rgba(0, 0, 0, 0.08) !important;
	padding: 50px 40px !important;
	margin-top: 20px !important;
	text-align: center !important;
}

.login-method-title {
	font-size: 24px !important;
	font-weight: 700 !important;
	color: #1a1a1a !important;
	margin-bottom: 12px !important;
}

.login-method-subtitle {
	font-size: 15px !important;
	color: #6B7280 !important;
	margin-bottom: 32px !important;
	line-height: 1.5 !important;
}

/* Responsive */
@media (max-width: 480px) {
	#login {
		max-width: 100%;
		padding: 15px;
	}
	
	.login form#loginform.is-visible {
		padding: 30px 25px !important;
	}

	.login-method-container {
		padding: 40px 25px !important;
	}

	.login-method-title {
		font-size: 20px !important;
	}

	.aef-login-button {
		padding: 16px 24px !important;
		font-size: 16px !important;
	}
}