@import "./fonts.css";

:root {
  --borderColor: rgba(0, 0, 0, 0.38);
  --primaryColor: #00c999;
  --primaryHoverColor: #03e2ae;
  --buttonTextColor: #031c1c;
  --buttonDisabledColor: #999;
  --buttonDisabledBackgroundColor: #f0f0f0;
}

.login-pf body {
  background: #fafafa;
}

#kc-header-wrapper {
  color: black;
}

/* logo */

#kc-header-wrapper img {
  max-width: 150px;
  vertical-align: top;
}

.card-pf {
  border-color: var(--primaryColor);
  font-size: large;
}

/* button */

.pf-c-button.pf-m-primary {
  color: var(--buttonTextColor);
  background-color: var(--primaryColor);
  font-size: 1.1rem;
  font-weight: 600;
}
.pf-c-button.pf-m-primary:hover {
  background-color: var(--primaryHoverColor);
}
.pf-c-button:disabled {
  color: var(--buttonDisabledColor);
  background-color: var(--buttonDisabledBackgroundColor);
}

/* input text */

.pf-c-form-control {
  --pf-c-form-control--BorderBottomColor: var(--borderColor);
  --pf-c-form-control--BorderTopColor: var(--borderColor);
  --pf-c-form-control--BorderLeftColor: var(--borderColor);
  --pf-c-form-control--BorderRightColor: var(--borderColor);
}
.pf-c-form-control:hover,
.pf-c-form-control:focus {
  --pf-c-form-control--BorderBottomColor: var(--borderColor);
  --pf-c-form-control--BorderTopColor: var(--borderColor);
  --pf-c-form-control--BorderLeftColor: var(--borderColor);
  --pf-c-form-control--BorderRightColor: var(--borderColor);
  border-bottom-width: 1px;
}
.pf-c-form-control:focus-visible {
  outline: none;
}

/* password icon */
.pf-c-button.pf-m-control,
.pf-c-button.pf-m-control:hover {
  --pf-c-button--after--BorderColor: var(--borderColor) var(--borderColor)
    var(--borderColor) var(--borderColor);
  --pf-c-button--m-control--after--BorderBottomColor: var(--borderColor);
}

/* link */
a {
  color: var(--primaryColor);
}
a:hover,
a:focus,
.login-pf a:hover,
.login-pf a:focus {
  color: var(--primaryHoverColor);
  outline: none;
}

/* register link */
#kc-registration {
  font-size: medium;
}

/* migration-notice */

#migration-notice {
  background-color: #f0f0f0;
  color: #000;
  padding: 10px;
  margin: 10px 0;
  border-radius: 2px;
  font-size: 1.1rem;
  border: 1px solid red;
}

#migration-notice p span {
  color: red;
  font-weight: 600;
}

#migration-notice p a {
  color: #666;
  font-weight: 600;
}

/* register */

.login-pf-header .subtitle {
  margin-top: 0;
}

.login-pf-header .col-md-10 {
  width: 100%;
}