.clocksContainer {
	display: flex;
	gap: var(--s-2);
}

.clock {
	font-size: var(--font-sm);
	font-weight: var(--weight-bold);
	color: var(--color-text-high);
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	flex: 1 1 0;
	line-height: 1.3;
}

.clockCountry {
	color: var(--color-text) !important;
	white-space: nowrap;
	font-size: var(--font-xs);
}

.frontPageLink {
	background-color: var(--color-bg-high);
	border-radius: var(--radius-field);
	padding: var(--s-2);
	font-size: var(--font-sm);
	color: var(--color-text);
	font-weight: var(--weight-bold);
	display: flex;
	align-items: center;
	gap: var(--s-3);
	transition: background-color 0.2s;

	&:hover {
		background-color: var(--color-bg-higher);
	}
}

.linkSubText {
	color: var(--color-text-high);
	font-size: var(--font-2xs);
	font-weight: var(--weight-body);
}
