/*
 * PA Academy — on-brand wp-login.php
 *
 * Enqueued via login_enqueue_scripts AFTER tokens.css, so the Gotham @font-face
 * declarations and brand CSS variables (--pa-navy, --pa-orange, --font-body)
 * are available here. Relative url()s resolve against this file's location
 * (the child theme root), so assets/ and fonts/ work as-is.
 */

body.login {
	background: var(--pa-navy, #20223D);
	background: radial-gradient(1100px 560px at 50% -12%, #2b2e50 0%, var(--pa-navy, #20223D) 62%);
	font-family: var(--font-body, "Gotham", "Helvetica Neue", Arial, sans-serif);
}

#login {
	width: 360px;
	max-width: 92vw;
	padding: 6% 0 4%;
}

/* Brand logo in place of the WordPress mark. on-dark variant for the navy bg. */
.login h1 a {
	background-image: url("assets/logo-horizontal-on-dark.svg");
	background-size: contain;
	background-position: center center;
	background-repeat: no-repeat;
	width: 280px;
	height: 60px;
	margin: 0 auto 28px;
}

/* The login / lost-password / register form as a white brand card. */
.login form {
	background: var(--pa-white, #fff);
	border: none;
	border-radius: 10px;
	box-shadow: 0 14px 44px rgba(0, 0, 0, 0.38);
	padding: 28px 26px;
	font-family: var(--font-body, "Gotham", "Helvetica Neue", Arial, sans-serif);
}

.login label {
	color: var(--pa-navy, #20223D);
	font-weight: 600;
	font-size: 14px;
}

.login input[type="text"],
.login input[type="password"],
.login input[type="email"] {
	border: 1px solid var(--border-strong, #C7C8D3);
	border-radius: 6px;
	padding: 10px 12px;
	font-size: 15px;
	box-shadow: none;
}

.login input[type="text"]:focus,
.login input[type="password"]:focus,
.login input[type="email"]:focus {
	border-color: var(--pa-orange, #F47D20);
	box-shadow: 0 0 0 2px rgba(244, 125, 32, 0.25);
	outline: none;
}

/* Primary submit ("Log In") → brand orange. */
.wp-core-ui .button-primary {
	background: var(--pa-orange, #F47D20);
	border-color: var(--pa-orange, #F47D20);
	color: #fff;
	font-weight: 700;
	border-radius: 6px;
	padding: 6px 18px;
	text-shadow: none;
	box-shadow: none;
	transition: background 0.15s ease, border-color 0.15s ease;
}

.wp-core-ui .button-primary:hover,
.wp-core-ui .button-primary:focus {
	background: #D96A12;
	border-color: #D96A12;
}

/* Links beneath the card (Lost password? / Back to site) — light on navy. */
.login #nav a,
.login #backtoblog a,
.login .privacy-policy-page-link a {
	color: rgba(255, 255, 255, 0.82);
	transition: color 0.15s ease;
}

.login #nav a:hover,
.login #backtoblog a:hover,
.login .privacy-policy-page-link a:hover {
	color: var(--pa-orange, #F47D20);
}

.login .forgetmenot label {
	font-weight: 400;
}

/* Error / message boxes: brand-accent the left border. */
.login #login_error,
.login .message,
.login .notice {
	border-radius: 6px;
	border-left-color: var(--pa-orange, #F47D20);
}

/* Give the miniOrange "Sign in with Microsoft" button room to breathe. */
.login form .mo_oauth,
.login form .mo-oauth-login-wrapper,
.login form .pa-sso {
	margin-top: 14px;
}