.card-wrapper {
  $gap: 12px;
  margin: $gap var(--page-container-bleeding, 0);
  border-radius: $gap;
  box-shadow: inset 0px 0px $gap * 3 0px rgba(52, 167, 107, 0.38);

  .card-header {
    --td-cell-title-color: var(--primary-color);
    --td-loading-color: var(--primary-color);
    background-color: transparent;

    &__title {
      display: flex;
      flex-direction: row;
      align-items: center;

      .icon {
        margin-left: 8px;
        margin-top: 2px;
        height: 20px;
      }
    }

    .loading {
      margin-left: 8px;
    }
  }

  .card-body {
    padding: var(--td-cell-vertical-padding, 32rpx) var(--td-cell-horizontal-padding, 32rpx);
    background-color: transparent;

    .row+.row {
      margin-top: 8px;
    }
  }
}

.empty-wrapper {
  padding: 12px;
  --td-empty-description-color: #939393;
  --td-empty-description-line-height: var(--td-empty-description-font-size);
  &.error {
    --td-empty-icon-color: #FF611B;
  }
}

.extra-warapper {
  display: flex;
  flex-direction: row;
  align-items: center;
  font-size: 14px;
  color: var(--primary-color);
  .icon {
    margin-top: 2px;
  }
}