/* Custom login styles */

/*
 CUSTOMIZE SITE LOGIN
 All you have to do is update the variables and replace the logo url.
*/

/*Please change Variables*/
.login {
  --light-background: #f7f6f3;
  --primary-color: #443750;
  --secondary-color: #05668d;
  --accent-color: #7a9a3d;
}

body.login {
  background-color: var(--light-background);
}
.login form .input,
.login form input[type="checkbox"],
.login input[type="text"] {
  background: white;
}
.login form,
.login #login_error,
.login .message,
.login .success {
  box-shadow: 0px 2px 20px 0px rgba(0, 0, 0, 0.2);
}
.login label {
  color: var(--primary-color);
}
.login #backtoblog,
.login #nav {
  text-align: center;
}
.login a,
.login #backtoblog a,
.login #nav a {
  color: var(--secondary-color);
}
.login a:hover,
.login #backtoblog a:hover,
.login #nav a:hover {
  color: var(--accent-color);
}
.login h1 a {
  background-image: url("../images/nami-cos-logo-simplified.svg");
  padding-bottom: 8px;
  width: 100%;
  height: 90px;
  -webkit-background-size: 100px;
  background-size: 150px;
}
body.login div#login form#loginform p.submit,
body.login div#login form#loginform p.submit input#wp-submit {
  background: var(--secondary-color);
  border: none;
  border-radius: 0;
  font-weight: bold;
  text-transform: uppercase;
  -webkit-box-shadow: none;
  box-shadow: none;
  text-shadow: none;
}
body.login div#login form#loginform p.submit:hover,
body.login div#login form#loginform p.submit input#wp-submit:hover {
  background: #151f4e;
}