//
// Variables
// --------------------------------------------------
$cardpanel-header-background:       transparent !default;
$cardpanel-header-color:            inherit !default;
$cardpanel-border-color:            inherit !default;
$cardpanel-variants: () !default;
$cardpanel-variants: map-merge(
    (
        'primary': (
            'header-background':    $primary,
            'header-color':         color-contrast($primary),
            'border-color':         darken($primary, 10%),
        ),
        'secondary': (
            'header-background':    $secondary,
            'header-color':         color-contrast($secondary),
            'border-color':         darken($secondary, 10%),
        ),
        'tertiary': (
            'header-background':    $tertiary,
            'header-color':         color-contrast($tertiary),
            'border-color':         darken($tertiary, 10%),
        ),
        'quaternary': (
            'header-background':    $quaternary,
            'header-color':         color-contrast($quaternary),
            'border-color':         darken($quaternary, 10%),
        ),
        'lighter': (
            'header-background':    $lighter,
            'header-color':         color-contrast($lighter),
            'border-color':         darken($lighter, 10%),
        ),
        'light': (
            'header-background':    $light,
            'header-color':         color-contrast($light),
            'border-color':         darken($light, 10%),
        ),
        'dark': (
            'header-background':    $dark,
            'header-color':         color-contrast($dark),
            'border-color':         darken($dark, 10%),
        ),
        'darker': (
            'header-background':    $darker,
            'header-color':         color-contrast($darker),
            'border-color':         darken($darker, 10%),
        ),
        'default': (
            'header-background':    $default,
            'header-color':         color-contrast($default),
            'border-color':         darken($default, 10%),
        ),
        'success': (
            'header-background':    $success,
            'header-color':         color-contrast($success),
            'border-color':         darken($success, 10%),
        ),
        'info': (
            'header-background':    $info,
            'header-color':         color-contrast($info),
            'border-color':         darken($info, 10%),
        ),
        'warning': (
            'header-background':    $warning,
            'header-color':         color-contrast($warning),
            'border-color':         darken($warning, 10%),
        ),
        'danger': (
            'header-background':    $danger,
            'header-color':         color-contrast($danger),
            'border-color':         darken($danger, 10%),
        ),
    ),
    $cardpanel-variants
);

//
// CSS Variables
// --------------------------------------------------
:root {
    --cardpanel-header-background: #{$cardpanel-header-background};
    --cardpanel-header-color: #{$cardpanel-header-color};
    --cardpanel-border-color: #{$cardpanel-border-color};
}

//
// Card Panel
// --------------------------------------------------
.card-panel {
    border-color: var(--cardpanel-border-color);
    .card-header {
        background: var(--cardpanel-header-background);
        color: var(--cardpanel-header-color);
        font-size: 1rem !important;
        padding: $card-spacer-y $card-spacer-x;
    }
}
@each $name, $settings in $cardpanel-variants {
    $tmp-header-background: map-get($settings, 'header-background');
    $tmp-header-color: map-get($settings, 'header-color');
    $tmp-border-color: map-get($settings, 'border-color');
    .card-panel-#{$name} {
        @if ($tmp-header-background) {
            --cardpanel-header-background: #{$tmp-header-background};
        }
        @if ($tmp-header-color) {
            --cardpanel-header-color: #{$tmp-header-color};
        }
        @if ($tmp-border-color) {
            --cardpanel-border-color: #{$tmp-border-color};
        }
    }
}