/* notifs.css — صفحه اعلانات */
body[data-route="notifications"] .app-footer{display:none !important}
body[data-route="notifications"] .app-main{padding-bottom:calc(var(--bottom-h) + 18px + var(--nav-off))}
@media(min-width:1024px){body[data-route="notifications"] .app-main{padding-bottom:22px}}

.nt{display:flex;flex-direction:column;gap:14px;min-width:0;max-width:100%;max-width:860px;margin-inline:auto;width:100%}
.nt-head{display:flex;align-items:center;gap:12px}
.nt-bell{width:52px;height:52px;flex:none;border-radius:17px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--secondary),#2f5a94 60%,var(--primary));box-shadow:var(--shadow);position:relative}
.nt-bell svg{width:24px;height:24px}
.nt-bell .dot{position:absolute;top:9px;inset-inline-end:10px;width:11px;height:11px;border-radius:50%;background:#e5484d;border:2px solid var(--bg)}
.nt-head h1{margin:0;font-size:clamp(1.15rem,3vw,1.5rem)}
.nt-head p{margin:2px 0 0;color:var(--muted);font-size:.8rem}
.nt-head .btn-ghost{margin-inline-start:auto;font-size:.78rem;white-space:nowrap}
.nt-cats{display:flex;gap:8px;overflow-x:auto;padding:4px 2px 8px;scrollbar-width:none}
.nt-cats::-webkit-scrollbar{display:none}
.nt-cats button{flex:none;display:inline-flex;align-items:center;gap:7px;font-family:inherit;font-size:.8rem;font-weight:700;padding:9px 17px;border-radius:99px;border:1px solid var(--stroke);background:var(--surface);color:var(--muted);cursor:pointer;position:relative}
.nt-cats button.on{background:var(--primary-soft);color:var(--primary-ink);border-color:rgba(212,175,55,.5)}
.nt-cats button i{width:7px;height:7px;border-radius:50%;background:#e5484d}
.nt-cats button svg{width:15px;height:15px}
.nt-list{display:flex;flex-direction:column;gap:10px;max-height:calc(100vh - 330px);max-height:calc(var(--app-h,100dvh) - 330px);min-height:200px;overflow-y:auto;padding:2px 2px 8px}
@media(max-width:1023px){.nt-list{max-height:none;overflow:visible}}
.nrow{display:flex;gap:13px;padding:14px 15px;cursor:pointer;align-items:flex-start;transition:.2s;border-inline-start:3px solid transparent;min-width:0}
.nrow:hover{box-shadow:var(--shadow-lg)}
.nrow.unread{border-inline-start-color:var(--primary);background:color-mix(in srgb,var(--primary-soft) 55%,var(--surface))}
.nrow .thumb{width:52px;height:52px;flex:none;border-radius:16px;display:grid;place-items:center;background:var(--secondary-soft);color:var(--secondary)}
.nrow .thumb svg{width:24px;height:24px}
.nrow .tx{flex:1;min-width:0}
.nrow h3{margin:0 0 3px;font-size:.87rem;display:flex;align-items:center;gap:8px}
.nrow h3 .u{width:8px;height:8px;flex:none;border-radius:50%;background:var(--primary)}
.nrow p{margin:0;font-size:.78rem;color:var(--muted);line-height:1.95}
.nrow time{flex:none;font-size:.66rem;color:var(--muted);white-space:nowrap}
.nt-empty{padding:50px 20px;text-align:center;color:var(--muted)}
.nt-empty b{display:block;color:var(--text);margin-top:8px}
