/* واجهة إشعارات PWA: جرس الإشعارات + بطاقة دعوة التفعيل + Toast - مشتركة بين كل القوالب */
.naql-bell { position: relative; display: inline-flex; }
.naql-bell .nb-btn { position: relative; width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(0,0,0,.06); background: #fff; color: #123524; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; box-shadow: 0 2px 8px rgba(0,0,0,.06); padding: 0; }
.naql-bell .nb-btn svg { width: 20px; height: 20px; }
.naql-bell .nb-badge { position: absolute; top: -4px; right: -4px; min-width: 19px; height: 19px; padding: 0 5px; border-radius: 10px; background: #d33a2c; color: #fff; font: 800 .68rem/19px 'Cairo', sans-serif; text-align: center; border: 2px solid #fff; display: none; }
.naql-bell .nb-panel { position: absolute; top: 48px; left: -10px; width: 340px; max-width: calc(100vw - 24px); background: #fff; border-radius: 18px; box-shadow: 0 18px 60px rgba(0,0,0,.25); border: 1px solid rgba(0,0,0,.06); overflow: hidden; display: none; z-index: 3000; direction: rtl; font-family: 'Cairo', sans-serif; }
.naql-bell.open .nb-panel { display: block; animation: nbIn .18s ease-out; }
@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; background: linear-gradient(135deg, #0c2118, #1f6b4a); color: #fff; }
.nb-head b { font-weight: 800; font-size: .98rem; }
.nb-head a { color: #f4d470; font-size: .75rem; font-weight: 800; text-decoration: none; cursor: pointer; }
.nb-list { max-height: 380px; overflow-y: auto; }
.nb-item { display: flex; gap: 11px; padding: 12px 14px; text-decoration: none; color: #1e293b; border-bottom: 1px solid #f1f5f9; }
.nb-item:hover { background: #f8fafc; color: #1e293b; }
.nb-item.unread { background: #f0f8f3; }
.nb-item.unread .nb-txt b::after { content: ''; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #1f6b4a; margin-right: 6px; }
.nb-ico { flex: 0 0 38px; height: 38px; border-radius: 12px; background: #eef2f0; display: flex; align-items: center; justify-content: center; font-size: 1.15rem; }
.nb-txt { display: flex; flex-direction: column; min-width: 0; }
.nb-txt b { font-weight: 800; font-size: .86rem; }
.nb-txt span { font-size: .8rem; color: #475569; font-weight: 600; line-height: 1.5; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.nb-txt small { color: #94a3b8; font-weight: 700; font-size: .7rem; margin-top: 2px; }
.nb-empty { text-align: center; padding: 34px 16px; color: #94a3b8; font-weight: 700; }
.nb-empty-ico { font-size: 2.2rem; margin-bottom: 6px; }
.nb-foot { display: flex; flex-direction: column; border-top: 1px solid #eef2f0; background: #fafbfa; }
.nb-foot a, .nb-foot button { padding: 11px 16px; text-align: center; font: 800 .8rem 'Cairo', sans-serif; color: #1f6b4a; text-decoration: none; background: none; border: 0; cursor: pointer; }
.nb-foot .nb-push { color: #a6841e; border-top: 1px dashed #e2e8f0; }
.nb-foot .nb-push.on { color: #1f6b4a; cursor: default; }
.nb-foot .nb-push[data-state=denied], .nb-foot .nb-push[data-state=unsupported], .nb-foot .nb-push[data-state=needs-install] { color: #94a3b8; cursor: default; font-size: .74rem; }

html[data-bs-theme=dark] .naql-bell .nb-btn { background: #14251c; color: #e6efe9; border-color: rgba(255,255,255,.1); }
html[data-bs-theme=dark] .naql-bell .nb-badge { border-color: #14251c; }
html[data-bs-theme=dark] .naql-bell .nb-panel { background: #0e2019; border-color: rgba(255,255,255,.08); }
html[data-bs-theme=dark] .nb-item { color: #e6efe9; border-bottom-color: rgba(255,255,255,.06); }
html[data-bs-theme=dark] .nb-item:hover { background: rgba(255,255,255,.04); color: #e6efe9; }
html[data-bs-theme=dark] .nb-item.unread { background: rgba(47,158,110,.12); }
html[data-bs-theme=dark] .nb-ico { background: rgba(255,255,255,.08); }
html[data-bs-theme=dark] .nb-txt span { color: #9db3a7; }
html[data-bs-theme=dark] .nb-foot { background: #0a1b14; border-top-color: rgba(255,255,255,.06); }
html[data-bs-theme=dark] .nb-foot a { color: #6fd3a5; }

/* في الواجهة العربية (RTL) يُفتح الجرس نحو اليسار */
@media (max-width: 480px) { .naql-bell .nb-panel { position: fixed; top: 64px; left: 12px; right: 12px; width: auto; } }

/* ---------- بطاقة دعوة التفعيل ---------- */
#naql-push-prompt { position: fixed; z-index: 4000; bottom: 96px; left: 14px; right: 14px; max-width: 460px; margin: 0 auto; display: flex; gap: 14px; align-items: flex-start; padding: 16px; border-radius: 22px; background: #fff; color: #1e293b; box-shadow: 0 20px 70px rgba(0,0,0,.35); border: 1px solid rgba(201,162,39,.45); transform: translateY(40px); opacity: 0; transition: all .4s cubic-bezier(.2,.9,.3,1.2); font-family: 'Cairo', sans-serif; }
#naql-push-prompt.show { transform: none; opacity: 1; }
#naql-push-prompt .npp-icon { flex: 0 0 56px; height: 56px; border-radius: 16px; background: linear-gradient(145deg, #123524, #1f6b4a); display: flex; align-items: center; justify-content: center; box-shadow: 0 6px 18px rgba(18,53,36,.35); }
#naql-push-prompt .npp-icon img { width: 40px; height: 40px; object-fit: contain; border-radius: 10px; }
#naql-push-prompt .npp-title { font-weight: 900; font-size: 1.02rem; color: #123524; }
#naql-push-prompt .npp-text { font-weight: 600; font-size: .84rem; color: #475569; line-height: 1.6; margin: 3px 0 10px; }
#naql-push-prompt .npp-actions { display: flex; gap: 8px; flex-wrap: wrap; }
#naql-push-prompt button { border: 0; border-radius: 12px; padding: 9px 18px; font: 800 .84rem 'Cairo', sans-serif; cursor: pointer; }
#naql-push-prompt .npp-yes { background: linear-gradient(135deg, #e5c14a, #c9a227); color: #1a1405; box-shadow: 0 6px 18px rgba(201,162,39,.4); }
#naql-push-prompt .npp-no { background: #f1f5f9; color: #475569; }
html[data-bs-theme=dark] #naql-push-prompt { background: #0e2019; color: #e6efe9; border-color: rgba(201,162,39,.5); }
html[data-bs-theme=dark] #naql-push-prompt .npp-title { color: #f4d470; }
html[data-bs-theme=dark] #naql-push-prompt .npp-text { color: #9db3a7; }
html[data-bs-theme=dark] #naql-push-prompt .npp-no { background: rgba(255,255,255,.08); color: #d5e2da; }
@media (min-width: 992px) { #naql-push-prompt { bottom: 24px; left: 24px; right: auto; margin: 0; } }

.naql-toast { position: fixed; z-index: 5000; bottom: 110px; left: 50%; transform: translate(-50%, 20px); background: #123524; color: #fff; padding: 11px 22px; border-radius: 30px; font: 800 .86rem 'Cairo', sans-serif; opacity: 0; transition: all .35s; box-shadow: 0 10px 40px rgba(0,0,0,.35); direction: rtl; max-width: 90vw; text-align: center; }
.naql-toast.show { opacity: 1; transform: translate(-50%, 0); }
