.notification-bell{position:relative}.notification-bell-button{background:none;border:none;cursor:pointer;padding:.5rem;font-size:1.3rem;position:relative;transition:transform .2s ease}.notification-bell-button:hover{transform:scale(1.1)}.bell-icon{display:block}.notification-badge{position:absolute;top:0;right:0;background:#e74c3c;color:#fff;font-size:.65rem;font-weight:700;padding:.15rem .35rem;border-radius:10px;min-width:16px;text-align:center}.notification-dropdown{position:absolute;top:100%;right:0;width:320px;max-height:400px;background:var(--bg-primary, #fff);border-radius:12px;box-shadow:0 4px 20px #00000026;z-index:1000;overflow:hidden;animation:slideDown .2s ease}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.notification-header{display:flex;justify-content:space-between;align-items:center;padding:1rem;border-bottom:1px solid var(--border-color, #eee)}.notification-header h3{margin:0;font-size:1rem;color:var(--text-primary, #333)}.mark-all-read{background:none;border:none;color:var(--primary-color, #3498db);font-size:.85rem;cursor:pointer;padding:.25rem .5rem;border-radius:4px;transition:background .2s ease}.mark-all-read:hover{background:#3498db1a}.notification-list{max-height:340px;overflow-y:auto}.no-notifications{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:2rem;color:var(--text-secondary, #666)}.empty-icon{font-size:2.5rem;margin-bottom:.5rem}.notification-item{display:flex;align-items:flex-start;gap:.75rem;padding:.75rem 1rem;border-bottom:1px solid var(--border-color, #eee);cursor:pointer;transition:background .2s ease}.notification-item:hover{background:var(--bg-secondary, #f5f5f5)}.notification-item.unread{background:#3498db0d}.notification-item.unread:hover{background:#3498db1a}.notification-icon{font-size:1.3rem;flex-shrink:0}.notification-content{flex:1;min-width:0}.notification-title{font-weight:500;font-size:.9rem;color:var(--text-primary, #333);display:flex;align-items:center;gap:.5rem}.new-badge{background:var(--primary-color, #3498db);color:#fff;font-size:.65rem;font-weight:600;padding:.1rem .4rem;border-radius:4px;text-transform:uppercase}.notification-message{margin:.25rem 0;font-size:.8rem;color:var(--text-secondary, #666);line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.notification-time{font-size:.7rem;color:var(--text-tertiary, #999)}.delete-notification{background:none;border:none;color:var(--text-tertiary, #999);font-size:1.2rem;cursor:pointer;padding:.25rem;line-height:1;border-radius:4px;transition:all .2s ease;opacity:0}.notification-item:hover .delete-notification{opacity:1}.delete-notification:hover{background:#e74c3c1a;color:#e74c3c}[data-theme=dark] .notification-dropdown{background:var(--bg-primary, #1a1a1a);box-shadow:0 4px 20px #0006}[data-theme=dark] .notification-item.unread{background:#3498db1a}[data-theme=dark] .notification-item:hover{background:var(--bg-secondary, #2d2d2d)}@media(max-width:480px){.notification-dropdown{width:280px;right:-50px}}
