/* Existing theme: pta-vuexy-v25.css */
:root {
  --pta-primary: #28c76f;
  --pta-primary-hover: #20b763;
  --pta-primary-soft: #e9f9f0;
  --pta-gold: #d9ad25;
  --pta-heading: #26332c;
  --pta-text: #56635b;
  --pta-muted: #89948d;
  --pta-border: #dce4df;
  --pta-panel: #f4f8f6;
  --pta-white: #ffffff;
}

html.login-pf,
body#keycloak-bg {
  width: 100% !important;
  min-width: 100% !important;
  height: 100%;
  min-height: 100%;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  zoom: 1 !important;
}

body#keycloak-bg {
  position: static !important;
  overflow: hidden;
}

.login-pf body {
  background: var(--pta-white);
  color: var(--pta-text);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.pf-v5-c-login {
  position: static !important;
  display: block !important;
  box-sizing: border-box;
  width: 100% !important;
  min-width: 100% !important;
  height: 100vh;
  height: 100dvh;
  max-width: none !important;
  min-height: 0;
  margin: 0 !important;
  padding: 0 !important;
}

.pf-v5-c-login__container {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  display: grid !important;
  box-sizing: border-box;
  width: auto !important;
  min-width: 100vw !important;
  height: 100vh;
  height: 100dvh;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  grid-template-areas: "header main" !important;
  grid-template-columns: minmax(0, 1.7fr) minmax(35rem, 0.9fr) !important;
  gap: 0;
}

#kc-header {
  position: relative;
  grid-area: header;
  width: 100%;
  min-width: 0;
  min-height: 0;
  margin: 0;
  overflow: hidden;
  background:
    url("../img/auth-login-illustration.png") center 47% / auto min(68vh, 43rem) no-repeat,
    url("../img/auth-bg-shape.png") center 79% / min(72%, 48rem) auto no-repeat,
    radial-gradient(circle at 15% 12%, rgb(40 199 111 / 16%) 0, transparent 18rem),
    linear-gradient(145deg, #f8fbf9 0%, #edf6f1 52%, #e4f0ea 100%);
}

#kc-header::before {
  position: absolute;
  right: 2rem;
  bottom: 1.4rem;
  left: 2rem;
  width: fit-content;
  max-width: calc(100% - 4rem);
  margin: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--pta-primary);
  content: attr(data-footer-text);
  font-size: 0.74rem;
  font-weight: 500;
  letter-spacing: 0.01em;
  line-height: 1.4;
  text-align: center;
  text-shadow: none;
  backdrop-filter: none;
}

#kc-header::after {
  display: none;
}

#kc-header-wrapper {
  position: absolute;
  z-index: 2;
  top: clamp(1.5rem, 4vh, 2.75rem);
  left: clamp(1.75rem, 4vw, 4rem);
  display: flex;
  align-items: center;
  gap: 0.55rem;
  color: var(--pta-heading) !important;
  font-size: 0;
  letter-spacing: normal;
  text-align: left;
  text-transform: none;
}

#kc-header-wrapper::before {
  width: 4rem;
  height: 3.65rem;
  flex: 0 0 auto;
  background: url("../img/logo-sso.png") center / contain no-repeat;
  content: "";
  filter: drop-shadow(0 6px 12px rgb(40 199 111 / 16%));
}

#kc-header-wrapper::after {
  color: var(--pta-heading);
  content: "SINGLE SIGN-ON\A APLIKASI PENGADILAN";
  font-size: 0.9rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  line-height: 1.45;
  white-space: pre;
}

.pf-v5-c-login__main {
  position: relative;
  grid-area: main;
  display: flex;
  box-sizing: border-box;
  width: 100% !important;
  max-width: none !important;
  height: 100vh;
  height: 100dvh;
  max-height: none;
  min-height: 0;
  margin: 0 !important;
  overflow-y: auto;
  border: 0;
  border-left: 1px solid rgb(120 132 124 / 12%);
  border-radius: 0;
  background: var(--pta-white);
  box-shadow: none;
  flex-direction: column;
  justify-content: flex-start;
}

.pf-v5-c-login__main::before {
  display: none;
}

.pf-v5-c-login__main-header,
div.pf-v5-c-login__main-header:has(.pf-v5-c-login__main-header-utilities) {
  display: block !important;
  box-sizing: border-box;
  width: 100%;
  margin: 0 auto;
  padding: clamp(4rem, 12vh, 7.5rem) clamp(2.5rem, 5vw, 6rem) 0.65rem;
  border: 0;
  grid-template-columns: 1fr !important;
}

.pf-v5-c-login__main-header-utilities {
  display: none !important;
}

#kc-page-title {
  width: 100%;
  max-width: none;
  padding: 0;
  color: var(--pta-heading);
  font-size: clamp(1.7rem, 3vw, 2.15rem);
  font-weight: 800;
  letter-spacing: -0.035em;
  line-height: 1.08;
  text-align: left;
}

#kc-page-title::before {
  display: block;
  width: fit-content;
  margin-bottom: 0.85rem;
  padding: 0.35rem 0.7rem;
  border-radius: 999px;
  background: var(--pta-primary-soft);
  color: var(--pta-primary);
  content: "AKSES TERPUSAT";
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.1em;
}

#kc-page-title::after {
  display: block;
  max-width: 27rem;
  margin-top: 0.3rem;
  color: var(--pta-muted);
  content: "Masuk ke akun SSO Anda untuk mengakses aplikasi.";
  font-size: 0.92rem;
  font-weight: 450;
  letter-spacing: normal;
  line-height: 1.55;
}

body[data-page-id="login-logout-confirm"] #kc-page-title::after {
  content: "Keluar dari sesi SSO Anda dengan aman.";
}

body[data-page-id="login-logout-confirm"] .pf-v5-c-login__main-body {
  padding-top: 1.45rem;
}

.pta-logout-confirm {
  width: 100%;
  max-width: 34rem;
  margin: 0 auto;
  padding: 1.35rem 0 0.5rem;
  text-align: left;
}

.pta-logout-confirm__message {
  color: var(--pta-text);
  font-size: 1.05rem;
  font-weight: 550;
  line-height: 1.55;
}

.pta-logout-confirm__form {
  margin: 0;
}

.pta-logout-confirm__divider {
  display: flex;
  margin: 0.95rem 0 0.8rem;
  align-items: center;
  gap: 0.75rem;
  color: var(--pta-muted);
  font-size: 0.78rem;
  font-weight: 650;
  text-align: center;
}

.pta-logout-confirm__divider::before,
.pta-logout-confirm__divider::after {
  height: 1px;
  flex: 1;
  background: var(--pta-border);
  content: "";
}

.pta-logout-confirm__button {
  position: relative;
  display: flex;
  width: 100%;
  min-height: 2.8rem;
  overflow: hidden;
  align-items: center;
  justify-content: center;
  padding: 0.62rem 1rem;
  border: 0;
  border-radius: 0.8rem;
  background: linear-gradient(135deg, #ef4444, #dc2626);
  box-shadow: 0 0.45rem 1rem rgb(220 38 38 / 18%);
  color: #fff;
  cursor: pointer;
  font-size: 0.94rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  transition: box-shadow 180ms ease, transform 180ms ease, filter 180ms ease;
}

.pta-logout-confirm__button::before {
  position: absolute;
  top: -20%;
  bottom: -20%;
  left: -40%;
  width: 35%;
  background: linear-gradient(110deg, transparent, rgb(255 255 255 / 24%), transparent);
  content: "";
  transform: skewX(-18deg);
  transition: left 650ms ease;
}

.pta-logout-confirm__button:hover {
  filter: brightness(1.05);
  box-shadow: 0 1rem 1.8rem rgb(220 38 38 / 28%);
  transform: translateY(-1px);
}

.pta-logout-confirm__button:hover::before {
  left: 115%;
}

.pta-logout-confirm__button:focus-visible,
.pta-logout-confirm__back:focus-visible,
.pta-logout-confirm__catalog:focus-visible {
  outline: 0.2rem solid var(--pta-gold);
  outline-offset: 0.16rem;
}

.pta-logout-confirm__back {
  display: flex;
  margin-top: 1.05rem;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  color: #2563eb;
  font-size: 0.95rem;
  font-weight: 700;
  text-decoration: none;
  transition: color 160ms ease;
}

.pta-logout-confirm__back svg {
  width: 1.1rem;
  height: 1.1rem;
  flex: 0 0 auto;
}

.pta-logout-confirm__back:hover {
  color: #1d4ed8;
  text-decoration: underline;
}

.pta-logout-confirm__catalog {
  position: relative;
  display: flex;
  width: 100%;
  min-height: 2.8rem;
  box-sizing: border-box;
  margin: 0;
  overflow: hidden;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  padding: 0.62rem 1rem;
  border: 1px solid #16a34a;
  border-radius: 0.8rem;
  background: linear-gradient(135deg, #22c55e, #16a34a);
  color: #fff;
  font-size: 0.94rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-decoration: none;
  box-shadow: 0 0.45rem 1rem rgb(22 163 74 / 18%);
  transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.pta-logout-confirm__catalog::before {
  position: absolute;
  top: -20%;
  bottom: -20%;
  left: -40%;
  width: 35%;
  background: linear-gradient(110deg, transparent, rgb(255 255 255 / 28%), transparent);
  content: "";
  transform: skewX(-18deg);
  transition: left 650ms ease;
}

.pta-logout-confirm__catalog svg {
  width: 1rem;
  height: 1rem;
  flex: 0 0 auto;
  transition: transform 180ms ease;
}

.pta-logout-confirm__catalog:hover {
  border-color: #15803d;
  background: linear-gradient(135deg, #16a34a, #15803d);
  color: #fff;
  box-shadow: 0 0.65rem 1.15rem rgb(22 163 74 / 28%);
  transform: translateY(-1px);
}

.pta-logout-confirm__catalog:hover::before {
  left: 115%;
}

.pta-logout-confirm__catalog:hover svg {
  transform: scale(1.08) rotate(3deg);
}

/* Error pages use the same visual language as the logout confirmation. */
.pta-error-page {
  width: 100%;
  max-width: 34rem;
  margin: 0 auto;
  padding: 1.35rem 0 0.5rem;
  text-align: left;
}

.pta-error-page__message {
  margin: 0;
  color: var(--pta-text);
  font-size: 1.05rem;
  font-weight: 550;
  line-height: 1.55;
}

.pta-error-page__back {
  display: flex;
  width: 100%;
  min-height: 2.8rem;
  box-sizing: border-box;
  margin-top: 1.1rem;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  padding: 0.62rem 1rem;
  border: 1px solid #dbeafe;
  border-radius: 0.8rem;
  background: #eff6ff;
  color: #2563eb;
  font-size: 0.94rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-decoration: none;
  box-shadow: 0 0.45rem 1rem rgb(37 99 235 / 10%);
  transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.pta-error-page__back svg {
  width: 1.1rem;
  height: 1.1rem;
  flex: 0 0 auto;
}

.pta-error-page__back:hover,
.pta-error-page__back:focus-visible {
  border-color: #93c5fd;
  background: #dbeafe;
  color: #1d4ed8;
  box-shadow: 0 0.65rem 1.15rem rgb(37 99 235 / 16%);
  transform: translateY(-1px);
  text-decoration: none;
}

.pta-error-page__back:focus-visible {
  outline: 0.2rem solid var(--pta-gold);
  outline-offset: 0.16rem;
}

.pf-v5-c-login__main-body {
  box-sizing: border-box;
  width: 100%;
  margin: 0 auto;
  padding: 1.1rem clamp(2.5rem, 5vw, 6rem) 3rem;
}

#kc-form,
#kc-form-wrapper,
#kc-form-login,
#kc-form-login > .pf-v5-c-form__group,
#kc-form-login .pf-v5-c-form-control,
#kc-form-login input {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
}

#kc-form-login {
  gap: 1.15rem;
}

#kc-form-login > .pf-v5-c-form__group {
  opacity: 0;
  transform: translateY(0.8rem);
  animation: ptaFieldEntrance 480ms cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

#kc-form-login > .pf-v5-c-form__group:nth-of-type(2) {
  animation-delay: 80ms;
}

#kc-form-login > .pf-v5-c-form__group:nth-of-type(3) {
  animation-delay: 160ms;
}

.pta-transaction-year-group {
  position: relative;
}

.pta-transaction-year-group .pf-v5-c-form__group-label {
  display: flex;
  align-items: center;
  gap: 0.45rem;
}

.pta-transaction-year__info {
  display: inline-flex;
  width: 1.15rem;
  height: 1.15rem;
  align-items: center;
  justify-content: center;
  border: 2px solid #9b8cff;
  border-radius: 50%;
  color: #7c6ce8;
  font-size: 0.72rem;
  font-weight: 800;
  line-height: 1;
  cursor: help;
}

.pta-transaction-year__surface {
  position: relative;
  display: flex;
  min-height: 3.5rem;
  align-items: center;
  overflow: hidden;
  border: 1px solid var(--pta-border);
  border-radius: 0.85rem;
  background: #fbfcfb;
  box-shadow: 0 0.15rem 0.35rem rgb(31 50 40 / 4%);
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}

.pta-transaction-year__surface:hover,
.pta-transaction-year__surface:focus-within {
  border-color: rgb(40 199 111 / 65%);
  box-shadow: 0 0 0 0.23rem rgb(40 199 111 / 11%);
  transform: translateY(-1px);
}

.pta-transaction-year-group.pta-has-error .pta-transaction-year__surface {
  border-color: #ff4c51;
  background: #fffafa;
  box-shadow: 0 0 0 0.18rem rgb(255 76 81 / 8%);
}

.pta-transaction-year__select {
  width: 100%;
  min-height: 3.35rem;
  padding: 0 3rem 0 1.05rem;
  border: 0;
  outline: 0;
  appearance: none;
  background: transparent;
  color: var(--pta-heading);
  font: inherit;
  font-size: 0.96rem;
  cursor: pointer;
}

.pta-transaction-year__surface::after {
  position: absolute;
  right: 1.15rem;
  width: 0.65rem;
  height: 0.65rem;
  border-right: 2px solid var(--pta-heading);
  border-bottom: 2px solid var(--pta-heading);
  content: "";
  pointer-events: none;
  transform: translateY(-0.2rem) rotate(45deg);
}

.pf-v5-c-form__label-text {
  color: #39463f;
  font-size: 0.88rem;
  font-weight: 700;
}

.pf-v5-c-form__group-label.pf-v5-u-pb-xs {
  padding-bottom: 0.45rem !important;
}

#kc-form-login span.pf-v5-c-form-control {
  position: relative;
  display: flex;
  min-height: 3.5rem;
  align-items: center;
  overflow: hidden;
  border: 1px solid var(--pta-border) !important;
  border-radius: 0.85rem;
  background: #fbfcfb;
  box-shadow: 0 0.15rem 0.35rem rgb(31 50 40 / 4%);
  transition: border-color 180ms ease, box-shadow 180ms ease, background-color 180ms ease, transform 180ms ease;
}

#kc-form-login span.pf-v5-c-form-control::before,
#kc-form-login span.pf-v5-c-form-control::after {
  display: none !important;
  content: none !important;
}

#kc-form-login span.pf-v5-c-form-control.pf-m-error {
  border-color: #d92d20 !important;
}

#kc-form-login span.pf-v5-c-form-control.pta-has-error,
#kc-form-login .pf-v5-c-input-group.pta-has-error {
  border-color: #ff4c51 !important;
  background: #fffafa;
  box-shadow: 0 0 0 0.18rem rgb(255 76 81 / 8%);
}

.pta-field-error {
  margin: 0.42rem 0 0;
  color: #e63d43;
  font-size: 0.8rem;
  font-weight: 550;
  line-height: 1.4;
}

#kc-form-login #input-error-container-username[hidden],
#kc-form-login #input-error-container-password[hidden] {
  display: none !important;
}

.pta-login-alert {
  display: flex;
  margin: -0.3rem 0 -0.35rem;
  padding: 0.65rem 0.8rem;
  align-items: flex-start;
  gap: 0.65rem;
  border: 1px solid rgb(234 55 61 / 16%);
  border-top: 0.2rem solid #ea373d;
  border-radius: 0.85rem;
  background: #fff3f3;
  color: #b4232a;
  box-shadow: 0 0.5rem 1.25rem rgb(180 35 42 / 7%);
  font-size: 0.82rem;
  font-weight: 650;
  line-height: 1.45;
  opacity: 1;
  transform: translateY(0);
  transition: opacity 280ms ease, transform 280ms ease;
}

