/* --- Tags --- */

.tag {
  display: inline-flex;
  align-items: center;
  padding: 0.125rem 0.375rem;
  border-radius: 9999px;
  font-size: 0.65rem;
  font-weight: 500;
  line-height: 1;
  margin-left: 0.5rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  vertical-align: middle;
}

.tag-pre {
  background-color: rgba(245, 158, 11, 0.1);
  color: #d97706;
  /* Amber-600 */
  border: 1px solid rgba(245, 158, 11, 0.2);
}

.tag-post {
  background-color: rgba(59, 130, 246, 0.1);
  color: #2563eb;
  /* Blue-600 */
  border: 1px solid rgba(59, 130, 246, 0.2);
}

.dark .tag-post {
  background-color: rgba(59, 130, 246, 0.2);
  color: #60a5fa;
  /* Blue-400 */
}

.tag-mfn {
  background-color: rgba(139, 92, 246, 0.1);
  color: #7c3aed;
  /* Violet-600 */
  border: 1px solid rgba(139, 92, 246, 0.2);
}

.dark .tag-mfn {
  background-color: rgba(139, 92, 246, 0.2);
  color: #a78bfa;
  /* Violet-400 */
}

.tag-topup {
  background-color: rgba(16, 185, 129, 0.1);
  color: #059669;
  /* Emerald-600 */
  border: 1px solid rgba(16, 185, 129, 0.2);
}

.dark .tag-topup {
  background-color: rgba(16, 185, 129, 0.2);
  color: #34d399;
  /* Emerald-400 */
}

/* Input List MFN Tag */
.mfn-valuation-tag {
  display: block;
  margin-top: 0.25rem;
  font-size: 0.7rem;
  color: #7c3aed;
  /* Violet */
  background: rgba(139, 92, 246, 0.05);
  padding: 2px 6px;
  border-radius: 4px;
  width: fit-content;
}

.dark .mfn-valuation-tag {
  color: #a78bfa;
  background: rgba(139, 92, 246, 0.15);
}