/* Badge (status/meta), chip (filter/category pill, can be a link or button), tag (link cloud).
   Tones: --neutral (location), --brand (featured, full time), --accent (new, part time), --success (internship, remote),
   --warning (contract, temporary), --danger (urgent, expired), --muted (filled). Text on tint >= 4.5:1. */
.c-badge {
	display: inline-flex; align-items: center; gap: 0.375rem;
	min-height: 1.5rem; padding: 0.125rem 0.625rem;
	font-size: var(--fs-12); line-height: 1.4; font-weight: var(--fw-semibold); white-space: nowrap;
	color: var(--color-text-2); background: var(--pn-gray-100); border: 1px solid var(--pn-gray-200); border-radius: var(--radius-pill);
}
.c-badge .icon { width: 0.875rem; height: 0.875rem; }
.c-badge--brand { color: var(--pn-brand-700); background: var(--pn-brand-50); border-color: var(--pn-brand-200); }
.c-badge--accent { color: var(--pn-accent-900); background: var(--pn-accent-50); border-color: var(--pn-accent-200); }
.c-badge--success { color: var(--color-success); background: var(--color-success-bg); border-color: #c5e3cf; }
.c-badge--warning { color: var(--color-warning); background: var(--color-warning-bg); border-color: #ecd6b3; }
.c-badge--danger { color: var(--color-danger); background: var(--color-danger-bg); border-color: #f0c6c6; }
.c-badge--muted { color: var(--color-text-muted); background: transparent; border-color: var(--pn-gray-300); }
.c-badge--solid { color: #fff; background: var(--color-primary); border-color: var(--color-primary); }
.c-badge--dot::before { content: ""; width: 0.375rem; height: 0.375rem; border-radius: 50%; background: currentColor; }

.c-chip {
	display: inline-flex; align-items: center; gap: var(--space-1);
	min-height: var(--control-h-sm); padding: 0.375rem 0.875rem;
	font-size: var(--fs-13); font-weight: var(--fw-semibold); text-decoration: none; white-space: nowrap;
	color: var(--color-text-2); background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-pill);
	transition: background-color var(--dur-fast) var(--ease), border-color var(--dur-fast) var(--ease), color var(--dur-fast) var(--ease);
}
.c-chip:hover { color: var(--pn-brand-700); border-color: var(--pn-brand-300); background: var(--pn-brand-50); }
.c-chip.is-active, .c-chip[aria-current], .c-chip[aria-pressed="true"] { color: #fff; background: var(--color-primary); border-color: var(--color-primary); }
.c-chip__remove { display: inline-grid; place-items: center; width: 1.25rem; height: 1.25rem; margin-right: -0.375rem; border-radius: 50%; }
.c-chip__count { font-weight: var(--fw-regular); opacity: 0.8; }

.c-tags { display: flex; flex-wrap: wrap; gap: var(--space-2); margin: 0; padding: 0; list-style: none; }
.c-tag { display: inline-block; padding: 0.375rem 0.75rem; font-size: var(--fs-13); font-weight: var(--fw-medium); text-decoration: none; color: var(--color-text-2); background: var(--pn-gray-100); border-radius: var(--radius-pill); }
.c-tag:hover { color: var(--pn-brand-700); background: var(--pn-brand-100); }
.c-badges { display: flex; flex-wrap: wrap; gap: 0.375rem; }