/* =========================
   主题列表 meta（点赞 / 浏览 / 回复）
   ========================= */

.topic-meta{
  display:inline-flex;
  align-items:center;
  gap:14px;
  margin-top:6px;
  font-size:13px;
  color:#94a3b8; /* 冷灰，适合深色背景 */
}

.topic-meta .meta-item{
  display:inline-flex;
  align-items:center;
  gap:4px;
  line-height:1;
  white-space:nowrap;
  user-select:none;
}

/* 回复是链接时 */
.topic-meta .meta-link{
  color:#94a3b8;
  text-decoration:none;
  transition:color .15s ease,transform .15s ease;
}

.topic-meta .meta-link:hover{
  color:#60a5fa;
  transform:translateY(-1px);
}

/* 数字等宽，防止跳动 */
.topic-meta .meta-item span,
.topic-meta .meta-item strong{
  font-variant-numeric:tabular-nums;
}

/* 整行 hover 时 meta 略微提亮 */
.topic-row:hover .topic-meta{
  color:#cbd5f5;
}
.topic-row{
  cursor:pointer;
  border-radius:12px;
  transition: background .12s ease, transform .12s ease;
}
.topic-row:hover{
  background: rgba(148,163,184,.08);
}
.topic-row:active{
  transform: translateY(1px);
}

/* =========================
   Notifications
   ========================= */
.notif-item{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  padding:12px;
  border-top:1px solid #1f2937;
  border-radius:12px;
  text-decoration:none;
  color:inherit;
  transition: transform .12s ease, background .12s ease, box-shadow .12s ease;
}

.notif-item:hover{
  background: rgba(96,165,250,.08);
  transform: translateY(-1px);
}

.notif-left{
  display:flex;
  gap:10px;
  align-items:flex-start;
}

.notif-icon{
  width:34px;
  height:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  background:#0b1220;
  border:1px solid #334155;
  font-size:16px;
  flex:0 0 auto;
}

.notif-main{min-width:0}
.notif-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:720px}
.notif-meta{display:flex;gap:8px;align-items:center;margin-top:4px}

.notif-type{
  background:#1f2937;
  border:1px solid #334155;
}

.notif-right{display:flex;align-items:center;gap:8px}

.notif-dot{
  width:10px;height:10px;border-radius:999px;
  background:#60a5fa;
  box-shadow:0 0 0 0 rgba(96,165,250,.6);
  animation:notifPulse 1.6s infinite;
}

@keyframes notifPulse{
  0%{ box-shadow:0 0 0 0 rgba(96,165,250,.55) }
  70%{ box-shadow:0 0 0 10px rgba(96,165,250,0) }
  100%{ box-shadow:0 0 0 0 rgba(96,165,250,0) }
}

.notif-item.is-read{
  opacity:.75;
}

.notif-item.is-unread{
  background: rgba(96,165,250,.06);
  border:1px solid rgba(96,165,250,.18);
}
/* ===== Notifications ===== */
.notify-toolbar{
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:space-between;
}
.notify-actions{ display:flex; gap:8px; align-items:center; }

.notification-list{ padding: 6px 0; }

.notify-item{
  display:flex;
  gap:12px;
  align-items:flex-start;
  padding:12px 14px;
  border-top:1px solid rgba(255,255,255,.06);
  text-decoration:none;
  border-radius:12px;
  margin:6px 8px;
  background: rgba(255,255,255,.02);
  transition: transform .12s ease, background .12s ease, box-shadow .12s ease;
}
.notify-item:hover{
  transform: translateY(-1px);
  background: rgba(255,255,255,.04);
  box-shadow: 0 6px 18px rgba(0,0,0,.18);
}
.notify-icon{
  width:34px;
  height:34px;
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  background: rgba(37,99,235,.18);
  flex: 0 0 34px;
}
.notify-body{ flex:1; min-width:0; }
.notify-title{
  font-weight:700;
  margin-bottom:4px;
  color: #cfe3ff;
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.notify-meta{
  font-size:12px;
  opacity:.8;
  display:flex;
  gap:8px;
  align-items:center;
}
.badge-new{
  background: rgba(37,99,235,.25);
  border: 1px solid rgba(37,99,235,.35);
  padding:2px 8px;
  border-radius:999px;
  font-size:12px;
}
.badge-type{
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  padding:2px 8px;
  border-radius:999px;
  font-size:12px;
}

/* unread highlight + pulse */
.notify-item.unread{
  background: rgba(37,99,235,.10);
  border: 1px solid rgba(37,99,235,.20);
}
.notify-item.unread .notify-icon{
  animation: notifyPulse 1.6s ease-in-out infinite;
}
@keyframes notifyPulse{
  0%,100%{ transform: scale(1); filter: brightness(1); }
  50%{ transform: scale(1.06); filter: brightness(1.15); }
}

.notify-chevron{
  opacity:.55;
  font-size:20px;
  line-height:20px;
  margin-top:4px;
}

/* pagination */
.pagination{
  display:flex;
  gap:8px;
  justify-content:center;
  margin-top:12px;
}
.pagination a{
  display:inline-flex;
  min-width:34px;
  height:34px;
  align-items:center;
  justify-content:center;
  border-radius:10px;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.08);
}
.pagination a.active{
  background: rgba(37,99,235,.25);
  border-color: rgba(37,99,235,.35);
}

/* =========================
   Icons (navbar / sidebar)
   ========================= */
.nav .btn .ico,
.nav .brand .ico{
  width:16px;
  height:16px;
  display:inline-block;
  vertical-align:-3px;
  margin-right:6px;
  opacity:.9;
}

.sidebar-item{
  display:flex;
  align-items:center;
  gap:8px;
}
.sidebar-item .ico{
  width:14px;
  height:14px;
  opacity:.8;
}


/* =========================
   Sidebar categories: collapse + today badge
   ========================= */
.cat-toggle-btn{
  width:30px;
  height:30px;
  border-radius:10px;
  font-weight:800;
  line-height:1;
}

.cat-new-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:20px;
  padding:0 8px;
  border-radius:999px;
  font-size:12px;
  font-weight:800;
  background: rgba(34,197,94,.18);
  border: 1px solid rgba(34,197,94,.28);
  color: rgba(34,197,94,.95);
}

/* lucky draw */
.lucky-box{
  display:flex;
  gap:14px;
  align-items:flex-start;
  flex-wrap:wrap;
}
.lucky-result{
  font-weight:800;
  font-size:18px;
}


.nav-user{display:flex;align-items:center;gap:8px;}
.nav-user .pill{margin-left:0;}

