/* ABH login — replaces Login Customizer styling */

body.login {
	--abh-ink: #1a2d38;
	--abh-slate: #2a4657;
	--abh-mist: #d5dde2;
	--abh-paper: #f7f4ef;
	--abh-gold: #d48b1f;
	--abh-gold-hi: #f4c15a;
	--abh-gold-line: #b67818;
	background:
		radial-gradient(ellipse 80% 55% at 50% -10%, rgba(244, 193, 90, 0.22), transparent 55%),
		radial-gradient(ellipse 60% 40% at 100% 100%, rgba(42, 70, 87, 0.55), transparent 50%),
		linear-gradient(165deg, #152832 0%, var(--abh-slate) 48%, #1e3644 100%);
	min-height: 100%;
	font-family: "Lato", "Helvetica Neue", Helvetica, sans-serif;
	color: var(--abh-paper);
}

body.login::before {
	content: "";
	position: fixed;
	inset: 0;
	pointer-events: none;
	opacity: 0.07;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");
	z-index: 0;
}

body.login #login {
	position: relative;
	z-index: 1;
	width: min(100% - 2rem, 24rem);
	padding: 3.5rem 0 2rem;
}

body.login #login h1.wp-login-logo {
	margin: 0;
}

body.login #login h1 a {
	background-image: none !important;
	width: auto;
	height: auto;
	min-height: 88px;
	padding: 0;
	margin: 0 auto 0.75rem;
	display: block;
	text-indent: -9999px;
	overflow: hidden;
	background-size: contain;
	background-position: center top;
	background-repeat: no-repeat;
	color: transparent;
}

body.login #login h1 a.abh-login-logo {
	width: 112px;
	height: 112px;
	background-size: contain;
}

body.login .abh-login-brand {
	display: block;
	text-align: center;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--abh-mist);
	margin: 0 0 1.75rem;
}

body.login #loginform,
body.login #registerform,
body.login #lostpasswordform {
	background: rgba(247, 244, 239, 0.96);
	border: 1px solid rgba(255, 255, 255, 0.18);
	border-radius: 14px;
	box-shadow: 0 18px 50px rgba(0, 0, 0, 0.28);
	padding: 1.5rem 1.4rem 1.25rem;
	color: var(--abh-ink);
}

body.login label {
	color: var(--abh-slate);
	font-size: 0.8rem;
	font-weight: 700;
	letter-spacing: 0.02em;
}

body.login form .input,
body.login input[type="text"],
body.login input[type="password"],
body.login input[type="email"] {
	background: #fff;
	border: 1px solid #c5d0d6;
	border-radius: 8px;
	box-shadow: none;
	color: var(--abh-ink);
	font-size: 1rem;
	padding: 0.65rem 0.75rem;
	margin-top: 0.35rem;
}

body.login form .input:focus,
body.login input[type="text"]:focus,
body.login input[type="password"]:focus,
body.login input[type="email"]:focus {
	border-color: var(--abh-gold);
	box-shadow: 0 0 0 3px rgba(212, 139, 31, 0.22);
	outline: none;
}

body.login .user-pass-wrap .button.wp-hide-pw {
	color: var(--abh-slate) !important;
	border: 0;
	background: transparent !important;
	box-shadow: none !important;
}

body.login .user-pass-wrap .button.wp-hide-pw:hover,
body.login .user-pass-wrap .button.wp-hide-pw:focus {
	color: var(--abh-gold) !important;
	background: transparent !important;
	box-shadow: none !important;
}

body.login .forgetmenot {
	margin-top: 0.85rem;
}

body.login .forgetmenot label {
	font-weight: 500;
	font-size: 0.85rem;
}

body.login input[type="checkbox"] {
	border-radius: 4px;
	border-color: #c5d0d6;
}

body.login input[type="checkbox"]:checked {
	background: var(--abh-gold);
	border-color: var(--abh-gold-line);
}

