/* ####################################
   Alert Boxes

   - Critical Rendering Path: Recommended
   - Note: The default colours delivered with the CMS white site are "AAA" accessibility compliant.
   ################################## */

.alert-box {
    position: relative;
    clear: left;
    box-sizing: border-box;
    width: 100%;
    margin-bottom: var(--site-box-margin-bottom);
    padding: var(--site-padding);
    border-width: 0;
    border-style: solid;
    border-radius: var(--site-box-border-radius);
}

    .alert-box a:link {
    }

    .alert-box a:visited {
    }

    .alert-box h1,
    .alert-box h2,
    .alert-box h3,
    .alert-box h4,
    .alert-box p,
    .alert-box ul,
    .alert-box ol {
        margin: 0 0 var(--site-margin-thin);
    }

    .alert-box > h1:first-child,
    .alert-box > h2:first-child,
    .alert-box > h3:first-child,
    .alert-box > h4:first-child {
        box-sizing: border-box;
        font-size: var(--site-font-size-bigger);
        font-weight: bold;
        margin: 0 0 calc(var(--site-box-margin-bottom) * 0.5);
        padding-bottom: 0;
        border: none;
        background: none;
    }

    .alert-box > ul li,
    .alert-box > ol li {
        margin: var(--site-margin-thinnest) 0 !important;
    }

    .alert-box > :first-child {
        margin-top: 0 !important;
    }

    .alert-box > :last-child {
        margin-bottom: 0 !important;
    }

.alert-information {
    color: #0c5460;
    background: #D4EFF2;
    border-color: #bee5eb;
}

    .alert-information h1:first-child,
    .alert-information h2:first-child,
    .alert-information h3:first-child,
    .alert-information h4:first-child {
        color: #0c5460;
    }

.alert-success {
    color: #165A26;
    background: #E0F1E4;
    border-color: #c3e6cb;
}

    .alert-success h1:first-child,
    .alert-success h2:first-child,
    .alert-success h3:first-child,
    .alert-success h4:first-child {
        color: #165A26;
    }

.alert-warning {
    color: #684018;
    background: #FFF7E0;
    border-color: #fff0da;
}

    .alert-warning h1:first-child,
    .alert-warning h2:first-child,
    .alert-warning h3:first-child,
    .alert-warning h4:first-child {
        color: #684018;
    }

.alert-error {
    color: #721c24;
    background: #FAE0E2;
    border-color: #F9D7D8;
}

    .alert-error h1:first-child,
    .alert-error h2:first-child,
    .alert-error h3:first-child,
    .alert-error h4:first-child {
        color: #721c24;
    }

.alert-inline {
    display: inline-block;
}