@use 'sass:map';
@use '../../../mx-core/src/base/colors';
@use '../../../mx-core/src/base/opacity';

@mixin mx-select-search-theme($theme) {
  $is-dark: map.get($theme, is-dark);
  $color-theme: colors.$mx-light;

  @if $is-dark {
    $color-theme: colors.$mx-dark;
  }

  .mx-select-search__panel-content__content__option,
  .mx-select-search__panel-content__content__nested-option {
    .mat-pseudo-checkbox-full:not(.mat-pseudo-checkbox-checked) {
      border-color: map.get($color-theme, onSurface);
    }

    &.mat-mdc-option.mdc-list-item--selected:not(.mdc-list-item--disabled) .mdc-list-item__primary-text {
      color: map.get($color-theme, onSurface);
    }
  }

  .mx-select-search {
    &__panel-header {
      background-color: map.get($color-theme, surfaceContainer);
    }

    &__panel-content {
      &__filter-count {
        color: map.get($color-theme, onSurfaceVariant);
      }
    }

    &__panel-footer {
      background-color: map.get($color-theme, surfaceContainer);
      border-color: map.get($color-theme, outlineVariant);
      color: map.get($color-theme, onSurfaceVariant);
    }
  }
}
