/* ============================================================
   Voted community tier list view. Reuses the maker's tier-row
   layout (tierlist.css); owns the vote dropdowns and status.
   ============================================================ */

.tlv-page .tlp-tier-label { cursor: default; }

.tlv-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 12px;
  margin-bottom: clamp(18px, 2.6vw, 26px);
  min-height: 1px;
}
.tlv-note { font-size: 13.5px; color: var(--text-dim); text-align: center; }

/* toolbar (hide-votes toggle) */
.tlv-tools {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 6px;
  margin-bottom: clamp(16px, 2.4vw, 24px);
}

/* chip with a vote dropdown */
.tlv-chip {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 6px 5px 5px;
  border: 1px solid var(--hairline);
  border-radius: 999px;
  background: rgba(255,255,255,.04);
}
.tlv-chip img { width: 26px; height: 26px; border-radius: 6px; image-rendering: pixelated; flex: 0 0 auto; }
.tlv-chip .nm { font-size: 13px; font-weight: 600; color: var(--text); max-width: 130px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tlv-chip .votes {
  font-size: 10.5px; font-weight: 700;
  color: var(--text-mute);
  white-space: nowrap;
}
.tlv-vote {
  appearance: none;
  height: 26px; padding: 0 20px 0 8px;
  border: 1px solid var(--hairline); border-radius: 8px;
  background: var(--bg-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%23A4B4C8' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") no-repeat right 6px center;
  color: var(--text); font: inherit; font-size: 11.5px; cursor: pointer;
}
.tlv-vote:disabled { opacity: .45; cursor: default; }
.tlv-chip.voted { border-color: rgba(126,231,135,.5); }

.tlv-back { margin-top: clamp(20px, 3vw, 30px); text-align: center; font-size: 14px; }
.tlv-back a { color: var(--text-dim); font-weight: 600; }
.tlv-back a:hover { color: var(--text); }