.notif-bell-btn{width:2.25rem;height:2.25rem;color:var(--notif-btn-color,#64748b);cursor:pointer;background:0 0;border:none;border-radius:9999px;justify-content:center;align-items:center;transition:background .2s,color .2s,transform .15s,box-shadow .2s;display:flex;position:relative}.notif-bell-btn:hover{background:color-mix(in srgb, var(--notif-accent,#0655b3) 10%, transparent);color:var(--notif-accent,#0655b3)}.notif-bell-btn--active{background:color-mix(in srgb, var(--notif-accent,#0655b3) 14%, transparent);color:var(--notif-accent,#0655b3);box-shadow:0 0 0 3px color-mix(in srgb, var(--notif-accent,#0655b3) 18%, transparent)}.notif-bell-btn--admin{--notif-accent:#0655b3;--notif-btn-color:#64748b;border-radius:.5rem;width:auto;height:auto;padding:.5rem}.dark .notif-bell-btn--admin{--notif-btn-color:#94a3b8}.notif-bell-btn--store{--notif-accent:var(--store-primary,#0655b3)}.notif-bell-btn--seller{--notif-accent:#fd7401}.notif-bell-btn--has-unread .notif-bell-icon{transform-origin:top;animation:2.5s ease-in-out infinite notif-ring}@keyframes notif-ring{0%,to{transform:rotate(0)}5%{transform:rotate(14deg)}10%{transform:rotate(-12deg)}15%{transform:rotate(10deg)}20%{transform:rotate(-8deg)}25%{transform:rotate(0)}}.notif-badge{color:#fff;background:linear-gradient(135deg,#f43f5e,#e11d48);border-radius:9999px;justify-content:center;align-items:center;min-width:1.125rem;height:1.125rem;padding:0 .25rem;font-size:.625rem;font-weight:700;line-height:1;display:flex;position:absolute;top:0;box-shadow:0 2px 8px #f43f5e73,0 0 0 2px #fff}.notif-badge--ltr{right:0}.notif-badge--rtl{left:0}.dark .notif-badge{box-shadow:0 2px 8px #f43f5e8c,0 0 0 2px #0f172a}.notif-panel{z-index:60;-webkit-backdrop-filter:blur(20px);border:1px solid color-mix(in srgb, var(--notif-accent,#0655b3) 12%, #e2e8f0);background:#ffffffeb;border-radius:1.25rem;width:min(100vw - 2rem,24rem);animation:.28s cubic-bezier(.22,1,.36,1) notif-panel-in;position:absolute;top:calc(100% + .625rem);overflow:hidden;box-shadow:0 4px 6px -1px #0f172a0f,0 20px 40px -12px #0f172a2e,inset 0 0 0 1px #fff9}.notif-panel--ltr{right:0}.notif-panel--rtl{left:0}.dark .notif-panel{border-color:color-mix(in srgb, var(--notif-accent,#0655b3) 22%, #334155);background:#0f172af0;box-shadow:0 20px 50px -12px #0000008c,inset 0 0 0 1px #ffffff0a}@keyframes notif-panel-in{0%{opacity:0;transform:translateY(-8px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}.notif-panel-header{background:linear-gradient(135deg, color-mix(in srgb, var(--notif-accent,#0655b3) 92%, #4f46e5), color-mix(in srgb, var(--notif-accent,#0655b3) 70%, #fd7401));color:#fff;padding:1rem 1.125rem;position:relative;overflow:hidden}.notif-panel-header:before,.notif-panel-header:after{content:"";pointer-events:none;background:#ffffff1f;border-radius:50%;position:absolute}.notif-panel-header:before{top:-3rem;width:7rem;height:7rem;inset-inline-end:-2rem}.notif-panel-header:after{bottom:-2rem;width:4rem;height:4rem;inset-inline-start:1rem}.notif-panel-title{letter-spacing:-.01em;font-size:.9375rem;font-weight:700;position:relative}.notif-panel-subtitle{opacity:.85;margin-top:.125rem;font-size:.75rem;position:relative}.notif-mark-all{color:#fff;cursor:pointer;background:#ffffff2e;border:1px solid #ffffff38;border-radius:9999px;align-items:center;gap:.3rem;padding:.35rem .65rem;font-size:.6875rem;font-weight:600;transition:background .2s;display:inline-flex;position:relative}.notif-mark-all:hover{background:#ffffff47}.notif-list{max-height:min(70vh,26rem);padding:.5rem;overflow-y:auto}.notif-list::-webkit-scrollbar{width:5px}.notif-list::-webkit-scrollbar-thumb{background:color-mix(in srgb, var(--notif-accent,#0655b3) 30%, #cbd5e1);border-radius:9999px}.notif-item{color:inherit;border-radius:.875rem;gap:.75rem;padding:.75rem;text-decoration:none;transition:background .2s,transform .15s,box-shadow .2s;animation:.35s cubic-bezier(.22,1,.36,1) both notif-item-in;display:flex}.notif-item:hover{background:color-mix(in srgb, var(--notif-accent,#0655b3) 6%, #f8fafc);transform:translateY(-1px);box-shadow:0 4px 12px -4px #0f172a1a}.dark .notif-item:hover{background:color-mix(in srgb, var(--notif-accent,#0655b3) 12%, #1e293b)}.notif-item--unread{background:color-mix(in srgb, var(--notif-accent,#0655b3) 7%, #f8fafc);box-shadow:inset 3px 0 0 var(--notif-accent,#0655b3)}.dark .notif-item--unread{background:color-mix(in srgb, var(--notif-accent,#0655b3) 14%, #0f172a)}@keyframes notif-item-in{0%{opacity:0;transform:translate(8px)}to{opacity:1;transform:translate(0)}}.notif-item-icon{border-radius:.75rem;flex-shrink:0;justify-content:center;align-items:center;width:2.5rem;height:2.5rem;display:flex;box-shadow:0 4px 10px -4px #0f172a33}.notif-item-icon--emerald{color:#fff;background:linear-gradient(135deg,#34d399,#059669)}.notif-item-icon--sky{color:#fff;background:linear-gradient(135deg,#38bdf8,#0284c7)}.notif-item-icon--violet{color:#fff;background:linear-gradient(135deg,#a78bfa,#7c3aed)}.notif-item-icon--amber{color:#fff;background:linear-gradient(135deg,#fbbf24,#d97706)}.notif-item-icon--cyan{color:#fff;background:linear-gradient(135deg,#22d3ee,#0891b2)}.notif-item-icon--orange{color:#fff;background:linear-gradient(135deg,#fb923c,#ea580c)}.notif-item-icon--pink{color:#fff;background:linear-gradient(135deg,#f472b6,#db2777)}.notif-item-icon--indigo{color:#fff;background:linear-gradient(135deg,#818cf8,#4f46e5)}.notif-item-body{flex:1;min-width:0}.notif-item-title{color:#0f172a;align-items:center;gap:.375rem;font-size:.8125rem;font-weight:600;line-height:1.35;display:flex}.dark .notif-item-title{color:#f1f5f9}.notif-item-title span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.notif-unread-dot{background:var(--notif-accent,#0655b3);width:.4375rem;height:.4375rem;box-shadow:0 0 0 3px color-mix(in srgb, var(--notif-accent,#0655b3) 25%, transparent);border-radius:50%;flex-shrink:0;animation:2s ease-in-out infinite notif-pulse}@keyframes notif-pulse{0%,to{opacity:1}50%{opacity:.55}}.notif-item-text{color:#64748b;text-overflow:ellipsis;white-space:nowrap;margin-top:.2rem;font-size:.75rem;line-height:1.4;overflow:hidden}.dark .notif-item-text{color:#94a3b8}.notif-item-time{color:#94a3b8;margin-top:.35rem;font-size:.6875rem;font-weight:500}.notif-empty{text-align:center;padding:2.5rem 1.5rem}.notif-empty-icon{background:linear-gradient(135deg, color-mix(in srgb, var(--notif-accent,#0655b3) 15%, #f1f5f9), color-mix(in srgb, var(--notif-accent,#0655b3) 8%, #e2e8f0));width:4rem;height:4rem;color:var(--notif-accent,#0655b3);border-radius:1.25rem;justify-content:center;align-items:center;margin:0 auto 1rem;display:flex}.dark .notif-empty-icon{background:linear-gradient(135deg, color-mix(in srgb, var(--notif-accent,#0655b3) 25%, #1e293b), color-mix(in srgb, var(--notif-accent,#0655b3) 12%, #0f172a))}.notif-empty-title{color:#334155;font-size:.875rem;font-weight:600}.dark .notif-empty-title{color:#e2e8f0}.notif-empty-desc{color:#94a3b8;margin-top:.25rem;font-size:.75rem}.notif-skeleton{border-radius:.875rem;gap:.75rem;padding:.75rem;display:flex}.notif-skeleton-icon,.notif-skeleton-line{background:linear-gradient(90deg,#e2e8f0 25%,#f1f5f9 50%,#e2e8f0 75%) 0 0/200% 100%;border-radius:.5rem;animation:1.4s infinite notif-shimmer}.dark .notif-skeleton-icon,.dark .notif-skeleton-line{background:linear-gradient(90deg,#1e293b 25%,#334155 50%,#1e293b 75%) 0 0/200% 100%}.notif-skeleton-icon{border-radius:.75rem;flex-shrink:0;width:2.5rem;height:2.5rem}.notif-skeleton-line{height:.625rem;margin-bottom:.4rem}@keyframes notif-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.notif-loading-row{color:#64748b;justify-content:center;align-items:center;gap:.5rem;padding:2rem;font-size:.8125rem;display:flex}