$suffix-align: var(--wds-card-header-suffix-align, flex-start);
$title-subtitle-gap: var(
  --wds-card-header-title-subtitle-gap,
  var(--wds-space-100)
);
$subtitle-font-size: var(
  --wds-card-subtitle-font-size,
  var(--wds-font-size-200)
);
$subtitle-line-height: var(
  --wds-card-subtitle-line-height,
  var(--wds-font-line-height-200)
);
$subtitle-color: var(--wds-card-subtitle-color, #44485f);

.card-header {
  &__suffix {
    align-items: $suffix-align;
    align-self: $suffix-align;
  }

  &__title-wrapper {
    gap: $title-subtitle-gap;
  }

  &#{&} &__title-wrapper &__subtitle {
    font-size: $subtitle-font-size;
    line-height: $subtitle-line-height;
    color: $subtitle-color;
  }
}