.toastContainer-root--DS {
}

.toast-root-QCh {
    animation: toast-toast-pulsate-wg1 0.5s 1s;
    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.5);
    grid-template-areas: 'icon message controls';
    grid-auto-columns: min-content auto min-content;
}

@keyframes toast-toast-pulsate-wg1 {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0.5;
    }
    100% {
        opacity: 1;
    }
}

.toast-icon-pia {
    grid-area: icon;
}

.toast-infoToast-mba {
}

.toast-infoToast-mba > .toast-icon-pia {
    --stroke: rgb(0, 104, 108);
}

.toast-warningToast-lZl {
}

.toast-warningToast-lZl > .toast-icon-pia {
    --stroke: rgb(var(--venia-global-color-orange));
}

.toast-errorToast-sNw {
}

.toast-errorToast-sNw > .toast-icon-pia {
    --stroke: rgb(220, 20, 60);
}

.toast-successToast-sxP {
}

.toast-successToast-sxP > .toast-icon-pia {
    --stroke: rgb(var(--venia-global-color-green-500));
}

.toast-message-ysr {
    grid-area: message;

    /* For wrapping...*/
    /* These are technically the same, but use both */

    /* TODO @TW review */
    -ms-word-break: break-all;
    /* This is the dangerous one in WebKit, as it breaks things wherever */
    word-break: break-all;
    /* Instead use this non-standard one: */
    word-break: break-word;
}

.toast-actions-Dfe {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
    grid-column: 2 / span 1;
    grid-row: 2 / span 1;
}

.toast-controls-MwI {
    grid-area: controls;
}

.toast-actionButton-q3i {
}

.toast-dismissButton-62i {
}