.alert,
.alertLink{
    --alert-background: var(--var-bg-color);
    --alert-text-color: var(--var-text-color);

    position: relative;
    background: var(--var-bg-color);
    color: var(--var-text-color);
    @include space-many(var(--alert-spacing-vertical), var(--alert-spacing-horizontal), $name: "padding");
    border: 1px solid transparent;
    border-radius: var(--alert-border-radius);
    box-shadow: var(--alert-box-shadow); 

    .close {
        position: absolute;
        top: 0;
        right: 0;
        cursor: pointer;
        @include space-many(var(--alert-spacing-vertical), var(--alert-spacing-horizontal), $name: "padding");
        color: inherit;
    }
}

.alertLink { box-shadow: $alert-link-box-shadow; }
.alertLink.fill { border-left: $alert-fill-size solid var(--var-bg-color); }