.#{$card-prefix-cls} {
  background-color: $white;
  border-radius: $border-radius;

  &-header,
  &-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: nth($card-header-padding,1) nth($card-header-padding,2);

    &__extra {
      color: $gray-11;
    }
  }

  &-header {
    padding-bottom: nth($card-header-padding,1) -  nth($card-header-padding,2);

    &__title {
      font-size: $card-header-title-font-size;
      font-weight: 600;
      color: $gray-9;
    }
  }

  &-footer {
    border-top: 1px solid $gray-12;

    &__content {
      font-size: $card-footer-content-font-size;
      color: $gray-11;
    }

    &__extra {
      .aid-chevron-right {
        font-size: $list-arrow-font-size;
      }
    }
  }

  &-content {
    padding: nth($card-header-padding,2);
  }
}