/**
 * Flash
 * --
 * An alert shown at the top of the content to indicate the result of an action
 * from the previous page or form submission.
 */


.mh-flash {
    background: $color-alert url($manhattan-manage-asset-root + '/form-error-striping.png') top center repeat-x;
    padding: 12.5px 20px;
    position: relative;
    text-align: left;
    @include type(large, $color: #fff, $font-weight: 400);

    @include media-span($from: 0, $to: $mobile-width) {
        margin: -15px 0 15px !important;
    }

    @include media-mobile() {
        border-radius: $corner-radius;
        margin: 20px 0;
        text-align: center;
    }

    &:first-child { margin-top: 0; }
    &:last-child { margin-bottom: 0; }

    &--error {
        background-color: $color-alert-error;
    }

    &--warning {
        background-color: $color-alert-warning;
    }

    &--success {
        background-color: $color-alert-success;
    }

    &--has-close {
        padding-right: 40px;
    }

    &__close {
        cursor: pointer;
        display: block;
        height: 20px;
        margin-top: -10px;
        width: 20px;
        @include position(absolute, 50% 10px null null);

        &:before, &:after {
            background-color: #fff;
            content: '';
            display: block;
            height: 14px;
            margin: -7px 0 0 -2px;
            width: 4px;
            @include position(absolute, 50% null null 50%);
        }

        &:before {
            @include transform(rotate(45deg));
        }

        &:after {
            @include transform(rotate(-45deg));
        }
    }

    a {
        text-decoration: underline;
    }
}