@font-face {
  font-family: 'Roboto-Condensed';
  src: url('../fonts/Roboto_Condensed/RobotoCondensed-Regular.ttf') format('truetype'),
    url('../fonts/Roboto_Condensed/RobotoCondensed-Light.ttf') format('truetype'),
    url('../fonts/Roboto_Condensed/RobotoCondensed-Bold.ttf') format('truetype');
}

.kc-login-page * {
  font-family: 'Roboto-Condensed', sans-serif;
  box-sizing: border-box;
}

.kc-login-page body {
  margin: 0;
  padding: 0;
}

.kc-login-page span,
.kc-login-page label,
.kc-login-page a,
.kc-login-page p {
  color: #033052;
}

.kc-login-div {
  display: flex;
  min-height: 100vh;
}

.kc-login-image-wrapper {
  flex-basis: 45%;
}

.kc-login-image {
  height: 100%;
  width: 100%;
  background-image: url('../img/eingabemaske-edbic.svg');
  background-size: cover;
  background-position-x: center;
}

.kc-form-section {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-basis: 55%;
}

.kc-header h1 {
  margin: 0 0 0.6rem;
  font-size: 1.875rem;
  font-weight: 700;
  color: #3a3952;
}

.kc-header span {
  display: inline-block;
  margin-bottom: 2.2rem;
  color: #656666;
}

#kc-form-login {
  width: 430px;
}

#kc-form-login label {
  display: inline-block;
  margin-bottom: 0.5rem;
  font-size: 1rem;
  font-weight: 700;
}

#kc-form-login .kc-remember-me label {
  font-weight: 400;
}

#kc-form-login .kc-remember-me {
  margin-bottom: 1.6rem;
}

#kc-form-login .kc-remember-me input {
  vertical-align: -1px;
  accent-color: #3a3952;
}

#username {
  margin-bottom: 2.25rem;
}

#username,
#password {
  width: 100%;
  padding: 0.6rem 0.5rem;
  border: 1px solid #cbcccc;
  border-radius: 5px;
  background-color: #ffffff;
}

#username::placeholder,
#password::placeholder {
  font-size: 1rem;
  color: #989999;
}

.kc-password-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.5rem;
}

#kc-form-login .kc-password-actions label {
  margin-bottom: 0;
}

.kc-password-actions a {
  text-decoration: none;
}

.kc-password-field {
  position: relative;
  margin-bottom: 1.6rem;
}

.kc-show-password {
  cursor: pointer;
  position: absolute;
  top: 50%;
  right: 0.5rem;
  height: 15px;
  width: 22px;
  border: none;
  background-color: transparent;
  background-image: url('../img/black_eye.svg');
  background-size: cover;
  transform: translateY(-50%);
}

.kc-show-password.kc-show-password--selected {
  height: 18px;
  background-image: url('../img/black_eye-off.svg');
}

#kc-login {
  cursor: pointer;
  height: 50px;
  width: 100%;
  border: none;
  outline: none;
  border-radius: 5px;
  font-size: 1rem;
  color: #ffffff;
  background-color: #054d84;
}

#kc-login:disabled {
  background-color: #e3e3e3;
  color: #88898a;
  cursor: default;
}

.kc-login__main-footer .pf-v5-c-login__main-footer-band {
  display: flex;
  justify-content: center;
  padding: 0.5rem 0 0 0; /* Reduced padding, especially at the bottom */
  margin-bottom: 0; /* Removed bottom margin */
}

.kc-login__main-footer .pf-v5-c-login__main-footer-band-item {
  color: #6a6e73;
  font-size: 0.875rem;
  margin: 0 0 0.25rem 0; /* Small bottom margin only */
  text-align: center;
}

.kc-login__main-footer #kc-social-providers .pf-v5-c-login__main-footer-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  list-style: none;
  margin: 0.25rem 0 0 0; /* Small top margin only */
  padding: 0;
}

