body.login-page {
  min-height: 100vh !important;
  margin: 0 !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 18% 18%, rgba(255, 255, 255, 0.7), transparent 22rem),
    radial-gradient(circle at 86% 12%, rgba(243, 130, 32, 0.08), transparent 24rem),
    linear-gradient(90deg, #d8e0dd 0%, #edf3ef 48%, #d9e0dd 100%) !important;
  font-family: Inter, Roboto, Arial, sans-serif !important;
}

body.login-page #page,
body.login-page .page-content {
  min-height: 100vh !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.login-page .page-content {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
}

.login-portal-shell {
  position: relative !important;
  width: min(100%, 1080px) !important;
  min-height: 620px !important;
  display: grid !important;
  grid-template-columns: 410px 560px !important;
  gap: 0 !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 20px !important;
}

.login-info-card {
  position: relative !important;
  left: auto !important;
  top: auto !important;
  z-index: 2 !important;
  width: 100% !important;
  min-height: 540px !important;
  padding: 58px 44px 52px !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, 0.97) !important;
  box-shadow: 0 28px 70px rgba(37, 53, 49, 0.16) !important;
  text-align: center !important;
  transform: translateX(18px) !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
}

.login-info-logo {
  display: block !important;
  width: 230px !important;
  max-width: 100% !important;
  margin: 0 auto 52px !important;
}

.login-info-card h1 {
  margin: 0 0 28px !important;
  color: #084734 !important;
  font-size: 29px !important;
  line-height: 1.26 !important;
  font-weight: 800 !important;
  letter-spacing: 0.04em !important;
}

.login-info-card p {
  margin: 0 !important;
  color: #245744 !important;
  font-size: 18px !important;
  line-height: 2 !important;
  font-weight: 600 !important;
}

.login-card {
  width: 100% !important;
  min-height: 590px !important;
  padding: 48px 52px 38px 82px !important;
  border: 1px solid rgba(255, 255, 255, 0.62) !important;
  border-radius: 8px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  box-shadow: 0 28px 70px rgba(37, 53, 49, 0.16) !important;
}

.login-tabs {
  display: flex !important;
  align-items: flex-end !important;
  gap: 20px !important;
  margin: 0 0 48px !important;
  border-bottom: 1px solid #e2e6e2 !important;
}

.login-tab {
  height: 48px !important;
  padding: 0 24px 17px !important;
  border: 0 !important;
  border-bottom: 2px solid transparent !important;
  background: transparent !important;
  color: #2f3437 !important;
  font-size: 22px !important;
  line-height: 1 !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
}

.login-tab i {
  margin-right: 8px !important;
  font-size: 19px !important;
  color: #f38220 !important;
}

.login-tab.active {
  color: #2f3437 !important;
  border-bottom-color: #f38220 !important;
}

.login-form-body {
  max-width: none !important;
}

.login-field label {
  display: block !important;
  margin: 0 0 10px !important;
  color: #222 !important;
  font-size: 18px !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
}

.login-field label span {
  color: #db2e1e !important;
}

.login-input-wrap {
  position: relative !important;
  height: 58px !important;
  display: block !important;
}

.login-input-wrap > i {
  position: absolute !important;
  left: 18px !important;
  top: 0 !important;
  width: 22px !important;
  height: 58px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #74706c !important;
  font-size: 18px !important;
  line-height: 58px !important;
  transform: none !important;
  z-index: 2 !important;
}

.login-field .form-control {
  position: relative !important;
  width: 100% !important;
  height: 58px !important;
  min-height: 58px !important;
  margin: 0 !important;
  padding: 0 58px 0 54px !important;
  border: 1px solid rgba(64, 76, 70, 0.18) !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: #1f2933 !important;
  font-size: 16px !important;
  line-height: 58px !important;
  box-shadow: 0 10px 26px rgba(28, 44, 38, 0.05) !important;
  transition: border-color .2s ease, box-shadow .2s ease !important;
}

.login-field .form-control:focus {
  border-color: rgba(243, 130, 32, 0.5) !important;
  box-shadow: 0 0 0 4px rgba(243, 130, 32, 0.1), 0 12px 28px rgba(28, 44, 38, 0.08) !important;
}

.login-field .form-control::placeholder {
  color: #737d85 !important;
}

.login-password-wrap .form-control {
  padding-right: 58px !important;
}

.login-password-toggle {
  position: absolute !important;
  top: 8px !important;
  right: 12px !important;
  width: 42px !important;
  height: 42px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  transform: none !important;
  z-index: 3 !important;
}

.login-password-toggle svg {
  width: 23px !important;
  height: 23px !important;
  stroke: #706d69 !important;
}

.login-error {
  min-height: 18px !important;
  padding-top: 4px !important;
  color: #d22d20 !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
}

.login-button {
  width: 210px !important;
  height: 58px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: 30px 0 44px !important;
  border: 0 !important;
  border-radius: 8px !important;
  color: #fff !important;
  font-size: 17px !important;
  line-height: 1 !important;
  padding: 0 28px !important;
  letter-spacing: 0.12em !important;
  transition: transform .2s ease, box-shadow .2s ease !important;
}

.login-button:hover,
.login-button:focus {
  color: #fff !important;
  transform: translateY(-1px) !important;
}

.login-powered {
  display: flex !important;
  width: 100% !important;
  align-items: center !important;
  justify-content: center !important;
  flex-direction: column !important;
  gap: 12px !important;
  color: #333 !important;
  font-size: 13px !important;
  text-align: center !important;
}

.login-powered img {
  width: 108px !important;
}

@media (max-width: 1100px) {
  body.login-page {
    overflow: auto !important;
  }

  .login-portal-shell {
    display: flex !important;
    min-height: 100vh !important;
    justify-content: center !important;
    padding: 28px 18px !important;
  }

  .login-info-card {
    display: none !important;
    transform: none !important;
  }

  .login-card {
    width: min(100%, 620px) !important;
    min-height: auto !important;
    padding: 34px 28px !important;
  }
}

@media (max-width: 560px) {
  .login-tabs {
    gap: 4px !important;
  }

  .login-tab {
    padding-left: 8px !important;
    padding-right: 8px !important;
    font-size: 17px !important;
  }

  .login-button {
    width: 100% !important;
  }
}
  border-radius: 8px !important;