@use '@angular/material' as mat;
@mixin search-input-mat($theme) {
  app-search-input {
    #search-bar,
    #search-options {
      background-color: map-get($theme, search-bar);
      border: 1px solid rgba(mat.get-color-from-palette(map-get($theme, foreground), text), 0.38);

      .mdc-list-item__end{
        display: none;
      }
    }

    #search #search-input::placeholder {
      color: map-get($theme, inactive-text);
    }

    #search #search-input {
      color: mat.get-color-from-palette(map-get($theme, foreground), text);
    }

    // #search-options{
    //     .option:hover, .option.selected{
    //         background-color: map-get($theme, active-selection);
    //     }
    // }

    .mat-mdc-list-item {
      height: 26px !important;
    }
    /* TODO(mdc-migration): The following rule targets internal classes of list that may no longer apply for the MDC version.*/
    .mat-list-item-content {
      padding: 0px !important;
    }
    /* TODO(mdc-migration): The following rule targets internal classes of list that may no longer apply for the MDC version.*/
    .mat-list-text {
      padding-right: 0px !important;
    }

    .icon-box {
      color: map-get($theme, flag-info);
    }
  }
}
