/* Anaconda Review log-in, lost-password and set-password screens.
   Colors come from Settings → Login Branding (set as variables on body.login). */

body.login {
	background: var(--arlb-bg);
	color: var(--arlb-text);
	font-family: Georgia, "Times New Roman", serif;
}

/* Masthead: allowed to be wider than the form, centered over it. */
.login h1 {
	display: flex;
	justify-content: center;
	margin: 0 calc((320px - min(var(--arlb-logo-w), 92vw)) / 2) 22px;
}

.login h1 a {
	flex: none;
	margin: 0;
	padding: 0;
}

.login h1 a:focus {
	box-shadow: 0 0 0 2px var(--arlb-accent);
	outline: 0;
}

/* Form card */
.login form {
	background: #fff;
	border: 0;
	border-top: 3px double var(--arlb-accent);
	border-bottom: 1px solid var(--arlb-rule);
	border-radius: 0;
	box-shadow: none;
	color: var(--arlb-text);
}

.login label {
	color: var(--arlb-text);
	font-size: 15px;
}

.login form .input,
.login input[type="text"],
.login input[type="password"],
.login input[type="email"] {
	border: 1px solid var(--arlb-rule);
	border-radius: 2px;
	color: var(--arlb-text);
	font-family: inherit;
}

body.login form .input:focus,
body.login form input.password-input:focus,
.login input[type="text"]:focus,
.login input[type="password"]:focus,
.login input[type="email"]:focus,
.login input[type="checkbox"]:focus,
.login select:focus {
	border-color: var(--arlb-accent);
	box-shadow: 0 0 0 1px var(--arlb-accent);
	outline: 0;
}

.login input[type="checkbox"] {
	border-color: var(--arlb-rule);
}

.login input[type="checkbox"]:checked::before {
	filter: grayscale(1) brightness(0.6);
}

/* Main button */
.login .button-primary,
.wp-core-ui.login .button-primary {
	background: var(--arlb-accent);
	border-color: var(--arlb-accent);
	border-radius: 2px;
	color: var(--arlb-on-accent);
	font-family: inherit;
	font-weight: 700;
	letter-spacing: 0.04em;
	text-shadow: none;
	text-transform: uppercase;
}

.wp-core-ui.login .button-primary:hover,
.wp-core-ui.login .button-primary:focus,
.wp-core-ui.login .button-primary:active {
	background: var(--arlb-accent-dark);
	border-color: var(--arlb-accent-dark);
	color: var(--arlb-on-accent);
}

.wp-core-ui.login .button-primary:focus {
	box-shadow: 0 0 0 1px #fff, 0 0 0 3px var(--arlb-accent);
}

/* "Generate password" and the show/hide eye on the set-password screen */
.wp-core-ui.login .button:not(.button-primary),
.wp-core-ui.login .button-secondary {
	border-color: var(--arlb-accent);
	color: var(--arlb-accent);
	font-family: inherit;
}

.wp-core-ui.login .button.wp-hide-pw,
.wp-core-ui.login .button.wp-hide-pw:hover {
	background: transparent;
	border-color: transparent;
	color: var(--arlb-accent);
}

.wp-core-ui.login .button.wp-hide-pw:focus {
	border-color: var(--arlb-accent);
	box-shadow: 0 0 0 1px var(--arlb-accent);
}

/* Notices */
.login .message,
.login .success,
.login .notice-info {
	background: #fff;
	border-left-color: var(--arlb-accent);
	box-shadow: none;
	color: var(--arlb-text);
}

.login .notice,
.login #login_error {
	box-shadow: none;
	color: var(--arlb-text);
}

/* Links under the form */
.login #nav,
.login #backtoblog,
.login .privacy-policy-page-link {
	font-size: 14px;
}

.login #nav a,
.login #backtoblog a,
.login .privacy-policy-page-link a,
.login a {
	color: var(--arlb-accent);
}

.login #nav a:hover,
.login #backtoblog a:hover,
.login a:hover {
	color: var(--arlb-accent-dark);
	text-decoration: underline;
}

.login a:focus {
	box-shadow: 0 0 0 2px var(--arlb-accent);
	color: var(--arlb-accent-dark);
	outline: 0;
}

.login .language-switcher {
	color: var(--arlb-text);
}

@media (max-width: 400px) {
	.login h1 {
		margin-left: 0;
		margin-right: 0;
	}
}
