/**
 * TRENDING BAR — Barra de tags tendencia
 * Cargado solo donde se renderiza (header, mobile).
 */

.informe-trending-bar {
	display: flex;
	flex-wrap: nowrap;
	gap: var(--space-3);
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
	padding: var(--space-2) 0;
}

.informe-trending-bar::-webkit-scrollbar {
	display: none;
}

.informe-trending-bar__tag {
	flex: 0 0 auto;
	scroll-snap-align: start;
	font-family: var(--font-sans, MarcinAntB, sans-serif);
	font-size: 0.8125rem;
	font-weight: 700;
	color: #fff;
	background: var(--color-primary, #f85b1b);
	padding: var(--space-1) var(--space-3);
	border-radius: 4px;
	text-decoration: none;
	white-space: nowrap;
	transition: background 0.2s ease;
}

.informe-trending-bar__tag:hover {
	background: #e14a00;
	color: #fff;
}

/* Solo mobile: añadir clase --mobile-only al nav */
.informe-trending-bar--mobile-only {
	display: none;
}
@media (max-width: 767px) {
	.informe-trending-bar--mobile-only {
		display: flex;
	}
}

.informe-home-header__trending {
	margin-top: var(--space-2);
}