/*
Theme Name: Precision Race Timing
Theme URI: https://precisionracetiming.services/
Description: GeneratePress child theme for Precision Race Timing Services, LLC. Component styles live in GenerateBlocks Pro global styles (GenerateBlocks → Global Styles); this file holds only site-wide rules those can't express.
Author: Precision Race Timing Services, LLC
Template: generatepress
Version: 1.0.0
Text Domain: prts
*/

/* ---------- Base ---------- */
:root {
	--prts-radius: 12px;
	--prts-radius-lg: 20px;
	--prts-shadow: 0 1px 2px rgba(19, 19, 19, .06), 0 8px 24px rgba(19, 19, 19, .08);
	--prts-shadow-lg: 0 2px 4px rgba(19, 19, 19, .06), 0 18px 48px rgba(19, 19, 19, .14);
	--prts-checker: repeating-conic-gradient(var(--contrast) 0% 25%, var(--base-3) 0% 50%) 0 0 / 16px 16px;
}

::selection {
	background: var(--accent);
	color: var(--contrast);
}

html {
	scroll-padding-top: 96px;
}

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}

/* Keyboard focus that is visible on light and dark sections alike. */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 3px solid var(--accent);
	outline-offset: 3px;
	box-shadow: 0 0 0 6px var(--contrast);
	border-radius: 4px;
}

/* Tabular figures for times, dates and bib numbers. */
.prts-tnum,
.prts-mono {
	font-variant-numeric: tabular-nums;
}

/* ---------- Header / navigation ---------- */
.site-header {
	border-bottom: 1px solid var(--base);
}

.main-navigation .main-nav ul li a {
	position: relative;
}

@media (min-width: 1200px) {
	.main-navigation .main-nav > ul > li > a::after {
		content: "";
		position: absolute;
		left: 18px;
		right: 18px;
		bottom: 14px;
		height: 3px;
		border-radius: 2px;
		background: var(--accent);
		transform: scaleX(0);
		transform-origin: left;
		transition: transform .2s ease;
	}

	.main-navigation .main-nav > ul > li:hover > a::after,
	.main-navigation .main-nav > ul > li.current-menu-item > a::after,
	.main-navigation .main-nav > ul > li.current-menu-ancestor > a::after,
	.main-navigation .main-nav > ul > li.current_page_parent > a::after,
	.main-navigation .main-nav > ul > li.current-page-ancestor > a::after,
	.main-navigation .main-nav > ul > li.prts-current-section > a::after {
		transform: scaleX(1);
	}
}

.main-navigation .menu-bar-items {
	align-items: center;
}

.prts-nav-cta-item {
	display: flex;
	align-items: center;
	padding-left: 12px;
}

/* Specificity beats GP's sticky rule (.main-navigation.sticky-navigation-transition .menu-bar-item > a {line-height:68px}). */
.main-navigation .menu-bar-items .menu-bar-item > a.prts-nav-cta,
.prts-nav-cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 11px 18px;
	line-height: 1.2;
	border-radius: 10px;
	background: var(--accent);
	color: var(--contrast);
	font-family: var(--gp-font--montserrat, inherit);
	font-weight: 700;
	font-size: 15px;
	text-decoration: none;
	transition: background-color .2s ease, transform .2s ease;
}

.main-navigation .menu-bar-items .menu-bar-item > a.prts-nav-cta:hover,
.main-navigation .menu-bar-items .menu-bar-item > a.prts-nav-cta:focus-visible {
	background: #04c963;
	color: var(--contrast);
	transform: translateY(-1px);
}

.prts-nav-cta svg {
	width: 18px;
	height: 18px;
	flex: none;
}

@media (max-width: 768px) {
	.prts-nav-cta-item {
		padding-left: 0;
	}

	.main-navigation .menu-bar-items .menu-bar-item > a.prts-nav-cta {
		padding: 11px 14px;
		font-size: 14px;
	}

	.main-navigation .menu-bar-items .menu-bar-item > a.prts-nav-cta svg {
		display: none;
	}
}

/* ---------- Icons ---------- */
/* Inline SVG icons inherit color; size them with font-size or width/height. */
.gb-shape svg,
.prts-inline-icon svg {
	display: block;
}

/*
 * Data-driven icons (e.g. a service's ACF "Icon" select):
 * <div class="prts-icon-mask" data-icon="stopwatch"></div>
 * The icon is painted with the current text color via a CSS mask.
 */
.prts-icon-mask {
	display: inline-block;
	width: 28px;
	height: 28px;
	background-color: currentColor;
	-webkit-mask: var(--prts-icon) center / contain no-repeat;
	mask: var(--prts-icon) center / contain no-repeat;
}

