.card {
    //rui card variables
    --#{$prefix}card-spacer-y: #{$card-spacer-y};
    --#{$prefix}card-title-spacer-y: #{$card-title-spacer-y};
    --#{$prefix}card-spacer-x: #{$card-spacer-x};
    --#{$prefix}card-height: #{$card-height};
    --#{$prefix}card-border-width: #{$card-border-width};
    --#{$prefix}card-bg: #{$card-bg};
    --#{$prefix}card-cap-bg: #{$card-cap-bg};
    --#{$prefix}card-box-shadow: #{$card-box-shadow};
    --#{$prefix}card-border-color: #{$card-border-color};
    --#{$prefix}card-border-radius: #{$card-border-radius};
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    height: var(--#{$prefix}card-height);
    word-wrap: break-word;
    background-color: var(--#{$prefix}card-bg);
    background-clip: border-box;
    border: var(--#{$prefix}card-border-width) solid var(--#{$prefix}card-border-color);
    border-radius: var(--#{$prefix}card-border-radius);
}

.card-body {
    flex: 1 1 auto;
    padding: var(--rui-card-spacer-y) var(--rui-card-spacer-x);
    color: var(--rui-card-color);
}

.card-title {
    margin-bottom: var(--rui-card-title-spacer-y);
}

.card-header:first-child {
    border-radius: calc(0.375rem - 1px) calc(0.375rem - 1px) 0 0;
}

.card-header {
    padding: 0.5rem 1rem;
    margin-bottom: 0;
    //color: var(--bs-card-cap-color);
    background-color: var(--rui-card-cap-bg);
    border-bottom: var(--rui-card-border-width) solid var(--rui-card-border-color);
}