/*
 * Badge component.
 *
 * NEW as of Sprint 7. .cat-tag (the category label on post cards) is a
 * related but visually distinct pattern — text-only, no background —
 * and is deliberately left as-is in components/cards.css rather than
 * migrated to .badge, for the same "don't touch shipped, approved
 * markup" reason buttons.css documents. This component exists for
 * Sprint 10's AI Tools (pricing model: Free/Freemium/Paid), Reviews, and
 * Deals (retailer name) CPTs, which are still unbuilt — DATABASE.md
 * already anticipates these needing exactly this kind of small label.
 *
 * @package TFGadgets
 */

.badge{
	display:inline-flex;
	align-items:center;
	gap:var(--space-1);
	font-family:var(--font-mono);
	font-size:10.5px;
	text-transform:uppercase;
	letter-spacing:.06em;
	padding:4px 10px;
	border:1px solid var(--line-strong);
	border-radius:var(--radius-full);
	color:var(--text-muted);
	background:var(--bg-card);
}

.badge--accent{ border-color:var(--accent); color:var(--accent); }
.badge--outline{ background:transparent; }

/* Semantic variants anticipated by DATABASE.md's Sprint 10 CPT schema
   (ai_tool pricing model / deal retailer) — same visual system, distinct
   colors so "Free" and "Paid" are scannable at a glance in a grid. */
.badge--success{ border-color:var(--cat-2); color:var(--cat-2); } /* e.g. "Free" */
.badge--info{ border-color:var(--cat-1); color:var(--cat-1); }    /* e.g. "Freemium" */
.badge--muted{ color:var(--text-faint); }                          /* e.g. "Paid" */