:root { --pf-v5-global--primary-color--100:#D3261B; --pf-v5-global--primary-color--200:#B3211A; --pf-v5-global--link--Color:#B3211A; }
body { background:#F5F4F2; color:#232326; font-family:"Nunito Sans","Segoe UI",sans-serif; }
.pf-v5-c-login { background:#F5F4F2; min-height:100vh; }
.pf-v5-c-login__container { max-width:480px; width:calc(100% - 32px); margin:auto; padding:32px 0; }
.pf-v5-c-login__main { background:#fff; border-radius:20px; overflow:hidden; border-top:6px solid #EF4337; box-shadow:0 12px 38px #23232610; }
#kc-header-wrapper { width:160px; height:60px; margin:0 auto 18px; overflow:hidden; text-indent:-9999px; background:url('../img/homeserve.svg') center/contain no-repeat; }
#kc-page-title { font-size:28px; font-weight:800; line-height:1.2; color:#232326; }
.pf-v5-c-form-control { border-radius:10px; min-height:48px; }
.pf-v5-c-form-control:after { border-radius:10px; }
#kc-login { background:#D3261B; color:#fff; min-height:52px; border:0; border-radius:12px; font-weight:800; }
a { color:#B3211A; }
.hs-auth-footer { padding:4px 28px 24px; text-align:center; color:#5C5C62; font-size:14px; }
.hs-auth-footer p { margin:8px 0; }

/* A single, quiet outline around the password and its visibility control. */
.pf-v5-c-input-group:has(#password) {
  display:flex; align-items:stretch; border:1px solid #E4E2DE;
  border-radius:12px; background:#fff; overflow:hidden;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.pf-v5-c-input-group:has(#password):focus-within {
  border-color:#EF4337; box-shadow:0 0 0 3px #EF43371A;
}
.pf-v5-c-input-group:has(#password) .pf-v5-c-form-control {
  border:0; border-radius:0; background:transparent; box-shadow:none;
}
.pf-v5-c-input-group:has(#password) .pf-v5-c-form-control::before,
.pf-v5-c-input-group:has(#password) .pf-v5-c-form-control::after,
.pf-v5-c-input-group:has(#password) .pf-v5-c-button::after {
  border:0; box-shadow:none;
}
#password { border:0; background:transparent; min-height:48px; padding:12px 14px; }
#password:focus { outline:none; box-shadow:none; }
.pf-v5-c-input-group:has(#password) .pf-v5-c-button {
  border:0; border-radius:0; min-width:48px; background:transparent; color:#5C5C62;
}
.pf-v5-c-input-group:has(#password) .pf-v5-c-button:hover { background:#FAF9F7; color:#B3211A; }
.pf-v5-c-input-group:has(#password) .pf-v5-c-button:focus-visible { outline:2px solid #EF4337; outline-offset:-5px; }
#password::-ms-reveal, #password::-ms-clear { display:none; }

/* Match the username field to the password and retain only the brand accent. */
.pf-v5-c-login__main::before { display:none; }
.pf-v5-c-form-control:has(> #username) {
  display:block; border:1px solid #E4E2DE; border-radius:12px;
  background:#fff; box-shadow:none; transition:border-color .15s ease, box-shadow .15s ease;
}
.pf-v5-c-form-control:has(> #username)::before,
.pf-v5-c-form-control:has(> #username)::after { border:0; box-shadow:none; }
.pf-v5-c-form-control:has(> #username):focus-within {
  border-color:#EF4337; box-shadow:0 0 0 3px #EF43371A;
}
#username { border:0; border-radius:inherit; background:transparent; min-height:48px; padding:12px 14px; }
#username:focus { outline:none; box-shadow:none; }
.pf-v5-c-form-control:has(> #username[aria-invalid=true]),
.pf-v5-c-input-group:has(#password[aria-invalid=true]) { border-color:#D3261B; }

/* PatternFly also draws its accent on the header in Keycloak26. */
.pf-v5-c-login__main-header { border-top:0; }