.x-card-info {
  @extend .d-flex,
          .py-3,
          .px-4,
          .py-md-3,
          .py-xl-4,
          .px-md-3,
          .px-xl-4;

  .x-card-thumbnail {
    width: 3rem;

    @include media-breakpoint-up(md) {
      width: 4rem;
    }

    @include media-breakpoint-up(lg) {
      width: 4.5rem;
    }
  }
}

.x-card-info-content {
  @extend .pl-4,
          .flex-1;
  h6 {
    @extend .text-primary-darker;
    font-weight: $font-weight-medium;
    .x-card-primary & { @extend .text-success; }
    .x-card-secondary & { @extend .text-secondary; }
    .x-card-tertiary & { @extend .text-helper-default; }
  }

  p {
    @extend .mb-0;
    font-size: $small-font-size;

    .x-aside-dark & {
      @extend .text-light;
    }
  }
}