/* Purpose-built modern login modal with a visible title, dependency-free lock mark, and accessible form labels. */

.it-login-modal .modal-dialog {
  width: calc(100% - 24px);
  max-width: 430px;
  padding: 0;
}

.it-login-modal .modal-content {
  border: 1px solid rgba(255,255,255,.20);
  border-radius: 22px;
  box-shadow: 0 32px 90px rgba(5,20,36,.34);
}

.it-login-modal .it-login-header {
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 112px;
  padding: 25px 66px 25px 27px !important;
}

.it-login-icon-badge {
  position: relative;
  flex: 0 0 48px;
  width: 48px;
  height: 48px;
  margin: 0;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 14px;
  background: rgba(255,255,255,.10);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10);
}

.it-login-icon-badge::before {
  content: "";
  position: absolute;
  left: 14px;
  top: 21px;
  width: 18px;
  height: 15px;
  border: 2px solid #ffffff;
  border-radius: 4px;
  box-sizing: border-box;
}

.it-login-icon-badge::after {
  content: "";
  position: absolute;
  left: 17px;
  top: 11px;
  width: 12px;
  height: 13px;
  border: 2px solid #ffffff;
  border-bottom: 0;
  border-radius: 8px 8px 0 0;
  box-sizing: border-box;
}

.it-login-heading {
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
}

.it-login-modal .it-login-eyebrow {
  margin: 0 !important;
  padding: 0;
  color: #9fd2e5 !important;
  font-size: 10px !important;
  font-weight: 800;
  line-height: 1.3;
  letter-spacing: .13em;
  text-align: left;
  text-transform: uppercase;
}

.it-login-modal .it-login-title {
  margin: 0 !important;
  padding: 0 !important;
  color: #ffffff !important;
  font-size: 25px !important;
  font-weight: 750;
  line-height: 1.15;
  letter-spacing: -.025em;
  text-align: left;
}

.it-login-modal .it-login-body {
  padding: 28px 30px 26px !important;
}

.it-login-modal .it-login-form {
  display: block;
  width: 100%;
}

.it-login-modal .it-login-intro {
  margin: 0 0 22px !important;
  color: #657587;
  font-size: 14px;
  line-height: 1.6;
  text-align: left;
}

.it-login-modal .it-login-field {
  margin: 0 0 16px !important;
}

.it-login-modal .it-login-label {
  display: block;
  margin: 0 0 7px !important;
  color: #233c52;
  font-size: 12px;
  font-weight: 750;
  line-height: 1.4;
  letter-spacing: .015em;
}

.it-login-modal .it-login-input {
  min-height: 50px;
  padding: 13px 15px;
  border: 1px solid #d8e1e9;
  border-radius: 10px;
  background: #f7f9fb;
  color: #132333;
  font-size: 14px;
}

.it-login-modal .it-login-actions {
  margin: 6px 0 0 !important;
}

.it-login-modal .it-login-submit {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 49px;
  margin: 0 !important;
  border: 1px solid #cf2028;
  border-radius: 10px;
  background: #cf2028;
  color: #ffffff;
  box-shadow: 0 10px 24px rgba(207,32,40,.20);
  font-size: 14px;
  font-weight: 750;
}

.it-login-modal .it-login-submit:hover, .it-login-modal .it-login-submit:focus {
  background: #b81820;
  border-color: #b81820;
  color: #ffffff;
  box-shadow: 0 12px 26px rgba(207,32,40,.25);
}

.it-login-modal .it-login-help {
  margin: 22px 0 0 !important;
  padding: 18px 0 0;
  border-top: 1px solid #e4ebf0;
  color: #718092 !important;
  font-size: 11.5px;
  line-height: 1.55;
  text-align: center;
}

@media (max-width: 575.98px) {
  .it-login-modal .it-login-header {
    min-height: 100px;
    padding: 22px 58px 22px 22px !important;
  }
}

@media (max-width: 575.98px) {
  .it-login-icon-badge {
    flex-basis: 44px;
    width: 44px;
    height: 44px;
    border-radius: 13px;
  }
}

@media (max-width: 575.98px) {
  .it-login-icon-badge::before {
    left: 13px;
    top: 20px;
  }
}

@media (max-width: 575.98px) {
  .it-login-icon-badge::after {
    left: 16px;
    top: 10px;
  }
}

@media (max-width: 575.98px) {
  .it-login-modal .it-login-title {
    font-size: 22px !important;
  }
}

@media (max-width: 575.98px) {
  .it-login-modal .it-login-body {
    padding: 24px 22px 22px !important;
  }
}

