/*
 * F1 Stats, styled for a white background.
 *
 * Fonts are inherited from the theme, except positions, which are set in
 * Caveat (the plugin loads its digits). Override any colour in your theme:
 *   --f1s-ink     text                     #0a1e4a
 *   --f1s-muted   round, location, gap     #4c5878
 *   --f1s-line    row rules                #d9dfec
 *   --f1s-accent  positions, sprint label  #2749b6
 */

.f1s-races,
.f1s-standings {
	--_ink: var(--f1s-ink, #0a1e4a);
	--_muted: var(--f1s-muted, #4c5878);
	--_line: var(--f1s-line, #d9dfec);
	--_accent: var(--f1s-accent, #2749b6);

	list-style: none;
	margin: 0;
	padding: 0;
	font-weight: 400;
	line-height: 1.5;
	color: var(--_ink);
	border-top: 1px solid var(--_line);
}

/* Margin only: this selector outranks .f1s-race, so padding is left to it. */
.f1s-races > li,
.f1s-standings > li {
	margin: 0;
}

/* Upcoming races ------------------------------------------------------- */

.f1s-race {
	display: grid;
	grid-template-columns: 72px 1fr auto;
	gap: 20px;
	align-items: center;
	padding: 13px 0;
	border-bottom: 1px solid var(--_line);
}

.f1s-race__round {
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	white-space: nowrap;
	color: var(--_muted);
}

.f1s-race__title,
.f1s-race__when {
	font-weight: 700;
	letter-spacing: -0.035em;
	line-height: 0.92;
}

.f1s-race__title {
	font-size: clamp(19px, 2vw, 24px);
}

.f1s-race__name {
	font-weight: inherit;
	color: inherit;
}

.f1s-race__location {
	margin-left: 10px;
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0;
	color: var(--_muted);
}

.f1s-race__when {
	font-size: clamp(16px, 1.6vw, 20px);
	text-align: right;
	white-space: nowrap;
}

.f1s-race__sprint {
	margin-left: 8px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.06em;
	color: var(--_accent);
}

@media (max-width: 900px) {
	.f1s-race {
		grid-template-columns: 1fr auto;
	}

	.f1s-race__round {
		display: none;
	}
}

@media (max-width: 760px) {
	.f1s-race {
		padding: 11px 0;
	}

	.f1s-race__location {
		display: block;
		margin: 2px 0 0;
	}
}

/* Standings ------------------------------------------------------------ */

.f1s-standings {
	display: grid;
	grid-template-columns: auto 1fr auto;
	column-gap: 14px;
	font-size: 15px;
}

.f1s-driver {
	display: grid;
	grid-column: 1 / -1;
	grid-template-columns: subgrid;
}

.f1s-driver > span {
	display: flex;
	align-items: center;
	padding: 11px 0;
	border-bottom: 1px solid var(--_line);
}

.f1s-driver__pos {
	width: 26px;
	font-family: "Caveat", cursive;
	font-size: 26px;
	font-weight: 700;
	line-height: 1;
	color: var(--_accent);
}

.f1s-driver__name {
	font-weight: 600;
}

.f1s-driver__points {
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
	color: var(--_muted);
}

.f1s-driver__points strong {
	color: var(--_ink);
}

.f1s-empty {
	font-size: 15px;
	color: var(--f1s-muted, #4c5878);
}
