@use '../../scss/config.scss' as *;

.w-alert {
    @include border(primary-50);
    @include border-radius(md);
    @include spacing(p-md);
    @include layout(flex);

    &.col {
        @include layout(column);
    }

    &:not(.col) {
        @include layout(sm);
    }

    &.info {
        @include border(info);
        @include typography(info);
    }

    &.success {
        @include border(success);
        @include typography(success);
    }

    &.warning {
        @include border(warning);
        @include typography(warning);
    }

    &.alert {
        @include border(alert);
        @include typography(alert);
    }

    svg {
        @include size(20px);
        min-width: 20px;
        margin-top: 2.5px;
    }

    .title {
        @include typography(lg, hmd);
        display: block;
    }

    .body {
        @include typography(primary-20, hmd);
    }
}
