// Alerts
//
// Default styles for alerts.
//
// Markup: alerts.twig
//
// .alert-info      - info alert
// .alert-success   - success alert
// .alert-warning   - warning alert
// .alert-error     - error alert
//
// Styleguide: Elements.Alerts
/:root
    --alert-color: var(--color-fade)
    --alert-text-color: var(--color-base)

.alert
    margin 0
    padding 1em
    border-radius .3em
    background-color var(--alert-color)
    color var(--alert-text-color)

    a
        text-decoration underline

        &:hover
            text-decoration none

    &-info
    &-success
    &-warning
    &-error
        a
            color currentColor

    &-info
        // TODO : replace when we drop support of IE
        // --alert-color: s('hsl(var(--color-info-h), 60%, 90%)')
        // --alert-text-color: var(--color-info)
        // IE support for colors : replace when we drop support of IE
        background-color s('hsl(var(--color-info-h), 60%, 90%)')
        color var(--color-info)

    &-success
        // TODO : replace when we drop support of IE
        // --alert-color: s('hsl(var(--color-success-h), 60%, 90%)')
        // --alert-text-color: var(--color-success)
        // IE support for colors : replace when we drop support of IE
        background-color s('hsl(var(--color-success-h), 60%, 90%)')
        color var(--color-success)

    &-warning
        // TODO : replace when we drop support of IE
        // --alert-color: s('hsl(var(--color-warning-h), 60%, 90%)')
        // --alert-text-color: var(--color-warning)
        // IE support for colors : replace when we drop support of IE
        background-color s('hsl(var(--color-warning-h), 60%, 90%)')
        color var(--color-warning)

    &-error
        // TODO : replace when we drop support of IE
        // --alert-color: s('hsl(var(--color-error-h), 60%, 90%)')
        // --alert-text-color: var(--color-error)
        // IE support for colors : replace when we drop support of IE
        background-color s('hsl(var(--color-error-h), 60%, 90%)')
        color var(--color-error)

