#toaster-container {
    position: fixed;
    bottom: 2em;
    right: 1em;
    z-index: 19999;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.toaster {
    margin: 10px;
    z-index: 9999;
    display: none;
    max-width: 300px;
    border-radius: 5px;
    padding: 10px;
    box-shadow: 0 0 10px var(--main-color-black-1);
}

.toaster.rott {
    opacity: 0.35;
    transition-duration: 3s;
    transition-property: opacity;
    transition-timing-function: ease-in-out;
}

.toaster.show {
    display: block;
}

.toaster.hide {
    display: none;
}

.toaster.info {
    background-color: rgb(148, 201, 248);
    color: black;
}

.toaster.validation {
    background-color: rgb(148, 248, 153);
    color: black;
}

.toaster.warning {
    background-color: #ffcc00;
    color: black;
}

.toaster.error {
    background-color: #ff3333;
    color: white;
}