.pta-login-alert.is-dismissing {
  opacity: 0;
  transform: translateY(-0.5rem);
}

.pta-login-alert__icon {
  display: inline-flex;
  width: 1.5rem;
  height: 1.5rem;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #ea373d;
  color: #ffffff;
  flex: 0 0 auto;
}

.pta-login-alert__icon svg {
  width: 0.95rem;
  height: 0.95rem;
  stroke: currentColor;
}

.pta-login-alert__message {
  padding-top: 0.1rem;
}

#kc-form-login:has(.pta-login-alert) {
  gap: 0.85rem;
}

#kc-form-login input {
  min-height: 3.35rem;
  padding: 0 1.05rem !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  color: var(--pta-heading);
  font-size: 0.96rem;
  box-shadow: none !important;
}

#kc-form-login input::placeholder {
  color: #a1aaa5;
}

#kc-form-login span.pf-v5-c-form-control:hover,
.pf-v5-c-input-group:hover {
  border-color: rgb(40 199 111 / 34%) !important;
}

#kc-form-login span.pf-v5-c-form-control:focus-within,
.pf-v5-c-input-group:focus-within {
  border-color: rgb(40 199 111 / 65%) !important;
  background: var(--pta-white);
  box-shadow: 0 0 0 0.23rem rgb(40 199 111 / 11%);
  transform: translateY(-1px);
}

.pf-v5-c-input-group {
  position: relative;
  display: block;
  overflow: hidden;
  border: 1px solid var(--pta-border) !important;
  border-radius: 0.85rem;
  background: #fbfcfb;
  box-shadow: 0 0.15rem 0.35rem rgb(31 50 40 / 4%);
  transition: border-color 180ms ease, box-shadow 180ms ease, background-color 180ms ease, transform 180ms ease;
}

.pf-v5-c-input-group__item.pf-m-fill {
  width: 100%;
  min-width: 0;
}

.pf-v5-c-input-group > .pf-v5-c-input-group__item:not(.pf-m-fill) {
  position: static !important;
  width: 0;
  height: 0;
}

.pf-v5-c-input-group .pf-v5-c-button.pf-m-control {
  position: absolute;
  z-index: 2;
  top: 0;
  right: 0;
  bottom: 0;
  display: inline-flex !important;
  width: 3.5rem;
  height: auto;
  min-height: 0;
  padding: 0;
  border: 0 !important;
  border-radius: 0;
  background: transparent;
  color: var(--pta-primary);
  box-shadow: none !important;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.pf-v5-c-input-group .pf-v5-c-button.pf-m-control::before,
.pf-v5-c-input-group .pf-v5-c-button.pf-m-control::after {
  display: none !important;
  border: 0 !important;
  content: none !important;
}

.pf-v5-c-input-group #password-show-password:hover,
.pf-v5-c-input-group #password-show-password:focus {
  background: transparent;
  color: var(--pta-primary-hover);
}

.pf-v5-c-input-group #password-show-password > i {
  display: inline-block !important;
  color: currentColor;
  font-size: 1rem;
  line-height: 1;
  opacity: 1 !important;
  visibility: visible !important;
}

.pf-v5-c-input-group span.pf-v5-c-form-control {
  min-height: 3.5rem;
  border: 0 !important;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  transform: none;
}

.pf-v5-c-input-group #password {
  padding-right: 4rem !important;
}

#kc-login {
  position: relative;
  min-height: 2.8rem !important;
  overflow: hidden;
  padding: 0.62rem 1rem !important;
  border-radius: 0.8rem;
  background: linear-gradient(135deg, var(--pta-primary), #20b763);
  box-shadow: 0 0.45rem 1rem rgb(40 199 111 / 16%);
  font-size: 0.94rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  transition: box-shadow 180ms ease, transform 180ms ease, filter 180ms ease;
}

#kc-login::before {
  position: absolute;
  top: -20%;
  bottom: -20%;
  left: -40%;
  width: 35%;
  background: linear-gradient(110deg, transparent, rgb(255 255 255 / 22%), transparent);
  content: "";
  transform: skewX(-18deg);
  transition: left 650ms ease;
}

#kc-login:hover {
  filter: brightness(1.05);
  box-shadow: none !important;
  transform: translateY(-1px);
}

#kc-login:hover::before {
  left: 115%;
}

#kc-login:focus-visible {
  outline: 0.2rem solid var(--pta-gold);
  outline-offset: 0.16rem;
}

.pta-login-footer {
  margin-top: 1.55rem;
  color: var(--pta-muted);
  text-align: center;
}

.pta-login-footer__links {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  font-size: 0.82rem;
  font-weight: 700;
}

.pta-login-footer__links a {
  color: var(--pta-primary);
  text-decoration: none;
  transition: color 160ms ease;
}

.pta-login-footer__links a:hover,
.pta-login-footer__links a:focus-visible {
  color: var(--pta-primary-hover);
  text-decoration: underline;
}

.pta-login-footer__certificate-title {
  display: flex;
  margin: 1.15rem 0 0.75rem;
  align-items: center;
  gap: 0.9rem;
  color: #9aa29d;
  font-size: 0.76rem;
  white-space: nowrap;
}

.pta-login-footer__certificate-title::before,
.pta-login-footer__certificate-title::after {
  height: 1px;
  background: var(--pta-border);
  content: "";
  flex: 1;
}

.pta-login-footer__certificate-link {
  display: inline-flex;
  border-radius: 0.5rem;
}

.pta-login-footer__certificate-link:focus-visible {
  outline: 0.18rem solid rgb(40 199 111 / 25%);
  outline-offset: 0.2rem;
}

.pta-login-footer__certificate-logo {
  display: block;
  width: auto;
  height: 3.25rem;
  max-width: min(100%, 14rem);
  object-fit: contain;
}

.pta-login-block-ui {
  position: fixed;
  z-index: 10000;
  inset: 0;
  display: flex;
  padding: 1.25rem;
  align-items: center;
  justify-content: center;
  background:
    radial-gradient(circle at 50% 15%, rgb(40 199 111 / 13%), transparent 36%),
    rgb(255 255 255 / 78%);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  backdrop-filter: blur(11px) saturate(1.04);
  transition: opacity 180ms ease, visibility 180ms ease;
}

.pta-login-block-ui.is-active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.pta-login-block-ui__card {
  position: relative;
  display: flex;
  box-sizing: border-box;
  width: min(100%, 22rem);
  min-height: 6.25rem;
  padding: 1.15rem 1.25rem;
  align-items: center;
  gap: 1rem;
  overflow: hidden;
  border: 1px solid rgb(40 199 111 / 16%);
  border-radius: 1.15rem;
  background: rgb(255 255 255 / 94%);
  box-shadow:
    0 1.5rem 3.5rem rgb(31 61 46 / 18%),
    0 0 0 0.35rem rgb(255 255 255 / 45%);
  color: var(--pta-heading);
  transform: translateY(0.5rem) scale(0.98);
  transition: transform 240ms cubic-bezier(0.22, 1, 0.36, 1);
}

.pta-login-block-ui.is-active .pta-login-block-ui__card {
  transform: translateY(0) scale(1);
}

.pta-login-block-ui__card::before {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 0.24rem;
  background: linear-gradient(
    90deg,
    rgb(40 199 111 / 72%),
    rgb(102 220 155 / 56%),
    rgb(40 199 111 / 28%)
  );
  content: "";
}

.pta-login-block-ui__card::after {
  position: absolute;
  top: 0;
  left: 0;
  width: 48%;
  height: 0.24rem;
  background: linear-gradient(
    90deg,
    rgb(40 199 111 / 0%),
    rgb(40 199 111 / 96%),
    rgb(102 220 155 / 92%),
    rgb(40 199 111 / 0%)
  );
  content: "";
  opacity: 0;
  transform: translate3d(-110%, 0, 0);
  will-change: transform, opacity;
}

.pta-login-block-ui.is-active .pta-login-block-ui__card::after {
  opacity: 1;
  animation: ptaLoginProgress 1.25s cubic-bezier(0.45, 0, 0.2, 1) infinite;
}

.pta-login-block-ui__badge {
  position: relative;
  display: inline-flex;
  box-sizing: border-box;
  width: 3.25rem;
  height: 3.25rem;
  min-width: 3.25rem;
  max-width: 3.25rem;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background: linear-gradient(135deg, rgb(40 199 111 / 17%), rgb(40 199 111 / 6%));
  color: var(--pta-primary);
  flex: 0 0 auto;
  animation: ptaLoginBadgePulse 2.2s ease-in-out infinite;
}

.pta-login-block-ui__badge::before,
.pta-login-block-ui__badge::after {
  position: absolute;
  inset: 0;
  border: 1px solid rgb(40 199 111 / 28%);
  border-radius: inherit;
  content: "";
  animation: ptaLoginRipple 1.9s ease-out infinite;
}

.pta-login-block-ui__badge::after {
  animation-delay: 700ms;
}

.pta-login-block-ui__badge svg {
  position: relative;
  z-index: 1;
  width: 1.4rem;
  height: 1.4rem;
  stroke: currentColor;
  animation: ptaLoginShield 1.6s ease-in-out infinite;
}

.pta-login-block-ui__copy {
  min-width: 0;
  flex: 1;
}

.pta-login-block-ui__title,
.pta-login-block-ui__subtitle {
  display: block;
}

.pta-login-block-ui__title {
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: -0.015em;
}

.pta-login-block-ui__subtitle {
  margin-top: 0.24rem;
  color: #718078;
  font-size: 0.82rem;
  font-weight: 550;
}

.pf-v5-c-login__main-footer:empty,
.pf-v5-c-login__main::after {
  display: none;
}

.pf-v5-c-alert.pf-m-inline {
  border-radius: 0.8rem;
}

@keyframes ptaFieldEntrance {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes ptaLoginProgress {
  0% {
    transform: translate3d(-110%, 0, 0);
  }

  to {
    transform: translate3d(320%, 0, 0);
  }
}

@keyframes ptaLoginRipple {
  0% {
    opacity: 0.65;
    transform: scale(0.82);
  }

  75%,
  100% {
    opacity: 0;
    transform: scale(1.42);
  }
}

@keyframes ptaLoginShield {
  0%,
  100% {
    transform: translateY(0);
  }

  50% {
    transform: translateY(-0.2rem);
  }
}

@keyframes ptaLoginBadgePulse {
  0%,
  100% {
    transform: scale(1);
  }

  50% {
    transform: scale(1.035);
  }
}

@media (max-width: 1024px) {
  body#keycloak-bg {
    overflow-y: auto;
    background: var(--pta-panel);
  }

  .pf-v5-c-login,
  .pf-v5-c-login__container {
    position: relative;
    height: auto;
    min-height: 100vh;
    min-height: 100dvh;
  }

  .pf-v5-c-login__container {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    min-width: 0 !important;
    grid-template-areas:
      "header"
      "main" !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto 1fr;
  }

  #kc-header {
    min-height: 5.5rem;
    overflow: visible;
    background: var(--pta-panel);
  }

  #kc-header::before,
  #kc-header::after {
    display: none;
  }

  #kc-header-wrapper {
    top: 1.1rem;
    left: 50%;
    transform: translateX(-50%);
  }

  #kc-header-wrapper::before {
    width: 3.35rem;
    height: 3.1rem;
  }

  #kc-header-wrapper::after {
    font-size: 0.78rem;
  }

  .pf-v5-c-login__main {
    width: 100% !important;
    max-width: none !important;
    height: auto;
    min-height: calc(100vh - 5.5rem);
    min-height: calc(100dvh - 5.5rem);
    max-height: none;
    margin: 0 !important;
    border-left: 0;
    border-radius: 0;
    box-shadow: none;
  }

  .pf-v5-c-login__main-header,
  div.pf-v5-c-login__main-header:has(.pf-v5-c-login__main-header-utilities),
  .pf-v5-c-login__main-body {
    width: 100%;
  }
}

@media (max-width: 520px) {
  .pta-logout-confirm__button {
    min-height: 2.75rem;
  }

  #kc-header-wrapper {
    width: max-content;
    max-width: calc(100vw - 2rem);
  }

  #kc-header-wrapper::before {
    width: 3rem;
    height: 2.75rem;
  }

  #kc-header-wrapper::after {
    font-size: 0.7rem;
  }

  .pf-v5-c-login__main-header,
  div.pf-v5-c-login__main-header:has(.pf-v5-c-login__main-header-utilities) {
    padding: 1.65rem 1.35rem 0.5rem;
  }

  #kc-page-title {
    font-size: 1.6rem;
  }

  #kc-page-title::after {
    font-size: 0.84rem;
  }

  .pf-v5-c-login__main-body {
    padding: 0.9rem 1.35rem 1.65rem;
  }

  .pta-login-footer__links {
    font-size: 0.76rem;
  }

  .pta-login-footer__certificate-title {
    gap: 0.6rem;
    font-size: 0.7rem;
  }

  .pta-login-footer__certificate-logo {
    height: 2.8rem;
  }

  #kc-form-login .pf-v5-c-form-control,
  .pf-v5-c-input-group,
  #kc-login {
    min-height: 2.75rem !important;
  }
}

@media (max-height: 720px) and (min-width: 1025px) {
  #kc-header {
    background-size: auto 54vh, min(68%, 42rem) auto, auto, auto;
  }

  #kc-header::before {
    bottom: 1rem;
    padding: 0;
    font-size: 0.75rem;
  }

  .pf-v5-c-login__main-header,
  div.pf-v5-c-login__main-header:has(.pf-v5-c-login__main-header-utilities) {
    padding-top: 2rem;
  }

  #kc-page-title::before {
    margin-bottom: 0.5rem;
  }

  .pf-v5-c-login__main-body {
    padding-top: 0.65rem;
    padding-bottom: 1.25rem;
  }

  #kc-form-login {
    gap: 0.75rem;
  }

  #kc-form-login .pf-v5-c-form-control,
  .pf-v5-c-input-group,
  #kc-login {
    min-height: 2.85rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  #kc-form-login > .pf-v5-c-form__group {
    opacity: 1;
    transform: none;
    animation: none;
  }

  #kc-login,
  #kc-login::before,
  #authenticateWebAuthnButton,
  #authenticateWebAuthnButton::before,
  #pta-create-passkey,
  #pta-create-passkey::before,
  #registerWebAuthn,
  #registerWebAuthn::before,
  #pta-passkey-continue,
  #pta-passkey-continue::before,
  body:has(.pta-passkey-offer) [name="pta_passkey_action"][value="skip"],
  body:has(.pta-passkey-offer) [name="pta_passkey_action"][value="skip"]::before,
  #kc-form-login .pf-v5-c-form-control,
  .pf-v5-c-input-group .pf-v5-c-button.pf-m-control {
    transition: none;
  }

  .pta-login-block-ui,
  .pta-login-block-ui__card,
  .pta-login-block-ui__card::after,
  .pta-login-block-ui.is-active .pta-login-block-ui__card::after,
  .pta-login-block-ui__badge::before,
  .pta-login-block-ui__badge::after,
  .pta-login-block-ui__badge,
  .pta-login-block-ui__badge svg {
    animation: none;
    transition: none;
  }

  .pta-login-alert {
    transition: none;
  }
}

/* Authentication card layout: shared by login and logout confirmation. */
#kc-page-title::before {
  display: none;
}

#kc-header::before {
  right: auto;
  left: clamp(1.75rem, 4vw, 4rem);
  margin: 0;
  color: var(--pta-muted);
  text-align: left;
}

.pf-v5-c-login__main {
  isolation: isolate;
  justify-content: center;
  padding: 1.25rem clamp(1rem, 3vw, 3rem) !important;
  box-sizing: border-box;
  height: 100vh;
  max-height: 100dvh;
  min-height: 0;
  overflow: hidden !important;
  background: #f4f8f6;
}

.pf-v5-c-login__main::before {
  display: none;
}

.pf-v5-c-login__main-header,
div.pf-v5-c-login__main-header:has(.pf-v5-c-login__main-header-utilities),
.pf-v5-c-login__main-body {
  width: min(100%, 34rem);
  max-width: 34rem;
  margin-right: auto;
  margin-left: auto;
  position: relative;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.58);
  -webkit-backdrop-filter: blur(18px) saturate(1.08);
  backdrop-filter: blur(18px) saturate(1.08);
  outline: 1px solid rgba(255, 255, 255, 0.08);
  z-index: 1;
}

