.notification {
    position: fixed;
    right: 0;
    transform: translateX(100%);
    background-color: #FFF;
    border-radius: 5px;
    padding: 10px;
    z-index: 10000;
    animation: ease 5s notification_anim;
}

.notification-error {
    background-color: #681212;
    color: #ffb6b6;
}

.notification-success {
    background-color: #077034;
    color: #56ed90;
}

.notification-info {
    background-color: #dfdfdf;
    color: #434343;
    border: 2px solid #434343;
}

.notification-content {
    display: flex;
    gap: 10px;
    align-items: center;
}

.notification-message {
    font-weight: 400;
}

@keyframes notification_anim {
    0% {
        right: 0;
        transform: translateX(100%);
    }
    10% {
        right: 10px;
        transform: translateX(0%);
    }
    90% {
        right: 10px;
        transform: translateX(0%);
    }
    100% {
        right: 0;
        transform: translateX(100%);
    }
}