:root {
  --login-black: #09090b;
  --login-bg: #302c35;
  --login-panel: #423c49;
  --login-border: #756a7e;
  --login-text: #f4efe7;
  --login-muted: #c9c0cc;
  --login-gold: #d8b45d;
  --login-burgundy: #593747;
}

body.login {
  background:
    linear-gradient(90deg, rgb(9 9 11 / 94%), rgb(9 9 11 / 58%)),
    url("ctr-klaczki-header.webp") 62% center / cover fixed;
  color: var(--login-text);
}

.login h1 a {
  width: auto;
  height: auto;
  padding: 10px;
  background: none;
  color: var(--login-text);
  font-family: Georgia, serif;
  font-size: 30px;
  font-weight: 500;
  line-height: 1.1;
  text-indent: 0;
}

.login form {
  border: 1px solid var(--login-border);
  border-radius: 8px;
  background: rgb(66 60 73 / 96%);
  color: var(--login-text);
  box-shadow: 0 24px 60px rgb(0 0 0 / 38%);
}

.login label,
.login #nav,
.login #backtoblog,
.login .privacy-policy-page-link {
  color: var(--login-muted);
}

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

.login input[type="text"],
.login input[type="email"],
.login input[type="password"],
.login select {
  border-color: var(--login-border);
  background: #312d36;
  color: var(--login-text);
}

.wp-core-ui .button-primary {
  border-color: var(--login-gold);
  background: var(--login-burgundy);
  color: #fff;
}

.wp-core-ui .button-primary:hover,
.wp-core-ui .button-primary:focus {
  border-color: #f0d080;
  background: #72495d;
}

.login .message,
.login .notice,
.login .success {
  border-left-color: var(--login-gold);
  background: #fff;
  color: #1d2025;
}