.notification-bell-container{align-items:center;display:inline-flex;position:relative}.notification-bell-container .notification-bell-btn{color:#cbd5e1;cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex;position:relative}.notification-bell-container .notification-bell-btn:hover,.notification-bell-container .notification-bell-btn.active{color:#fff;background:#ffffff1f;border-color:#00f2fe66;transform:translateY(-1px);box-shadow:0 0 16px #00f2fe33}.notification-bell-container .notification-bell-btn .bell-icon{width:20px;height:20px;transition:transform .2s}.notification-bell-container .notification-bell-btn:hover .bell-icon{transform:rotate(12deg)}.notification-bell-container .notification-bell-btn .unread-badge{color:#fff;background:linear-gradient(135deg,#ef4444 0%,#f97316 100%);border:2px solid #0b0f19;border-radius:999px;justify-content:center;align-items:center;min-width:18px;height:18px;padding:0 4px;font-size:.68rem;font-weight:800;animation:2s ease-in-out infinite pulse-badge;display:flex;position:absolute;top:-2px;right:-2px;box-shadow:0 0 10px #ef444499}.notification-bell-container .notification-dropdown{-webkit-backdrop-filter:blur(16px);z-index:1000;background:#0d111cf7;border:1px solid #ffffff1f;border-radius:16px;width:380px;max-width:90vw;animation:.2s cubic-bezier(.16,1,.3,1) dropdown-in;position:absolute;top:calc(100% + 10px);right:0;overflow:hidden;box-shadow:0 20px 50px #0009,0 0 30px #00f2fe14}.notification-bell-container .notification-dropdown .dropdown-header{background:#ffffff05;border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;padding:1rem 1.15rem;display:flex}.notification-bell-container .notification-dropdown .dropdown-header .title-row{align-items:center;gap:.6rem;display:flex}.notification-bell-container .notification-dropdown .dropdown-header .title-row h3{color:#f8fafc;margin:0;font-size:.98rem;font-weight:700}.notification-bell-container .notification-dropdown .dropdown-header .title-row .unread-counter{color:#00f2fe;background:#00f2fe26;border:1px solid #00f2fe4d;border-radius:999px;padding:.15rem .5rem;font-size:.72rem;font-weight:700}.notification-bell-container .notification-dropdown .dropdown-header .header-actions{align-items:center;gap:.35rem;display:flex}.notification-bell-container .notification-dropdown .dropdown-header .header-actions .mark-all-btn,.notification-bell-container .notification-dropdown .dropdown-header .header-actions .clear-all-btn{color:#94a3b8;cursor:pointer;background:0 0;border:none;border-radius:6px;align-items:center;gap:.3rem;padding:.25rem .5rem;font-size:.72rem;font-weight:600;transition:all .15s;display:inline-flex}.notification-bell-container .notification-dropdown .dropdown-header .header-actions .mark-all-btn .btn-icon,.notification-bell-container .notification-dropdown .dropdown-header .header-actions .clear-all-btn .btn-icon{width:13px;height:13px}.notification-bell-container .notification-dropdown .dropdown-header .header-actions .mark-all-btn:hover,.notification-bell-container .notification-dropdown .dropdown-header .header-actions .clear-all-btn:hover{color:#f8fafc;background:#ffffff14}.notification-bell-container .notification-dropdown .dropdown-header .header-actions .clear-all-btn:hover{color:#f87171;background:#ef44441f}.notification-bell-container .notification-dropdown .dropdown-body{max-height:380px;overflow-y:auto}.notification-bell-container .notification-dropdown .dropdown-body::-webkit-scrollbar{width:6px}.notification-bell-container .notification-dropdown .dropdown-body::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:3px}.notification-bell-container .notification-dropdown .dropdown-body .empty-notifications{text-align:center;flex-direction:column;justify-content:center;align-items:center;padding:3rem 1.5rem;display:flex}.notification-bell-container .notification-dropdown .dropdown-body .empty-notifications .empty-icon{color:#475569;opacity:.8;width:42px;height:42px;margin-bottom:.75rem}.notification-bell-container .notification-dropdown .dropdown-body .empty-notifications .empty-title{color:#cbd5e1;margin:0 0 .25rem;font-size:.95rem;font-weight:700}.notification-bell-container .notification-dropdown .dropdown-body .empty-notifications .empty-desc{color:#64748b;max-width:260px;font-size:.8rem;line-height:1.45}.notification-bell-container .notification-dropdown .dropdown-body .notifications-list{flex-direction:column;display:flex}.notification-bell-container .notification-dropdown .dropdown-body .notifications-list .notification-item{cursor:pointer;border-bottom:1px solid #ffffff0a;align-items:flex-start;gap:.85rem;padding:.9rem 1.15rem;transition:background .15s;display:flex;position:relative}.notification-bell-container .notification-dropdown .dropdown-body .notifications-list .notification-item:last-child{border-bottom:none}.notification-bell-container .notification-dropdown .dropdown-body .notifications-list .notification-item:hover{background:#ffffff0d}.notification-bell-container .notification-dropdown .dropdown-body .notifications-list .notification-item:hover .item-actions-col .delete-item-btn{opacity:1;visibility:visible}.notification-bell-container .notification-dropdown .dropdown-body .notifications-list .notification-item.unread{background:#00f2fe0a}.notification-bell-container .notification-dropdown .dropdown-body .notifications-list .notification-item.unread .item-title{color:#fff;font-weight:700}.notification-bell-container .notification-dropdown .dropdown-body .notifications-list .notification-item.unread .item-message{color:#e2e8f0}.notification-bell-container .notification-dropdown .dropdown-body .notifications-list .notification-item .icon-col{flex-shrink:0;margin-top:.15rem}.notification-bell-container .notification-dropdown .dropdown-body .notifications-list .notification-item .icon-col .icon-type{width:22px;height:22px}.notification-bell-container .notification-dropdown .dropdown-body .notifications-list .notification-item .icon-col .icon-type.verification{color:#10b981;filter:drop-shadow(0 0 6px #10b98166)}.notification-bell-container .notification-dropdown .dropdown-body .notifications-list .notification-item .icon-col .icon-type.tip{color:#facc15;filter:drop-shadow(0 0 6px #facc1566)}.notification-bell-container .notification-dropdown .dropdown-body .notifications-list .notification-item .icon-col .icon-type.copyright{color:#ef4444;filter:drop-shadow(0 0 6px #ef444466)}.notification-bell-container .notification-dropdown .dropdown-body .notifications-list .notification-item .icon-col .icon-type.comment{color:#38bdf8}.notification-bell-container .notification-dropdown .dropdown-body .notifications-list .notification-item .icon-col .icon-type.system{color:#a855f7}.notification-bell-container .notification-dropdown .dropdown-body .notifications-list .notification-item .content-col{flex:1;min-width:0}.notification-bell-container .notification-dropdown .dropdown-body .notifications-list .notification-item .content-col .item-title-row{justify-content:space-between;align-items:center;gap:.5rem;margin-bottom:.2rem;display:flex}.notification-bell-container .notification-dropdown .dropdown-body .notifications-list .notification-item .content-col .item-title-row .item-title{color:#cbd5e1;white-space:nowrap;text-overflow:ellipsis;font-size:.86rem;font-weight:600;overflow:hidden}.notification-bell-container .notification-dropdown .dropdown-body .notifications-list .notification-item .content-col .item-title-row .item-time{color:#64748b;flex-shrink:0;font-size:.72rem}.notification-bell-container .notification-dropdown .dropdown-body .notifications-list .notification-item .content-col .item-message{color:#94a3b8;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;margin:0;font-size:.79rem;line-height:1.4;display:-webkit-box;overflow:hidden}.notification-bell-container .notification-dropdown .dropdown-body .notifications-list .notification-item .item-actions-col{flex-shrink:0;align-items:center;gap:.4rem;margin-top:.2rem;display:flex}.notification-bell-container .notification-dropdown .dropdown-body .notifications-list .notification-item .item-actions-col .unread-dot{background:#00f2fe;border-radius:50%;flex-shrink:0;width:7px;height:7px;box-shadow:0 0 8px #00f2fecc}.notification-bell-container .notification-dropdown .dropdown-body .notifications-list .notification-item .item-actions-col .delete-item-btn{color:#64748b;cursor:pointer;opacity:.4;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:22px;height:22px;transition:all .15s;display:flex}.notification-bell-container .notification-dropdown .dropdown-body .notifications-list .notification-item .item-actions-col .delete-item-btn .delete-icon{width:14px;height:14px}.notification-bell-container .notification-dropdown .dropdown-body .notifications-list .notification-item .item-actions-col .delete-item-btn:hover{opacity:1;color:#f87171;background:#ef444426}@media (max-width:640px){.notification-bell-container .notification-dropdown{width:auto;max-width:none;max-height:calc(100dvh - 80px);position:fixed;top:66px;left:8px;right:8px;overflow-y:auto}}@keyframes dropdown-in{0%{opacity:0;transform:translateY(-8px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes pulse-badge{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}
