@import "~bootstrap/scss/list-group";


.x-list-group-menu {
  @extend %px-3,
          %w-100;

  .is-narrow & {
    @extend %px-2;
  }

  // .x-aside-theme-dark & {
  //   @extend %x-theme-dark-aside-mobile;
  // }

  .list-group-item {
    @extend %d-flex,
            %border-0,
            %py-1,
            %py-md-2,
            %px-2,
            %my-1,
            %my-lg-1,
            %cursor-pointer,
            %align-items-center;
    @include border-radius($border-radius-lg);

    &-slim {
      @extend %d-flex,
              %align-items-center,
              %pl-0,
              %pr-0,
              %justify-content-center;
      max-width: 2.5rem;
    }

    .list-text,
    .x-icon-container {
      @extend %text-grey;
    }

    @include x-hover-focus-active() {
      @include custom-theme-color(primary, color);
      @include custom-theme-color(primary-transparent, background-color);

      .list-text,
      .x-icon-container {
        @include custom-theme-color(primary, color);
      }
    }

    &.x-list-item-action {
      .x-aside-theme-dark & {
        @include custom-theme-color(secondary, color);
      }
      .x-icon-container {
        .x-aside-theme-dark & {
          @include custom-theme-color(secondary, color);
        }
      }
    }

    .x-aside-theme-dark & {
      @extend %x-theme-dark-menu-item;
    }

    .x-avatar {
      @extend %mr-2;
    }

    .x-list-item-stacked {
      @extend %d-flex,
              %flex-column;

      .x-list-item-action {
        @include custom-theme-color(secondary, color);
        font-size: $font-size-sm;
      }
    }
  }
}