/**
 * News Element — Taxonomy Pills block (from news-element's
 * taxomony-slider). Structure only; spacing, colours, sizes and the badge
 * come from the block's controls. The slider is .ne-carousel (Splide,
 * assets/js/carousel.js; arrow styles in blocks/post-carousel/style.css).
 */

.ne-pills-row {
	display: flex;
	flex-wrap: wrap;
	/* Room for badges that sit above the pills. */
	padding-top: 10px;
}

.ne-pills .ne-pill,
.ne-pills-row .ne-pill,
.ne-pills-slider .ne-pill {
	display: inline-flex;
	align-items: center;
	text-decoration: none;
	transition: background 0.2s ease, border-color 0.2s ease;
}

.ne-pill .ft-thumbwrap {
	display: block;
	flex: 0 0 auto;
}

.ne-pill-text {
	display: flex;
	flex-direction: column;
	line-height: 1.3;
	white-space: nowrap;
}

.ne-pill-badge {
	position: absolute;
	z-index: 1;
	line-height: 1.4;
	white-space: nowrap;
}

/* Slider: pills keep their own width; the track leaves room for badges. */
.ne-pills-slider .splide__track {
	padding-top: 10px;
}

.ne-pills-slider:not(.is-initialized) .splide__slide {
	flex: 0 0 auto;
}

.ne-pills-empty {
	margin: 0;
	padding: 20px;
	text-align: center;
	border: 1px dashed currentColor;
	opacity: 0.6;
}

@media (prefers-reduced-motion: reduce) {
	.ne-pills-row .ne-pill,
	.ne-pills-slider .ne-pill {
		transition: none;
	}
}
