/*
 * BragDev sign-in screen (wp-login.php). Same design system as the site and bdt.css: colours ONLY
 * from Astra's palette variables (printed on this page by LoginScreen, fallbacks = the site's
 * palette), square corners, 44px controls, buttons like the site's (15px uppercase, 10 × 20px).
 * "body.login" outranks WordPress's ".login" and ".wp-core-ui" rules without !important.
 */
body.login {
	background: var(--ast-global-color-4, #e7f6ff);
	color: var(--ast-global-color-3, #364151);
	font-family: Lato, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	font-size: 16px;
	line-height: 1.6;
}

body.login #login {
	width: 360px;
	max-width: calc(100% - 32px);
	padding-top: 8vh;
}

/* Logo on a white tile, as in the site header. The image URL comes from the Customizer logo. */
body.login h1 a {
	width: 72px;
	height: 72px;
	padding: 10px;
	box-sizing: content-box;
	background-color: var(--ast-global-color-5, #fff);
	background-size: contain;
	background-position: center;
	background-origin: content-box;
	margin-bottom: 24px;
}

body.login form {
	margin-top: 16px;
	padding: 28px 28px 32px;
	background: var(--ast-global-color-5, #fff);
	border: 1px solid var(--ast-global-color-6, #d1dae5);
	border-radius: 0;
	box-shadow: none;
}

body.login label {
	font-size: 15px;
	font-weight: 700;
	color: var(--ast-global-color-3, #364151);
}
body.login .forgetmenot label { font-weight: 400; }

body.login form .input,
body.login input[type="text"],
body.login input[type="email"],
body.login input[type="password"] {
	min-height: 44px;
	padding: 8px 12px;
	font-size: 16px;
	color: var(--ast-global-color-3, #364151);
	background: var(--ast-global-color-5, #fff);
	border: 1px solid var(--ast-global-color-6, #d1dae5);
	border-radius: 0;
	box-shadow: none;
}
body.login input[type="password"] { padding-right: 48px; } /* room for the show/hide button */
body.login input:focus,
body.login .button:focus {
	border-color: var(--ast-global-color-1, #1c90d0);
	box-shadow: none;
	outline: 2px solid var(--ast-global-color-1, #1c90d0);
	outline-offset: 1px;
}

body.login .button.wp-hide-pw {
	min-height: 44px;
	height: 44px;
	color: var(--ast-global-color-0, #1c3c6d);
	border-radius: 0;
}
body.login .button.wp-hide-pw:hover { color: var(--ast-global-color-2, #616d8c); }

/* Square checkbox with a white tick on the brand fill (WordPress draws a rounded box with a blue tick). */
body.login input[type="checkbox"] {
	width: 18px;
	height: 18px;
	border: 1px solid var(--ast-global-color-2, #616d8c);
	border-radius: 0;
	box-shadow: none;
}
body.login input[type="checkbox"]:checked {
	border-color: var(--ast-global-color-0, #1c3c6d);
	background: var(--ast-global-color-0, #1c3c6d) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3 6-7' fill='none' stroke='%23fff' stroke-width='2'/%3E%3C/svg%3E") center / 80% no-repeat;
}
body.login input[type="checkbox"]:checked::before { content: none; }

body.login .button-primary {
	min-height: 44px;
	padding: 10px 20px;
	font-size: 15px;
	line-height: 1.2;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--ast-global-color-5, #fff);
	background: var(--ast-global-color-0, #1c3c6d);
	border: 0;
	border-radius: 0;
	box-shadow: none;
	text-shadow: none;
}
body.login .button-primary:hover,
body.login .button-primary:focus {
	color: var(--ast-global-color-5, #fff);
	background: var(--ast-global-color-2, #616d8c); /* 5.15:1, as the site's buttons */
}
/* Full-width button on the screens with a single field (lost password, new password). */
body.login #lostpasswordform .button-primary,
body.login #resetpassform .button-primary { float: none; width: 100%; }

body.login .message,
body.login .notice,
body.login .success {
	border-left: 4px solid var(--ast-global-color-1, #1c90d0);
	background: var(--ast-global-color-5, #fff);
	box-shadow: none;
	font-size: 15px;
}
body.login .success { border-left-color: #067647; }
body.login .notice-error,
body.login #login_error { border-left-color: #b42318; }

body.login a { color: var(--ast-global-color-0, #1c3c6d); }
body.login a:hover,
body.login a:focus { color: var(--ast-global-color-2, #616d8c); }
body.login #nav,
body.login #backtoblog {
	padding: 0;
	font-size: 15px;
}
body.login #nav a,
body.login #backtoblog a { color: var(--ast-global-color-0, #1c3c6d); }
body.login #nav a:hover,
body.login #backtoblog a:hover { color: var(--ast-global-color-2, #616d8c); }

/* Password strength meter and hints on the "set your password" screen. */
body.login #pass-strength-result { border-radius: 0; }
body.login .description.indicator-hint { color: var(--ast-global-color-3, #364151); font-size: 14px; }
