#lfqp-login,
#lfqp-login * {
  box-sizing: border-box;
}

#lfqp-login {
  max-width: 100vw;
  overflow-x: hidden;
}

#lfqp-login > .relative,
#lfqp-login .panel,
#lfqp-login form,
#lfqp-login .grid,
#lfqp-login .flex,
#lfqp-login .well,
#lfqp-login .login-tabs {
  min-width: 0 !important;
  max-width: 100% !important;
}

#lfqp-login .login-card,
#lfqp-login .login-card.panel {
  overflow: visible !important;
  max-height: none !important;
  background-color: rgba(255, 255, 255, 0.22) !important;
  background-image: linear-gradient(180deg, rgba(255,255,255,.55), rgba(255,255,255,.06) 48%, rgba(255,255,255,.14)) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html[data-sky="dark"] #lfqp-login .login-card {
  background-color: rgba(12, 18, 36, 0.94) !important;
  background-image: none !important;
  color: #fff !important;
}

html[data-sky="dark"] #lfqp-login,
html[data-sky="dark"] #lfqp-login h1,
html[data-sky="dark"] #lfqp-login p,
html[data-sky="dark"] #lfqp-login label,
html[data-sky="dark"] #lfqp-login button,
html[data-sky="dark"] #lfqp-login a,
html[data-sky="dark"] #lfqp-login span {
  color: #fff;
}

html[data-sky="dark"] #lfqp-login input,
html[data-sky="dark"] #lfqp-login textarea {
  color: #fff !important;
  background-color: rgba(0, 0, 0, 0.45) !important;
}

#lfqp-login .login-card-body {
  display: block;
  overflow: visible;
  height: auto;
}

#lfqp-login .login-card-body.is-retracted {
  display: none;
}

#lfqp-login .login-card-inner,
#lfqp-login form {
  min-height: 0;
  height: auto;
  overflow: visible;
}

#lfqp-login input,
#lfqp-login textarea,
#lfqp-login select,
#lfqp-login button {
  display: block;
  width: 100%;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  white-space: normal;
}

#lfqp-login .login-tabs,
#lfqp-login .login-tabs button,
#lfqp-login .well,
#lfqp-login .well button {
  width: auto;
}

#lfqp-login .login-tabs {
  display: grid;
  width: 100%;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr);
}

#lfqp-login .login-tabs button {
  width: 100%;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}

#lfqp-login .well {
  width: 100%;
  min-width: 0;
}

#lfqp-login .well > button.flex-1,
#lfqp-login .well > button.min-w-0 {
  width: auto;
  flex: 1 1 0;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}

#lfqp-login .sign-in-submit,
#lfqp-login .x-signin {
  position: relative !important;
  z-index: 80 !important;
  background-color: #2ed161 !important;
  color: #06140c !important;
  min-height: 48px !important;
  pointer-events: auto !important;
  touch-action: manipulation;
}

@media (max-width: 767px) {
  #lfqp-login {
    padding-bottom: 2rem !important;
  }

  #lfqp-login .sign-in-submit {
    position: relative !important;
    z-index: 40 !important;
  }
}

#lfqp-login .login-recent,
#lfqp-login .login-recent * {
  pointer-events: auto !important;
  touch-action: manipulation;
}

#lfqp-login .login-recent-btn {
  display: block !important;
  width: auto !important;
  flex: 1 1 0 !important;
  min-height: 48px !important;
  min-width: 0 !important;
  position: relative !important;
  z-index: 50 !important;
}

#lfqp-login input,
#lfqp-login textarea {
  font-size: 16px !important;
}

#lfqp-login .login-recent .well {
  display: flex !important;
  width: 100% !important;
}

#lfqp-login .login-recent button {
  display: block !important;
  width: auto !important;
  max-width: none !important;
  position: relative !important;
  z-index: 60 !important;
  pointer-events: auto !important;
}

#lfqp-login .login-recent-btn {
  flex: 1 1 auto !important;
}

#lfqp-login .login-recent .well > button:last-child {
  flex: 0 0 auto !important;
}

@media (max-width: 767px) {
  html:has(#lfqp-login),
  html:has(#lfqp-login) body {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  #lfqp-login {
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  #lfqp-login .login-recent {
    display: block !important;
    order: -3 !important;
    visibility: visible !important;
    margin-top: 0.5rem !important;
  }
}
