.notification-item-card{position:relative;display:flex;gap:1rem;background:white;border-radius:12px;padding:1rem;cursor:pointer;transition:all .2s ease;border:1px solid #e5e7eb;box-shadow:0 1px 3px rgba(0,0,0,.05)}.notification-item-card.unread{background:rgba(255,220,40,.15);border-color:#ffc107;box-shadow:0 2px 8px rgba(255,193,7,.15)}.notification-item-card.read{background:white;opacity:.85}.notification-item-card:hover{transform:translateY(-2px);box-shadow:0 4px 16px rgba(255,193,7,.25)}.notification-item-card.unread:hover{background:rgba(255,220,40,.2);border-color:#ffb300}.notification-item-card:active{transform:translateY(0)}.notification-icon-wrapper{flex-shrink:0}.notification-icon{width:35px;height:35px;border-radius:11px;display:flex;align-items:center;justify-content:center;color:white;font-size:1.35rem;box-shadow:0 2px 8px rgba(255,193,7,.3)}.notification-item-card.unread .notification-icon{animation:iconPulse 2s ease-in-out infinite}@keyframes iconPulse{0%,to{box-shadow:0 2px 8px rgba(255,193,7,.3)}50%{box-shadow:0 4px 16px rgba(255,193,7,.5)}}.notification-content{flex:1 1;min-width:0}.notification-header-row{display:flex;justify-content:space-between;align-items:flex-start;gap:.5rem;margin-bottom:.5rem}.notification-title{font-size:.9rem;font-weight:600;color:#1f2937;margin:0;line-height:1.4}.notification-item-card.unread .notification-title{color:#000}.notification-time{font-size:.75rem;color:#999;white-space:nowrap;flex-shrink:0}.notification-item-card.unread .notification-time{color:#ffa000;font-weight:600}.notification-body-text{font-size:.85rem;color:#4b5563;margin:0 0 .75rem;line-height:1.5}.notification-item-card.unread .notification-body-text{color:#333}.notification-footer{display:flex;align-items:center;justify-content:space-between;gap:.75rem;flex-wrap:wrap}.notification-user{display:flex;align-items:center;gap:.5rem}.notification-avatar{width:26px;height:26px;border-radius:50%;object-fit:cover;border:2px solid #fff;box-shadow:0 2px 4px rgba(0,0,0,.1)}.notification-item-card.unread .notification-avatar{border-color:#ffc107}.notification-username{font-size:.75rem;color:#6b7280;font-weight:500}.notification-item-card.unread .notification-username{color:#555;font-weight:600}.notification-project{font-size:.75rem;color:#ffa000;background:rgba(255,220,40,.15);padding:.25rem .625rem;border-radius:6px;font-weight:600;border:1px solid rgba(255,193,7,.2)}.notification-unread-dot{position:absolute;top:1rem;right:1rem;width:10px;height:10px;background:#ffc107;border-radius:50%;box-shadow:0 0 0 3px rgba(255,193,7,.3);animation:dotPulse 2s ease-in-out infinite}@keyframes dotPulse{0%,to{box-shadow:0 0 0 3px rgba(255,193,7,.3)}50%{box-shadow:0 0 0 6px rgba(255,193,7,.2)}}@media (max-width:576px){.notification-item-card{padding:.875rem;gap:.875rem}.notification-icon{width:40px;height:40px;font-size:1.2rem}}