/**
 * Color variants
 */

.toast {
    &.-light {
        --toast--background: var(--toast--light--background, var(--color-white));
        --toast--border-top-color: var(
            --toast--light--border-top-color,
            var(--color-light-shade-50)
        );
        --toast--border-right-color: var(
            --toast--light--border-right-color,
            var(--color-light-shade-50)
        );
        --toast--border-bottom-color: var(
            --toast--light--border-bottom-color,
            var(--color-light-shade-50)
        );
        --toast--border-left-color: var(
            --toast--light--border-left-color,
            var(--color-light-shade-50)
        );
        --toast--color: var(--toast--light--color, var(--contrast-text-color-light));
        --toast--progress--background: var(
            --toast--light--progress--background,
            rgba(0, 0, 0, 0.05)
        );
        --toast--progress-bar--background: var(
            --toast--light--progress-bar--background,
            rgba(0, 0, 0, 0.15)
        );
    }

    &.-dark {
        --toast--background: var(--toast--dark--background, var(--color-dark));
        --toast--border-top-color: var(--toast--dark--border-top-color, var(--color-dark-tint-50));
        --toast--border-right-color: var(
            --toast--dark--border-right-color,
            var(--color-dark-tint-50)
        );
        --toast--border-bottom-color: var(
            --toast--dark--border-bottom-color,
            var(--color-dark-tint-50)
        );
        --toast--border-left-color: var(
            --toast--dark--border-left-color,
            var(--color-dark-tint-50)
        );
        --toast--color: var(--toast--dark--color, var(--contrast-text-color-dark));
        --toast--progress--background: var(
            --toast--dark--progress--background,
            rgba(255, 255, 255, 0.05)
        );
        --toast--progress-bar--background: var(
            --toast--dark--progress-bar--background,
            rgba(255, 255, 255, 0.15)
        );
    }

    &.-info {
        --toast--background: var(--toast--info--background, var(--color-info-100));
        --toast--border-top-color: var(--toast--info--border-top-color, var(--color-info-500));
        --toast--border-right-color: var(--toast--info--border-right-color, var(--color-info-500));
        --toast--border-bottom-color: var(
            --toast--info--border-bottom-color,
            var(--color-info-500)
        );
        --toast--border-left-color: var(--toast--info--border-left-color, var(--color-info-500));
        --toast--color: var(--toast--info--color, var(--color-info-800));
        --toast--progress--background: var(
            --toast--info--progress--background,
            rgba(0, 0, 0, 0.05)
        );
        --toast--progress-bar--background: var(
            --toast--info--progress-bar--background,
            rgba(0, 0, 0, 0.15)
        );
    }

    &.-success {
        --toast--background: var(--toast--success--background, var(--color-success-100));
        --toast--border-top-color: var(
            --toast--success--border-top-color,
            var(--color-success-500)
        );
        --toast--border-right-color: var(
            --toast--success--border-right-color,
            var(--color-success-500)
        );
        --toast--border-bottom-color: var(
            --toast--success--border-bottom-color,
            var(--color-success-500)
        );
        --toast--border-left-color: var(
            --toast--success--border-left-color,
            var(--color-success-500)
        );
        --toast--color: var(--toast--success--color, var(--color-success-800));
        --toast--progress--background: var(
            --toast--success--progress--background,
            rgba(0, 0, 0, 0.05)
        );
        --toast--progress-bar--background: var(
            --toast--success--progress-bar--background,
            rgba(0, 0, 0, 0.15)
        );
    }

    &.-warning {
        --toast--background: var(--toast--warning--background, var(--color-warning-100));
        --toast--border-top-color: var(
            --toast--warning--border-top-color,
            var(--color-warning-500)
        );
        --toast--border-right-color: var(
            --toast--warning--border-right-color,
            var(--color-warning-500)
        );
        --toast--border-bottom-color: var(
            --toast--warning--border-bottom-color,
            var(--color-warning-500)
        );
        --toast--border-left-color: var(
            --toast--warning--border-left-color,
            var(--color-warning-500)
        );
        --toast--color: var(--toast--warning--color, var(--color-warning-800));
        --toast--progress--background: var(
            --toast--warning--progress--background,
            rgba(0, 0, 0, 0.05)
        );
        --toast--progress-bar--background: var(
            --toast--warning--progress-bar--background,
            rgba(0, 0, 0, 0.15)
        );
    }

    &.-danger {
        --toast--background: var(--toast--danger--background, var(--color-danger-100));
        --toast--border-top-color: var(--toast--danger--border-top-color, var(--color-danger-500));
        --toast--border-right-color: var(
            --toast--danger--border-right-color,
            var(--color-danger-500)
        );
        --toast--border-bottom-color: var(
            --toast--danger--border-bottom-color,
            var(--color-danger-500)
        );
        --toast--border-left-color: var(
            --toast--danger--border-left-color,
            var(--color-danger-500)
        );
        --toast--color: var(--toast--danger--color, var(--color-danger-800));
        --toast--progress--background: var(
            --toast--danger--progress--background,
            rgba(0, 0, 0, 0.05)
        );
        --toast--progress-bar--background: var(
            --toast--danger--progress-bar--background,
            rgba(0, 0, 0, 0.15)
        );
    }
}