.x-card-contact {
  @extend .d-flex;
}

.x-card-contact-details {
  @extend .align-self-center,
          .flex-auto,
          .overflow-hidden,
          .ml-3;

  h6 {
    @extend .text-default,
            .d-flex,
            .align-items-center,
            .my-1;
    &:last-child {
      min-height: 2rem;
    }
  }
}
.x-card-contact-item {
  @extend %font-size-xs,
          .font-weight-bold,
          .d-flex,
          .mb-0,
          .align-items-center;

  .x-card-contact-item-icon {
    @extend .text-grey,
            .mr-2;

    .x-icon {
      @extend .x-icon-sm;
    }

    &:not(.d-flex) > * {
      top: 1px; // Make icon align to the first line
    }

  }
}

.x-card-contact-list {
  > * {
    @extend .d-block;
    &:not(:last-child) .x-card-contact-details {
      @extend .pb-3,
              .mb-3,
              .border-bottom;
    }
  }
}