.toast-container{position:fixed;top:20px;right:20px;z-index:9999;display:flex;flex-direction:column;gap:10px}.toast{min-width:300px;max-width:350px;padding:15px;border-radius:5px;box-shadow:0 4px 8px rgba(0,0,0,.2);background-color:#fff;color:#000;font-size:14px;line-height:1.5;display:flex;align-items:center;justify-content:space-between;opacity:0;transform:translateX(100%);transition:opacity .3s ease-in-out,transform .3s ease-in-out;position:relative;overflow:hidden}.toast .toast-icon{font-size:18px;margin-right:10px}.toast.show{opacity:1;transform:translateX(0)}.toast.hide{opacity:0;transform:translateX(100%);transition:opacity .2s ease-out,transform .2s ease-out}.toast.success{background-color:#d4edda;color:#155724;border-left:5px solid #28a745}.toast.error,.toast.danger{background-color:#f8d7da;color:#721c24;border-left:5px solid #dc3545}.toast.warning{background-color:#fff3cd;color:#856404;border-left:5px solid #ffc107}.toast.info{background-color:#d1ecf1;color:#0c5460;border-left:5px solid #17a2b8}.alert{padding:10px;margin-bottom:15px;border-radius:5px;text-align:center}.alert.alert-success{background-color:#d4edda;color:#155724;border-left:5px solid #28a745}.alert.alert-error,.alert.alert-danger{background-color:#f8d7da;color:#721c24;border-left:5px solid #dc3545}.alert.alert-warning{background-color:#fff3cd;color:#856404;border-left:5px solid #ffc107}.alert.alert-info{background-color:#d1ecf1;color:#0c5460;border-left:5px solid #17a2b8}.close-button{background:0 0;border:none;font-size:18px;cursor:pointer;margin-left:10px;transition:color .3s ease-in-out}.toast.success .close-button{color:#155724;background-color:#fff}.toast.error .close-button,.toast.danger .close-button{color:#721c24;background-color:#fff}.toast.warning .close-button{color:#856404;background-color:#fff}.toast.info .close-button{color:#0c5460;background-color:#fff}.toast.success .close-button:hover{color:#28a745;background-color:#fff}.toast.error .close-button:hover,.toast.danger .close-button:hover{color:#dc3545;background-color:#fff}.toast.warning .close-button:hover{color:#ffc107;background-color:#fff}.toast.info .close-button:hover{color:#17a2b8;background-color:#fff}.toast .progress-bar{position:absolute;bottom:0;left:0;height:4px;width:100%;background-color:rgba(0,0,0,.1);animation:toast-progress linear forwards}@keyframes toast-progress{from{width:100%}to{width:0%}}