// Backdrops
// ---------
@mixin fhi-backdrop {
  background-color: #000000;
  opacity: 0.6;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1040;
}
.fhi-backdrop-default {
  @include fhi-backdrop;
}
.fhi-backdrop-responsive {
  @include fhi-backdrop;
}

@include media-breakpoint-up(xl) {
  .fhi-backdrop-responsive {
      display: none;
  }
}
// Backdrops end



// Color utilities
// ---------------
.text-error {
  color: $fhi-core-red-2 !important;
}

.fhi-text {
  &-ancillary,
  &-placeholder {
      color: $fhi-text-ancillary;
      &-inverse {
          color: $fhi-text-ancillary-inverse;
      }
  }
  &-disabled {
      color: $fhi-core-grey-3;
      &-inverse {
          color: $fhi-disabled-color-inverse;
      }
  }
  &-error {
      color: $danger;
      &-inverse {
          color: $fhi-text-error-inverse;
      }
  }
}
// Color utilities end



// Focus
// -----
*:focus {
  box-shadow: none !important;
  outline: none;
}

*:focus-visible {
  box-shadow: $input-focus-box-shadow !important;

  .bg-dark & {
      box-shadow: 0 0 0 2px $fhi-core-white !important;
  }
}
// Focus end