// Card

// Backport Bootstrap 4 card-columns
.card-columns {
  .card {
    margin-bottom: $card-spacer-y;
  }

  @include media-breakpoint-up(sm) {
    column-count: 3;
    column-gap: 1.25rem;
    orphans: 1;
    widows: 1;

    .card {
      display: inline-block; // Don't let them vertically span multiple columns
      width: 100%; // Don't let their width change
    }
  }
}

.content {
  .card {
    background: var(--card-body-bg);
    box-shadow: var(--atum-box-shadow);
  }

  .card-header {
    display: flex;
    align-items: center;
    padding: 1rem 1rem .75rem;
    font-weight: $font-weight-bold;
    color: var(--card-header-color);
    background-color: var(--card-bg);

    a {
      font-weight: normal;
    }

    > [class^="icon-"],
    > img {
      margin-inline-end: .5rem;
    }
  }
}