.pf-v5-c-login__main-header,
div.pf-v5-c-login__main-header:has(.pf-v5-c-login__main-header-utilities) {
  padding: clamp(1.7rem, 5vh, 3.4rem) 2.35rem 0.8rem;
  border: 1px solid rgba(255, 255, 255, 0.82);
  border-bottom: 0;
  border-radius: 1.35rem 1.35rem 0 0;
  box-shadow: 0 1.2rem 2.8rem rgb(31 61 46 / 10%);
}

.pf-v5-c-login__main-body {
  padding: 0.8rem 2.35rem 1.7rem;
  border: 1px solid rgba(255, 255, 255, 0.82);
  border-top: 0;
  border-radius: 0 0 1.35rem 1.35rem;
  box-shadow: 0 1.2rem 2.8rem rgb(31 61 46 / 10%);
}

body[data-page-id="login-logout-confirm"] .pf-v5-c-login__main-body {
  padding-top: 0.8rem;
}

@media (max-width: 1024px) {
  .pf-v5-c-login__main {
    justify-content: flex-start;
    padding: 2rem 1rem 3rem !important;
    overflow-y: auto;
  }
}

@media (min-width: 1025px) {
  body#keycloak-bg,
  .pf-v5-c-login__container {
    overflow: hidden !important;
  }
}

@media (max-width: 520px) {
  .pf-v5-c-login__main {
    padding: 1rem 0.75rem 2rem !important;
  }

  .pf-v5-c-login__main-header,
  div.pf-v5-c-login__main-header:has(.pf-v5-c-login__main-header-utilities) {
    padding: 1.8rem 1.35rem 0.65rem;
    border-radius: 1.1rem 1.1rem 0 0;
  }

  .pf-v5-c-login__main-body {
    padding: 0.65rem 1.35rem 1.8rem;
    border-radius: 0 0 1.1rem 1.1rem;
  }
}

