/* ── notifications.css — in-app notification feed (top of Sessions page) ──── */

.notif-feed { margin-bottom: 16px; }

.notif-feed-hdr {
  display: flex; justify-content: flex-end; margin-bottom: 6px;
}
.notif-feed-clear {
  font-size: 12px; font-weight: 600; color: var(--text-secondary);
  background: none; border: none; cursor: pointer; font-family: inherit;
  padding: 4px 6px;
}
.notif-feed-clear:hover { color: var(--text); }

.notif-card {
  display: flex; align-items: flex-start; gap: 4px;
  background: var(--surface); border: 0.5px solid var(--border);
  border-left: 3px solid var(--notif-info);
  border-radius: var(--radius-sm);
  padding: 10px 6px 10px 12px;
  margin-bottom: 8px;
  transition: transform 0.2s ease, opacity 0.2s ease;
  touch-action: pan-y;
}
.notif-card.notif-urgent { border-left-color: var(--notif-urgent); }

.notif-card-body {
  flex: 1; min-width: 0; cursor: pointer;
}
.notif-card-title { font-size: 13px; font-weight: 600; color: var(--text); }
.notif-card-text { font-size: 12px; color: var(--text-secondary); margin-top: 2px; }

.notif-card-close {
  flex-shrink: 0; width: 28px; height: 28px;
  display: flex; align-items: center; justify-content: center;
  font-size: 13px; line-height: 1; color: var(--text-tertiary);
  background: none; border: none; cursor: pointer; border-radius: 50%;
  font-family: inherit;
}
.notif-card-close:hover { color: var(--text); background: var(--bg); }