@font-face {
  font-family: "MHANTA Manrope";
  src: url("../fonts/manrope-latin-variable.woff2") format("woff2");
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
}
@font-face {
  font-family: "MHANTA Mono";
  src: url("../fonts/jetbrains-mono-latin-variable.woff2") format("woff2");
  font-style: normal;
  font-weight: 400 800;
  font-display: swap;
}
:root {
  --mh-font-ui: "MHANTA Manrope", Arial, sans-serif;
  --mh-font-mono: "MHANTA Mono", ui-monospace, monospace;
  --pf-global--FontFamily--sans-serif: var(--mh-font-ui);
  --pf-global--FontFamily--heading--sans-serif: var(--mh-font-ui);
  --pf-global--primary-color--100: var(--mh-blue-600);
  --pf-global--primary-color--200: var(--mh-blue-700);
  --pf-global--Color--100: var(--mh-text);
  --pf-global--Color--200: var(--mh-text-secondary);
}
.login-pf {
  background: #fff;
  color-scheme: light;
}
.login-pf body {
  position: relative;
  isolation: isolate;
  display: flex;
  min-height: 100dvh;
  height: auto;
  margin: 0;
  padding: 32px 16px;
  background:
    radial-gradient(
      ellipse at 78% 8%,
      var(--mh-atmosphere-soft),
      transparent 58%
    ),
    radial-gradient(ellipse at 12% 90%, var(--mh-atmosphere), transparent 65%),
    #fff;
  color: var(--mh-text);
  font-family: var(--mh-font-ui);
  font-size: var(--mh-type-body);
  line-height: var(--mh-leading-body);
  -webkit-font-smoothing: antialiased;
}
.login-pf body::before {
  content: "";
  position: fixed;
  z-index: -1;
  top: -52px;
  right: -140px;
  width: min(720px, 80vw);
  aspect-ratio: 2;
  background: url("../img/mhanta-wing-transparent.png") center / contain
    no-repeat;
  opacity: 0.12;
  mask-image: linear-gradient(to bottom, black 20%, transparent 95%);
  -webkit-mask-image: linear-gradient(to bottom, black 20%, transparent 95%);
  pointer-events: none;
}
.login-pf-page {
  position: relative;
  width: 100%;
  max-width: 448px;
  margin: auto;
  padding: 28px 32px 24px;
  border: 1px solid var(--mh-border);
  border-radius: var(--mh-radius-lg);
  background: var(--mh-surface-strong);
  box-shadow: var(--mh-shadow-card);
  backdrop-filter: blur(var(--mh-blur-card));
}
#kc-header {
  margin: 0 0 20px;
  padding: 0;
  color: var(--mh-text);
}
#kc-header-wrapper {
  width: 200px;
  max-width: 100%;
  height: 67px;
  margin: 0 auto;
  padding: 0;
  background: url("../img/mhanta-official.png") center / contain no-repeat;
  text-indent: -9999px;
  white-space: nowrap;
  overflow: hidden;
}
.login-pf-page .card-pf {
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
}
.login-pf-page .login-pf-header {
  margin: 0 0 24px;
  padding: 0;
}
.login-pf h1#kc-page-title {
  margin: 0;
  color: var(--mh-text);
  font-family: var(--mh-font-ui);
  font-size: var(--mh-type-compact-heading);
  font-weight: var(--mh-weight-bold);
  line-height: var(--mh-leading-title);
  letter-spacing: var(--mh-tracking-heading);
  text-wrap: balance;
}
#kc-content,
#kc-content-wrapper {
  margin: 0;
  padding: 0;
}
.login-pf .form-group {
  margin-bottom: 20px;
}
.login-pf label,
.login-pf .pf-c-form__label {
  margin-bottom: 8px;
  color: var(--mh-text);
  font-family: var(--mh-font-ui);
  font-size: var(--mh-type-control);
  font-weight: var(--mh-weight-semibold);
  line-height: var(--mh-leading-label);
}
.login-pf .pf-c-form-control,
.login-pf textarea {
  min-height: 46px;
  height: auto;
  padding: 11px 12px;
  border: 1px solid var(--mh-border-strong);
  border-radius: var(--mh-radius-sm);
  background: #fff;
  color: var(--mh-text);
  font-family: var(--mh-font-ui);
  font-size: var(--mh-type-prose);
  line-height: var(--mh-leading-label);
  box-shadow: none;
}
.login-pf .pf-c-form-control[aria-invalid="true"] {
  border-color: var(--mh-danger-ink);
}
.login-pf .pf-c-input-group .pf-c-form-control {
  min-width: 0;
  border-radius: var(--mh-radius-sm) 0 0 var(--mh-radius-sm);
}
.login-pf .pf-c-input-group .pf-c-button {
  min-width: 46px;
  border: 1px solid var(--mh-border-strong);
  border-left: 0;
  border-radius: 0 var(--mh-radius-sm) var(--mh-radius-sm) 0;
  background: #fff;
  color: var(--mh-text-secondary);
}
.login-pf .pf-c-button,
.login-pf .btn {
  min-height: 46px;
  padding: 11px 16px;
  border-radius: var(--mh-radius-sm);
  font-family: var(--mh-font-ui);
  font-size: var(--mh-type-body);
  font-weight: var(--mh-weight-semibold);
  line-height: var(--mh-leading-body);
}
.login-pf .pf-c-button::after {
  border: 0;
}
.login-pf .pf-c-button.pf-m-primary {
  border: 1px solid transparent;
  background: var(--mh-blue-600);
  color: #fff;
}
.login-pf .pf-c-button.pf-m-primary:hover {
  background: var(--mh-blue-700);
}
.login-pf :is(input, button, a, select, textarea):focus-visible {
  outline: 2px solid var(--mh-blue-600);
  outline-offset: 3px;
}
.login-pf a {
  color: var(--mh-blue-700);
  text-underline-offset: 3px;
}
.login-pf a:hover {
  color: var(--mh-blue-700);
  text-decoration: underline;
}
.login-pf .pf-c-alert {
  margin: 0 0 20px;
  border: 1px solid var(--mh-border);
  border-radius: var(--mh-radius-sm);
  box-shadow: none;
}
.login-pf .pf-c-alert.pf-m-danger {
  background: #fff0f3;
  color: var(--mh-danger-ink);
}
.login-pf .pf-c-alert.pf-m-warning {
  background: #fff8e9;
  color: var(--mh-warning-ink);
}
.login-pf .pf-c-alert__title,
.login-pf .kc-feedback-text {
  font-size: var(--mh-type-control);
  line-height: var(--mh-leading-body);
}
.login-pf .pf-m-error,
.login-pf .required {
  color: var(--mh-danger-ink);
}
#kc-form-buttons {
  margin: 24px 0 0;
}
#kc-form-options,
#kc-info-wrapper,
.login-pf p.instruction,
.login-pf .subtitle {
  color: var(--mh-text-secondary);
  font-size: var(--mh-type-caption);
  line-height: var(--mh-leading-reading);
}
#kc-info-wrapper {
  padding: 20px 0 0;
  background: transparent;
}
#kc-totp-settings {
  margin: 0 0 24px;
  padding-left: 22px;
  color: var(--mh-text-secondary);
}
#kc-totp-settings li {
  margin-bottom: 12px;
}
#kc-totp-secret-qr-code {
  max-width: 100%;
  height: auto;
  margin: 12px 0;
  border-radius: var(--mh-radius-sm);
}
#kc-totp-secret-key,
.kc-recovery-codes-list {
  font-family: var(--mh-font-mono);
  font-size: var(--mh-type-caption);
  overflow-wrap: anywhere;
}
#kc-username {
  color: var(--mh-text);
  overflow-wrap: anywhere;
}
.mhanta-auth-footer {
  margin: 28px 0 0;
  color: var(--mh-text-secondary);
  font-size: var(--mh-type-caption);
  line-height: var(--mh-leading-body);
  text-align: center;
}
@media (max-width: 480px) {
  .login-pf-page {
    padding: 24px;
    backdrop-filter: none;
  }
  .login-pf body::before {
    display: none;
  }
}
@media (prefers-reduced-transparency: reduce) {
  .login-pf-page {
    background: #fff;
    backdrop-filter: none;
  }
}
@media (forced-colors: active) {
  .login-pf body::before {
    display: none;
  }
  .login-pf-page,
  .login-pf .pf-c-form-control {
    border: 1px solid CanvasText;
    background: Canvas;
    box-shadow: none;
  }
  .login-pf :is(input, button, a, select, textarea):focus-visible {
    outline-color: Highlight;
  }
}
.login-pf .pf-c-alert.pf-m-success,
.login-pf .pf-c-alert.pf-m-info {
  background: #effaf5;
  color: var(--mh-success-ink);
}
.login-pf .pf-c-alert.pf-m-info {
  background: #f0f5ff;
  color: var(--mh-blue-700);
}
#kc-form-options {
  margin-top: 4px;
  font-size: var(--mh-type-control);
}
#kc-form-options .pf-c-form__helper-text,
#kc-form-options a {
  font-weight: 600;
}
.mhanta-auth-back {
  margin: 20px 0 0;
  font-size: var(--mh-type-control);
  text-align: center;
}
#kc-social-providers {
  margin-top: 24px;
}
#kc-social-providers h2 {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 14px;
  color: var(--mh-text-secondary);
  font-size: var(--mh-type-caption);
  font-weight: 600;
  text-align: center;
}
#kc-social-providers h2::before,
#kc-social-providers h2::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--mh-border);
}
#kc-social-providers ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
#kc-social-providers a.pf-c-button,
#kc-social-providers .pf-c-login__main-footer-links-item-link {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  min-height: 44px;
  border: 1px solid var(--mh-border);
  border-radius: var(--mh-radius-sm);
  background: #fff;
  color: var(--mh-text);
  font-weight: 700;
  text-decoration: none;
}
#kc-social-providers a:hover {
  background: #f6f8fd;
  text-decoration: none;
}
#kc-social-providers a#social-google::before {
  content: "";
  flex: none;
  width: 18px;
  height: 18px;
  margin-right: 10px;
  background: url("../img/google.svg") center / contain no-repeat;
}
#kc-social-providers .pf-c-login__main-footer-links-item-link svg,
#kc-social-providers .kc-social-provider-logo {
  display: none;
}
#kc-social-providers hr,
#kc-social-providers a i {
  display: none;
}