/* chat.css — قائمة إشعارات العميل (تُستخدم الآن أيضاً كواجهة استقبال رسائل الأدمن) */

/* ═══ NOTIFICATION SYSTEM ═══ */
.notif-wrap { position: relative; display: inline-flex; }

.notif-bdg {
  position: absolute; top: -6px; left: -6px;
  background: var(--red); color: #fff;
  width: 17px; height: 17px; border-radius: 50%;
  font-size: 9px; font-weight: 700;
  display: none; align-items: center; justify-content: center;
  font-family: 'Space Mono', monospace; pointer-events: none; z-index: 2;
}

.notif-bdg.show { display: flex; }

.notif-drop {
  position: absolute; top: calc(100% + 10px); left: 0;
  width: min(340px, 90vw);
  background: var(--off); border: 1px solid var(--border);
  z-index: 1200; display: none; flex-direction: column;
  box-shadow: 0 8px 32px rgba(0,0,0,.7);
  max-height: 420px; overflow: hidden;
}

.notif-drop.open { display: flex; }

.notif-drop-h {
  padding: 12px 16px; border-bottom: 1px solid var(--border);
  display: flex; align-items: center; justify-content: space-between; flex-shrink: 0;
}

.notif-drop-h span { font-family:'Space Mono',monospace; font-size:9px; letter-spacing:2px; color:var(--gold); }

.notif-mark-all {
  background: transparent; border: 1px solid var(--border); color: var(--muted);
  font-family:'Space Mono',monospace; font-size:8px; padding:3px 8px; transition:all .2s;
  min-height:auto;
}

.notif-mark-all:hover { border-color:var(--gold); color:var(--gold); }

.notif-list { flex:1; overflow-y:auto; }

.notif-item {
  padding: 12px 16px; border-bottom: 1px solid var(--b2);
  display: flex; gap: 10px; align-items: flex-start;
  transition: background .2s; cursor: pointer;
}

.notif-item:hover { background: var(--card); }

.notif-item.unseen { background: rgba(201,168,76,.05); border-right: 3px solid var(--gold); }

.notif-ico { font-size: 18px; flex-shrink: 0; margin-top: 1px; }

.notif-body { flex:1; min-width:0; }

.notif-msg { font-size: 12px; color: var(--white); line-height: 1.45; }

.notif-time { font-family:'Space Mono',monospace; font-size: 9px; color: var(--muted); margin-top: 3px; }

.notif-empty { padding: 32px 16px; text-align: center; color: var(--muted); font-size: 12px; }

.nib{background:transparent;border:1px solid var(--border);color:var(--muted);padding:7px 11px;font-family:'Space Mono',monospace;font-size:9px;letter-spacing:.5px;transition:all .22s;white-space:nowrap;position:relative;display:flex;align-items:center;gap:5px}

.nib:hover{border-color:var(--gold);color:var(--gold)}

.nib.act{background:var(--gold);color:var(--black);border-color:var(--gold);font-weight:700}