.ic{width:1.15em;height:1.15em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;vertical-align:-.2em;flex-shrink:0}
.nb{position:relative;display:inline-block}
.nb-btn{position:relative;width:38px;height:38px;border-radius:50%;border:1px solid #e6e9f0;background:#fff;color:#4a4f66;display:inline-grid;place-items:center;cursor:pointer;transition:.15s;padding:0}
.nb-btn:hover,.nb-btn[aria-expanded=true]{background:#f1edff;color:#5b3dff;border-color:#d7d0ff}
.nb-btn .ic{width:19px;height:19px}
.nb-badge{position:absolute;top:-4px;right:-4px;min-width:18px;height:18px;padding:0 5px;border-radius:99px;background:#ff4d4f;color:#fff;font-size:10.5px;font-weight:700;display:grid;place-items:center;border:2px solid #fff;box-sizing:content-box;line-height:1}
.nb-badge[hidden]{display:none}
.nb-panel{position:absolute;right:0;top:calc(100% + 10px);width:380px;max-width:calc(100vw - 24px);background:#fff;border:1px solid #e6e9f0;border-radius:16px;box-shadow:0 18px 50px rgba(30,30,80,.18);z-index:1000;overflow:hidden;color:#1a1c24;text-align:left;font-size:14px;animation:nbIn .15s ease-out}
.nb-panel[hidden]{display:none}
@keyframes nbIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.nb-head{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid #eef0f6}
.nb-head strong{font-size:15px}
.nb-count{font-size:12px;background:#f1edff;color:#5b3dff;padding:2px 9px;border-radius:99px;font-weight:600}
.nb-list{max-height:380px;overflow-y:auto}
.nb-item{display:flex;gap:11px;padding:12px 16px;border-bottom:1px solid #f3f4f8;cursor:pointer;position:relative;transition:background .12s}
.nb-item:hover{background:#f8f7ff}
.nb-item.is-unread{background:#faf8ff}
.nb-ico{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:#eef0f6;color:#5d667a;flex-shrink:0}
.nb-ico.t-CONFIRMED{background:#e7f8ee;color:#0f9d58}.nb-ico.t-CANCELLED{background:#fdecea;color:#d93025}
.nb-ico.t-PENDING,.nb-ico.t-REMINDER_2H{background:#fff4dc;color:#b26a00}.nb-ico.t-PARTNER_NEW,.nb-ico.t-REMINDER_24H{background:#f1edff;color:#5b3dff}
.nb-body{min-width:0;flex:1}
.nb-body strong{display:block;font-size:13.5px;margin-bottom:2px}
.nb-body p{margin:0;color:#5d667a;font-size:13px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.nb-item.is-open .nb-body p{-webkit-line-clamp:unset;display:block}
.nb-body small{color:#9aa0b4;font-size:11.5px;display:block;margin-top:4px}
.nb-dot{width:8px;height:8px;border-radius:50%;background:#5b3dff;margin-top:6px;flex-shrink:0}
.nb-empty{display:flex;flex-direction:column;align-items:center;gap:8px;padding:36px;color:#9aa0b4}
.nb-empty .ic{width:30px;height:30px}
.nb-foot{display:flex;justify-content:space-between;align-items:center;padding:11px 16px;background:#fafbfd;border-top:1px solid #eef0f6}
.nb-foot a{color:#5b3dff;font-weight:600;text-decoration:none;font-size:13.5px}
.nb-foot a:hover{text-decoration:underline}
.nb-readall{border:0;background:none;color:#5d667a;font-size:13px;cursor:pointer;padding:0}
.nb-readall:hover:not(:disabled){color:#5b3dff}.nb-readall:disabled{opacity:.4;cursor:default}
@media(max-width:560px){.nb-panel{position:fixed;left:12px;right:12px;top:64px;width:auto}}