/*
 * 2. Cards and containers
 * All elements that are supposed to contain other stuff
 *
 *
*/

$card-bigpad: $lineheight;
$card-smallpad: $lineheight_half;

@mixin card-color($background-color) {
    & .card-header, & .menu-header {
        @include colorize-shape($background-color);
        color:getTextColorFromBackground($background-color);
    }
}

.card {
    @include panel($card-bigpad);
    display: flex;
    flex-direction: column;

    &-body {
        padding:0!important;
    }

    &-header {
        @include panel-header($card-bigpad);
        .fa {
          margin-right: 0.5em;
        }
    }
}

/* CARD LIST - Make a list part of a card */


@mixin list-symbol($symbol) {
    li.list-element {
        list-style: none;
        &::before {
            font-family: "ForkAwesome";
            content:$symbol;
            padding-right:$lineheight_half;
        }
    }
}

@mixin list-color($color) {
    li.list-element {
        &::before {
            color: $color;
        }
    }
}

ul.card-list, .card > ul {
    padding:0;
    margin:0;
    li.list-element {
        line-height:$lineheight;
        padding-right:$lineheight_half;
        padding-left:$lineheight_quarter;
        padding-top:$lineheight_quarter;
        padding-bottom:$lineheight_quarter;
        margin:0;
    }
}

.list {
    &-check {@include list-symbol("\f00c");}
    &-cross {@include list-symbol("\f00d");}

    &-danger{@include list-color($color-danger);}
    &-success{@include list-color($color-success);}
}

.smallcard {
    &-header {
        @include panel-header($card-bigpad);
    }
}

/* COLORIZE CARDS and TOASTS */

.card, .smallcard {
    @each $name, $color in list-colors() {
        &-#{$name} { @include card-color(get-color($name)); }
    }
}