.unit-filter {
  width: 100%;
  color: $ui-text;

  .col-xs-6 {
    padding: 0 0 $gap;

    &:nth-child(even) {
      padding-left: $gap/2;
    }

    &:nth-child(odd) {
      padding-right: $gap/2;
    }
  }

  & &__filter {
    background: $ui-disabled;
    padding: $gap;
    display: flex;
    align-items: center;
    cursor: pointer;

    &:active {
      background: darken($ui-disabled, 10%);
    }

    &-icon {
      padding-right: $gap;
      font-size: 24px;
      line-height: 24px;

      img {
        height: 30px;
      }
    }


    &.active {
      background: $ui-enabled;

      &:active {
        background: darken($ui-enabled, 10%);
      }
    }
  }
}

.unit-filter {
  width: 100%;
  color: $ui-text;

  .col-xs-6 {
    padding: 0 0 $gap;

    &:nth-child(even) {
      padding-left: $gap/2;
    }

    &:nth-child(odd) {
      padding-right: $gap/2;
    }
  }

  & &__filter {
    background: $ui-disabled;
    padding: $gap;
    display: flex;
    align-items: center;
    cursor: pointer;

    &:active {
      background: darken($ui-disabled, 10%);
    }

    &:hover {
      background: #036ea4;
    }

    &-icon {
      padding-right: $gap;
      font-size: 24px;
      line-height: 24px;

      img {
        height: 30px;
      }
    }


    &.active {
      background: $ui-enabled;

      &:active {
        background: darken($ui-enabled, 10%);
      }

      &:hover {
        background: #036ea4;
      }
    }
  }
}

Add hover to filter buttons
Add hover to filter buttons
