/* ==== Global Notification Popup ==== */
.notification {
    position: fixed;
    bottom: 20px;
    left: 20px;
    z-index: 1000;
    max-width: 320px;
    padding: 12px 20px;
    border-radius: 6px;
    transform: translateX(-150%);
    opacity: 0;
    transition: all 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    /* Applying the glass effect from home.blade.php */
    background: rgba(17, 34, 64, 0.7); /* --light-navy with more opacity */
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(100, 255, 218, 0.1);
    box-shadow: 0 8px 32px 0 rgba(2, 12, 27, 0.7);
}

.notification.show {
    transform: translateX(0);
    opacity: 1;
}