@import '../../../core/src/style/variables';

.BomFilter {
  display: inline;
  float: left;
  width: calc(30% - 5px);
  &.matched {
    @media screen and (min-width: 531px) {
      // ! Sync with filter-item.component.scss > .matched-filters @media styles
      width: calc(70% - 5px);
    }
  }
  &.manufacturers {
    width: calc(50% - 5px);
  }
  @media (min-width: $tablet-breakpoint) {
    margin-right: 10px;

    &:nth-child(2) {
      margin-right: 0;
    }
  }
  @media (max-width: $phablet-breakpoint) {
    width: 100%;
  }
}