.kc-login__main-footer .pf-v5-c-login__main-footer-links-item {
  margin: 0.5rem;
}

.kc-login__main-footer .pf-v5-c-login__main-footer-links-item-link {
  display: flex;
  align-items: center;
  padding: 0.5rem 1rem;
  border-radius: 4px;
  text-decoration: none;
  color: #151515;
  background-color: #f0f0f0;
  transition: background-color 0.2s;
}

.kc-login__main-footer .pf-v5-c-login__main-footer-links-item-link:hover {
  background-color: #e0e0e0;
}

.kc-login__main-footer .pf-v5-c-login__main-footer-links-item-link svg {
  width: 1rem;
  height: 1rem;
  margin-right: 0.5rem;
  fill: currentColor;
}

.kc-login__main-footer .pf-v5-c-login__main-footer-band {
  display: flex;
  justify-content: center;
  padding: 0.5rem 0 0 0; /* Reduced padding, especially at the bottom */
  margin-bottom: 0; /* Removed bottom margin */
}

.kc-login__main-footer .pf-v5-c-login__main-footer-band-item {
  color: #6a6e73;
  font-size: 0.875rem;
  margin: 0 0 0.25rem 0; /* Small bottom margin only */
  text-align: center;
}

.kc-login__main-footer #kc-social-providers .pf-v5-c-login__main-footer-links {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  list-style: none;
  margin: 0.25rem 0 0 0; /* Small top margin only */
  padding: 0;
}

.kc-login__main-footer .pf-v5-c-login__main-footer-links-item {
  margin: 0.5rem;
}

.kc-login__main-footer .pf-v5-c-login__main-footer-links-item-link {
  display: flex;
  align-items: center;
  padding: 0.5rem 1rem;
  border-radius: 4px;
  text-decoration: none;
  color: #151515;
  background-color: #f0f0f0;
  transition: background-color 0.2s;
}

.kc-login__main-footer .pf-v5-c-login__main-footer-links-item-link:hover {
  background-color: #e0e0e0;
}

.kc-login__main-footer .pf-v5-c-login__main-footer-links-item-link svg {
  width: 1rem;
  height: 1rem;
  margin-right: 0.5rem;
  fill: currentColor;
}

.kc-form-section-footer {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  height: 60px;
  padding: 1rem 2rem;
  background-color: #f7f9fa;
}

.footer-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

#compacer-logo {
  height: 1.08em;
  width: auto;
  vertical-align: text-bottom;
  margin-top: 0.1em;
  display: inline-block;
}

.kc-form-section-footer span {
  display: inline-block;
  font-size: 0.9rem;
  color: #525559;
  margin-bottom: 0.125em;
}

.kc-alert-wrapper {
  min-width: 21rem;
  background-color: #fff;
  position: fixed;
  bottom: 0.75rem;
  right: 0.75rem;
  transform: translateX(0);
  animation-name: alert-fade-out;
  animation-duration: 5s;
}

.kc-alert-bar {
  display: flex;
  align-items: center;
  padding: 0.4rem 1rem;
  border-radius: 5px;
  border: 1px solid #ce4141;
  background: #ce414126;
  line-height: 1.43;
  letter-spacing: 0.01071em;
}

.kc-alert-bar p {
  padding: 0.5rem 0.9rem;
  margin: 0;
  font-size: 0.875rem;
  color: #ce4141;
}

.kc-alert-icon {
  display: flex;
  align-items: center;
  background-repeat: no-repeat;
  width: 1.4rem;
  color: #ce4141;
}

.kc-alert-icon svg {
  fill: #ce4141;
}

.kc-alert-icon svg path {
  fill: #ce4141;
}

@keyframes alert-fade-out {
  0% {
    transform: translateX(calc(100% + 0.75rem));
  }
  10% {
    transform: translateX(0);
  }
  80% {
    opacity: 1;
    transform: translateX(0) translateY(0);
  }
  100% {
    opacity: 0;
    transform: translateX(0) translateY(-40px);
  }
}
