/*
 * RH login surfaces: custom /connexion/ link and native WordPress password
 * recovery screens. Kept inside the RH module so legacy login modules remain
 * untouched.
 */

/* Custom portal: resist theme and widget link-colour overrides. */
body .fv-login-page .fv-login-card .fv-row-between a.fv-forgot,
body .fv-login-page .fv-login-card .fv-row-between a.fv-forgot:visited {
	color: #fff !important;
	display: inline-flex !important;
	align-items: center !important;
	font-size: 13px !important;
	font-weight: 650 !important;
	line-height: 1.3 !important;
	text-decoration: none !important;
	white-space: nowrap !important;
	opacity: .92 !important;
}

body .fv-login-page .fv-login-card .fv-row-between a.fv-forgot:hover,
body .fv-login-page .fv-login-card .fv-row-between a.fv-forgot:focus-visible {
	color: #fff !important;
	opacity: 1 !important;
	text-decoration: underline !important;
	text-underline-offset: 4px !important;
}

/* Native lost-password / reset-password pages. */
body.login {
	--ifg-login-navy: #0d1b35;
	--ifg-login-panel: rgba(20, 37, 66, .92);
	--ifg-login-input: #1b2c49;
	--ifg-login-line: rgba(255, 255, 255, .13);
	--ifg-login-muted: #9aabc7;
	--ifg-login-blue: #3268c7;
	min-height: 100vh !important;
	background:
		radial-gradient(ellipse 80% 65% at 8% 0%, rgba(50, 104, 199, .42), transparent 62%),
		radial-gradient(ellipse 55% 50% at 92% 100%, rgba(28, 75, 145, .28), transparent 64%),
		var(--ifg-login-navy) !important;
	color: #f6f8fc !important;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

body.login * {
	box-sizing: border-box;
}

body.login #login {
	width: min(440px, calc(100% - 32px)) !important;
	margin: 0 auto !important;
	padding: clamp(42px, 8vh, 84px) 0 36px !important;
}

body.login h1 {
	margin: 0 0 25px !important;
}

body.login h1 a {
	width: 220px !important;
	height: 58px !important;
	margin: 0 auto !important;
	background-position: center !important;
	background-size: contain !important;
	filter: none !important;
}

body.login .ifg-rh-login-intro {
	margin: 0 0 18px;
	text-align: center;
}

body.login .ifg-rh-login-intro h2 {
	margin: 0 0 7px !important;
	color: #fff !important;
	font-size: 24px !important;
	font-weight: 720 !important;
	letter-spacing: -.025em;
}

body.login .ifg-rh-login-intro p {
	margin: 0 auto !important;
	max-width: 390px;
	color: var(--ifg-login-muted) !important;
	font-size: 13.5px !important;
	line-height: 1.55 !important;
}

body.login #login form,
body.login #lostpasswordform,
body.login #resetpassform {
	position: relative !important;
	z-index: 5 !important;
	margin: 0 !important;
	padding: 27px 28px 25px !important;
	overflow: visible !important;
	border: 1px solid var(--ifg-login-line) !important;
	border-radius: 18px !important;
	background: var(--ifg-login-panel) !important;
	box-shadow: 0 28px 70px rgba(2, 10, 25, .42) !important;
	backdrop-filter: blur(18px);
}

body.login #login_error,
body.login .message,
body.login .success {
	margin: 0 0 16px !important;
	padding: 13px 15px !important;
	border: 1px solid rgba(104, 151, 231, .32) !important;
	border-left: 3px solid #5f8ee2 !important;
	border-radius: 11px !important;
	background: rgba(53, 91, 154, .18) !important;
	box-shadow: none !important;
	color: #dce8fb !important;
	font-size: 13px !important;
	line-height: 1.5 !important;
}

body.login #login_error {
	border-color: rgba(248, 113, 113, .3) !important;
	border-left-color: #f87171 !important;
	background: rgba(185, 49, 49, .15) !important;
	color: #ffd7d7 !important;
}

body.login #login form p,
body.login #login form .user-pass-wrap {
	position: relative !important;
	z-index: 6 !important;
}

