.LoginPage {
    width: 100%;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 16px 60px;
    background-color: #fdf6ec;
    background-image: linear-gradient(180deg, rgb(250 171 142 / 90%) 0%, rgb(255 172 134 / 55%) 40%, rgba(248, 250, 252, 0) 75%), url(/assets/Image/log_in/auth-bg.png);
    background-repeat: no-repeat, no-repeat;
    background-position: center, center bottom;
    background-size: cover, cover;
    background-attachment: fixed;
    box-sizing: border-box;
}

.LoginPage .login_page_card {
  position: relative;
  width: 100%;
  max-width: 480px;
  background-color: #ffffff;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.08);
}

.LoginPage .login_back_btn {
  position: absolute;
  top: 14px;
  left: 14px;
  z-index: 2;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: none;
  background-color: #ffffff;
  color: #000000;
  font-size: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15);
  cursor: pointer;
}

@media (min-width: 0px) and (max-width: 485px) {
  /* Card floats on the illustration so the background stays visible */
  .LoginPage {
    padding: 16px 12px 40px;
    background-attachment: scroll;
  }

  .LoginPage .login_page_card {
    max-width: 100%;
    border-radius: 14px;
  }
}