/**
 * GV Metal Prices — deliberately minimal.
 * Colours come from CSS variables set by the plugin settings.
 * Everything else is left for the theme / page builder to style.
 */

:root {
	--gv-mp-up: #1a9e5c;
	--gv-mp-down: #d33a2c;
	--gv-mp-flat: #8a8a8a;
}

.is-up {
	color: var(--gv-mp-up);
}

.is-down {
	color: var(--gv-mp-down);
}

.is-flat {
	color: var(--gv-mp-flat);
}

/* Ticker shortcode wrapper. Only used by [gv_metal_ticker]. */
.gv-ticker {
	display: flex;
	flex-wrap: wrap;
	gap: 1.25rem 2rem;
	align-items: center;
}

.gv-ticker--stacked {
	flex-direction: column;
	align-items: flex-start;
}

.gv-ticker__item {
	display: flex;
	align-items: baseline;
	gap: 0.5rem;
	line-height: 1.3;
}

.gv-ticker--stacked .gv-ticker__item {
	flex-direction: column;
	align-items: flex-start;
	gap: 0.15rem;
}

.gv-ticker__label {
	font-weight: 600;
	letter-spacing: 0.04em;
	text-transform: uppercase;
}

.gv-ticker__price {
	font-variant-numeric: tabular-nums;
	font-weight: 700;
}

.gv-ticker__change,
.gv-ticker__pct,
.gv-ticker__combined {
	font-variant-numeric: tabular-nums;
	font-size: 0.9em;
}

.gv-ticker__updated {
	flex-basis: 100%;
	font-size: 0.8em;
	opacity: 0.7;
}

@media (max-width: 600px) {
	.gv-ticker {
		gap: 0.5rem 1.25rem;
		justify-content: center;
	}
}