body.login #login form label {
	display: block !important;
	margin: 0 0 8px !important;
	color: #c4d1e6 !important;
	font-size: 12px !important;
	font-weight: 650 !important;
	letter-spacing: .025em !important;
}

body.login input[type="text"],
body.login input[type="email"],
body.login input[type="password"],
body.login #lostpasswordform input[type="text"],
body.login #lostpasswordform input[type="email"],
body.login #resetpassform input[type="text"],
body.login #resetpassform input[type="password"] {
	display: block !important;
	width: 100% !important;
	height: 48px !important;
	margin: 0 !important;
	padding: 0 14px !important;
	visibility: visible !important;
	opacity: 1 !important;
	pointer-events: auto !important;
	position: relative !important;
	z-index: 7 !important;
	border: 1px solid var(--ifg-login-line) !important;
	border-radius: 10px !important;
	background: var(--ifg-login-input) !important;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025) !important;
	color: #fff !important;
	caret-color: #fff !important;
	font-size: 15px !important;
	line-height: 48px !important;
	-webkit-appearance: none !important;
	appearance: none !important;
}

body.login input[type="text"]:focus,
body.login input[type="email"]:focus,
body.login input[type="password"]:focus {
	border-color: #5f8ee2 !important;
	background: #203555 !important;
	box-shadow: 0 0 0 3px rgba(74, 124, 216, .22) !important;
	outline: none !important;
}

body.login input::placeholder {
	color: #7183a0 !important;
	opacity: 1 !important;
}

body.login .wp-pwd {
	position: relative !important;
	z-index: 7 !important;
}

body.login .wp-pwd button.button {
	top: 4px !important;
	right: 4px !important;
	width: 40px !important;
	height: 40px !important;
	border: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	color: #91a7ca !important;
	pointer-events: auto !important;
}

body.login #login form .submit {
	margin: 22px 0 0 !important;
	padding: 0 !important;
}

body.login #login form .button-primary,
body.login #login form input[type="submit"] {
	float: none !important;
	width: 100% !important;
	min-height: 46px !important;
	padding: 0 18px !important;
	border: 0 !important;
	border-radius: 10px !important;
	background: linear-gradient(135deg, #3d75d4, #285ab3) !important;
	box-shadow: 0 8px 24px rgba(39, 89, 177, .35) !important;
	color: #fff !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	text-shadow: none !important;
	cursor: pointer !important;
}

body.login #login form .button-primary:hover,
body.login #login form input[type="submit"]:hover {
	background: linear-gradient(135deg, #4a82df, #2f63bf) !important;
	transform: translateY(-1px);
}

body.login #nav,
body.login #backtoblog {
	margin: 14px 0 0 !important;
	padding: 0 4px !important;
	text-align: center !important;
}

body.login #nav a,
body.login #backtoblog a,
body.login .privacy-policy-page-link a {
	color: #bac9e1 !important;
	font-size: 12.5px !important;
	text-decoration: none !important;
}

body.login #nav a:hover,
body.login #backtoblog a:hover,
body.login .privacy-policy-page-link a:hover {
	color: #fff !important;
	text-decoration: underline !important;
	text-underline-offset: 3px;
}

body.login .language-switcher {
	margin-top: 24px !important;
}

body.login .language-switcher select {
	min-height: 40px !important;
	border: 1px solid var(--ifg-login-line) !important;
	border-radius: 9px !important;
	background: var(--ifg-login-input) !important;
	color: #fff !important;
}

body.login #pass-strength-result {
	margin: 8px 0 0 !important;
	border: 0 !important;
	border-radius: 8px !important;
}

@media (max-width: 480px) {
	body.login #login {
		width: min(100% - 24px, 440px) !important;
		padding-top: 34px !important;
	}

	body.login #login form,
	body.login #lostpasswordform,
	body.login #resetpassform {
		padding: 22px 20px !important;
	}

	body .fv-login-page .fv-login-card .fv-row-between {
		align-items: flex-start !important;
		gap: 14px !important;
		flex-direction: column !important;
	}
}