ujh/fountainpencompanion

@import "font-awesome";

@import "jquery-ui/core";
@import "jquery-ui/theme";
@import "jquery-ui/autocomplete";
@import "jquery-ui/menu";
@import "jquery-ui/datepicker";

@import "select2";

.select2-dropdown,
.select2-container--default .select2-selection--single,
.select2-container--default
  .select2-results__option[aria-selected="true"]:not(
    .select2-results__option--highlighted
  ) {
  background-color: var(--bs-body-bg);
  border-color: var(--bs-border-color);
  color: var(--fpc-text-color);
}

.select2-container--default
  .select2-results__option--highlighted[aria-selected] {
  background-color: var(--bs-primary);
  border-color: var(--bs-primary-border-subtle);
  color: #fff;
}

.select2-container--default
  .select2-selection--single
  .select2-selection__rendered {
  color: var(--fpc-text-color);
}

.ui-autocomplete {
  max-height: 200px;
  overflow-y: auto;
  overflow-x: hidden;
  color: var(--fpc-text-color);
  background-color: var(--fpc-bright-background);
}

.ui-widget {
  &.ui-widget-content,
  &-content {
    background-color: var(--fpc-background);
    border: 1px solid var(--bs-border-color);
    color: var(--fpc-text-color);

    .ui-state-default {
      background-color: var(--fpc-bright-background);
      border-color: var(--bs-border-color);
      color: var(--fpc-text-color);
    }

    .ui-state-hover {
      background-color: var(--bs-primary-bg-subtle);
      border-color: var(--bs-primary-border-subtle);
      color: var(--fpc-text-color);
    }

    .ui-state-highlight {
      background-color: var(--bs-primary);
      border-color: var(--bs-primary-border-subtle);
      color: #fff;
    }
  }

  &-header {
    border: 1px solid var(--bs-border-color);
    background-color: var(--fpc-bright-background);
    color: var(--fpc-text-color);
  }
}