:host(us-list) {
  width: 100%;

  .list {
    position: absolute;
    top: auto;
    flex: 1;
    margin-top: 1px;
    width: 100%;
    min-width: 118px;
    box-sizing: border-box;
    background-color: var(--color-neutral-0);
    border-radius: var(--border-radius-m);
    box-shadow: var(--box-shadow-200);
    z-index: 4;

    &_display_none {
      display: none;
    }

    &.left {
      right: 0;
    }
    &.right {
      left: 0;
    }
    &.top {
      bottom: 100%;
    }
  }

  .list.simplebar-scrollable-y:hover,
  .list.simplebar-scrolling {
    padding-right: 14px;
  }

  .list-item {
    display: flex;
    align-items: center;
    box-sizing: border-box;
    width: 100%;
    cursor: pointer;
    appearance: none;
    background: var(--color-neutral-0);

    &:first-child {
      margin-top: var(--space-inline-m);
    }

    &:last-child {
      margin-bottom: var(--space-inline-m);
    }

    &:hover,
    &_active {
      border-color: var(--color-primary-100);
      background: var(--color-primary-100);
    }

    &__label {
      font: var(--text-p-m-light);
      padding: var(--space-inner-s) var(--space-inner-l);
      color: var(--color-neutral-1000);
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;

      &-with-img {
        display: flex;
        align-items: center;
      }

      &-text {
        font: inherit;
        color: inherit;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
      }
    }

    .reduce-left-padding-when-icon-exist {
      padding-left: var(--space-inner-m);
    }

    &__main-checkbox {
      position: relative;
      display: flex;
      margin-bottom: var(--space-inline-l);

      &::after {
        content: "";
        position: absolute;
        width: 100%;
        bottom: calc(var(--space-inner-s) * -1);
        border-bottom: 1px solid var(--color-neutral-300);
      }
    }

    &__logo {
      display: flex;
      margin-right: var(--space-inline-m);
      width: var(--size-m);
      height: var(--size-m);
    }

    &__checkbox {
      padding-left: var(--space-inner-xl);
    }

    &__checkbox {
      pointer-events: none;
    }

    &_disabled {
      pointer-events: none;
      .list-item__label {
        color: var(--color-neutral-700);
      }
    }

    &__icon {
      display: flex;
      padding-left: var(--space-inline-m);
    }
  }
}
