
.alert {
    border:none;
    .alert-heading {
    }
    p {
        margin-bottom: 0;
    }
    button.close {
        padding: .75rem;
        line-height: .75;
    }
    .alert-heading {
        margin-left: .4rem;
        & + p {
            margin-left: .4rem;
        }
    }
}
.alert-dark .btn-close{
    filter: $btn-close-white-filter;
}
.alert-secondary .btn-close,
.alert-light .btn-close{
    @if($dark-mode == true) {
        filter: unset;
    }
}
@each $key, $value in $alert-colors {
    .alert-#{$key} {
        background-color: map-get($value, 'background-color');
        color: map-get($value, 'text-color');
        
        a {
            color: #fff;
            font-weight: bold;
        }
    }
}
@each $key, $value in $theme-colors-light {
    .alert-light-#{$key} {
        @if($dark-mode == true) {
            background-color: lighten(saturate($value,2%),20%);
            color: saturate(shade-color($value, 60%), 40%);
            border: 1px solid tint-color($value, 30%);
        }
        @else {
            background-color: saturate($value,10%);
            color: saturate(shade-color($value, 60%), 40%);
            border: 1px solid darken($value, 3%);
        }
    }
}
