.cepa-customer-login-page {
  min-height: calc(100vh - 188px);
  padding: 28px 16px 60px;
}

.cepa-login-wrap {
  max-width: 458px;
  margin: 0 auto;
}

.cepa-login-breadcrumb {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-bottom: 30px;
  text-transform: uppercase;
  letter-spacing: .16em;
  font-size: 10px;
  font-weight: 700;
  color: #91a3bd;
}

.cepa-login-breadcrumb span.current {
  color: #0f172a;
}

.cepa-login-card {
  background: #fff;
  border: 1px solid rgba(219, 227, 241, .95);
  border-radius: 32px;
  box-shadow: 0 20px 52px rgba(15, 23, 42, .08);
  padding: 42px 40px 38px;
}

.cepa-login-card h1 {
  text-align: center;
  margin: 0;
  color: #0f172a;
  font-size: clamp(2rem, 3vw, 2.35rem);
  line-height: 1.08;
  letter-spacing: -.04em;
  font-weight: 700;
}

.cepa-login-subtitle {
  margin: 16px auto 0;
  max-width: 360px;
  text-align: center;
  color: #66758f;
  font-size: 15px;
  line-height: 1.7;
}

.cepa-login-subtitle .uv-brand {
  color: #4361ee;
  font-weight: 700;
}

#login-form-container {
  margin-top: 34px;
}

#login-form .uv-element-block {
  margin-bottom: 22px;
}

#login-form .uv-field-label {
  margin: 0 0 9px 4px;
  color: #64748b;
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
  font-weight: 700;
}

#login-form .uv-field-block {
  position: relative;
}

#login-form .uv-field {
  border: 1px solid rgba(207, 217, 235, .95);
  border-radius: 18px;
  background: #f8fbff;
  height: 58px;
  padding: 0 18px;
  font-size: 15px;
  font-weight: 500;
  color: #172036;
}

#login-form .uv-field:focus {
  border-color: #4361ee;
  box-shadow: 0 0 0 5px rgba(67, 97, 238, .08);
}

#login-form input[name="_username"],
#login-form input[name="_password"],
#login-form input[name="otp"] {
  padding-left: 48px;
}

#login-form .uv-field-block::before {
  content: "";
  position: absolute;
  left: 16px;
  top: 50%;
  width: 18px;
  height: 18px;
  transform: translateY(-50%);
  opacity: .52;
  background-size: contain;
  background-repeat: no-repeat;
  pointer-events: none;
}

#login-form .uv-field-block.cepa-field-email::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2364758b' stroke-width='2'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M16 12a4 4 0 10-8 0 4 4 0 008 0z'/%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M16 12v1.5a2.5 2.5 0 005 0V12a9 9 0 10-9 9'/%3E%3C/svg%3E");
}

#login-form .uv-field-block.cepa-field-pass::before,
#login-form .uv-field-block.cepa-field-otp::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2364758b' stroke-width='2'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z'/%3E%3C/svg%3E");
}

#login-form .uv-forgot-pwd,
#login-form .uv-resend-otp,
#login-form .uv-continue-with-pass {
  color: #4361ee !important;
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .14em;
  font-weight: 700;
}

#login-form .uv-forgot-pwd {
  right: 8px;
  top: -23px;
}

#login-form .uv-login-form-actions {
  margin: -2px 0 18px !important;
  padding-left: 4px;
  font-size: 13px;
  color: #66758f;
  line-height: 1.6;
}

#login-form .uv-submit-form {
  width: 100%;
  border-radius: 18px;
  height: 58px;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: -.01em;
  text-transform: none;
  background: linear-gradient(135deg, #4361ee 0%, #4c65ea 100%);
  box-shadow: 0 14px 30px rgba(67, 97, 238, .24);
}

#login-form .uv-submit-form::after {
  content: "  \2192";
  font-size: 18px;
}

.cepa-login-footer-note {
  margin-top: 30px;
  padding-top: 26px;
  border-top: 1px solid rgba(219, 227, 241, .95);
  text-align: center;
  color: #9aa9c2;
  font-size: 13px;
  line-height: 1.6;
}

.cepa-login-extra-link {
  margin-top: 22px;
  text-align: center;
}

.cepa-login-extra-link a {
  color: #8da0bf;
  font-size: 12px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .14em;
}

.cepa-login-extra-link a:hover {
  color: #4361ee;
}

@media (max-width: 768px) {
  .cepa-login-card {
    border-radius: 26px;
    padding: 30px 22px 28px;
  }

  .cepa-login-card h1 {
    font-size: 2rem;
  }

  .cepa-login-subtitle {
    font-size: 14px;
  }

  #login-form .uv-field {
    font-size: 15px;
    height: 54px;
  }
}