@font-face {
  font-family: "AgencyArchivo";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/archivo-v19-latin-regular.woff2") format("woff2");
}
@font-face {
  font-family: "AgencyArchivo";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("fonts/archivo-v19-latin-600.woff2") format("woff2");
}

body.login {
  background-color: #16151a;
  background-image:
    linear-gradient(rgba(10, 8, 15, 0.2), rgba(10, 8, 15, 0.38)),
    url("night-sea.webp");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  color: #f3f0f7;
  font-family: "AgencyArchivo", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
}

body.login #login {
  width: min(360px, calc(100% - 40px));
  padding-top: 7vh;
}

body.login #login h1 a {
  width: 220px;
  height: 86px;
  margin-bottom: 24px;
  background-image: url("wpseoai-rocket-white.svg");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

body.login form {
  border: 1px solid rgba(233, 238, 250, 0.16);
  border-radius: 12px;
  background: #1c1a21;
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.24);
}

body.login label,
body.login .message,
body.login #login_error {
  color: #f3f0f7;
}

body.login input[type="text"],
body.login input[type="password"] {
  border-color: rgba(233, 238, 250, 0.32);
  border-radius: 8px;
  background: #23202a;
  color: #fbf9ff;
}

body.login input:focus,
body.login .button.wp-hide-pw:focus {
  border-color: #cf8aff;
  box-shadow: 0 0 0 1px #cf8aff;
}

body.login .button-primary {
  border-color: #cf8aff;
  border-radius: 8px;
  background: #cf8aff;
  color: #16151a;
  font-weight: 600;
  text-shadow: none;
}

body.login .button-primary:hover,
body.login .button-primary:focus {
  border-color: #b748ff;
  background: #b748ff;
  color: #16151a;
}

body.login #nav a,
body.login #backtoblog a,
body.login .privacy-policy-page-link a {
  color: #aaa4af;
}

body.login #nav a:hover,
body.login #backtoblog a:hover,
body.login .privacy-policy-page-link a:hover {
  color: #cf8aff;
}

body.login .agency-kit-login-credit {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin: 28px auto 0;
  color: #aaa4af;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

body.login .agency-kit-login-credit a {
  display: inline-flex;
}

body.login .agency-kit-login-credit img {
  width: 96px;
  height: auto;
  opacity: 0.88;
}