/* ============================================================
   trending.css — Trending template only.
   Loaded on: is_page_template('trending.php')  (after grid.css)

   Extras layered on top of the shared poster grid: the numbered
   rank badge (gold/silver/bronze for 1-3) and the comment-count
   meta row.
   ============================================================ */

/* Rank badge — top-left corner */
.rank-badge {
  position:        absolute;
  top:             8px;
  left:            8px;
  z-index:         3;
  min-width:       24px;
  height:          24px;
  padding:         0 6px;
  border-radius:   7px;
  background:      rgba(0, 0, 0, 0.72);
  border:          1px solid rgba(255, 255, 255, 0.12);
  display:         flex;
  align-items:     center;
  justify-content: center;
  font-size:       11px;
  font-weight:     800;
  color:           var(--accent);
  line-height:     1;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

/* Gold / Silver / Bronze for ranks 1-3 */
.rank-badge.rank-1 { color: #FFD700; border-color: rgba(255, 215,   0, 0.40); }
.rank-badge.rank-2 { color: #C0C0C0; border-color: rgba(192, 192, 192, 0.40); }
.rank-badge.rank-3 { color: #CD7F32; border-color: rgba(205, 127,  50, 0.40); }

/* Meta row under the title */
.post-card .card-meta {
  display:     flex;
  align-items: center;
  gap:         8px;
}

/* Comment-count pill */
.post-card .card-comments {
  display:     inline-flex;
  align-items: center;
  gap:         3px;
  font-size:   10px;
  color:       rgba(255, 255, 255, 0.40);
  margin-left: auto;
}
.post-card .card-comments svg { width: 10px; height: 10px; flex-shrink: 0; }