/* Binder Suite agent sign-in theme. */
:root {
  --bs-bg: #080d12;
  --bs-surface: #101821;
  --bs-surface-2: #172331;
  --bs-line: #2a3a4c;
  --bs-text: #f5f8fb;
  --bs-muted: #acb8c5;
  --bs-cyan: #7dd3fc;
  --bs-blue: #4da3ea;
  --bs-gold: #d6ad48;
}

body#loginBody {
  color: var(--bs-text);
  background: var(--bs-bg);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

#brickwall,
#background {
  background:
    radial-gradient(circle at 16% 12%, rgba(77, 163, 234, 0.26), transparent 32rem),
    radial-gradient(circle at 88% 0%, rgba(214, 173, 72, 0.16), transparent 28rem),
    linear-gradient(145deg, #080d12, #111b26 68%, #0b1118);
}

#blur {
  display: none;
}

#loginBox {
  top: 12%;
  width: min(440px, calc(100% - 32px));
  margin-left: 0;
  padding: 28px 30px 24px;
  border: 1px solid rgba(125, 211, 252, 0.20);
  border-radius: 18px;
  background: rgba(16, 24, 33, 0.96);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.48);
  transform: translateX(-50%);
}

#loginBox::after {
  display: none;
}

#logo a {
  height: 104px;
}

#logo a img {
  width: min(340px, 80vw);
  max-width: 100%;
  max-height: 82px;
  object-fit: contain;
}

#loginBox form {
  width: 100%;
}

#loginBox fieldset {
  margin: 0;
}

#loginBox fieldset input {
  height: 46px;
  margin-bottom: 14px;
  padding: 9px 12px;
  color: #172331;
  border: 1px solid #526477;
  border-radius: 8px;
  background: #f7f9fc;
  font-size: 15px;
}

#loginBox fieldset input:focus {
  border-color: var(--bs-cyan);
  box-shadow: 0 0 0 3px rgba(125, 211, 252, 0.18);
}

#loginBox .submit.button {
  height: 40px;
  padding: 7px 18px;
  color: #07121b;
  border: 0;
  border-radius: 8px;
  background: linear-gradient(135deg, var(--bs-cyan), var(--bs-blue));
  box-shadow: 0 9px 22px rgba(77, 163, 234, 0.23);
  font-size: 14px;
  font-weight: 800;
}

#loginBox .submit.button:hover {
  color: #07121b;
  background: linear-gradient(135deg, #a6e3ff, #68b6f0);
  box-shadow: 0 10px 25px rgba(77, 163, 234, 0.30);
}

#reset-link {
  color: var(--bs-cyan);
  line-height: 40px;
}

#login-message {
  color: #ffb4a7;
}

#loginBox .banner {
  color: var(--bs-muted);
}

#company {
  margin-top: 24px;
  color: #8292a2;
  font-size: 12px;
}

#poweredBy {
  color: #718191;
}

@media (max-width: 520px) {
  #loginBox {
    top: 7%;
    padding: 24px 20px 20px;
  }
}