/* ============================================================
 * BIOTA · PRIMITIVE · Badge
 * Small pill label overlaid on cards (bestseller, discount, …).
 * inline-block + align-self:flex-start so it shrinks to its text and
 * sits left inside a flex column (e.g. a tile's inner container).
 * ============================================================ */

.biota-badge {
	display: inline-block;
	align-self: flex-start;
	margin: 0;
	border-radius: 20px;
	padding: 5px 12px;
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--caption);
	font-weight: 600;
	line-height: 1;
}

.biota-badge--warm {
	background-color: var(--wp--preset--color--accent-warm);
	color: var(--wp--preset--color--primary);
}

.biota-badge--sale {
	background-color: var(--wp--preset--color--sale-surface); /* #FDECEC (Figma) */
	color: var(--wp--preset--color--sale);                    /* #D0342C */
	font-weight: 700;
	border-radius: 8px;
	padding: 5px 10px;
}

/* Neutral chip (e.g. payment methods in the footer). */
.biota-badge--muted {
	background-color: var(--wp--preset--color--surface-subtle);
	color: var(--wp--preset--color--primary);
	font-weight: 500;
	border-radius: 6px;
	padding: 6px 10px;
}