#login-container-card .form-container {
  display: flex;
  flex-direction: column;
  flex: 1;
  align-items: stretch;
  justify-content: center;
}

#login-check-consent {
  color: #23282E;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
}

#login-container-card #reboot_message {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  color: #596069;
  text-align: center;
  font-family: Inter, sans-serif;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: 24px;
}

#login-container-card .form-section {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 24px;
}

#form-title {
  color: #373C42;
  font-family: 'Sharp Sans', sans-serif;
  font-size: 24px;
  font-style: normal;
  font-weight: 700;
  margin: 0;
}

#loginForm, #tacuser_container {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.login-form-field-container {
  display: flex;
  flex-direction: column;
  gap: 4px;
  color: #23282E;
  flex: 1;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
}

.login-form-field-container input {
  border-radius: 6px;
  height: 34px;
  border: 2px solid #889099;
  background: #FFFFFF;
  padding: 10px 6px;
}

.login-form-field-container > .input-container {
  border-radius: 6px;
  height: 34px;
  border: 2px solid #889099;
  background: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.login-form-field-container > .input-container input {
  flex: 1;
  border: none;
}

.login-form-field-container > .input-container > .input-suffix {
  display: flex;
  align-items: center;
  padding: 6px;
}

.login-form-field-container > .input-container > .input-suffix .input-suffix-icon {
  width: 22px;
  height: 22px;
  cursor: pointer;
}

.login-form-field-container > .input-container > .input-suffix .input-suffix-button-container {
  color: #1D69CC;
  font-family: Inter, sans-serif;
  font-weight: 700;
  font-size: 12px;
  line-height: 18px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0 4px;
}

.login-form-field-container > .input-container > .input-suffix .input-suffix-button-container:hover {
  color: #1D69CC;
  background-color: #CCE1FF;
  border-radius: 6px;
}

.login-form-field-container > .input-container > .input-suffix .input-suffix-button-container:hover svg.input-suffix-icon path {
  fill: #1D69CC;
}

.login-form-field-container > .input-container:focus-within,
.login-form-field-container > .input-container:hover,
.login-form-field-container > input:hover {
  border: 2px solid #7CADF7;
  box-shadow: 0 0 0 2px #7CADF7;
}

.login-form-field-container > .input-container:focus-within,
.login-form-field-container > input:focus-within {
  outline: #7CADF7 solid 2px;
  outline-offset: 2px;
}

.login-form-field-container > .input-container input:focus {
  outline: none;
}
.login-form-field-container > .input-container input:focus-visible {
  outline: none;
}

.login-button {
  background: #1D69CC;
  border: none;
  border-radius: 6px;
  padding: 7px 12px;
  color: #FFFFFF;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
}

#error-info {
  display: flex;
  gap: 8px;
  color: #23282E;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  border-radius: 6px;
  background: #FFE8E9;
  padding: 12px 16px;
}

#errorMessageBox {
  font-weight: 700;
  /* For alignment with the icon */
  line-height: 24px;
}

#error-info ul {
  padding-left: 20px;
}

#errorInfoIcon img {
  width: 24px;
  height: 24px;
}

#login-check-wrap .login-check-row {
  display: flex;
  gap: 8px;
  color: #23282E;
  font-family: Inter, sans-serif;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
}

#error-info-container,
.errorDetails,
#login-check-wrap,
#login-check-consent,
.hidden,
#loginBtn,
#frm_password,
#tacuser_container {
  display: none;
}