/* ---------- Formidable Forms (brand overrides) ---------- */
/* Formidable prints literal colors for the resting submit button, so variables alone aren't enough. */
body .frm_forms.with_frm_style {
	--label-color: var(--contrast);
	--text-color: var(--contrast);
	--border-color: #8a918d;
	--border-color-active: var(--contrast);
	--submit-bg-color: var(--accent);
	--submit-border-color: var(--accent);
	--submit-text-color: var(--contrast);
	--submit-hover-bg-color: var(--contrast);
	--submit-hover-border-color: var(--contrast);
	--submit-hover-color: var(--base-3);
	--progress-active-bg-color: var(--accent-2);
	--toggle-on-color: var(--accent-2);
}

body .frm_forms.with_frm_style .frm_submit button,
body .frm_forms.with_frm_style input[type=submit] {
	background: var(--submit-bg-color);
	border-color: var(--submit-border-color);
	color: var(--submit-text-color);
	font-family: var(--gp-font--montserrat, inherit);
	font-weight: 700;
	border-radius: 10px;
	padding: 14px 24px;
}

body .frm_forms.with_frm_style .frm_submit button:hover,
body .frm_forms.with_frm_style .frm_submit button:focus-visible {
	background: var(--submit-hover-bg-color);
	border-color: var(--submit-hover-border-color);
	color: var(--submit-hover-color);
}

body .frm_forms.with_frm_style .frm_submit .frm_prev_page {
	background: transparent;
	color: var(--contrast);
	border: 2px solid var(--contrast);
}

body .frm_forms.with_frm_style input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]),
body .frm_forms.with_frm_style select,
body .frm_forms.with_frm_style textarea {
	border-radius: 8px;
	min-height: 48px;
}

body .frm_forms.with_frm_style .frm_primary_label {
	font-weight: 600;
}

/* ---------- Motion ---------- */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
		scroll-behavior: auto !important;
	}
}

@media (prefers-reduced-motion: no-preference) {
	html {
		scroll-behavior: smooth;
	}
}

/* ---------- Icon mask map (generated) ---------- */
.prts-icon-mask[data-icon="arch"]{--prts-icon:url(assets/icons/arch.svg)}
.prts-icon-mask[data-icon="arrow-right"]{--prts-icon:url(assets/icons/arrow-right.svg)}
.prts-icon-mask[data-icon="arrow-up-right"]{--prts-icon:url(assets/icons/arrow-up-right.svg)}
.prts-icon-mask[data-icon="bib"]{--prts-icon:url(assets/icons/bib.svg)}
.prts-icon-mask[data-icon="bike"]{--prts-icon:url(assets/icons/bike.svg)}
.prts-icon-mask[data-icon="calendar"]{--prts-icon:url(assets/icons/calendar.svg)}
.prts-icon-mask[data-icon="check"]{--prts-icon:url(assets/icons/check.svg)}
.prts-icon-mask[data-icon="chevron-down"]{--prts-icon:url(assets/icons/chevron-down.svg)}
.prts-icon-mask[data-icon="chip"]{--prts-icon:url(assets/icons/chip.svg)}
.prts-icon-mask[data-icon="clock"]{--prts-icon:url(assets/icons/clock.svg)}
.prts-icon-mask[data-icon="display"]{--prts-icon:url(assets/icons/display.svg)}
.prts-icon-mask[data-icon="document"]{--prts-icon:url(assets/icons/document.svg)}
.prts-icon-mask[data-icon="external"]{--prts-icon:url(assets/icons/external.svg)}
.prts-icon-mask[data-icon="facebook"]{--prts-icon:url(assets/icons/facebook.svg)}
.prts-icon-mask[data-icon="flag"]{--prts-icon:url(assets/icons/flag.svg)}
.prts-icon-mask[data-icon="heart"]{--prts-icon:url(assets/icons/heart.svg)}
.prts-icon-mask[data-icon="instagram"]{--prts-icon:url(assets/icons/instagram.svg)}
.prts-icon-mask[data-icon="layers"]{--prts-icon:url(assets/icons/layers.svg)}
.prts-icon-mask[data-icon="mail"]{--prts-icon:url(assets/icons/mail.svg)}
.prts-icon-mask[data-icon="map-pin"]{--prts-icon:url(assets/icons/map-pin.svg)}
.prts-icon-mask[data-icon="megaphone"]{--prts-icon:url(assets/icons/megaphone.svg)}
.prts-icon-mask[data-icon="message"]{--prts-icon:url(assets/icons/message.svg)}
.prts-icon-mask[data-icon="minus"]{--prts-icon:url(assets/icons/minus.svg)}
.prts-icon-mask[data-icon="mountain"]{--prts-icon:url(assets/icons/mountain.svg)}
.prts-icon-mask[data-icon="phone"]{--prts-icon:url(assets/icons/phone.svg)}
.prts-icon-mask[data-icon="plus"]{--prts-icon:url(assets/icons/plus.svg)}
.prts-icon-mask[data-icon="printer"]{--prts-icon:url(assets/icons/printer.svg)}
.prts-icon-mask[data-icon="registration"]{--prts-icon:url(assets/icons/registration.svg)}
.prts-icon-mask[data-icon="results"]{--prts-icon:url(assets/icons/results.svg)}
.prts-icon-mask[data-icon="route"]{--prts-icon:url(assets/icons/route.svg)}
.prts-icon-mask[data-icon="school"]{--prts-icon:url(assets/icons/school.svg)}
.prts-icon-mask[data-icon="search"]{--prts-icon:url(assets/icons/search.svg)}
.prts-icon-mask[data-icon="shield-check"]{--prts-icon:url(assets/icons/shield-check.svg)}
.prts-icon-mask[data-icon="signal"]{--prts-icon:url(assets/icons/signal.svg)}
.prts-icon-mask[data-icon="sparkle"]{--prts-icon:url(assets/icons/sparkle.svg)}
.prts-icon-mask[data-icon="stopwatch"]{--prts-icon:url(assets/icons/stopwatch.svg)}
.prts-icon-mask[data-icon="target"]{--prts-icon:url(assets/icons/target.svg)}
.prts-icon-mask[data-icon="tools"]{--prts-icon:url(assets/icons/tools.svg)}
.prts-icon-mask[data-icon="trophy"]{--prts-icon:url(assets/icons/trophy.svg)}
.prts-icon-mask[data-icon="users"]{--prts-icon:url(assets/icons/users.svg)}
.prts-icon-mask[data-icon="video"]{--prts-icon:url(assets/icons/video.svg)}
.prts-icon-mask[data-icon="waves"]{--prts-icon:url(assets/icons/waves.svg)}

