/*
 * Login page styles.
 * Change these variables to customize the login page palette.
 */
body.login {
	--login-primary: #F91A1D;
	--login-accent: #001837;
	--login-text: #001837;

	background-image: url("../images/login_background.jpg");
	background-size: cover;
	background-position: center;
}

#login::after {
	background-color: var(--login-accent);
}

#login::before,
#login form::after {
	background-image: radial-gradient(circle, var(--login-primary) 30%, transparent 30.5%);
}

#login h1 a {
	background-image: url("../images/logo_de_geuzen.jpeg");
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
}

#login form {
	color: var(--login-text);
}

#login form input:focus,
form#language-switcher select:focus {
	border-color: var(--login-primary);
}

#login form button.button.button-secondary.wp-hide-pw.hide-if-no-js .dashicons::before {
	color: var(--login-primary);
}

#login .button-primary,
form#language-switcher input[type="submit"] {
	background: var(--login-primary);
}

#login .button-primary:hover,
form#language-switcher input[type="submit"]:hover {
	background-color: var(--login-accent);
}

#login #nav a,
#login #backtoblog a {
	color: var(--login-text);
}

#login #nav a:hover,
#login #backtoblog a:hover {
	color: var(--login-primary);
}