/* Optional passkey enrollment; native Keycloak controls remain accessible. */
.pta-passkey-offer { border-top: 1px solid #e5e7eb; padding-top: 1.25rem; }
.pta-passkey-offer h2 { font-size: 1.25rem; margin-bottom: .75rem; }
.pta-passkey-offer p { margin-bottom: 1rem; line-height: 1.6; }
.pta-passkey-offer button, [name="pta_passkey_action"] { margin-top: .75rem; }
.pta-passkey-hint { font-size: .875rem; line-height: 1.5; margin-top: 1rem; color: #525866; }
#authenticateWebAuthnButton { display: block; box-sizing: border-box; width: 100%; text-align: center; margin-top: 1rem; }
.pta-passkey-divider { display: flex; align-items: center; gap: .7rem; width: 100%; margin: 1rem 0 .1rem; color: #89948d; font-size: .9rem; font-weight: 700; line-height: 1; }
.pta-passkey-divider::before, .pta-passkey-divider::after { content: ""; height: 1px; flex: 1 1 auto; background: #dce4df; }
.pta-passkey-divider span { flex: 0 0 auto; }
body:has(.pta-passkey-offer) #kc-page-title::after,
body:has(#registerWebAuthn) #kc-page-title::after { content: none; }
body:has(#authenticateWebAuthnButton, .pta-passkey-offer, #registerWebAuthn, #kc-try-again) .pf-v5-c-login__main {
  overflow-y: auto !important;
  justify-content: safe center;
}
body:has(#authenticateWebAuthnButton, .pta-passkey-offer, #registerWebAuthn, #kc-try-again) .pf-v5-c-login__main-header,
body:has(#authenticateWebAuthnButton, .pta-passkey-offer, #registerWebAuthn, #kc-try-again) .pf-v5-c-login__main-body { flex-shrink: 0; }
#pta-create-passkey, #registerWebAuthn, #pta-passkey-continue {
  min-height: 2.8rem;
  border-radius: .65rem;
  background: #147d46;
  color: white;
  font-weight: 600;
}
#authenticateWebAuthnButton, [name="pta_passkey_action"][value="skip"] {
  min-height: 2.8rem;
  padding: .65rem;
  border: 1px solid #147d46;
  border-radius: .65rem;
  color: #147d46;
  background: transparent;
}
#authenticateWebAuthnButton {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  overflow: hidden;
  border: 0;
  color: #fff;
  background: linear-gradient(135deg, #2563eb, #1d4ed8);
  box-shadow: 0 .45rem 1rem rgb(37 99 235 / 18%);
  transition: box-shadow 180ms ease, transform 180ms ease, filter 180ms ease;
}
#authenticateWebAuthnButton::before {
  position: absolute;
  top: -20%;
  bottom: -20%;
  left: -40%;
  width: 35%;
  background: linear-gradient(110deg, transparent, rgb(255 255 255 / 24%), transparent);
  content: "";
  transform: skewX(-18deg);
  transition: left 650ms ease;
}
#authenticateWebAuthnButton:hover {
  filter: brightness(1.05);
  box-shadow: none !important;
  transform: translateY(-1px);
}
#authenticateWebAuthnButton:hover::before { left: 115%; }
#authenticateWebAuthnButton:active { transform: translateY(0); }
.pta-passkey-button__icon,
.pta-passkey-button__label { position: relative; z-index: 1; }
.pta-passkey-button__icon { display: inline-flex; width: 1.25rem; height: 1.25rem; flex: 0 0 auto; }
.pta-passkey-button__icon svg { display: block; width: 100%; height: 100%; }
#authenticateWebAuthnButton::after, [name="pta_passkey_action"][value="skip"]::after { border: 0; }
#pta-create-passkey:disabled { opacity: .55; cursor: not-allowed; }
#authenticateWebAuthnButton:focus-visible, [name="pta_passkey_action"]:focus-visible, #registerWebAuthn:focus-visible {
  outline: 3px solid var(--pta-gold);
  outline-offset: 3px;
}

/* Compact login rhythm: keep the logout confirmation's spacing unchanged. */
body[data-page-id="login-login"] .pf-v5-c-login__main-header,
body[data-page-id="login-login"] div.pf-v5-c-login__main-header:has(.pf-v5-c-login__main-header-utilities) {
  padding-top: clamp(2rem, 6vh, 4rem);
  padding-bottom: 0.25rem;
}
body[data-page-id="login-login"] .pf-v5-c-login__main-body {
  padding-top: 0.2rem;
  padding-bottom: 0.85rem;
}
body[data-page-id="login-login"] #kc-form-login { gap: 0.48rem; }
body[data-page-id="login-login"] #kc-form-login > .pf-v5-c-form__group { transform: translateY(0.35rem); }
body[data-page-id="login-login"] #kc-form-login .pf-v5-c-form__group-label.pf-v5-u-pb-xs { padding-bottom: 0.2rem !important; }
body[data-page-id="login-login"] #kc-form-login span.pf-v5-c-form-control,
body[data-page-id="login-login"] .pf-v5-c-input-group span.pf-v5-c-form-control,
body[data-page-id="login-login"] .pta-transaction-year__surface { min-height: 2.55rem; }
body[data-page-id="login-login"] #kc-form-login input { min-height: 2.55rem; }
body[data-page-id="login-login"] #kc-login { min-height: 2.55rem !important; padding-block: 0.45rem !important; }
body[data-page-id="login-login"] .pta-passkey-divider { margin-top: 0.42rem; gap: .6rem; font-size: .86rem; }
body[data-page-id="login-login"] #authenticateWebAuthnButton { min-height: 2.55rem; margin-top: 0.42rem; padding-block: 0.45rem; }
/* Keep hover feedback subtle: no elevated shadow on either login action. */
body[data-page-id="login-login"] #kc-login:hover,
body[data-page-id="login-login"] #authenticateWebAuthnButton:hover,
body[data-page-id="login-login"] #kc-login:focus-visible,
body[data-page-id="login-login"] #authenticateWebAuthnButton:focus-visible {
  box-shadow: none !important;
}
body[data-page-id="login-login"] .pta-login-footer { margin-top: 0.8rem; }
body[data-page-id="login-login"] .pta-login-footer__certificate-title { margin-top: 0.65rem; margin-bottom: 0.45rem; }

/* Use the same compact rhythm and interaction treatment on logout. */
body[data-page-id="login-logout-confirm"] .pf-v5-c-login__main-header,
body[data-page-id="login-logout-confirm"] div.pf-v5-c-login__main-header:has(.pf-v5-c-login__main-header-utilities) {
  padding-top: clamp(2rem, 6vh, 4rem);
  padding-bottom: 0.25rem;
}
body[data-page-id="login-logout-confirm"] .pf-v5-c-login__main-body {
  padding-top: 0.2rem;
  padding-bottom: 0.85rem;
}
body[data-page-id="login-logout-confirm"] .pta-logout-confirm {
  padding-top: 0.35rem;
  padding-bottom: 0.2rem;
}
body[data-page-id="login-logout-confirm"] .pta-logout-confirm__message {
  margin-bottom: 0.48rem;
  font-size: 0.98rem;
  line-height: 1.4;
}
body[data-page-id="login-logout-confirm"] .pta-logout-confirm__button,
body[data-page-id="login-logout-confirm"] .pta-logout-confirm__catalog {
  min-height: 2.55rem;
  padding-block: 0.45rem;
}
body[data-page-id="login-logout-confirm"] .pta-logout-confirm__divider {
  margin-top: 0.42rem;
  margin-bottom: 0.42rem;
  font-size: 0.86rem;
}
body[data-page-id="login-logout-confirm"] .pta-logout-confirm__back {
  margin-top: 0.62rem;
}
body[data-page-id="login-logout-confirm"] .pta-logout-confirm__button:hover,
body[data-page-id="login-logout-confirm"] .pta-logout-confirm__catalog:hover,
body[data-page-id="login-logout-confirm"] .pta-logout-confirm__button:focus-visible,
body[data-page-id="login-logout-confirm"] .pta-logout-confirm__catalog:focus-visible {
  box-shadow: none !important;
}
body[data-page-id="login-logout-confirm"] .pta-logout-confirm__catalog:hover {
  border-color: #16a34a;
  background: linear-gradient(135deg, #22c55e, #16a34a);
  filter: brightness(1.05);
}
body[data-page-id="login-logout-confirm"] .pta-logout-confirm__catalog:hover svg {
  transform: none;
}

/* Compact optional-passkey offer, matching the login page rhythm. */
body:has(.pta-passkey-offer) .pf-v5-c-login__main-header,
body:has(.pta-passkey-offer) div.pf-v5-c-login__main-header:has(.pf-v5-c-login__main-header-utilities) {
  padding-top: clamp(2rem, 6vh, 4rem);
  padding-bottom: 0.25rem;
}
body:has(.pta-passkey-offer) .pf-v5-c-login__main-body {
  padding-top: 0.2rem;
  padding-bottom: 0.85rem;
}
body:has(.pta-passkey-offer) .pta-passkey-offer {
  max-width: none;
  padding-top: 0.35rem;
  border-top: 0;
}
body:has(.pta-passkey-offer) .pta-passkey-offer h2 {
  margin-bottom: 0.55rem;
  font-size: 1.18rem;
  line-height: 1.3;
}
body:has(.pta-passkey-offer) .pta-passkey-offer p {
  margin-bottom: 0.65rem;
  font-size: 0.92rem;
  line-height: 1.45;
}
body:has(.pta-passkey-offer) .pta-passkey-offer form {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  margin-top: 0.72rem;
}
body:has(.pta-passkey-offer) .pta-passkey-offer button {
  position: relative;
  min-height: 2.55rem;
  box-sizing: border-box;
  margin-top: 0;
  overflow: hidden;
  padding-block: 0.45rem;
  border-radius: 0.8rem;
  font-size: 0.94rem;
  font-weight: 700;
  transition: box-shadow 180ms ease, transform 180ms ease, filter 180ms ease, background-color 180ms ease, border-color 180ms ease;
}
body:has(.pta-passkey-offer) #pta-create-passkey {
  border: 0;
  background: linear-gradient(135deg, var(--pta-primary), #20b763);
  box-shadow: 0 0.45rem 1rem rgb(40 199 111 / 16%);
  color: #fff;
}
body:has(.pta-passkey-offer) #pta-create-passkey::before {
  position: absolute;
  top: -20%;
  bottom: -20%;
  left: -40%;
  width: 35%;
  background: linear-gradient(110deg, transparent, rgb(255 255 255 / 22%), transparent);
  content: "";
  transform: skewX(-18deg);
  transition: left 650ms ease;
}
body:has(.pta-passkey-offer) #pta-create-passkey:hover {
  filter: brightness(1.05);
  box-shadow: none !important;
  transform: translateY(-1px);
}
body:has(.pta-passkey-offer) #pta-create-passkey:hover::before { left: 115%; }
body:has(.pta-passkey-offer) [name="pta_passkey_action"][value="skip"] {
  position: relative;
  overflow: hidden;
  border: 0;
  background: linear-gradient(135deg, #f59e0b, #d97706);
  box-shadow: 0 0.45rem 1rem rgb(217 119 6 / 16%);
  color: #fff;
}
body:has(.pta-passkey-offer) [name="pta_passkey_action"][value="skip"]::before {
  position: absolute;
  top: -20%;
  bottom: -20%;
  left: -40%;
  width: 35%;
  background: linear-gradient(110deg, transparent, rgb(255 255 255 / 26%), transparent);
  content: "";
  transform: skewX(-18deg);
  transition: left 650ms ease;
}
body:has(.pta-passkey-offer) [name="pta_passkey_action"][value="skip"]:hover {
  border-color: transparent;
  background: linear-gradient(135deg, #f59e0b, #d97706);
  filter: brightness(1.05);
  box-shadow: none !important;
  transform: translateY(-1px);
}
body:has(.pta-passkey-offer) [name="pta_passkey_action"][value="skip"]:hover::before { left: 115%; }
body:has(.pta-passkey-offer) .pta-passkey-hint {
  margin-top: 0.72rem;
  margin-bottom: 0.2rem;
  font-size: 0.8rem;
  line-height: 1.45;
}

body:has(#pta-passkey-continue) #pta-passkey-continue {
  position: relative;
  overflow: hidden;
  border: 0;
  background: linear-gradient(135deg, var(--pta-primary), #20b763);
  box-shadow: 0 0.45rem 1rem rgb(40 199 111 / 16%);
  color: #fff;
}
body:has(#pta-passkey-continue) #pta-passkey-continue::before {
  position: absolute;
  top: -20%;
  bottom: -20%;
  left: -40%;
  width: 35%;
  background: linear-gradient(110deg, transparent, rgb(255 255 255 / 22%), transparent);
  content: "";
  transform: skewX(-18deg);
  transition: left 650ms ease;
}
body:has(#pta-passkey-continue) #pta-passkey-continue:hover {
  filter: brightness(1.05);
  box-shadow: none !important;
  transform: translateY(-1px);
}
body:has(#pta-passkey-continue) #pta-passkey-continue:hover::before { left: 115%; }
body:has(#pta-passkey-continue) .pta-login-footer { margin-top: 0.8rem; }

/* Delete-credential confirmation page. */
body[data-page-id="login-delete-credential"] .pf-v5-c-login__main-header,
body[data-page-id="login-delete-credential"] div.pf-v5-c-login__main-header:has(.pf-v5-c-login__main-header-utilities) {
  padding-top: clamp(2rem, 6vh, 4rem);
  padding-bottom: 0.25rem;
}
body[data-page-id="login-delete-credential"] .pf-v5-c-login__main-body {
  padding-top: 0.2rem;
  padding-bottom: 0.85rem;
}
body[data-page-id="login-delete-credential"] .pf-v5-c-login__main-body form {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin: 0;
}
body[data-page-id="login-delete-credential"] .pf-v5-c-login__main-body form > * {
  flex: 1 1 12rem;
  min-width: 0;
  min-height: 2.55rem;
  box-sizing: border-box;
  margin: 0;
  padding-block: 0.45rem;
  border-radius: 0.8rem;
  font-size: 0.94rem;
  font-weight: 700;
  transition: box-shadow 180ms ease, transform 180ms ease, filter 180ms ease, background-color 180ms ease, border-color 180ms ease;
}
body[data-page-id="login-delete-credential"] #kc-login {
  position: relative;
  overflow: hidden;
  border: 0;
  background: linear-gradient(135deg, #ef4444, #dc2626);
  box-shadow: 0 0.45rem 1rem rgb(220 38 38 / 18%);
  color: #fff;
}
body[data-page-id="login-delete-credential"] #kc-login::before {
  position: absolute;
  top: -20%;
  bottom: -20%;
  left: -40%;
  width: 35%;
  background: linear-gradient(110deg, transparent, rgb(255 255 255 / 24%), transparent);
  content: "";
  transform: skewX(-18deg);
  transition: left 650ms ease;
}
body[data-page-id="login-delete-credential"] #kc-login:hover {
  filter: brightness(1.05);
  box-shadow: none !important;
  transform: translateY(-1px);
}
body[data-page-id="login-delete-credential"] #kc-login:hover::before { left: 115%; }
body[data-page-id="login-delete-credential"] #kc-cancel {
  border: 1px solid #2563eb;
  background: transparent;
  color: #2563eb;
}
body[data-page-id="login-delete-credential"] #kc-cancel:hover {
  border-color: #1d4ed8;
  background: #eff6ff;
  box-shadow: none !important;
  transform: translateY(-1px);
}

/* Authenticator/OTP setup can be taller than the viewport. */
body[data-page-id="login-config-totp"] .pf-v5-c-login__main { overflow-y: auto !important; justify-content: flex-start; }
body[data-page-id="login-config-totp"] .pf-v5-c-login__main-header,
body[data-page-id="login-config-totp"] div.pf-v5-c-login__main-header:has(.pf-v5-c-login__main-header-utilities),
body[data-page-id="login-config-totp"] .pf-v5-c-login__main-body { flex-shrink: 0; }
body[data-page-id="login-config-totp"] .pf-v5-c-login__main-header,
body[data-page-id="login-config-totp"] div.pf-v5-c-login__main-header:has(.pf-v5-c-login__main-header-utilities) { padding-top: clamp(1.5rem, 5vh, 3rem); padding-bottom: 0.25rem; }
body[data-page-id="login-config-totp"] .pf-v5-c-login__main-body { padding-top: 0.2rem; padding-bottom: 0.85rem; }
body[data-page-id="login-config-totp"] .pf-v5-c-login__main-body h2 { margin-bottom: 0.6rem; font-size: 1.18rem; line-height: 1.3; }
body[data-page-id="login-config-totp"] .pf-v5-c-login__main-body p,
body[data-page-id="login-config-totp"] .pf-v5-c-login__main-body li { font-size: 0.9rem; line-height: 1.45; }
body[data-page-id="login-config-totp"] .pf-v5-c-login__main-body ol,
body[data-page-id="login-config-totp"] .pf-v5-c-login__main-body ul { margin-top: 0.35rem; margin-bottom: 0.65rem; padding-left: 1.35rem; }
body[data-page-id="login-config-totp"] .pf-v5-c-login__main-body li { margin-bottom: 0.35rem; }
body[data-page-id="login-config-totp"] #totp-qr-code,
body[data-page-id="login-config-totp"] img[src*="qr"] { display: block; width: min(100%, 14rem); height: auto; margin: 0.55rem auto 0.7rem; }
body[data-page-id="login-config-totp"] #kc-totp-settings-form,
body[data-page-id="login-config-totp"] #kc-form-buttons { margin-top: 0.65rem; }
body[data-page-id="login-config-totp"] #kc-totp-settings-form button,
body[data-page-id="login-config-totp"] #kc-totp-settings-form input[type="submit"],
body[data-page-id="login-config-totp"] #kc-form-buttons button,
body[data-page-id="login-config-totp"] #kc-form-buttons input[type="submit"] { min-height: 2.55rem; padding-block: 0.45rem; border-radius: 0.8rem; font-size: 0.94rem; font-weight: 700; }

/* Some Keycloak versions omit data-page-id on the OTP setup screen. The QR
   element is stable, so use it as a fallback and explicitly release the
   desktop card's clipping overflow. */
body:has(#totp-qr-code, #kc-totp-secret-qr-code, #kc-totp-secret, #kc-totp-settings-form) .pf-v5-c-login__main,
body:has(img[src*="qr"]) .pf-v5-c-login__main {
  overflow-y: auto !important;
  overflow-x: hidden;
  justify-content: flex-start;
}
body:has(#totp-qr-code, #kc-totp-secret-qr-code, #kc-totp-secret, #kc-totp-settings-form) .pf-v5-c-login__container,
body:has(img[src*="qr"]) .pf-v5-c-login__container {
  overflow: visible !important;
  min-height: 100dvh;
}
body:has(#totp-qr-code, #kc-totp-secret-qr-code, #kc-totp-secret, #kc-totp-settings-form) .pf-v5-c-login__main-body,
body:has(img[src*="qr"]) .pf-v5-c-login__main-body {
  max-height: none;
  overflow: visible;
  flex-shrink: 0;
}
body:has(#totp-qr-code, #kc-totp-secret-qr-code, #kc-totp-secret, #kc-totp-settings-form) .pf-v5-c-login__main-header,
body:has(#totp-qr-code, #kc-totp-secret-qr-code, #kc-totp-secret, #kc-totp-settings-form) .pf-v5-c-login__main-body,
body:has(img[src*="qr"]) .pf-v5-c-login__main-header,
body:has(img[src*="qr"]) .pf-v5-c-login__main-body { flex-shrink: 0; }
body:has(#kc-totp-settings-form) .pf-v5-c-login__main-header,
body:has(#kc-totp-settings-form) div.pf-v5-c-login__main-header:has(.pf-v5-c-login__main-header-utilities) { padding-top: clamp(1.5rem, 5vh, 3rem); padding-bottom: 0.25rem; }
body:has(#kc-totp-settings-form) .pf-v5-c-login__main-body { padding-top: 0.2rem; padding-bottom: 0.85rem; }
body:has(#kc-totp-settings-form) #keycloak-bg,
body:has(#kc-totp-settings-form) .pf-v5-c-login__container { min-height: 100dvh; overflow: visible !important; }
body:has(#kc-totp-settings-form) .pf-v5-c-login__main-body p,
body:has(#kc-totp-settings-form) .pf-v5-c-login__main-body li { font-size: 0.9rem; line-height: 1.45; }
body:has(#kc-totp-settings-form) .pf-v5-c-login__main-body ol,
body:has(#kc-totp-settings-form) .pf-v5-c-login__main-body ul { margin-top: 0.35rem; margin-bottom: 0.65rem; padding-left: 1.35rem; }
body:has(#kc-totp-settings-form) #kc-totp-secret-qr-code,
body:has(#kc-totp-settings-form) #totp-qr-code { display: block; width: min(100%, 14rem); height: auto; margin: 0.55rem auto 0.7rem; }
body:has(#kc-totp-settings-form) .pf-v5-c-login__main-body p { margin-top: 0; margin-bottom: 0.42rem; }
body:has(#kc-totp-settings-form) .pf-v5-c-login__main-body li { margin-bottom: 0.18rem; }
body:has(#kc-totp-settings-form) .pf-v5-c-login__main-body ol,
body:has(#kc-totp-settings-form) .pf-v5-c-login__main-body ul { margin-top: 0.15rem; margin-bottom: 0.42rem; }
body:has(#kc-totp-settings-form) #kc-totp-secret-qr-code,
body:has(#kc-totp-settings-form) #totp-qr-code { width: min(100%, 12rem); margin-top: 0.3rem; margin-bottom: 0.45rem; }
body:has(#kc-totp-settings-form) #kc-totp-secret-qr-code img { display: block; width: 100%; height: auto; }
body:has(#kc-totp-settings-form) #kc-totp-settings-form .pf-v5-c-form__group,
body:has(#kc-totp-settings-form) #kc-form-buttons { margin-bottom: 0.42rem; }
body:has(#kc-totp-settings-form) #kc-totp-settings-form .pf-m-checkbox,
body:has(#kc-totp-settings-form) #kc-totp-settings-form .pf-v5-c-check { margin-top: 0.25rem !important; margin-bottom: 0.3rem !important; }
body:has(#kc-totp-settings-form) #kc-form-buttons { margin-top: 0.25rem !important; padding-top: 0 !important; }
body:has(#kc-totp-settings-form) #kc-totp-settings-form input:not([type="hidden"]),
body:has(#kc-totp-settings-form) #kc-totp-settings-form select { min-height: 2.45rem; padding-block: 0.4rem; }
body:has(#kc-totp-settings-form) #kc-totp-settings-form .pf-v5-c-form__group-label { padding-bottom: 0.18rem; }

/* AIA password-update and OTP pages use the same compact controls as login. */
body[data-page-id="login-update-password"] .pf-v5-c-login__main,
body[data-page-id="login-otp"] .pf-v5-c-login__main { overflow-y: auto !important; justify-content: flex-start; }
body[data-page-id="login-update-password"] .pf-v5-c-login__main-header,
body[data-page-id="login-update-password"] .pf-v5-c-login__main-body,
body[data-page-id="login-otp"] .pf-v5-c-login__main-header,
body[data-page-id="login-otp"] .pf-v5-c-login__main-body { flex-shrink: 0; }
body[data-page-id="login-update-password"] .pf-v5-c-login__main-header,
body[data-page-id="login-otp"] .pf-v5-c-login__main-header { padding-top: clamp(1.5rem, 5vh, 3rem); padding-bottom: 0.25rem; }
body[data-page-id="login-update-password"] .pf-v5-c-login__main-body,
body[data-page-id="login-otp"] .pf-v5-c-login__main-body { padding-top: 0.2rem; padding-bottom: 0.85rem; }
body[data-page-id="login-update-password"] .pf-v5-c-form__group,
body[data-page-id="login-otp"] .pf-v5-c-form__group { margin-bottom: 0.5rem; }
body[data-page-id="login-update-password"] .pf-v5-c-form-control,
body[data-page-id="login-otp"] .pf-v5-c-form-control,
body[data-page-id="login-update-password"] .pf-v5-c-input-group,
body[data-page-id="login-otp"] .pf-v5-c-input-group { min-height: 2.55rem; }
body[data-page-id="login-update-password"] input,
body[data-page-id="login-otp"] input { min-height: 2.55rem; padding-block: 0.45rem !important; }
body[data-page-id="login-update-password"] #kc-form-buttons,
body[data-page-id="login-otp"] #kc-form-buttons { display: flex; gap: 0.55rem; margin-top: 0.35rem; }
body[data-page-id="login-update-password"] #kc-form-buttons > *,
body[data-page-id="login-otp"] #kc-form-buttons > * { flex: 1 1 0; min-height: 2.55rem; margin: 0; padding-block: 0.45rem; border-radius: 0.8rem; font-size: 0.94rem; font-weight: 700; }
body[data-page-id="login-update-password"] #kc-login,
body[data-page-id="login-otp"] #kc-login { min-height: 2.55rem !important; }
body[data-page-id="login-update-password"] #kc-cancel,
body[data-page-id="login-otp"] #kc-cancel { border: 1px solid #2563eb; background: transparent; color: #2563eb; }
body[data-page-id="login-update-password"] #kc-cancel:hover,
body[data-page-id="login-otp"] #kc-cancel:hover { background: #eff6ff; box-shadow: none !important; transform: translateY(-1px); }
body[data-page-id="login-otp"] .pf-v5-c-form-control,
body[data-page-id="login-otp"] .pf-v5-c-input-group,
body[data-page-id="login-update-password"] .pf-v5-c-form-control,
body[data-page-id="login-update-password"] .pf-v5-c-input-group {
  position: relative;
  display: flex;
  min-height: 2.55rem;
  align-items: center;
  overflow: hidden;
  border: 1px solid var(--pta-border) !important;
  border-radius: 0.85rem;
  background: #fbfcfb;
  box-shadow: 0 0.15rem 0.35rem rgb(31 50 40 / 4%);
  transition: border-color 180ms ease, box-shadow 180ms ease, transform 180ms ease;
}
body[data-page-id="login-otp"] .pf-v5-c-form-control::before,
body[data-page-id="login-otp"] .pf-v5-c-form-control::after,
body[data-page-id="login-update-password"] .pf-v5-c-form-control::before,
body[data-page-id="login-update-password"] .pf-v5-c-form-control::after { display: none !important; content: none !important; }
body[data-page-id="login-otp"] .pf-v5-c-form-control:focus-within,
body[data-page-id="login-otp"] .pf-v5-c-input-group:focus-within,
body[data-page-id="login-update-password"] .pf-v5-c-form-control:focus-within,
body[data-page-id="login-update-password"] .pf-v5-c-input-group:focus-within {
  border-color: rgb(40 199 111 / 65%) !important;
  box-shadow: 0 0 0 0.23rem rgb(40 199 111 / 11%);
  transform: translateY(-1px);
}
body[data-page-id="login-otp"] .pf-v5-c-form-control.pf-m-error,
body[data-page-id="login-otp"] .pf-v5-c-input-group.pf-m-error,
body[data-page-id="login-update-password"] .pf-v5-c-form-control.pf-m-error,
body[data-page-id="login-update-password"] .pf-v5-c-input-group.pf-m-error { border-color: #ff4c51 !important; background: #fffafa; box-shadow: 0 0 0 0.18rem rgb(255 76 81 / 8%); }
body[data-page-id="login-otp"] input:not([type="hidden"]),
body[data-page-id="login-update-password"] input:not([type="hidden"]) { min-height: 2.55rem; padding: 0 1.05rem !important; border: 0 !important; outline: 0 !important; background: transparent !important; box-shadow: none !important; font-size: 0.96rem; }

/* Native "Buat Passkey" page: apply the same compact button system. */
body:has(#registerWebAuthn) .pf-v5-c-login__main-header,
body:has(#registerWebAuthn) div.pf-v5-c-login__main-header:has(.pf-v5-c-login__main-header-utilities) {
  padding-top: clamp(2rem, 6vh, 4rem);
  padding-bottom: 0.25rem;
}
body:has(#registerWebAuthn) .pf-v5-c-login__main-body {
  padding-top: 0.2rem;
  padding-bottom: 0.85rem;
}
body:has(#registerWebAuthn) #register,
body:has(#registerWebAuthn) #kc-webauthn-settings-form {
  margin: 0;
}
body:has(#registerWebAuthn) #registerWebAuthn,
body:has(#registerWebAuthn) [name="pta_passkey_action"][value="skip"] {
  position: relative;
  display: block;
  width: 100%;
  min-height: 2.55rem;
  box-sizing: border-box;
  margin-top: 0.55rem;
  overflow: hidden;
  padding-block: 0.45rem;
  border-radius: 0.8rem;
  font-size: 0.94rem;
  font-weight: 700;
  transition: box-shadow 180ms ease, transform 180ms ease, filter 180ms ease;
}
body:has(#registerWebAuthn) #registerWebAuthn {
  border: 0;
  background: linear-gradient(135deg, var(--pta-primary), #20b763);
  box-shadow: 0 0.45rem 1rem rgb(40 199 111 / 16%);
  color: #fff;
}
body:has(#registerWebAuthn) #registerWebAuthn:hover {
  filter: brightness(1.05);
  box-shadow: none !important;
  transform: translateY(-1px);
}
body:has(#registerWebAuthn) [name="pta_passkey_action"][value="skip"] {
  border: 0;
  background: linear-gradient(135deg, #f59e0b, #d97706);
  box-shadow: 0 0.45rem 1rem rgb(217 119 6 / 16%);
  color: #fff;
}
body:has(#registerWebAuthn) [name="pta_passkey_action"][value="skip"]::before,
body:has(#registerWebAuthn) #registerWebAuthn::before {
  position: absolute;
  top: -20%;
  bottom: -20%;
  left: -40%;
  width: 35%;
  background: linear-gradient(110deg, transparent, rgb(255 255 255 / 24%), transparent);
  content: "";
  transform: skewX(-18deg);
  transition: left 650ms ease;
}
body:has(#registerWebAuthn) [name="pta_passkey_action"][value="skip"]:hover {
  filter: brightness(1.05);
  box-shadow: none !important;
  transform: translateY(-1px);
}
body:has(#registerWebAuthn) #registerWebAuthn:hover::before,
body:has(#registerWebAuthn) [name="pta_passkey_action"][value="skip"]:hover::before { left: 115%; }
body:has(#registerWebAuthn) .pta-passkey-hint {
  margin-top: 0.65rem;
  margin-bottom: 0.2rem;
  font-size: 0.8rem;
  line-height: 1.45;
}

@media (max-width: 520px) {
  body[data-page-id="login-login"] .pf-v5-c-login__main-header,
  body[data-page-id="login-login"] div.pf-v5-c-login__main-header:has(.pf-v5-c-login__main-header-utilities) {
    padding-top: 1rem;
    padding-bottom: 0.2rem;
  }
  body[data-page-id="login-login"] .pf-v5-c-login__main-body {
    padding-top: 0.2rem;
    padding-bottom: 0.75rem;
  }
  body[data-page-id="login-login"] #kc-form-login { gap: 0.42rem; }
  body[data-page-id="login-login"] #kc-form-login span.pf-v5-c-form-control,
  body[data-page-id="login-login"] .pf-v5-c-input-group span.pf-v5-c-form-control,
  body[data-page-id="login-login"] .pta-transaction-year__surface,
  body[data-page-id="login-login"] #kc-form-login input,
  body[data-page-id="login-login"] #kc-login,
  body[data-page-id="login-login"] #authenticateWebAuthnButton { min-height: 2.4rem; }
  body[data-page-id="login-logout-confirm"] .pta-logout-confirm__button,
  body[data-page-id="login-logout-confirm"] .pta-logout-confirm__catalog { min-height: 2.4rem; }
  body:has(.pta-passkey-offer) .pta-passkey-offer button { min-height: 2.4rem; }
  body:has(#registerWebAuthn) #registerWebAuthn,
  body:has(#registerWebAuthn) [name="pta_passkey_action"][value="skip"] { min-height: 2.4rem; }
  body[data-page-id="login-delete-credential"] .pf-v5-c-login__main-body form > * { min-height: 2.4rem; }
  body[data-page-id="login-config-totp"] #kc-totp-settings-form button,
  body[data-page-id="login-config-totp"] #kc-totp-settings-form input[type="submit"],
  body[data-page-id="login-config-totp"] #kc-form-buttons button,
  body[data-page-id="login-config-totp"] #kc-form-buttons input[type="submit"] { min-height: 2.4rem; }
  body[data-page-id="login-update-password"] .pf-v5-c-form-control,
  body[data-page-id="login-update-password"] .pf-v5-c-input-group,
  body[data-page-id="login-update-password"] input,
  body[data-page-id="login-update-password"] #kc-form-buttons > *,
  body[data-page-id="login-otp"] .pf-v5-c-form-control,
  body[data-page-id="login-otp"] .pf-v5-c-input-group,
  body[data-page-id="login-otp"] input,
  body[data-page-id="login-otp"] #kc-form-buttons > * { min-height: 2.4rem; }
}


/* Existing theme: pta-account-actions-v1.css */
/* Keycloak v2 form IDs scope these rules to password update and OTP login. */
body:has(#kc-passwd-update-form, #kc-otp-login-form) .pf-v5-c-login__main {
  overflow-y: auto !important;
  justify-content: safe center;
}
body:has(#kc-passwd-update-form, #kc-otp-login-form) .pf-v5-c-login__main-header,
body:has(#kc-passwd-update-form, #kc-otp-login-form) .pf-v5-c-login__main-body {
  flex-shrink: 0;
}
body:has(#kc-passwd-update-form, #kc-otp-login-form) .pf-v5-c-login__main-header {
  padding-top: 2rem;
  padding-bottom: .25rem;
}
body:has(#kc-passwd-update-form, #kc-otp-login-form) .pf-v5-c-login__main-body {
  padding-top: .2rem;
  padding-bottom: .85rem;
}
:is(#kc-passwd-update-form, #kc-otp-login-form) {
  --pf-v5-c-form--GridGap: .65rem;
  gap: .65rem;
}
body:has(#kc-passwd-update-form, #kc-otp-login-form) .pf-v5-c-form__group {
  margin-block: 0;
}
body:has(#kc-passwd-update-form, #kc-otp-login-form) .pf-v5-c-form__group-label {
  padding-bottom: .2rem !important;
}
/* A single outer surface; nested spans must not draw a second border. */
body:has(#kc-passwd-update-form, #kc-otp-login-form) :is(span.pf-v5-c-form-control, .pf-v5-c-input-group) {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 2.55rem;
  border: 1px solid var(--pta-border) !important;
  border-radius: .85rem;
  background: #fbfcfb;
  box-shadow: 0 .15rem .35rem rgb(31 50 40 / 4%);
  transition: border-color 180ms ease, box-shadow 180ms ease;
}
body:has(#kc-passwd-update-form, #kc-otp-login-form) span.pf-v5-c-form-control::before,
body:has(#kc-passwd-update-form, #kc-otp-login-form) span.pf-v5-c-form-control::after {
  content: none !important;
}
body:has(#kc-passwd-update-form, #kc-otp-login-form) :is(span.pf-v5-c-form-control, .pf-v5-c-input-group):focus-within {
  border-color: rgb(40 199 111 / 65%) !important;
  box-shadow: 0 0 0 .18rem rgb(40 199 111 / 11%);
}
body:has(#kc-passwd-update-form, #kc-otp-login-form) :is(span.pf-v5-c-form-control, .pf-v5-c-input-group):has(input[aria-invalid="true"]) {
  border-color: #ff4c51 !important;
  background: #fffafa;
}
body:has(#kc-passwd-update-form, #kc-otp-login-form) .pf-v5-c-input-group span.pf-v5-c-form-control {
  border: 0 !important;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  transform: none;
}
body:has(#kc-passwd-update-form, #kc-otp-login-form) :is(#password-new, #password-confirm, #otp, #kc-attempted-username) {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  min-height: 2.55rem;
  padding: 0 1.05rem !important;
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: var(--pta-heading);
  font: inherit;
  font-size: .96rem;
}
body:has(#kc-passwd-update-form, #kc-otp-login-form) .pf-v5-c-input-group input {
  padding-right: 3.25rem !important;
}
body:has(#kc-passwd-update-form, #kc-otp-login-form) .pf-v5-c-input-group .pf-v5-c-button.pf-m-control {
  width: 3rem;
  min-height: 2.55rem;
}
body:has(#kc-passwd-update-form, #kc-otp-login-form) .pf-v5-c-input-group button:focus-visible {
  outline: 2px solid var(--pta-primary);
  outline-offset: -4px;
}
#kc-passwd-update-form input[type="checkbox"] {
  min-height: auto;
  padding: 0 !important;
  accent-color: var(--pta-primary);
}
:is(#kc-passwd-update-form, #kc-otp-login-form) .pf-v5-c-form__actions {
  margin-top: .25rem;
  gap: .55rem;
  flex-wrap: wrap !important;
}
:is(#kc-passwd-update-form, #kc-otp-login-form) :is(#kc-submit, #kc-login, #kc-cancel) {
  position: relative;
  overflow: hidden;
  min-height: 2.55rem !important;
  padding: .45rem 1rem !important;
  border-radius: .8rem;
  font-size: .94rem;
  font-weight: 700;
  transition: filter 180ms ease, transform 180ms ease;
}
:is(#kc-passwd-update-form, #kc-otp-login-form) :is(#kc-submit, #kc-login) {
  border: 0;
  background: linear-gradient(135deg, var(--pta-primary), #20b763);
  color: #fff;
}
:is(#kc-passwd-update-form, #kc-otp-login-form) #kc-cancel {
  border: 0;
  background: linear-gradient(135deg, #ef4444, #dc2626);
  color: #fff;
}
:is(#kc-passwd-update-form, #kc-otp-login-form) #kc-cancel::after {
  border: 0;
}
:is(#kc-passwd-update-form, #kc-otp-login-form) :is(#kc-submit, #kc-login, #kc-cancel)::before {
  position: absolute;
  top: -20%;
  bottom: -20%;
  left: -40%;
  width: 35%;
  content: "";
  background: linear-gradient(110deg, transparent, rgb(255 255 255 / 22%), transparent);
  transform: skewX(-18deg);
  transition: left 650ms ease;
}
:is(#kc-passwd-update-form, #kc-otp-login-form) :is(#kc-submit, #kc-login, #kc-cancel):hover::before { left: 115%; }
:is(#kc-passwd-update-form, #kc-otp-login-form) :is(#kc-submit, #kc-login, #kc-cancel):hover {
  box-shadow: none !important;
  filter: brightness(1.05);
  transform: translateY(-1px);
}
:is(#kc-passwd-update-form, #kc-otp-login-form) :is(#kc-submit, #kc-login, #kc-cancel):focus-visible {
  outline: 3px solid var(--pta-gold);
  outline-offset: 3px;
  box-shadow: none !important;
}
body:has(#kc-passwd-update-form, #kc-otp-login-form) .pta-login-footer { margin-top: .8rem; }
@media (max-width: 520px) {
  body:has(#kc-passwd-update-form, #kc-otp-login-form) .pf-v5-c-login__main-header { padding-top: 1rem; }
}
@media (prefers-reduced-motion: reduce) {
  body:has(#kc-passwd-update-form, #kc-otp-login-form) *,
  body:has(#kc-passwd-update-form, #kc-otp-login-form) *::before {
    transition: none !important;
  }
}


/* Existing theme: pta-totp-setup-v1.css */
/* Native CONFIGURE_TOTP uses div controls and saveTOTPBtn/cancelTOTPBtn. */
#kc-totp-settings-form {
  --pf-v5-c-form--GridGap: .65rem;
  display: grid;
  gap: .65rem;
}
body:has(#kc-totp-settings-form) #kc-totp-settings-form .pf-v5-c-form__group {
  margin: 0;
  padding-block: 0;
  row-gap: .2rem;
}
body:has(#kc-totp-settings-form) #kc-totp-settings-form .pf-v5-c-form__group.pf-m-action {
  margin-top: .15rem;
}
#kc-totp-settings-form .pf-v5-c-form__actions {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  margin: 0;
  padding: 0;
}
#kc-totp-settings-form div.pf-v5-c-form-control {
  display: flex;
  align-items: center;
  overflow: hidden;
  min-height: 2.55rem;
  border: 1px solid var(--pta-border);
  border-radius: .85rem;
  background: #fbfcfb;
  box-shadow: 0 .15rem .35rem rgb(31 50 40 / 4%);
  transition: border-color 180ms ease, box-shadow 180ms ease;
}
#kc-totp-settings-form div.pf-v5-c-form-control::before,
#kc-totp-settings-form div.pf-v5-c-form-control::after { content: none; }
#kc-totp-settings-form div.pf-v5-c-form-control:focus-within {
  border-color: rgb(40 199 111 / 65%);
  box-shadow: 0 0 0 .18rem rgb(40 199 111 / 11%);
}
#kc-totp-settings-form div.pf-v5-c-form-control:has([aria-invalid="true"]) {
  border-color: #ff4c51;
  background: #fffafa;
  box-shadow: 0 0 0 .18rem rgb(255 76 81 / 8%);
}
/* Match login's .pta-field-error while retaining Keycloak's live messages. */
#kc-totp-settings-form :is(#input-error-otp-code, #input-error-otp-label) {
  display: block;
  margin: .42rem 0 0;
  color: #e63d43;
  font-size: .8rem;
  font-weight: 550;
  line-height: 1.4;
}
#kc-totp-settings-form .pf-v5-c-form-control:has([aria-invalid="true"]) .pf-v5-c-form-control__utilities {
  display: none;
}
body:has(#kc-totp-settings-form) #kc-totp-settings-form :is(#totp, #userLabel) {
  width: 100%;
  min-width: 0;
  min-height: 2.55rem;
  box-sizing: border-box;
  padding: 0 1.05rem !important;
  border: 0;
  outline: 0;
  background: transparent;
  box-shadow: none;
  color: var(--pta-heading);
  font: inherit;
  font-size: .96rem;
}
body:has(#kc-totp-settings-form) #kc-totp-settings-form input[type="checkbox"] {
  min-height: auto;
  padding: 0;
  accent-color: var(--pta-primary);
}
#kc-totp-settings-form :is(#saveTOTPBtn, #cancelTOTPBtn) {
  position: relative;
  overflow: hidden;
  flex: 1 1 10rem;
  min-height: 2.55rem;
  margin: 0;
  padding: .45rem 1rem;
  border: 0;
  border-radius: .8rem;
  background: linear-gradient(135deg, var(--pta-primary), #20b763);
  color: #fff;
  font: inherit;
  font-size: .94rem;
  font-weight: 700;
  transition: filter 180ms ease, transform 180ms ease;
}
#kc-totp-settings-form #cancelTOTPBtn { background: linear-gradient(135deg, #ef4444, #dc2626); }
#kc-totp-settings-form :is(#saveTOTPBtn, #cancelTOTPBtn)::after { border: 0; }
#kc-totp-settings-form :is(#saveTOTPBtn, #cancelTOTPBtn)::before {
  position: absolute;
  top: -20%;
  bottom: -20%;
  left: -40%;
  width: 35%;
  content: "";
  background: linear-gradient(110deg, transparent, rgb(255 255 255 / 22%), transparent);
  transform: skewX(-18deg);
  transition: left 650ms ease;
}
#kc-totp-settings-form :is(#saveTOTPBtn, #cancelTOTPBtn):hover::before { left: 115%; }
#kc-totp-settings-form :is(#saveTOTPBtn, #cancelTOTPBtn):hover {
  box-shadow: none;
  filter: brightness(1.05);
  transform: translateY(-1px);
}
#kc-totp-settings-form :is(#saveTOTPBtn, #cancelTOTPBtn):focus-visible {
  outline: 3px solid var(--pta-gold);
  outline-offset: 3px;
}
body:has(#kc-totp-settings-form) #kc-totp-settings { margin-bottom: .65rem !important; }
#kc-totp-secret-qr-code + br { display: none; }
#kc-totp-secret-key { overflow-wrap: anywhere; }
body:has(#kc-totp-settings-form) .pta-login-footer { margin-top: .8rem; }
@media (prefers-reduced-motion: reduce) {
  #kc-totp-settings-form *, #kc-totp-settings-form *::before { transition: none !important; }
}


/* Existing theme: pta-security-actions-v5.css */
/* Match native Keycloak IDs; delete-credential uses kc-accept/kc-decline. */
body:has(#kc-delete-text, #registerWebAuthn, #kc-error-credential-form, #pta-passkey-continue) .pf-v5-c-login__main {
  overflow-y:auto !important;
  justify-content:safe center;
}
body:has(#kc-delete-text, #registerWebAuthn, #kc-error-credential-form, #pta-passkey-continue) :is(.pf-v5-c-login__main-header,.pf-v5-c-login__main-body) {
  flex-shrink:0;
}
body:has(#kc-delete-text, #registerWebAuthn, #kc-error-credential-form) .pf-v5-c-login__main-header {
  padding-top:1.5rem !important;
  padding-bottom:.3rem !important;
}
body:has(#kc-delete-text, #registerWebAuthn, #kc-error-credential-form) .pf-v5-c-login__main-body {
  padding-top:.3rem !important;
  padding-bottom:.8rem !important;
}
#kc-delete-text { margin:.2rem 0 .75rem; font-size:.95rem; line-height:1.45; }
body:has(#kc-delete-text) :is(.form-actions,.pf-v5-c-form__actions) {
  display:flex; flex-wrap:wrap !important; gap:.55rem; margin:.5rem 0;
}
body:has(#kc-delete-text) :is(#kc-accept,#kc-decline) { flex:1; min-width:140px; }
body:has(#kc-delete-text) .pf-v5-c-form { gap:.55rem; }
body:has(#kc-delete-text, #registerWebAuthn, #kc-error-credential-form) .pta-login-footer { margin-top:.8rem !important; }
/* Explicit controls cover native AIA cancel buttons as well as themed forms. */
body :is(#kc-accept,#kc-decline,#cancelWebAuthnAIA,#registerWebAuthn,#kc-try-again,#kc-cancel,button[name="cancel-aia"],input[name="cancel-aia"]) {
  min-height:2.55rem !important;
  padding:.45rem 1rem !important;
  border:0 !important;
  border-radius:.8rem !important;
  color:#fff !important;
  font-size:.94rem !important;
  font-weight:700 !important;
  box-shadow:none !important;
  position:relative;
  overflow:hidden;
  transition:filter 180ms ease,transform 180ms ease !important;
}
body :is(#registerWebAuthn,#kc-try-again) { background:linear-gradient(135deg,#28c76f,#20b763) !important; }
body :is(#kc-accept,#kc-decline,#cancelWebAuthnAIA,#kc-cancel,button[name="cancel-aia"],input[name="cancel-aia"]) {
  background:linear-gradient(135deg,#ef4444,#dc2626) !important;
}
body :is(#kc-accept,#kc-decline,#cancelWebAuthnAIA,#registerWebAuthn,#kc-try-again,#kc-cancel,[name="cancel-aia"]):hover {
  filter:brightness(1.05); transform:translateY(-1px); box-shadow:none !important;
}
body :is(#kc-accept,#kc-decline,#cancelWebAuthnAIA,#registerWebAuthn,#kc-try-again,#kc-cancel,[name="cancel-aia"]):focus-visible {
  outline:3px solid var(--pta-gold,#d9b95b) !important; outline-offset:3px;
}
body :is(#kc-accept,#kc-decline,#cancelWebAuthnAIA,#registerWebAuthn,#kc-try-again,#kc-cancel,[name="cancel-aia"])::after { border:0 !important; }
@media(max-width:520px) {
  body:has(#kc-delete-text, #registerWebAuthn, #kc-error-credential-form) .pf-v5-c-login__main-header { padding-top:1rem !important; }
}
@media(prefers-reduced-motion:reduce) {
  body :is(#kc-accept,#kc-decline,#cancelWebAuthnAIA,#registerWebAuthn,#kc-try-again,#kc-cancel,[name="cancel-aia"]) { transition:none !important; transform:none !important; }
}

/* Credential deletion: equal compact actions and a warning-colored cancel. */
body:has(#kc-delete-text) .pf-v5-c-form__group { margin:0 !important; padding:0 !important; }
body:has(#kc-delete-text) .pf-v5-c-form__actions {
  display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr));
  gap:.65rem !important; margin:.4rem 0 0 !important; padding:0 !important;
}
body:has(#kc-delete-text) :is(#kc-accept,#kc-decline) {
  width:100% !important; min-width:0 !important; margin:0 !important;
  white-space:normal !important; line-height:1.25 !important;
}
body:has(#kc-delete-text) #kc-decline {
  background:linear-gradient(135deg,#facc15,#eab308) !important;
  color:#422006 !important;
}

/* Native AIA cancel is in a separate form below the registration button. */
body:has(#registerWebAuthn,#kc-error-credential-form) #kc-webauthn-settings-form {
  margin-top:.75rem !important;
}

/* The retry form contains only hidden fields; it must not add layout space. */
#kc-error-credential-form { display:none; }
body:has(#kc-error-credential-form) #kc-try-again { width:100%; margin:0; }
body:has(#kc-error-credential-form) :is(#kc-try-again,#cancelWebAuthnAIA)::before {
  position:absolute; top:-20%; bottom:-20%; left:-40%; width:35%;
  content:""; background:linear-gradient(110deg,transparent,rgb(255 255 255 / 24%),transparent);
  transform:skewX(-18deg); transition:left 650ms ease;
}
body:has(#kc-error-credential-form) :is(#kc-try-again,#cancelWebAuthnAIA):hover::before { left:115%; }
body:has(#kc-error-credential-form) .alert { overflow-wrap:anywhere; }
@media(prefers-reduced-motion:reduce) {
  body:has(#kc-error-credential-form) :is(#kc-try-again,#cancelWebAuthnAIA)::before { transition:none; content:none; }
}


/* Shared authentication layout: login and all Keycloak action pages. */
body:is([data-page-id="login-login"], .pta-auth-theme) {
  --pta-login-ink: #183c32;
  --pta-login-muted: #71867a;
  --pta-login-border: #dce9e1;
}
body:is([data-page-id="login-login"], .pta-auth-theme) .pf-v5-c-login__container {
  grid-template-columns: minmax(0, 1.05fr) minmax(31rem, .95fr) !important;
}
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-header {
  isolation: isolate;
  background:
    radial-gradient(circle at 12% 18%, rgb(48 192 116 / 13%), transparent 26%),
    radial-gradient(circle at 87% 78%, rgb(68 168 139 / 13%), transparent 29%),
    radial-gradient(#d8e9de 1px, transparent 1px),
    #f3f8f2;
  background-size: auto, auto, 1.75rem 1.75rem, auto;
}
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-header::after {
  position: absolute;
  z-index: 0;
  top: 16%;
  right: clamp(2rem, 7%, 5rem);
  bottom: 22%;
  left: clamp(2rem, 7%, 5rem);
  display: block;
  border: 1px solid rgb(255 255 255 / 96%);
  border-radius: 2rem;
  background:
    url("../img/auth-login-illustration.png") center / auto 88% no-repeat,
    radial-gradient(circle at 52% 43%, rgb(177 248 201 / 55%), transparent 50%),
    linear-gradient(150deg, #fff, #e6f5eb 86%);
  box-shadow: 0 1.5rem 3.5rem rgb(36 102 67 / 11%), inset 0 0 0 1px rgb(39 130 77 / 5%);
  content: "";
  animation: ptaStageEnter .9s cubic-bezier(.2,.8,.2,1) both;
  pointer-events: none;
}
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-header::before {
  z-index: 2;
  right: auto;
  bottom: 1.45rem;
  left: clamp(2rem, 6vw, 5rem);
  margin: 0;
  color: #82958a;
  font-size: .7rem;
  text-align: left;
}
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-header-wrapper {
  z-index: 2;
  top: clamp(1.5rem, 4vh, 2.75rem);
  left: clamp(2rem, 6vw, 5rem);
  gap: .7rem;
}
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-header-wrapper::before {
  width: 3.4rem;
  height: 3.25rem;
  background-color: #fff;
  border: 1px solid #e2eee5;
  border-radius: .95rem;
  box-shadow: 0 .5rem 1rem rgb(31 97 56 / 8%);
}
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-header-wrapper::after {
  color: #244537;
  font-size: .78rem;
  letter-spacing: .08em;
}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-login-hero {
  position: absolute;
  z-index: 2;
  right: 2rem;
  bottom: 5rem;
  left: clamp(2rem, 7%, 5rem);
  animation: ptaCardEnter .7s .18s both;
}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-login-hero__label {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  margin: 0 0 .45rem;
  color: #168f60;
  font-size: .7rem;
  font-weight: 800;
  letter-spacing: .13em;
  text-transform: uppercase;
}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-login-hero__label::before {
  width: .5rem;
  height: .5rem;
  border-radius: 50%;
  background: #29c87a;
  box-shadow: 0 0 0 .28rem rgb(41 200 122 / 12%);
  content: "";
}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-login-hero h2 {
  margin: 0;
  color: #1a4332;
  font-size: clamp(1.55rem, 2.5vw, 2.35rem);
  font-weight: 780;
  letter-spacing: -.04em;
  line-height: 1.12;
}
body:is([data-page-id="login-login"], .pta-auth-theme) .pf-v5-c-login__main {
  justify-content: safe center;
  padding: 1.2rem clamp(1.5rem, 3vw, 3.25rem) !important;
  overflow-y: auto !important;
  border: 0;
  background:
    radial-gradient(circle at 85% 9%, rgb(129 212 160 / 13%), transparent 28%),
    linear-gradient(155deg, #f9fbf8, #eef6f0);
}
body:is([data-page-id="login-login"], .pta-auth-theme) .pf-v5-c-login__main-header,
body:is([data-page-id="login-login"], .pta-auth-theme) div.pf-v5-c-login__main-header:has(.pf-v5-c-login__main-header-utilities),
body:is([data-page-id="login-login"], .pta-auth-theme) .pf-v5-c-login__main-body {
  width: min(100%, 32rem);
  max-width: 32rem;
  flex-shrink: 0;
  overflow: visible;
  background: #fff;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  outline: 0;
  animation: ptaCardEnter .6s both;
}
body:is([data-page-id="login-login"], .pta-auth-theme) .pf-v5-c-login__main-header,
body:is([data-page-id="login-login"], .pta-auth-theme) div.pf-v5-c-login__main-header:has(.pf-v5-c-login__main-header-utilities) {
  padding: 1.55rem 2rem .55rem;
  border: 1px solid #e5eee7;
  border-bottom: 0;
  border-radius: 1.5rem 1.5rem 0 0;
  box-shadow: 0 -1rem 2rem rgb(37 81 52 / 4%);
}
body:is([data-page-id="login-login"], .pta-auth-theme) .pf-v5-c-login__main-body {
  padding: .45rem 2rem 1.4rem;
  border: 1px solid #e5eee7;
  border-top: 0;
  border-radius: 0 0 1.5rem 1.5rem;
  box-shadow: 0 1.3rem 2.6rem rgb(37 81 52 / 10%);
  animation-delay: .06s;
}
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-page-title {
  color: var(--pta-login-ink);
  font-size: clamp(1.85rem, 2.3vw, 2.25rem);
  font-weight: 780;
  letter-spacing: -.045em;
  line-height: 1.12;
}
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-page-title::before {
  display: block;
  width: fit-content;
  margin: 0 0 .6rem;
  padding: .32rem .6rem;
  border: 1px solid #d2eade;
  border-radius: .45rem;
  background: #f0faf2;
  color: #188759;
  content: "AKSES TERPUSAT";
  font-size: .64rem;
  font-weight: 800;
  letter-spacing: .1em;
}
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-page-title::after {
  margin-top: .42rem;
  color: var(--pta-login-muted);
  font-size: .9rem;
  font-weight: 450;
}
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-form-login { gap: .55rem; }
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-form-login > .pf-v5-c-form__group { transform: none; }
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-form-login .pf-v5-c-form__group-label.pf-v5-u-pb-xs { padding-bottom: .17rem !important; }
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-form-login .pf-v5-c-form__label-text {
  color: #34483b;
  font-size: .83rem;
  font-weight: 700;
}
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-form-login span.pf-v5-c-form-control,
body:is([data-page-id="login-login"], .pta-auth-theme) .pf-v5-c-input-group,
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-transaction-year__surface {
  min-height: 2.82rem;
  border: 1px solid var(--pta-login-border) !important;
  border-radius: .7rem;
  background: #fcfefd;
  box-shadow: none;
}
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-form-login input,
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-transaction-year__select { min-height: 2.82rem; }
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-form-login span.pf-v5-c-form-control:focus-within,
body:is([data-page-id="login-login"], .pta-auth-theme) .pf-v5-c-input-group:focus-within,
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-transaction-year__surface:focus-within {
  border-color: #4fc889 !important;
  background: #fff;
  box-shadow: 0 0 0 .2rem rgb(40 199 111 / 12%);
  transform: none;
}
body:is([data-page-id="login-login"], .pta-auth-theme) .pf-v5-c-input-group span.pf-v5-c-form-control {
  border: 0 !important;
  box-shadow: none;
}
body:is([data-page-id="login-login"], .pta-auth-theme) .pf-v5-c-input-group .pf-v5-c-button.pf-m-control {
  top: 0;
  bottom: 0;
  height: 100%;
  min-height: 100%;
  align-items: center;
  justify-content: center;
}
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-login {
  min-height: 2.85rem !important;
  border-radius: .7rem;
  background: linear-gradient(115deg, #22c76e, #19b561);
  color: #fff;
  box-shadow: 0 .45rem .9rem rgb(34 197 110 / 17%);
  font-size: .92rem;
}
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-login:hover,
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-login:focus-visible {
  background: linear-gradient(115deg, #1bb963, #13a555);
  box-shadow: 0 .65rem 1.1rem rgb(34 197 110 / 23%) !important;
  transform: translateY(-1px);
}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-passkey-divider { margin: .58rem 0 .35rem; }
body:is([data-page-id="login-login"], .pta-auth-theme) #authenticateWebAuthnButton {
  min-height: 2.82rem;
  margin-top: .3rem;
  padding: .53rem .8rem;
  border: 1px solid transparent;
  border-radius: .7rem;
  background: linear-gradient(115deg, #2864f7, #204ee6);
  color: #fff;
  box-shadow: none;
  font-size: .9rem;
}
body:is([data-page-id="login-login"], .pta-auth-theme) #authenticateWebAuthnButton:hover,
body:is([data-page-id="login-login"], .pta-auth-theme) #authenticateWebAuthnButton:focus-visible {
  border-color: transparent;
  background: linear-gradient(115deg, #2058e9, #1b43d1);
  color: #fff;
  transform: translateY(-1px);
}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-login-footer { margin-top: .65rem; }
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-login-footer__certificate-title { margin: .65rem 0 .35rem; }
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-login-footer__certificate-logo { height: 2.6rem; }
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-form-login span.pf-v5-c-form-control.pf-m-error,
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-form-login span.pf-v5-c-form-control.pta-has-error,
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-form-login .pf-v5-c-input-group.pta-has-error,
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-transaction-year-group.pta-has-error .pta-transaction-year__surface {
  border-color: #f05258 !important;
  background: #fffafa;
  box-shadow: 0 0 0 .18rem rgb(240 82 88 / 8%);
}
@keyframes ptaStageEnter {
  from { opacity: 0; transform: translateY(12px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes ptaCardEnter {
  from { opacity: 0; transform: translateY(9px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (max-width: 1024px) {
  body:is([data-page-id="login-login"], .pta-auth-theme) .pf-v5-c-login__container {
    display: grid !important;
    grid-template-areas: "header" "main" !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-template-rows: auto auto;
    align-content: start;
  }
  body:is([data-page-id="login-login"], .pta-auth-theme) #kc-header {
    height: 5.5rem;
    min-height: 5.5rem;
    background: linear-gradient(115deg, #f5faf5, #e9f5ed);
  }
  body:is([data-page-id="login-login"], .pta-auth-theme) #kc-header::before,
  body:is([data-page-id="login-login"], .pta-auth-theme) #kc-header::after,
  body:is([data-page-id="login-login"], .pta-auth-theme) .pta-login-hero { display: none; }
  body:is([data-page-id="login-login"], .pta-auth-theme) #kc-header-wrapper {
    top: 1.1rem;
    left: 50%;
    transform: translateX(-50%);
  }
  body:is([data-page-id="login-login"], .pta-auth-theme) .pf-v5-c-login__main {
    height: auto;
    min-height: 0;
    max-height: none;
    justify-content: flex-start;
    padding: .5rem 1rem 2rem !important;
  }
}
@media (max-width: 520px) {
  body:is([data-page-id="login-login"], .pta-auth-theme) .pf-v5-c-login__main-header,
  body:is([data-page-id="login-login"], .pta-auth-theme) div.pf-v5-c-login__main-header:has(.pf-v5-c-login__main-header-utilities) { padding: 1.4rem 1.25rem .45rem; }
  body:is([data-page-id="login-login"], .pta-auth-theme) .pf-v5-c-login__main-body { padding: .35rem 1.25rem 1.3rem; }
  body:is([data-page-id="login-login"], .pta-auth-theme) #kc-page-title { font-size: 1.8rem; }
}
@media (max-height: 740px) and (min-width: 1025px) {
  body:is([data-page-id="login-login"], .pta-auth-theme) #kc-header::after { top: 15%; bottom: 25%; }
  body:is([data-page-id="login-login"], .pta-auth-theme) .pta-login-hero { bottom: 3.5rem; }
}
@media (prefers-reduced-motion: reduce) {
  body:is([data-page-id="login-login"], .pta-auth-theme) #kc-header::after,
  body:is([data-page-id="login-login"], .pta-auth-theme) .pta-login-hero,
  body:is([data-page-id="login-login"], .pta-auth-theme) .pf-v5-c-login__main-header,
  body:is([data-page-id="login-login"], .pta-auth-theme) .pf-v5-c-login__main-body { animation: none; }
}

/* Isometric identity console, decorative only. */
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-page-title::before { display:none !important; content:none !important; }
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-login-hero { display:none !important; }
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-header { background:radial-gradient(ellipse at 50% 53%,#def4e7,transparent 55%),linear-gradient(145deg,#fbfdfb,#eff8f2 70%,#e8f4ec); }
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-header::after { display:none; }
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-header-wrapper::before { background-color:transparent; border:0; border-radius:0; box-shadow:none; filter:none; }
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-login-scene { position:absolute; z-index:1; inset:13% 4% 8%; display:flex; align-items:center; justify-content:center; pointer-events:none; }
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-iso { display:block; width:min(100%,46rem); height:100%; max-height:42rem; overflow:visible; }
/* One eight-second cycle: user → verification → application access. */
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-iso { --pta-cycle:8s; }
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-iso__assembly { animation:ptaSyncFloat var(--pta-cycle) ease-in-out infinite; }
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-iso__route { stroke-dasharray:18 120; stroke-dashoffset:18; opacity:0; animation:ptaSyncRequest var(--pta-cycle) linear infinite; }
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-iso__route--second { animation-name:ptaSyncAccess; }
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-iso__flow { stroke-dasharray:16 110; stroke-dashoffset:16; opacity:0; animation:ptaSyncPlatform var(--pta-cycle) linear infinite; }
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-iso__scan { opacity:0; animation:ptaSyncScan var(--pta-cycle) linear infinite; }
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-iso__user-halo { opacity:0; animation:ptaSyncUser var(--pta-cycle) ease-in-out infinite; }
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-iso__center-halo { opacity:0; animation:ptaSyncVerified var(--pta-cycle) ease-in-out infinite; }
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-iso__app-halo { opacity:0; animation:ptaSyncApps var(--pta-cycle) ease-in-out infinite; }
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-iso__verified { opacity:0; transform-origin:425px 357px; animation:ptaSyncCheck var(--pta-cycle) ease-in-out infinite; }
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-iso__app-tile { animation:ptaSyncTile var(--pta-cycle) ease-in-out infinite; }
@keyframes ptaSyncFloat { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-5px)} }
@keyframes ptaSyncUser { 0%,3%,28%,100%{opacity:0} 9%,17%{opacity:.8} }
@keyframes ptaSyncRequest {
  0%,8%{stroke-dashoffset:18;opacity:0}
  10%{opacity:1}
  31%{stroke-dashoffset:-100;opacity:1}
  32%,100%{stroke-dashoffset:-100;opacity:0}
}
@keyframes ptaSyncScan {
  0%,29%{transform:translateX(-80px);opacity:0}
  32%{opacity:.75}
  49%{transform:translateX(270px);opacity:.75}
  50%,100%{transform:translateX(270px);opacity:0}
}
@keyframes ptaSyncVerified { 0%,29%,62%,100%{opacity:0} 44%,51%{opacity:.85} }
@keyframes ptaSyncCheck { 0%,45%,96%,100%{opacity:0;transform:scale(.8)} 50%,88%{opacity:1;transform:scale(1)} }
@keyframes ptaSyncAccess {
  0%,52%{stroke-dashoffset:18;opacity:0}
  54%{opacity:1}
  75%{stroke-dashoffset:-100;opacity:1}
  76%,100%{stroke-dashoffset:-100;opacity:0}
}
@keyframes ptaSyncPlatform {
  0%,32%{stroke-dashoffset:16;opacity:0}
  35%{opacity:.8}
  83%{stroke-dashoffset:-100;opacity:.8}
  89%,100%{stroke-dashoffset:-100;opacity:0}
}
@keyframes ptaSyncApps { 0%,72%,98%,100%{opacity:0} 79%,88%{opacity:.85} }
@keyframes ptaSyncTile { 0%,73%,98%,100%{fill:#e5f5eb} 80%,88%{fill:#96e4b8} }
@media(max-width:1024px) { body:is([data-page-id="login-login"], .pta-auth-theme) .pta-login-scene {display:none;} }
@media(prefers-reduced-motion:reduce) {
 body:is([data-page-id="login-login"], .pta-auth-theme) .pta-iso * {animation:none !important;}
 body:is([data-page-id="login-login"], .pta-auth-theme) .pta-iso__scan {display:none;}
}

/* Quiet institutional footer, separate from the login form footer. */
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-header:has(.pta-site-footer)::before { display:none; }
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-site-footer {
  position:absolute;
  z-index:2;
  right:clamp(2rem, 6vw, 5rem);
  bottom:1.45rem;
  left:clamp(2rem, 6vw, 5rem);
  display:flex;
  align-items:baseline;
  gap:.5rem;
  white-space:nowrap;
  padding-top:.85rem;
  color:#6e8778;
  font-size:.7rem;
  line-height:1.6;
  letter-spacing:.005em;
}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-site-footer::before {
  position:absolute;
  top:0;
  right:0;
  left:0;
  height:1px;
  background:linear-gradient(90deg,#42b980 0 2.5rem,#cde2d4 2.5rem,transparent 100%);
  content:"";
}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-site-footer__copyright {
  display:flex;
  align-items:baseline;
  flex-wrap:nowrap;
  gap:.15rem .5rem;
}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-site-footer__copyright strong {
  color:#456652;
  font-weight:650;
}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-site-footer__rights {
  display:inline;
  margin-top:0;
  color:#7c9385;
  font-size:.65rem;
  letter-spacing:0;
}
@media(min-width:1025px) and (max-width:1280px) {
  body:is([data-page-id="login-login"], .pta-auth-theme) .pta-site-footer {left:1.25rem;right:1.25rem;font-size:.6rem;gap:.35rem;}
  body:is([data-page-id="login-login"], .pta-auth-theme) .pta-site-footer__rights {font-size:.58rem;}
  body:is([data-page-id="login-login"], .pta-auth-theme) .pta-site-footer__copyright {gap:.35rem;}
}
@media(max-width:1024px) {
  body:is([data-page-id="login-login"], .pta-auth-theme) .pta-site-footer {display:none;}
}

/* Institutional brand lockup with clear title and subtitle hierarchy. */
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-header-wrapper:has(.pta-brand-copy) {
  width:max-content;
  max-width:calc(100% - 4rem);
  gap:1rem;
}
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-header-wrapper:has(.pta-brand-copy)::before {
  width:4.3rem;
  height:3.45rem;
  background-color:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
  filter:none;
}
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-header-wrapper:has(.pta-brand-copy)::after {display:none;}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-brand-copy {
  display:flex;
  min-width:0;
  padding:.2rem 0;
  border-left:0;
  flex-direction:column;
  gap:.1rem;
  line-height:1.2;
}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-brand-copy__title {
  color:#173f2e;
  font-size:1.18rem;
  font-weight:780;
  letter-spacing:-.025em;
}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-brand-copy__subtitle {
  color:#607f6b;
  font-size:.62rem;
  font-weight:650;
  letter-spacing:.15em;
  text-transform:uppercase;
}
@media(max-width:1024px) {
  body:is([data-page-id="login-login"], .pta-auth-theme) #kc-header-wrapper:has(.pta-brand-copy) {max-width:calc(100% - 2rem);gap:.75rem;}
  body:is([data-page-id="login-login"], .pta-auth-theme) #kc-header-wrapper:has(.pta-brand-copy)::before {width:3.7rem;height:2.9rem;}
  body:is([data-page-id="login-login"], .pta-auth-theme) .pta-brand-copy {padding-left:0;gap:.1rem;}
  body:is([data-page-id="login-login"], .pta-auth-theme) .pta-brand-copy__title {font-size:1.05rem;}
  body:is([data-page-id="login-login"], .pta-auth-theme) .pta-brand-copy__subtitle {font-size:.57rem;letter-spacing:.12em;}
}

/* Unified login card and focus-driven connection to the SSO illustration. */
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-auth-card {
  --pta-card-accent:#27bb78;
  position:relative;
  isolation:isolate;
  width:min(100%,32rem);
  margin:0 auto;
  flex:0 0 auto;
  border:1px solid #dfebe3;
  border-radius:1.4rem;
  background:linear-gradient(155deg,#fff 75%,#fbfefc);
  box-shadow:0 1.4rem 3.5rem rgb(35 82 53 / 9%),0 .2rem .6rem rgb(35 82 53 / 3%);
  transition:border-color .25s,box-shadow .25s;
}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-auth-card:focus-within {
  border-color:#c4e2d0;
  box-shadow:0 1.5rem 3.5rem rgb(35 82 53 / 12%),0 0 0 1px rgb(47 183 111 / 4%);
}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-auth-card::before {
  position:absolute;
  z-index:2;
  top:0;
  left:2rem;
  right:2rem;
  height:2px;
  border-radius:2px;
  background:linear-gradient(90deg,transparent,var(--pta-card-accent),transparent);
  opacity:.3;
  content:"";
  transition:opacity .25s,background .25s;
}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-auth-card:focus-within::before {opacity:.95;}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-auth-card:has(#authenticateWebAuthnButton:focus) {--pta-card-accent:#2864f7;border-color:#cad9f7;}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-auth-card > :is(div.pf-v5-c-login__main-header,.pf-v5-c-login__main-body) {
  width:100%;
  max-width:none;
  border:0 !important;
  border-radius:0;
  background:transparent;
  box-shadow:none !important;
  animation:none;
}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-auth-card > div.pf-v5-c-login__main-header {padding:1.75rem 2rem .7rem;}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-auth-card > .pf-v5-c-login__main-body {padding:.4rem 2rem 1.5rem;}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-auth-card #kc-page-title {font-size:clamp(1.85rem,2.15vw,2.15rem);line-height:1.15;letter-spacing:-.04em;}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-auth-card #kc-page-title::after {margin-top:.55rem;line-height:1.55;}
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-form-login label {display:inline-flex;align-items:center;gap:.4rem;}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-field-symbol {width:.95rem;height:.95rem;flex:0 0 auto;color:#7f9c8a;transition:color .2s;}
body:is([data-page-id="login-login"], .pta-auth-theme) #kc-form-login .pf-v5-c-form__group:focus-within .pta-field-symbol {color:#1aab6b;}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-auth-card #kc-form-login span.pf-v5-c-form-control,
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-auth-card .pf-v5-c-input-group,
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-auth-card .pta-transaction-year__surface {
  background:#f9fcfa;
  transition:border-color .2s,box-shadow .2s,background .2s;
}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-auth-card #kc-form-login span.pf-v5-c-form-control:focus-within,
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-auth-card .pf-v5-c-input-group:focus-within,
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-auth-card .pta-transaction-year__surface:focus-within {background:#fff;}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-auth-card .pf-v5-c-input-group span.pf-v5-c-form-control {background:transparent !important;box-shadow:none !important;}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-auth-card #kc-form-login :is(.pf-m-error,.pta-has-error) {background:#fffafa;}
body:is([data-page-id="login-login"], .pta-auth-theme) .pta-auth-card #authenticateWebAuthnButton {box-shadow:0 .35rem .8rem rgb(40 100 247 / 13%);}
/* Focus overrides the decorative idle sequence, without implying authentication success. */
body:is([data-page-id="login-login"], .pta-auth-theme):where([data-login-focus]:not([data-login-focus="idle"])) :is(.pta-iso__route,.pta-iso__flow,.pta-iso__scan,.pta-iso__user-halo,.pta-iso__center-halo,.pta-iso__app-halo,.pta-iso__verified) {animation:none;opacity:0;}
body:is([data-page-id="login-login"], .pta-auth-theme):where([data-login-focus]:not([data-login-focus="idle"])) .pta-iso__app-tile {animation:none;fill:#e5f5eb;}
body:is([data-page-id="login-login"], .pta-auth-theme)[data-login-focus="identity"] .pta-iso__user-halo {opacity:.9;}
body:is([data-page-id="login-login"], .pta-auth-theme)[data-login-focus="identity"] .pta-iso__route:not(.pta-iso__route--second) {opacity:1;animation:ptaFocusFlow 2.8s linear infinite;}
body:is([data-page-id="login-login"], .pta-auth-theme)[data-login-focus="security"] .pta-iso__center-halo {opacity:.9;}
body:is([data-page-id="login-login"], .pta-auth-theme)[data-login-focus="security"] .pta-iso__scan,
body:is([data-page-id="login-login"], .pta-auth-theme)[data-login-focus="passkey"] .pta-iso__scan {animation:ptaFocusScan 3.5s ease-in-out infinite;}
body:is([data-page-id="login-login"], .pta-auth-theme)[data-login-focus="passkey"] .pta-iso__center-halo {opacity:.9;stroke:#2864f7;}
body:is([data-page-id="login-login"], .pta-auth-theme)[data-login-focus="applications"] .pta-iso__app-halo {opacity:.9;}
body:is([data-page-id="login-login"], .pta-auth-theme)[data-login-focus="applications"] .pta-iso__app-tile {fill:#a8e9c4;}
body:is([data-page-id="login-login"], .pta-auth-theme):has(#kc-form-login[aria-busy="true"]) .pta-iso__verified {animation:none;opacity:0;}
@keyframes ptaFocusFlow {from{stroke-dashoffset:18}to{stroke-dashoffset:-120}}
@keyframes ptaFocusScan {0%,10%{transform:translateX(-80px);opacity:0}25%{opacity:.65}75%,100%{transform:translateX(270px);opacity:0}}
@media(max-width:520px) {
  body:is([data-page-id="login-login"], .pta-auth-theme) .pta-auth-card {border-radius:1.2rem;}
  body:is([data-page-id="login-login"], .pta-auth-theme) .pta-auth-card > div.pf-v5-c-login__main-header {padding:1.4rem 1.25rem .55rem;}
  body:is([data-page-id="login-login"], .pta-auth-theme) .pta-auth-card > .pf-v5-c-login__main-body {padding:.35rem 1.25rem 1.3rem;}
  body:is([data-page-id="login-login"], .pta-auth-theme) .pta-auth-card #kc-page-title {font-size:1.8rem;}
}
@media(prefers-reduced-motion:reduce) {
  body:is([data-page-id="login-login"], .pta-auth-theme) .pta-auth-card,
  body:is([data-page-id="login-login"], .pta-auth-theme) .pta-auth-card::before {transition:none;}
  body:is([data-page-id="login-login"], .pta-auth-theme)[data-login-focus] .pta-iso * {animation:none !important;}
}

/* Keep inherited information/footer sections within the shared card. */
body.pta-auth-theme .pta-auth-card > .pf-v5-c-login__main-footer {padding:0 2rem 1.25rem;margin:0;border:0;background:transparent;border-radius:0 0 1.4rem 1.4rem;box-shadow:none;}
body.pta-auth-theme .pta-auth-card {min-width:0;padding:0;}
body.pta-auth-theme .pta-auth-card #kc-page-title {overflow-wrap:anywhere;}
body.pta-auth-theme:not([data-page-id="login-login"]) .pta-auth-card .pf-v5-c-form__label-text {color:#34483b;font-weight:650;}
body.pta-auth-theme .pta-auth-card :is(#kc-totp-secret-key, .pta-totp-secret) {overflow-wrap:anywhere;}
@media(max-width:900px){body.pta-auth-theme .pta-auth-card > .pf-v5-c-login__main-footer {padding:0 1.25rem 1.25rem;}}

/* The login introduction must not appear on account actions or error pages. */
body.pta-auth-theme:not([data-page-id="login-login"]):not([data-page-id="login-login-username"]):not([data-page-id="login-login-password"]) #kc-page-title::after {content:none;}

/* One readable error surface for native Keycloak and local validation messages. */
body.pta-auth-theme :is(.pta-native-error,.pta-field-error,.pta-login-alert) {
  box-sizing:border-box;display:flex;align-items:flex-start;gap:.55rem;
  width:100%;min-width:0;margin:.5rem 0 .15rem;padding:.65rem .8rem;
  border:1px solid #f1d4d7;border-radius:.65rem;background:#fff5f5;
  color:#a83240;font-size:.8rem;font-weight:500;line-height:1.55;
  box-shadow:none;overflow-wrap:anywhere;text-align:left;
}
body.pta-auth-theme :is(.pta-native-error,.pta-field-error)::before {
  content:"";display:block;flex:0 0 1rem;width:1rem;height:1rem;margin-top:.12rem;
  background:currentColor;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v6m0 4h.01'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat;
}
body.pta-auth-theme .pta-native-error :is(div,span,p) {
  min-width:0;margin:0;padding:0;background:transparent!important;color:inherit!important;
  font-size:inherit;font-weight:inherit;line-height:inherit;box-shadow:none;
}
body.pta-auth-theme .pta-native-error :is(.pf-v5-c-helper-text__item-icon,.pf-v5-c-form__helper-text-icon) {display:none;}
body.pta-auth-theme .pta-login-alert__icon {width:1rem;height:1rem;margin-top:.12rem;border-radius:50%;background:transparent;color:inherit;border:1px solid currentColor;}
body.pta-auth-theme .pta-login-alert__icon svg {width:.85rem;height:.85rem;}
body.pta-auth-theme .pta-login-alert__message {min-width:0;padding:0;}
body.pta-auth-theme :is(.pta-native-error,.pta-field-error,.pta-login-alert)[hidden] {display:none!important;}
body.pta-auth-theme .pf-v5-c-alert {
  --pf-v5-c-alert--BackgroundColor:#f1f7fc;
  padding:.75rem .85rem;margin:0 0 .8rem;border:1px solid #d4e4f0;border-radius:.65rem;
  background:#f1f7fc;color:#315c7a;box-shadow:none;font-size:.8rem;line-height:1.55;
  grid-template-columns:1rem minmax(0,1fr);column-gap:.6rem;
}
body.pta-auth-theme .pf-v5-c-alert.pf-m-danger {background:#fff5f5;border-color:#f1d4d7;color:#a83240;}
body.pta-auth-theme .pf-v5-c-alert.pf-m-warning {background:#fff9ed;border-color:#efdfbc;color:#866420;}
body.pta-auth-theme .pf-v5-c-alert.pf-m-success {background:#eff9f3;border-color:#cde7d7;color:#2f7650;}
body.pta-auth-theme .pf-v5-c-alert :is(.pf-v5-c-alert__title,.kc-feedback-text,.pf-v5-c-alert__description) {min-width:0;color:inherit;font-size:inherit;font-weight:500;line-height:inherit;overflow-wrap:anywhere;}
body.pta-auth-theme .pf-v5-c-alert__icon {color:inherit;font-size:1rem;}

/* Compact credential-entry card; retain scrolling when errors need more room. */
body[data-page-id="login-login"] .pf-v5-c-login__main > .pta-auth-card {
  padding:0!important;min-height:0;max-width:32rem;
}
body[data-page-id="login-login"] .pta-auth-card > div.pf-v5-c-login__main-header {
  padding:1.25rem 1.75rem .5rem!important;
}
body[data-page-id="login-login"] .pta-auth-card > .pf-v5-c-login__main-body {
  padding:.25rem 1.75rem 1.15rem!important;
}
body[data-page-id="login-login"] .pta-auth-card #kc-page-title {font-size:clamp(1.65rem,2vw,2rem);line-height:1.15;}
body[data-page-id="login-login"] .pta-auth-card #kc-page-title::after {margin-top:.4rem;font-size:.85rem;line-height:1.45;}
body[data-page-id="login-login"] .pta-auth-card #kc-form-login {gap:.45rem;}
body[data-page-id="login-login"] .pta-auth-card #kc-form-login > .pf-v5-c-form__group {margin-block:0;padding-block:0;row-gap:.2rem;}
body[data-page-id="login-login"] .pta-auth-card #kc-form-login .pf-v5-c-form__label-text {font-size:.8rem;}
body[data-page-id="login-login"] .pta-auth-card :is(#kc-form-login span.pf-v5-c-form-control,.pf-v5-c-input-group,.pta-transaction-year__surface) {min-height:2.65rem;}
body[data-page-id="login-login"] .pta-auth-card #kc-form-login input:not([type="hidden"]):not([type="checkbox"]),
body[data-page-id="login-login"] .pta-auth-card .pta-transaction-year__select {min-height:2.65rem;font-size:.9rem;}
body[data-page-id="login-login"] .pta-auth-card :is(#kc-login,#authenticateWebAuthnButton) {min-height:2.75rem!important;padding-block:.45rem!important;}
body[data-page-id="login-login"] .pta-auth-card .pta-passkey-divider {margin:.65rem 0;line-height:1.3;}
body[data-page-id="login-login"] .pta-auth-card .pta-login-footer {margin-top:1.1rem;}
body[data-page-id="login-login"] .pta-auth-card .pta-login-footer__links {font-size:.75rem;line-height:1.45;}
body[data-page-id="login-login"] .pta-auth-card .pta-login-footer__certificate-title {margin:.5rem 0 .3rem;font-size:.7rem;}
body[data-page-id="login-login"] .pta-auth-card .pta-login-footer__certificate-logo {height:2.2rem;width:auto;}
@media(max-width:600px){
 body[data-page-id="login-login"] .pta-auth-card > div.pf-v5-c-login__main-header {padding:1.1rem 1.2rem .45rem!important;}
 body[data-page-id="login-login"] .pta-auth-card > .pf-v5-c-login__main-body {padding:.2rem 1.2rem 1.1rem!important;}
}

/* Equal spacing on both sides of the alternate sign-in separator. */
body[data-page-id="login-login"] .pta-auth-card #authenticateWebAuthnButton {margin-top:0;}
body[data-page-id="login-login"] .pta-auth-card #kc-form-login {margin-bottom:0;}

/* Keep both sign-in actions free of shadows on hover. */
body[data-page-id="login-login"] .pta-auth-card :is(#kc-login,#authenticateWebAuthnButton):hover {box-shadow:none!important;}

/* Shared light/dark preference with the portal. */
body.pta-auth-theme .pta-theme-toolbar{display:flex;justify-content:flex-end;padding:.8rem 1.75rem 0;}
body.pta-auth-theme .pta-auth-theme-toggle{display:inline-flex;align-items:center;gap:.45rem;min-height:32px;padding:.35rem .65rem;border:1px solid #dce9e1;border-radius:.6rem;background:#f8fcf9;color:#577765;font:inherit;font-size:.72rem;line-height:1.4;cursor:pointer;}
body.pta-auth-theme .pta-auth-theme-toggle svg{width:16px;height:16px;}
body.pta-auth-theme .pta-auth-theme-toggle:hover{background:#eaf6ee;}
body.pta-auth-theme .pta-auth-theme-toggle:focus-visible{outline:2px solid #4fba87;outline-offset:3px;}
body.pta-auth-theme .pta-theme-sun{display:none;}
html.dark .pta-theme-sun{display:initial;}html.dark .pta-theme-moon{display:none;}
body.pta-auth-theme .pta-theme-toolbar + div.pf-v5-c-login__main-header{padding-top:.65rem!important;}
html.dark{color-scheme:dark;}
html.dark body.pta-auth-theme{--pta-login-ink:#ecfdf5;--pta-heading:#e2e8f0;--pta-login-muted:#a5b8ad;--pta-login-border:#395247;--pta-border:#395247;--pta-white:#142237;background:#0f172a;color:#dbe8e1;}
html.dark body.pta-auth-theme :is(.pf-v5-c-login,.pf-v5-c-login__container){background:#0f172a;}
html.dark body.pta-auth-theme #kc-header{background:radial-gradient(ellipse at 50% 53%,#174236,transparent 65%),linear-gradient(145deg,#101f2c,#152e2b);}
html.dark body.pta-auth-theme .pf-v5-c-login__main{background:radial-gradient(circle at 90% 10%,#163c31,transparent 60%),#101d2c;}
html.dark body.pta-auth-theme .pta-auth-card{background:#172638;border-color:#324b47;box-shadow:0 14px 40px #0003;}
html.dark body.pta-auth-theme .pta-auth-card:focus-within{border-color:#3e6a53;box-shadow:0 14px 40px #0003;}
html.dark body.pta-auth-theme .pta-auth-card > :is(.pf-v5-c-login__main-header,.pf-v5-c-login__main-body,.pf-v5-c-login__main-footer){background:transparent;color:#dbe8e1;}
html.dark body.pta-auth-theme :is(.pta-brand-copy__title,#kc-page-title){color:#ecfdf5;}
html.dark body.pta-auth-theme :is(.pta-brand-copy__subtitle,.pta-site-footer,.pta-site-footer__rights,.pta-site-footer__copyright strong,#kc-page-title::after){color:#a5bdb0;}
html.dark body.pta-auth-theme .pta-site-footer{border-color:#335348;}
html.dark body.pta-auth-theme .pta-auth-card :is(label,.pf-v5-c-form__label-text){color:#d5e8dc!important;}
html.dark body.pta-auth-theme .pta-auth-card :is(span.pf-v5-c-form-control,div.pf-v5-c-form-control,.pf-v5-c-input-group,.pta-transaction-year__surface){background:#102333!important;border-color:#395247!important;box-shadow:none;}
html.dark body.pta-auth-theme .pta-auth-card .pf-v5-c-input-group span.pf-v5-c-form-control{background:transparent!important;border:0!important;}
html.dark body.pta-auth-theme .pta-auth-card :is(input:not([type="submit"]):not([type="button"]),select,textarea){color:#e2e8f0!important;background:transparent;}
html.dark body.pta-auth-theme .pta-auth-card input::placeholder{color:#91a99b;}
html.dark body.pta-auth-theme .pta-auth-card select option{background:#172638;color:#e2e8f0;}
html.dark body.pta-auth-theme :is(.pta-passkey-divider,.pta-login-footer__certificate-title){color:#a5b8ad;}
html.dark body.pta-auth-theme :is(.pta-passkey-divider,.pta-login-footer__certificate-title)::before,
html.dark body.pta-auth-theme :is(.pta-passkey-divider,.pta-login-footer__certificate-title)::after{background:#395247;}
html.dark body.pta-auth-theme .pta-auth-theme-toggle{background:#203849;border-color:#3a5261;color:#dbe8e1;}
html.dark body.pta-auth-theme .pta-auth-theme-toggle:hover{background:#2a4857;}
html.dark body.pta-auth-theme :is(.pta-native-error,.pta-field-error,.pta-login-alert,.pf-v5-c-alert.pf-m-danger){background:#3d2631!important;border-color:#75404b;color:#fda4af;}
html.dark body.pta-auth-theme .pf-v5-c-alert.pf-m-success{background:#173b2e;color:#a7f3d0;border-color:#305c43;}
html.dark body.pta-auth-theme .pf-v5-c-alert.pf-m-warning{background:#392e1c;color:#fcd68c;border-color:#69552b;}
html.dark body.pta-auth-theme .pf-v5-c-alert.pf-m-info{background:#1e354b;color:#b9d9f3;border-color:#375b77;}
@media(max-width:600px){body.pta-auth-theme .pta-theme-toolbar{padding:.75rem 1.2rem 0;}}

/* Compact icon-only theme control; accessible label remains on the button. */
body.pta-auth-theme .pta-theme-toolbar{padding:.6rem 1.25rem 0;}
body.pta-auth-theme .pta-auth-theme-toggle{width:30px;height:30px;min-height:30px;padding:0;gap:0;justify-content:center;border-radius:.5rem;}
body.pta-auth-theme .pta-auth-theme-toggle span{display:none;}
body.pta-auth-theme .pta-theme-toolbar + div.pf-v5-c-login__main-header{padding-top:.25rem!important;}
@media(max-width:600px){body.pta-auth-theme .pta-theme-toolbar{padding:.5rem 1rem 0;}}

/* Verification motion: identity → secure gateway → apps, never a success state. */
body.pta-auth-theme .pta-login-block-ui{--pta-loading-cycle:2.4s;background:rgb(234 244 239 / 68%);backdrop-filter:blur(6px);}
body.pta-auth-theme .pta-login-block-ui__card{width:min(100%,21rem);min-height:0;flex-direction:column;gap:.5rem;padding:1.1rem 1.5rem 1.35rem;border:1px solid #d7e9df;border-radius:1.4rem;background:#fcfffd;box-shadow:0 22px 70px #163d2926;color:#193f30;text-align:center;}
body.pta-auth-theme .pta-login-block-ui__card::before{top:auto;bottom:0;height:3px;background:#dcefe4;}
body.pta-auth-theme .pta-login-block-ui__card::after{top:auto;bottom:0;height:3px;}
body.pta-auth-theme .pta-login-block-ui.is-active .pta-login-block-ui__card::after{animation:ptaLoginProgress var(--pta-loading-cycle) ease-in-out infinite;}
body.pta-auth-theme .pta-login-block-ui__badge{display:block;width:204px;max-width:100%;min-width:0;height:auto;aspect-ratio:260/108;border-radius:0;background:none;color:#159e68;animation:none;}
body.pta-auth-theme .pta-login-block-ui__badge::before,body.pta-auth-theme .pta-login-block-ui__badge::after{content:none;}
body.pta-auth-theme .pta-login-block-ui__badge svg{display:block;width:100%;height:100%;animation:none;}
.pta-loading-track{stroke:#cfe6d9;}.pta-loading-user>rect,.pta-loading-apps>rect:first-child{fill:#eff9f3;stroke:#bfdfcc;}.pta-loading-vault>rect:first-child{fill:#e3f6ec;stroke:#c9e5d6;}.pta-loading-vault>rect:nth-child(2){fill:#fff;}.pta-loading-flow{stroke:#19b778;stroke-width:3;stroke-dasharray:25 100;opacity:0;}
.pta-login-block-ui.is-active .pta-loading-flow--in{animation:ptaLoadingInbound var(--pta-loading-cycle) linear infinite;}
.pta-login-block-ui.is-active .pta-loading-flow--out{animation:ptaLoadingOutbound var(--pta-loading-cycle) linear infinite;}
.pta-login-block-ui.is-active .pta-loading-vault{transform-origin:130px 54px;animation:ptaLoadingPulse var(--pta-loading-cycle) ease-in-out infinite;}
.pta-loading-glow{display:none;}
body.pta-auth-theme .pta-login-block-ui__title{color:#193f30;font-size:1.05rem;font-weight:700;line-height:1.4;}
body.pta-auth-theme .pta-login-block-ui__subtitle{color:#6e8478;font-size:.8rem;font-weight:450;line-height:1.6;margin-top:.4rem;}
@keyframes ptaLoadingInbound{0%{stroke-dashoffset:30;opacity:0}10%{opacity:1}40%{stroke-dashoffset:-100;opacity:1}45%,100%{stroke-dashoffset:-100;opacity:0}}
@keyframes ptaLoadingOutbound{0%,55%{stroke-dashoffset:30;opacity:0}60%{opacity:1}90%{stroke-dashoffset:-100;opacity:1}95%,100%{stroke-dashoffset:-100;opacity:0}}
@keyframes ptaLoadingPulse{0%,20%,80%,100%{transform:scale(1)}45%,55%{transform:scale(1.035)}}
@keyframes ptaLoadingGlow{0%,15%,85%,100%{opacity:.15;filter:drop-shadow(0 0 2px #29bf7c22)}40%,55%{opacity:.95;filter:drop-shadow(0 0 5px #29bf7c88)}}
body.pta-auth-theme:has(#kc-form-login[aria-busy="true"]) .pta-iso__assembly{animation:ptaSyncFloat 2.4s ease-in-out infinite;}
body.pta-auth-theme:has(#kc-form-login[aria-busy="true"]) .pta-iso__center-halo{animation:ptaLoadingGlow 2.4s ease-in-out infinite;}
body.pta-auth-theme:has(#kc-form-login[aria-busy="true"]) .pta-iso__scan{display:none;}
html.dark body.pta-auth-theme .pta-login-block-ui{background:rgb(6 17 29 / 70%);}
html.dark body.pta-auth-theme .pta-login-block-ui__card{background:#172c37;border-color:#345748;box-shadow:0 22px 70px #0006;}
html.dark body.pta-auth-theme .pta-login-block-ui__title{color:#ecfdf5;}
html.dark body.pta-auth-theme .pta-login-block-ui__subtitle{color:#a8c2b5;}
html.dark .pta-loading-track{stroke:#35584a;}html.dark .pta-loading-user>rect,html.dark .pta-loading-apps>rect:first-child{fill:#203d36;stroke:#42715b;}html.dark .pta-loading-vault>rect:first-child{fill:#214e3c;stroke:#3b6050;}html.dark .pta-loading-vault>rect:nth-child(2){fill:#18392e;}
@media(prefers-reduced-motion:reduce){body.pta-auth-theme .pta-login-block-ui *,body.pta-auth-theme .pta-login-block-ui *::after{animation:none!important;transition:none!important;}body.pta-auth-theme .pta-login-block-ui{transition:none;}body.pta-auth-theme:has(#kc-form-login[aria-busy="true"]) .pta-iso *{animation:none!important;}}

/* Subtle traveling highlight and sequential application illumination. */
body.pta-auth-theme .pta-login-block-ui__subtitle{white-space:nowrap;font-size:clamp(.65rem,2.7vw,.78rem);}
body.pta-auth-theme .pta-login-block-ui__card{padding-inline:1.1rem;}
.pta-loading-edge{fill:none;stroke:#20c985;stroke-width:2.5;stroke-dasharray:16 84;stroke-linecap:round;filter:drop-shadow(0 0 2px #25bd80);}
.pta-login-block-ui.is-active .pta-loading-edge{animation:ptaLoadingEdge var(--pta-loading-cycle) linear infinite;}
.pta-login-block-ui.is-active .pta-loading-apps>rect:not(:first-child){animation:ptaLoadingTile var(--pta-loading-cycle) ease-in-out infinite;}
.pta-login-block-ui.is-active .pta-loading-apps>rect:nth-child(3){animation-delay:.1s;}
.pta-login-block-ui.is-active .pta-loading-apps>rect:nth-child(4){animation-delay:.2s;}
.pta-login-block-ui.is-active .pta-loading-apps>rect:nth-child(5){animation-delay:.3s;}
@keyframes ptaLoadingEdge{from{stroke-dashoffset:0}to{stroke-dashoffset:-100}}
@keyframes ptaLoadingTile{0%,50%,95%,100%{fill:transparent}70%,80%{fill:#65d9a5;stroke:#159e68}}

html.dark .pta-loading-edge{stroke:#75efbd;}