/* Alerts */

.alert {

    --alert-padding-y: 16px;
    --alert-padding-x: 20px;

    &.size-xs {
        --alert-padding-y: 12px;
        --alert-padding-x: 15px;
    }

    &.size-sm {
        --alert-padding-y: 16px;
        --alert-padding-x: 20px;
    }

    &.size-md {
        --alert-padding-y: 18px;
        --alert-padding-x: 22px;
    }

    &.size-lg {
        --alert-padding-y: 20px;
        --alert-padding-x: 25px;
    }

    &.size-xl {
        --alert-padding-y: 24px;
        --alert-padding-x: 28px;
    }


    --alert-color: var(--theme-alert-color, #000 );
    --alert-background-color: var(--theme-alert-background-color, transparent );
    --alert-border-color: var(--theme-alert-border-color, transparent );
    --alert-border-radius: var(--theme-alert-border-radius, 6px);
    --alert-border-width: var(--theme-alert-border-width, 1px);


    &.alert-info {
        --alert-color: var(--theme-alert-info-color, #000 );
        --alert-background-color: var(--theme-alert-info-background-color, transparent );
        --alert-border-color: var(--theme-alert-info-border-color, transparent );
    }

    &.alert-warning {
        --alert-color: var(--theme-alert-warning-color, #000 );
        --alert-background-color: var(--theme-alert-warning-background-color, transparent );
        --alert-border-color: var(--theme-alert-warning-border-color, transparent );
    }

    &.alert-positive,
    &.alert-success {
        --alert-color: var(--theme-alert-positive-color, #000 );
        --alert-background-color: var(--theme-alert-positive-background-color, transparent );
        --alert-border-color: var(--theme-alert-positive-border-color, transparent );
    }

    &.alert-negative,
    &.alert-danger {
        --alert-color: var(--theme-alert-negative-color, #000 );
        --alert-background-color: var(--theme-alert-negative-background-color, transparent );
        --alert-border-color: var(--theme-alert-negative-border-color, transparent );
    }






    display: block;
    position: relative;
    padding: var(--alert-padding-y, 16px) var(--alert-padding-x, 20px);
    background-color: var(--alert-background-color, transparent );
    border-color: var(--alert-border-color, transparent );
    color: var(--alert-color, #000 );


    &:not(.no-bottom) {
        margin-bottom: 20px;
    }

    &:not(.no-radius) {
        border-radius: var(--alert-border-radius, 6px);
    }

    &.semibold {
        font-weight: 400;
    }

    &.border {
        border: var(--alert-border-width, 1px) solid var(--alert-border-color, transparent );
    }

    &.shadow {
        box-shadow: 0 8px 12px var(--theme-shadow-color, rgba(152, 152, 152, .125));
    }

    &.alert-inline {
        display: inline-block;
    }

    &:not([class*="title-"]) {
        h1, h2, h3, h4, h5, h6 {
            font-size: var(--title-h6);
        }
    }

    h1, h2, h3, h4, h5, h6 {
        margin-bottom: 0;
        &:not(:last-child) {
            margin-bottom: 10px;
        }
    }

    ul, ol, p, iframe {
        margin-bottom: 0;
        &:not(:last-child) {
            margin-bottom: 8px;
        }
    }

    ul, ol {
        padding-left: 16px;
    }


    &:not(.no-underline) a:not(.button) {
        text-decoration: underline;
    }

}