// 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 {
    box-shadow: $atum-box-shadow;
  }

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

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

  @if $enable-dark-mode {
    @include color-mode(dark) {
      .card-header {
        color: var(--body-color);
        background-color: var(--body-bg);
      }
    }
  }
}