.x-list-group-content {
  @extend .list-group,
          .list-group-flush;

  .list-group-item {
    @extend .list-group-item-action;

    .x-list-group-item-header,
    .x-list-group-item-content {
      @extend .d-flex,
              .align-items-center,
              .w-100;
    }

    .x-list-group-item-header {
      @extend .text-info,
              .justify-content-between;
      label {
        @extend %font-size-xs,
                .mb-0;
      }
      .x-icon-container {
        @extend .x-icon-lg,
                .text-info,
                .is-clickable;

        @include hover-focus-active {
          @extend %cursor-pointer,
                  .text-primary;

        }
      }
    }

    .x-list-group-item-content {
      > * {
        @extend .d-flex,
                .flex-auto;
      }

      .x-icon-container {
        @extend %cursor-pointer,
                .align-self-center;
        @include hover-focus-active { }
      }

      .x-list-group-content-action {
        @extend .d-flex;
        @include invisible(hidden);

        a {
          @extend .text-capitalize,
                  .text-center;
        }
      }
    }

    @include hover-focus-active {
      @extend %cursor-pointer;

      a {
        color: theme-color("primary-lighter");
        @include x-hover-focus-active {
          color: theme-color("secondary-darker");
        }
      }

      .x-list-group-content-action {
        @include invisible(visible);
      }
    }
  }
}