/* ---------- Prose links (theme link underlines are off so buttons/cards stay clean) ---------- */
.gb-text a:not([class]),
.entry-content p a:not([class]),
.entry-content li a:not([class]),
.dynamic-entry-content p a:not([class]),
.dynamic-entry-content li a:not([class]),
.prts-prose a:not([class]) {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: .18em;
}

/* ---------- GB Pro accordion ---------- */
/* GP's global button typography (button:not(.menu-toggle)) outranks single-class block styles. */
.gb-accordion button.gb-accordion__toggle {
	font-family: var(--gp-font--montserrat);
	font-size: 1.075rem;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: -.005em;
}
.prts-dark .gb-accordion button.gb-accordion__toggle {
	color: var(--base-3);
}

/* ---------- Dropdown + mobile menu polish ---------- */
@media (min-width: 1200px) {
	.main-navigation .main-nav ul ul {
		padding: 8px;
		border: 1px solid var(--base);
		border-radius: 14px;
		background: var(--base-3);
		box-shadow: 0 2px 4px rgba(19, 19, 19, .05), 0 18px 40px rgba(19, 19, 19, .12);
	}

	.main-navigation .main-nav ul ul li a {
		border-radius: 8px;
	}
}

@media (max-width: 1199px) {
	.main-navigation.toggled .main-nav > ul {
		border-top: 1px solid var(--base);
		padding-bottom: 12px;
	}

	.main-navigation.toggled .main-nav ul li a {
		font-size: 16px;
	}

	.main-navigation.toggled .main-nav > ul > li {
		border-bottom: 1px solid var(--base);
	}

	.main-navigation.toggled .main-nav ul ul li a {
		padding-left: 36px;
		font-weight: 500;
	}

	.main-navigation.toggled .main-nav li.current-menu-item > a {
		color: var(--accent-2);
	}
}

/* ---------- Header alignment below the desktop nav breakpoint ---------- */
/* GP zeroes this padding below its mobile breakpoint (also on the sticky clone); match the content gutters. */
@media (max-width: 1199px) {
	body .main-navigation.has-branding .inside-navigation.grid-container {
		padding-left: 40px;
		padding-right: 30px;
	}

	body .main-navigation .navigation-branding {
		margin-left: 0;
	}
}

@media (max-width: 1024px) {
	body .main-navigation.has-branding .inside-navigation.grid-container {
		padding-left: 32px;
		padding-right: 22px;
	}
}

@media (max-width: 767px) {
	body .main-navigation.has-branding .inside-navigation.grid-container {
		padding-left: 20px;
		padding-right: 10px;
	}
}

@media (max-width: 400px) {
	.main-navigation .navigation-branding img {
		max-height: 40px;
		width: auto;
	}
}

/* ---------- Typography wrapping ---------- */
h1,
h2,
h3,
h4 {
	text-wrap: balance;
}

.prts-lead,
.prts-card p,
.prts-prose p {
	text-wrap: pretty;
}

/* ---------- Linked cards: one focus ring around the whole card ---------- */
.prts-card-link:focus-visible {
	outline: none;
	box-shadow: none;
}

.prts-card:has(.prts-card-link:focus-visible) {
	outline: 3px solid var(--accent);
	outline-offset: 3px;
	box-shadow: 0 0 0 6px var(--contrast);
}

/* ---------- Back to top ---------- */
.generate-back-to-top {
	width: 44px;
	height: 44px;
	right: 20px;
	bottom: 20px;
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
}

@media (max-width: 767px) {
	body:has(.frm_forms) .generate-back-to-top {
		display: none;
	}
}