:root {
    --toast-width: 417px;
    --bg-toasts: #444;
}

.toast-notification {
    position: absolute;
    top: var(--navbar-height);
    right: 0;
    padding: var(--padding-comfortable);
    z-index: 110;
}

.toast-notification img {
    width: 27px;
    height: 27px;
    margin: 0 var(--padding-comfortable) 0 0;
    padding: 0;
}

.toast {
    width: var(--toast-width);
    border-radius: var(--radius-primary);
    background: var(--bg-toasts);
    padding: var(--padding-comfortable);
}

/*.toast.fade {*/
/*    animation: slide_left 500ms ;*/
/*    transition: none;*/
/*}*/

@keyframes slide_left {
    0% {
        margin-right: calc((var(--toast-width) + var(--padding-comfortable)) * -1)
    }
    100% {
        margin-right: 0;
    }
}

.toast-body, .toast-header {
    background: inherit;
    border: none;
    padding: 0;
}

.toast-header-title {
    font-size: 16px;
    font-weight: 600;
    line-height: normal;
    color: var(--text-default);
}

.toast-body {
    font-size: 16px;
    font-weight: 600;
    line-height: normal;
    color: var(--text-secondary-light);
    padding-top: var(--padding-tight);
}