.x-list-group-table {
  @extend .list-group,
          .list-group-flush;
}
.x-list-group-table-heading {
  @extend %font-size-xs,
          .text-center,
          .text-uppercase,
          .text-primary,
          .font-weight-bold,
          .bg-light-transparent;
}


.x-list-group-table-row {
  @extend .list-group-item,
          .d-flex,
          .justify-content-between,
          .p-0;

  > * {
    @extend .py-3,
            .px-2;
  }

  &:first-child {
    @extend .border-top-0;
  }

}

.x-list-group-table-label {
  @extend %font-size-xs,
          .text-left,
          .font-weight-bold,
          .d-flex,
          .align-items-center;
}

.x-list-group-table-value {
  @extend %font-size-xs,
          .text-right;

  .x-list-group-table-row & {
    @extend .bg-light-transparent;

  }
}

.x-list-group-table-footer {
  @extend .font-weight-bold,
          .d-flex,
          .align-items-center,
          .justify-content-between,
          .bg-secondary-transparent,
          .border-secondary;

  > * {
    @extend .py-3,
            .px-2;
  }

  border-top: 2px solid;

  .x-list-group-table-label {
    @extend .text-uppercase;
  }

  .x-list-group-table-value {
    @extend .text-right;
  }
}