/* Apex Architectural Metal - webmail branding over Elastic.
   Navy #092446, blue #12478a, slate #3b4856 (apex-metal.com). */

/* ---- Login ---- */
body.task-login {
  background: radial-gradient(1100px 620px at 50% -12%, #12478a 0%, #092446 62%) fixed #092446;
}
body.task-login #layout,
body.task-login #layout-content {
  background: transparent !important;
}
/* Logo and form stack into one white card; the logo needs a white ground. */
body.task-login #logo {
  box-sizing: border-box;
  display: block;
  width: 23rem;
  max-width: 92vw;
  height: 9.5rem;
  max-height: none;
  object-fit: contain;
  background: #fff;
  padding: 1.6rem 3rem .4rem;
  margin: 0 auto !important;
  top: 10vh;  /* Elastic offsets logo 16vh / form 20vh; equal = one card */
  z-index: 1;  /* paint over the form's shadow */
  border-radius: 14px 14px 0 0;
}
body.task-login #login-form {
  box-sizing: border-box;
  width: 23rem;
  max-width: 92vw;
  margin: 0 auto !important;
  top: 10vh;
  padding: .4rem 1.9rem 1.2rem;
  background: #fff;
  border-radius: 0 0 14px 14px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, .35);
}
.apex-login-head {
  text-align: center;
  margin: .2rem 0 1.1rem;
}
.apex-company {
  color: #092446;
  font-weight: 800;
  font-size: 1.05rem;
  letter-spacing: .01em;
}
.apex-sub {
  color: #3b4856;
  font-size: .85rem;
  margin-top: .15rem;
}
body.task-login #login-form input.form-control:focus {
  border-color: #12478a;
  box-shadow: 0 0 0 .2rem rgba(18, 71, 138, .25);
}
body.task-login #rcmloginsubmit {
  background-color: #092446;
  border-color: #092446;
  color: #fff;
  font-weight: 600;
}
body.task-login #rcmloginsubmit:hover,
body.task-login #rcmloginsubmit:focus {
  background-color: #12478a;
  border-color: #12478a;
}
.apex-forgot {
  text-align: center;
  color: #3b4856;
  font-size: .85rem;
  margin: 1.1rem 0 .3rem;
}
.apex-notice {
  text-align: center;
  color: #6c757d;
  font-size: .72rem;
  margin: 0;
}
body.task-login #login-footer {
  color: #6c757d;
  margin-top: .9rem;
}
body.task-login #login-footer a {
  color: #12478a;
}

/* ---- Forgot password box ---- */
.apex-forgot a {
  color: #12478a;
}
.apex-forgot label {
  display: block;
  text-align: left;
  font-size: .85rem;
  color: #3b4856;
  margin-bottom: .3rem;
}
.apex-forgot input {
  display: block;
  width: 100%;
  box-sizing: border-box;
}
.apex-forgot-actions {
  display: flex;
  justify-content: flex-end;
  gap: .5rem;
  margin-top: .6rem;
}
.apex-forgot-done {
  color: #3b4856;
  margin: 0;
}