.flash-container {

    position:fixed;

    right:25px;

    bottom:25px;

    z-index:99999;

    display:flex;

    flex-direction:column;

    gap:12px;

}



.flash-toast {

    width: fit-content;

    min-width: unset;

    max-width: 420px;


    padding:14px 20px;


    background:#111;

    color:white;


    border:1px solid #333;

    border-radius:12px;


    box-shadow:
    0 10px 30px rgba(0,0,0,.4);


    white-space: nowrap;


    animation:
    flash-in .3s ease,
    flash-out .4s ease 3s forwards;

}



.flash-toast.success {

    border-color:#555;

}



.flash-toast.danger {

    background:#1a1a1a;

    border-color:#777;

}



.flash-toast.warning {

    background:#222;

}



.flash-toast.info {

    background:#222;

}



@keyframes toast-in {

    from {

        opacity:0;

        transform:translateX(50px);

    }

    to {

        opacity:1;

        transform:translateX(0);

    }

}


@keyframes toast-out {

    from {

        opacity:1;

    }

    to {

        opacity:0;

        transform:translateX(50px);

    }

}