@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700&display=swap");

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  height: 100%;
}

body {
  margin: 0;
  font-family: var(--original-font-family);
  font-size: var(--original-font-size-base);
  line-height: var(--original-line-height-base);
  color: var(--original-color-body);
  background: var(--original-color-surface-muted);
  -webkit-font-smoothing: antialiased;
}

a {
  color: inherit;
  text-decoration: none;
}

button {
  font-family: inherit;
}

.original-toast-host {
  z-index: var(--original-z-toast);
}

#originalConfirmModal,
#originalChangePasswordModal {
  z-index: var(--original-z-confirm);
}

.modal-backdrop ~ .modal-backdrop {
  z-index: var(--original-z-confirm-backdrop);
}

#originalChangePasswordModal .btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}

.field-validation-valid,
.field-validation:empty {
  display: none;
}

.field-validation-error {
  display: block;
  margin-top: 0.25rem;
  font-size: var(--original-font-size-sm);
  color: var(--original-color-danger);
  line-height: var(--original-line-height-tight);
}

.input-validation-error {
  border-color: var(--original-color-danger) !important;
}

.input-validation-error:focus {
  border-color: var(--original-color-danger) !important;
  box-shadow: 0 0 0 0.2rem rgba(185, 28, 28, 0.18);
}