body.login .button-primary,
body.login .wp-core-ui .button-primary {
	background: linear-gradient(180deg, var(--abh-gold-hi) 0%, var(--abh-gold) 100%) !important;
	border: 2px solid var(--abh-gold-line) !important;
	border-radius: 999px !important;
	box-shadow: none !important;
	color: var(--abh-slate) !important;
	font-weight: 700 !important;
	text-shadow: none !important;
	padding: 0.35rem 1.15rem !important;
	height: auto !important;
	line-height: 1.4 !important;
	float: none;
	width: 100%;
	margin-top: 1rem;
	transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
}

body.login .button-primary:hover,
body.login .button-primary:focus,
body.login .wp-core-ui .button-primary:hover,
body.login .wp-core-ui .button-primary:focus {
	background: linear-gradient(180deg, #ffd67a 0%, #e1a33b 100%) !important;
	border-color: #c98c28 !important;
	color: var(--abh-slate) !important;
	transform: translateY(-1px);
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.18) !important;
}

body.login .submit {
	margin-top: 0.25rem;
}

body.login #nav,
body.login #backtoblog {
	text-align: center;
	padding: 0;
	margin: 1rem 0 0;
}

body.login #nav a,
body.login #backtoblog a,
body.login .privacy-policy-page-link a {
	color: var(--abh-mist) !important;
	text-decoration: none;
	font-size: 0.9rem;
}

body.login #nav a:hover,
body.login #backtoblog a:hover,
body.login .privacy-policy-page-link a:hover {
	color: var(--abh-gold-hi) !important;
}

body.login .privacy-policy-page-link,
body.login .language-switcher {
	display: none !important;
}

body.login #login .message,
body.login #login #login_error,
body.login #login .success {
	border-radius: 10px;
	border-left-width: 4px;
	box-shadow: none;
	background: rgba(247, 244, 239, 0.96);
	color: var(--abh-ink);
}

body.login #login_error {
	border-left-color: #b33;
}

body.login #login .message {
	border-left-color: var(--abh-gold);
}

/* Nextend social login */
body.login .nsl-container,
body.login .nsl-container-buttons {
	width: 100% !important;
	margin: 1rem 0 0 !important;
	padding: 0 !important;
}

body.login .nsl-container .nsl-button,
body.login .nsl-container a {
	border-radius: 999px !important;
	width: 100% !important;
	max-width: none !important;
	justify-content: center !important;
}

body.login .abh-login-or {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	margin: 1rem 0 0.15rem;
	color: #6a7c86;
	font-size: 0.75rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

body.login .abh-login-or::before,
body.login .abh-login-or::after {
	content: "";
	flex: 1;
	height: 1px;
	background: #c5d0d6;
}

body.login #login form p.submit {
	margin-bottom: 0;
}

@media (max-width: 480px) {
	body.login #login {
		padding-top: 2rem;
	}
}

html[data-abh-theme="dark"] body.login #loginform,
html[data-abh-theme="dark"] body.login #registerform,
html[data-abh-theme="dark"] body.login #lostpasswordform {
	background: #1b2a34;
	border-color: rgba(244, 193, 90, 0.18);
	color: #eef4f8;
}

html[data-abh-theme="dark"] body.login label,
html[data-abh-theme="dark"] body.login #reg_passmail {
	color: #c3d2dc;
}

html[data-abh-theme="dark"] body.login form .input,
html[data-abh-theme="dark"] body.login input[type="text"],
html[data-abh-theme="dark"] body.login input[type="password"],
html[data-abh-theme="dark"] body.login input[type="email"] {
	background: #10181f;
	border-color: rgba(244, 193, 90, 0.18);
	color: #eef4f8;
}

html[data-abh-theme="dark"] body.login .user-pass-wrap .button.wp-hide-pw {
	color: #c3d2dc !important;
}

html[data-abh-theme="dark"] body.login #login .message,
html[data-abh-theme="dark"] body.login #login #login_error,
html[data-abh-theme="dark"] body.login #login .success {
	background: #1b2a34;
	color: #eef4f8;
}

html[data-abh-theme="dark"] body.login .abh-login-or::before,
html[data-abh-theme="dark"] body.login .abh-login-or::after {
	background: rgba(244, 193, 90, 0.18);
}