/* 인기급상승 토픽 바 - index.php와 토픽 페이지(topic/*)가 공유하는 컴포넌트.
   호스트 페이지에 --text-color CSS 변수가 정의되어 있어야 함
   (index.php, topic/assets/topic.css 둘 다 이미 정의되어 있음). */
.trending-bar {
  display: flex; flex-direction: column; align-items: flex-start; gap: 8px;
  background: linear-gradient(90deg, #fff1f2, #fff7ed);
  border: 1px solid #fecdd3; border-radius: 12px;
  padding: 10px 16px; margin-bottom: 18px;
}
.trending-bar-label {
  display: flex; align-items: center; gap: 4px;
  font-size: 13px; font-weight: 800; color: #e11d48; white-space: nowrap;
}
.trending-bar-list { display: flex; gap: 16px; overflow-x: auto; scrollbar-width: none; width: 100%; }
.trending-bar-list::-webkit-scrollbar { display: none; }
.trending-bar-list a {
  flex-shrink: 0; font-size: 13px; font-weight: 600; color: var(--text-color);
  text-decoration: none; white-space: nowrap;
}
.trending-bar-list a:hover { color: #e11d48; }
.trending-bar-empty { font-size: 12.5px; color: var(--muted-text-color); white-space: nowrap; }