:host {
  display: block;
}

.filter-wrapper {
  display: flex;
}

.filter-nav {
  display: flex;
  flex-direction: column;
  width: 240px;

  .isa-btn {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
}

.filter-content {
  flex: 1 1 auto;
}

::ng-deep ui-filter-group,
::ng-deep [theme='customer'] ui-filter-group {
  ui-icon {
    @apply text-glitter;
  }

  .filter-nav .is-active {
    @apply bg-wild-blue-yonder;

    ui-icon {
      @apply text-black;
    }
  }
}

::ng-deep ui-filter-group[theme='filter'] {
  ui-icon {
    @apply text-wild-blue-yonder;
  }

  .filter-nav .is-active {
    @apply bg-cool-grey;

    ui-icon {
      @apply text-black;
    }
  }

  ui-checkbox.checked {
    @apply text-black;
    ui-icon {
      @apply text-ucla-blue;
    }
  }
}

::ng-deep [theme='branch'] ui-filter-group {
  ui-icon {
    @apply text-munsell;
  }

  .filter-nav .is-active {
    @apply bg-cool-grey;

    ui-icon {
      @apply text-black;
    }
  }
}
