/**
 * wp-login.php reskin to match the my-scouts portal.
 *
 * Every value here is a literal, not a var(--wp--preset--color--*) the way
 * portal.css prefers: WordPress never prints the theme's global-styles block
 * on wp-login.php, so those custom properties would not resolve here. The
 * literals below are the same numbers portal.css documents as its own
 * fallbacks (ink #1c1c19, surface #ffffff, accent #43613f, ...), so this
 * screen keeps the same brand look those defaults describe.
 *
 * No dark-mode handling, unlike the portal: wp-login.php is a single
 * anonymous screen with no theme or user preference to read one from.
 */

body.login {
	background: #fbfbfa;
}

.login h1 a {
	background-size: contain;
	width: 100%;
	height: 80px;
}

.login form {
	border: 1px solid #e2e0da;
	border-radius: 11px;
	box-shadow: none;
	padding: 26px 24px 24px;
}

.login label {
	color: #1c1c19;
}

.login form .input,
.login input[type="text"],
.login input[type="password"],
.login input[type="email"],
.login input[type="url"] {
	border: 1.5px solid #e2e0da;
	border-radius: 8px;
	color: #1c1c19;
	font-size: max(1rem, 16px);
}

.login form .input:focus,
.login input[type="text"]:focus,
.login input[type="password"]:focus,
.login input[type="email"]:focus,
.login input[type="url"]:focus {
	border-color: #43613f;
	box-shadow: 0 0 0 1px #43613f;
}

.login .button-primary {
	background: #43613f;
	border-color: #43613f;
	border-radius: 9px;
	color: #ffffff;
	text-shadow: none;
	box-shadow: none;
}

.login .button-primary:hover,
.login .button-primary:focus {
	background: #364e33;
	border-color: #364e33;
	color: #ffffff;
}

.login #nav,
.login #backtoblog {
	text-align: center;
}

.login #nav a,
.login #backtoblog a {
	color: #5f594f;
}

.login #nav a:hover,
.login #backtoblog a:hover {
	color: #43613f;
}

.login .message {
	background: #dcedd8;
	border: 0;
	border-radius: 9px;
	color: #2c5424;
}

.login #login_error {
	background: #fdecea;
	border: 0;
	border-radius: 9px;
	color: #9e1b32;
}

.login .message a,
.login #login_error a {
	color: inherit;
	text-decoration: underline;
}
