.notification-container{z-index:1000000;position:fixed;top:20px;left:50%;transform:translate(-50%)}.notification{background-color:#f8f9fa;border-radius:8px;align-items:center;width:320px;margin-bottom:10px;padding:10px 15px;animation:.3s ease-in-out slideIn;display:flex;position:relative;box-shadow:0 4px 6px #0000001a}.notification.success{background:#e6ffed}.notification.info{background:#deeaf9}.notification.warning{background:#fff8e1}.notification.danger{background:#fdecea}.notification.exiting{animation:.3s ease-in forwards slideOut}.notification .icon{margin-right:20px;font-size:1.5rem}.notification .content strong{color:#333;font-size:1rem;display:block}.notification .content p{color:#666;margin:0;font-size:.9rem}.notification .timer{width:100%;height:3px;animation-name:progressShrink;animation-timing-function:linear;animation-fill-mode:forwards;position:absolute;bottom:0;left:0}.notification.success .timer{background-color:#28a745}.notification.info .timer{background-color:#78a9ed}.notification.warning .timer{background-color:#ffc107}.notification.danger .timer{background-color:#dc3545}@keyframes slideIn{0%{opacity:0;transform:translateY(-200%)}to{opacity:1;transform:translateY(0)}}@keyframes slideOut{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-200%)}}@keyframes progressShrink{0%{width:100%}to{width:0%}}