/*
 * RacerPacer Runs: the schedule, a run's details, the route dialog and the club card.
 *
 * Every colour comes from the --rpr-* custom properties that render.php writes onto
 * the .rpr wrapper, already contrast-checked (see includes/style.php). No hex values
 * here. Text that sits straight on the page is never given a colour, so it takes the
 * theme's; only cards, buttons and the dialog set their own.
 *
 * Ported from racerpacer-clubs 1.8.5 (assets/css/club-page.css).
 */


@font-face {
	font-family: "Epunda Slab";
	font-style: normal;
	font-weight: 400 900;
	font-display: swap;
	src: url("../fonts/EpundaSlab-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "Epunda Slab";
	font-style: normal;
	font-weight: 400 900;
	font-display: swap;
	src: url("../fonts/EpundaSlab-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
	font-family: "Epunda Sans";
	font-style: normal;
	font-weight: 300 700;
	font-display: swap;
	src: url("../fonts/EpundaSans-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
	font-family: "Epunda Sans";
	font-style: normal;
	font-weight: 300 700;
	font-display: swap;
	src: url("../fonts/EpundaSans-latin-ext.woff2") format("woff2");
	unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

*,

.rpr,
.rpr *,
.rpr *::before,
.rpr *::after {
	box-sizing: border-box;
}
.rpr {
	font-family: var(--rpr-font-body);
	line-height: 1.55;
}
.rpr-mode-dark .rpr-run,
.rpr-mode-dark .rpr-details,
.rpr-mode-dark .rpr-dialog {
	color-scheme: dark;
}

/* "Use my theme's colours": everything is drawn from the text colour around it. */
.rpr.rpr-inherit {
	--rpr-bg: transparent;
	--rpr-surface: transparent;
	--rpr-text: currentColor;
	--rpr-muted: currentColor;
	--rpr-border: color-mix(in srgb, currentColor 22%, transparent);
	--rpr-edge: color-mix(in srgb, currentColor 55%, transparent);
	--rpr-accent: currentColor;
	--rpr-on-accent: Canvas;
	--rpr-accent-text: currentColor;
	--rpr-radius: 999px;
	--rpr-font-head: inherit;
	--rpr-font-body: inherit;
	--rpr-head-weight: 700;
	font-family: inherit;
}
.rpr.rpr-inherit .rpr-dialog {
	background: Canvas;
	color: CanvasText;
}

.rpr .rpr-icon {
	flex: none;
	width: 18px;
	height: 18px;
}
.rpr :focus-visible {
	outline: 3px solid var(--rpr-accent-text);
	outline-offset: 3px;
}
.rpr .rpr-h2 {
	margin: 0 0 14px;
	font-family: var(--rpr-font-head);
	font-weight: var(--rpr-head-weight);
	font-size: 22px;
	line-height: 1.2;
	letter-spacing: -0.01em;
}
.rpr .rpr-empty {
	margin: 0;
}

/* ---- Run cards ---- */
.rpr .rpr-runs {
	display: grid;
	gap: 10px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.rpr .rpr-run,
.rpr .rpr-details {
	padding: 16px 18px;
	border-radius: 16px;
	background: var(--rpr-surface);
	color: var(--rpr-text);
	box-shadow: inset 0 0 0 1px var(--rpr-border);
	font-size: 16px;
}
.rpr .rpr-details {
	margin: 0 0 28px;
}
.rpr .rpr-run p,
.rpr .rpr-details p {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin: 0;
}
.rpr .rpr-run p + p,
.rpr .rpr-details p + p {
	margin-top: 6px;
}
.rpr .rpr-run p > .rpr-icon,
.rpr .rpr-details p > .rpr-icon {
	margin-top: 3px;
	color: var(--rpr-accent-text);
}
.rpr .rpr-run-when {
	font-weight: 600;
}
.rpr .rpr-run .rpr-run-title {
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	font-family: var(--rpr-font-head);
	font-weight: var(--rpr-head-weight);
	font-size: 19px;
	line-height: 1.25;
}
.rpr .rpr-run a,
.rpr .rpr-details a:not(.rpr-chip),
.rpr .rpr-table a {
	color: inherit;
	text-decoration-color: var(--rpr-accent-text);
	text-underline-offset: 3px;
}
.rpr .rpr-run-title a {
	text-decoration: none;
}
.rpr .rpr-run-title a:hover {
	text-decoration: underline;
}
.rpr .rpr-run .rpr-run-note,
.rpr .rpr-details .rpr-run-note {
	display: block;
	padding-left: 28px;
	color: var(--rpr-muted);
	font-size: 14px;
}
.rpr .rpr-run .rpr-run-cta {
	margin-top: 10px;
	padding-left: 28px;
}
.rpr .rpr-badge {
	display: inline-block;
	padding: 2px 10px;
	border-radius: 999px;
	box-shadow: inset 0 0 0 1px var(--rpr-edge);
	font-family: var(--rpr-font-body);
	font-size: 13px;
	font-weight: 600;
	line-height: 1.5;
}
.rpr .rpr-details .rpr-details-actions {
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 14px;
}

/* ---- Schedule as a table ---- */
.rpr .rpr-table-wrap {
	overflow-x: auto;
	border-radius: 16px;
	background: var(--rpr-surface);
	color: var(--rpr-text);
	box-shadow: inset 0 0 0 1px var(--rpr-border);
}
.rpr .rpr-table {
	width: 100%;
	min-width: 560px;
	margin: 0;
	border: 0;
	border-collapse: collapse;
	font-size: 15px;
}
.rpr .rpr-table th,
.rpr .rpr-table td {
	padding: 12px 16px;
	border: 0;
	border-bottom: 1px solid var(--rpr-border);
	text-align: left;
	vertical-align: top;
}
.rpr .rpr-table tbody tr:last-child td {
	border-bottom: 0;
}
.rpr .rpr-table th {
	color: var(--rpr-muted);
	font-size: 13px;
	font-weight: 600;
}
.rpr .rpr-table-when {
	font-weight: 600;
	white-space: nowrap;
}

/* ---- Chips ---- */
.rpr .rpr-chip {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 40px;
	padding: 8px 16px;
	border: 0;
	border-radius: 999px;
	background: var(--rpr-surface);
	box-shadow: inset 0 0 0 1px var(--rpr-edge);
	color: var(--rpr-text);
	font: inherit;
	font-size: 14px;
	line-height: 1.3;
	text-decoration: none;
	cursor: pointer;
}
.rpr .rpr-chip:hover {
	color: var(--rpr-accent-text);
}
.rpr .rpr-chip-small {
	min-height: 30px;
	margin-left: 6px;
	padding: 4px 12px;
	font-size: 13px;
}

/* ---- Routes ---- */
.rpr .rpr-dialog {
	width: min(760px, calc(100vw - 32px));
	max-width: none;
	padding: 24px;
	border: 0;
	border-radius: 24px;
	background: var(--rpr-surface);
	color: var(--rpr-text);
	font-family: var(--rpr-font-body);
	font-size: 16px;
}
.rpr .rpr-dialog::backdrop {
	background: rgba(0, 0, 0, 0.55);
}
.rpr .rpr-route-summary {
	margin: 0 0 14px;
	color: var(--rpr-muted);
}
.rpr .rpr-route-map {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: min(52vh, 380px);
	border-radius: 14px;
	background: var(--rpr-surface);
	box-shadow: inset 0 0 0 1px var(--rpr-border);
	color: var(--rpr-muted);
	font-size: 14px;
	overflow: hidden;
}
.rpr .rpr-route-map .maplibregl-map {
	width: 100%;
	height: 100%;
}
.rpr .rpr-route-loading {
	margin: 0;
}
.rpr .rpr-route-profile {
	margin: 14px 0 0;
}
.rpr .rpr-route-profile svg {
	display: block;
	width: 100%;
	height: 90px;
	overflow: visible;
}
.rpr .rpr-profile-fill {
	fill: var(--rpr-accent-text);
	opacity: 0.16;
}
.rpr .rpr-profile-line {
	stroke: var(--rpr-accent-text);
	stroke-width: 2;
	stroke-linejoin: round;
	vector-effect: non-scaling-stroke;
}
.rpr .rpr-route-profile figcaption {
	margin-top: 6px;
	color: var(--rpr-muted);
	font-size: 14px;
}
.rpr .rpr-route-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 16px;
}
.rpr .rpr-route-actions form {
	margin: 0;
}
.rpr .rpr-route-credit {
	margin: 12px 0 0;
	color: var(--rpr-muted);
	font-size: 13px;
}

/* ---- Club card ---- */
.rpr .rpr-club {
	max-width: 580px;
	margin-inline: auto;
}
.rpr .rpr-head {
	text-align: center;
}
.rpr .rpr-logo {
	display: inline-flex;
	width: 112px;
	height: 112px;
	margin-bottom: 16px;
	overflow: hidden;
	border-radius: 50%;
	background: var(--rpr-surface);
	box-shadow: 0 0 0 1px var(--rpr-border), 0 6px 20px rgba(0, 0, 0, 0.12);
}
.rpr-logo-rounded .rpr-logo {
	border-radius: 24px;
}
.rpr .rpr-logo img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.rpr .rpr-monogram {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	background: var(--rpr-accent);
	color: var(--rpr-on-accent);
	font-family: var(--rpr-font-head);
	font-size: 40px;
	letter-spacing: 0.02em;
}
.rpr .rpr-name {
	margin: 0;
	font-family: var(--rpr-font-head);
	font-weight: var(--rpr-head-weight);
	font-size: clamp(28px, 7vw, 40px);
	line-height: 1.1;
	letter-spacing: -0.02em;
	text-wrap: balance;
}
.rpr .rpr-tagline {
	margin: 10px 0 0;
	font-size: 18px;
	text-wrap: balance;
}
.rpr .rpr-meta {
	margin: 8px 0 0;
	font-size: 14px;
	opacity: 0.8;
}
.rpr .rpr-socials {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px;
	margin: 20px 0 0;
	padding: 0;
	list-style: none;
}
.rpr .rpr-socials a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	color: inherit;
	transition: background-color 150ms, color 150ms, transform 150ms;
}
.rpr .rpr-socials a:hover {
	background: var(--rpr-surface);
	color: var(--rpr-accent-text);
	transform: translateY(-1px);
}
.rpr .rpr-socials .rpr-icon {
	width: 24px;
	height: 24px;
}
.rpr .rpr-prose {
	margin-top: 24px;
	text-align: center;
}
.rpr .rpr-prose p {
	margin: 0 0 12px;
}
.rpr .rpr-links {
	display: grid;
	gap: 12px;
	margin-top: 28px;
}
.rpr .rpr-link {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 56px;
	padding: 14px 52px;
	border-radius: var(--rpr-radius);
	font-weight: 600;
	font-size: 16px;
	line-height: 1.25;
	text-align: center;
	text-decoration: none;
	transition: transform 150ms, box-shadow 150ms, background-color 150ms;
}
.rpr .rpr-link .rpr-icon {
	position: absolute;
	left: 18px;
	width: 22px;
	height: 22px;
}
.rpr .rpr-link:hover {
	transform: translateY(-2px);
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
}
.rpr .rpr-link:active {
	transform: translateY(0);
}
/* Filled: every button in the accent. */
.rpr-btn-filled .rpr-link {
	background: var(--rpr-accent);
	color: var(--rpr-on-accent);
}
/* Outline: accent edge and text; highlighted links fill. */
.rpr-btn-outline .rpr-link {
	background: var(--rpr-bg);
	color: var(--rpr-accent-text);
	box-shadow: inset 0 0 0 2px var(--rpr-accent-text);
}
.rpr-btn-outline .rpr-link:hover {
	box-shadow: inset 0 0 0 2px var(--rpr-accent-text), 0 8px 20px rgba(0, 0, 0, 0.12);
}
/* Soft: surface cards; highlighted links fill. */
.rpr-btn-soft .rpr-link {
	background: var(--rpr-surface);
	color: var(--rpr-text);
	box-shadow: inset 0 0 0 1px var(--rpr-edge);
}
.rpr-btn-soft .rpr-link .rpr-icon {
	color: var(--rpr-accent-text);
}
.rpr-btn-outline .rpr-link-highlight,
.rpr-btn-soft .rpr-link-highlight {
	background: var(--rpr-accent);
	color: var(--rpr-on-accent);
	box-shadow: none;
}
.rpr-btn-soft .rpr-link-highlight .rpr-icon {
	color: inherit;
}
/* Filled: highlighted links get a ring so they still stand out. */
.rpr-btn-filled .rpr-link-highlight {
	box-shadow: 0 0 0 3px var(--rpr-bg), 0 0 0 5px var(--rpr-accent);
}

@media (prefers-reduced-motion: reduce) {
	.rpr .rpr-link,
	.rpr .rpr-socials a {
		transition: none;
	}
	.rpr .rpr-link:hover,
	.rpr .rpr-socials a:hover {
		transform: none;
	}
}

.rpr .rpr-credit {
	margin: 10px 0 0;
	font-size: 13px;
	opacity: 0.75;
}
.rpr .rpr-credit a {
	color: inherit;
	text-underline-offset: 3px;
}

/*
 * Holding our own inside other themes. Themes style lists, paragraphs and links in
 * post content (".entry-content li", ".entry-content a"), so the few things below
 * are said again firmly enough to win.
 */
.rpr ul.rpr-runs,
.rpr ul.rpr-socials {
	margin: 0;
	padding: 0;
	list-style: none;
}
.rpr ul.rpr-runs > li.rpr-run {
	margin: 0;
	list-style: none;
}
.rpr ul.rpr-socials > li {
	margin: 0;
	padding: 0;
	list-style: none;
}
.rpr .rpr-run p,
.rpr .rpr-details p {
	margin: 0;
	padding: 0;
}
.rpr .rpr-run p + p,
.rpr .rpr-details p + p {
	margin-top: 6px;
}
.rpr .rpr-run p.rpr-run-note,
.rpr .rpr-details p.rpr-run-note {
	padding-left: 28px;
}
.rpr .rpr-run p.rpr-run-cta {
	margin-top: 10px;
	padding-left: 28px;
}
.rpr .rpr-details p.rpr-details-actions {
	margin-top: 14px;
}
/* !important here only: some themes underline every link in a page with a
   selector too long to outrank (OceanWP's has five :not()s). */
.rpr .rpr-run-title a,
.rpr a.rpr-link,
.rpr a.rpr-chip,
.rpr .rpr-socials a {
	text-decoration: none !important;
	border-bottom: 0;
}
/* Themes that underline links with a shadow or border. Not the buttons and chips:
   their outline is a shadow of their own. */
.rpr .rpr-run-title a,
.rpr .rpr-socials a {
	box-shadow: none;
}
.rpr .rpr-run-title a:hover {
	text-decoration: underline !important;
}
.rpr a.rpr-link.rpr-link {
	color: var(--rpr-on-accent);
}
.rpr.rpr-btn-outline a.rpr-link:not(.rpr-link-highlight),
.rpr-btn-outline .rpr a.rpr-link:not(.rpr-link-highlight) {
	color: var(--rpr-accent-text);
}
.rpr.rpr-btn-soft a.rpr-link:not(.rpr-link-highlight),
.rpr-btn-soft .rpr a.rpr-link:not(.rpr-link-highlight) {
	color: var(--rpr-text);
}
.rpr .rpr-name,
.rpr .rpr-h2 {
	padding: 0;
	border: 0;
	color: inherit;
}
.rpr .rpr-route-profile {
	margin: 14px 0 0;
	padding: 0;
}
.rpr button.rpr-chip {
	width: auto;
	text-transform: none;
	letter-spacing: 0;
}