/*
 * OO Sport shared header visual system.
 * Hub-specific links and actions remain untouched; this file owns only the
 * common dark visual treatment and loads after all hub styles.
 */

:root {
	--oo-header-bg: #080d0c;
	--oo-header-text: #f7f9f8;
	--oo-header-line: rgba(255, 255, 255, 0.14);
	--oo-header-accent: #cfff00;
}

html body .wp-site-blocks > header.wp-block-template-part:has(#oo-sport-site-header),
html body .wp-site-blocks > .wp-block-template-part:has(#oo-sport-site-header) {
	position: relative !important;
	inset: auto !important;
	z-index: 10000 !important;
	display: block !important;
	width: 100% !important;
	height: auto !important;
	min-height: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	background: var(--oo-header-bg) !important;
	border: 0 !important;
	box-shadow: none !important;
}

/* Legacy home-page CSS pulled the whole site 32/46 px upwards for logged-in
 * editors. That clipped the header controls while testing the live site. */
body.home.admin-bar .wp-site-blocks {
	margin-top: 0 !important;
}

#oo-sport-site-header.oo-sport-header {
	position: relative !important;
	inset: auto !important;
	z-index: 1 !important;
	display: block !important;
	box-sizing: border-box !important;
	width: 100% !important;
	height: auto !important;
	min-height: 80px !important;
	margin: 0 !important;
	padding: 0 !important;
	color: var(--oo-header-text) !important;
	background: var(--oo-header-bg) !important;
	border: 0 !important;
	border-top: 3px solid var(--oo-header-accent) !important;
	border-bottom: 1px solid var(--oo-header-line) !important;
	box-shadow: none !important;
	transform: none !important;
	backdrop-filter: none !important;
}

#oo-sport-site-header.oo-sport-header::before,
#oo-sport-site-header.oo-sport-header::after {
	display: none !important;
	content: none !important;
}

#oo-sport-site-header .oo-sport-header-row {
	position: relative !important;
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	box-sizing: border-box !important;
	width: 100% !important;
	max-width: 1920px !important;
	min-height: 88px !important;
	margin: 0 auto !important;
	padding: 14px clamp(24px, 3.3vw, 64px) 10px !important;
	color: var(--oo-header-text) !important;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
}

/*
 * Give the desktop logo and actions a little more air above them. The
 * asymmetric block padding is intentional: it corrects the optical baseline
 * of the italic logo and the heavy CTA labels without moving the mobile
 * header, whose geometry is managed separately.
 */
@media (min-width: 782px) {
	#oo-sport-site-header.oo-sport-header {
		min-height: 92px !important;
	}
}

#oo-sport-site-header .oo-sport-header-row > .wp-block-group,
#oo-sport-site-header .oo-sport-header-nav,
#oo-sport-site-header .oo-sport-header-actions,
#oo-sport-site-header .oo-sport-header-nav-and-cta,
#oo-sport-site-header .oo-sport-nav-and-cta {
	background: transparent !important;
}

#oo-sport-site-header .oo-sport-header-logo-wrap {
	display: flex !important;
	align-items: center !important;
	justify-content: flex-start !important;
	flex: 0 0 auto !important;
	width: auto !important;
	min-width: 176px !important;
	height: 52px !important;
	margin: 0 !important;
	padding: 0 !important;
}

#oo-sport-site-header .wp-block-site-logo,
#oo-sport-site-header .custom-logo-link {
	display: flex !important;
	align-items: center !important;
	justify-content: flex-start !important;
	width: auto !important;
	height: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
}

#oo-sport-site-header .custom-logo,
#oo-sport-site-header .wp-block-site-logo img {
	display: block !important;
	width: 176px !important;
	max-width: 176px !important;
	height: auto !important;
	max-height: 46px !important;
	margin: 0 !important;
	object-fit: contain !important;
	object-position: left center !important;
	filter: none !important;
}

#oo-sport-site-header .oo-sport-header-nav-and-cta,
#oo-sport-site-header .oo-sport-nav-and-cta {
	display: flex !important;
	align-items: center !important;
	justify-content: flex-end !important;
	gap: clamp(20px, 2vw, 36px) !important;
	min-width: 0 !important;
}

#oo-sport-site-header .oo-sport-header-nav {
	color: var(--oo-header-text) !important;
}

#oo-sport-site-header .oo-sport-header-nav > .wp-block-navigation__container,
#oo-sport-site-header .oo-sport-header-nav > .wp-block-navigation__container > .wp-block-navigation-item {
	display: flex !important;
	align-items: center !important;
}

#oo-sport-site-header .oo-sport-header-nav > .wp-block-navigation__container {
	gap: clamp(20px, 1.85vw, 34px) !important;
}

#oo-sport-site-header .oo-sport-header-nav > .wp-block-navigation__container > .wp-block-navigation-item > a,
#oo-sport-site-header .oo-sport-header-nav > .wp-block-navigation__container > .wp-block-navigation-item > button,
#oo-sport-site-header .oo-sport-header-nav a,
#oo-sport-site-header .oo-sport-header-nav .wp-block-navigation-item__content,
#oo-sport-site-header .oo-sport-header-nav .wp-block-navigation-item__label,
#oo-sport-site-header .oo-sport-header-nav .wp-block-navigation-submenu__toggle,
#oo-sport-site-header .oo-sport-header-has-dropdown {
	color: var(--oo-header-text) !important;
	-webkit-text-fill-color: var(--oo-header-text) !important;
}

#oo-sport-site-header .oo-sport-header-nav > .wp-block-navigation__container > .wp-block-navigation-item > a,
#oo-sport-site-header .oo-sport-header-nav > .wp-block-navigation__container > .wp-block-navigation-item > button,
#oo-sport-site-header .oo-webshop-primary-nav > a,
#oo-sport-site-header .oo-webshop-menu-trigger,
#oo-sport-site-header .oo-sport-header-text-link,
#oo-sport-site-header .oo-sport-header-catalog-button {
	color: var(--oo-header-text) !important;
	-webkit-text-fill-color: var(--oo-header-text) !important;
	font-weight: 800 !important;
	letter-spacing: 0.035em !important;
	text-decoration: none !important;
}

#oo-sport-site-header .oo-sport-header-nav > .wp-block-navigation__container > .wp-block-navigation-item > a:hover,
#oo-sport-site-header .oo-sport-header-nav > .wp-block-navigation__container > .wp-block-navigation-item > button:hover,
#oo-sport-site-header .oo-webshop-primary-nav > a:hover,
#oo-sport-site-header .oo-webshop-primary-nav > a.is-active,
#oo-sport-site-header .oo-webshop-menu-trigger:hover,
#oo-sport-site-header .oo-sport-header-text-link:hover,
#oo-sport-site-header .oo-sport-header-catalog-button:hover,
#oo-sport-site-header .oo-sport-header-nav .current-menu-item > a {
	color: var(--oo-header-accent) !important;
}

#oo-sport-site-header .oo-sport-header-catalog-dropdown,
#oo-sport-site-header .wp-block-navigation__submenu-container {
	background: #ffffff !important;
	border-color: #dfe3e1 !important;
}

#oo-sport-site-header .oo-sport-header-nav .oo-sport-header-catalog-dropdown a,
#oo-sport-site-header .oo-sport-header-nav .wp-block-navigation__submenu-container a,
#oo-sport-site-header .oo-sport-header-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content,
#oo-sport-site-header .oo-sport-header-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__label {
	color: #4f5955 !important;
	-webkit-text-fill-color: #4f5955 !important;
}

#oo-sport-site-header .oo-sport-header-nav .oo-sport-header-catalog-dropdown a:hover,
#oo-sport-site-header .oo-sport-header-nav .wp-block-navigation__submenu-container a:hover {
	color: #080d0c !important;
	-webkit-text-fill-color: #080d0c !important;
}

#oo-sport-site-header .oo-sport-header-actions {
	display: flex !important;
	align-items: center !important;
	justify-content: flex-end !important;
	gap: 14px !important;
	color: var(--oo-header-text) !important;
}

#oo-sport-site-header .oo-sport-header-cart-link {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 9px !important;
	min-height: 44px !important;
	margin: 0 !important;
	padding: 0 !important;
	color: var(--oo-header-text) !important;
	-webkit-text-fill-color: var(--oo-header-text) !important;
	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	text-decoration: none !important;
	box-shadow: none !important;
}

#oo-sport-site-header .oo-sport-header-cart-icon,
#oo-sport-site-header .oo-sport-header-cart-icon svg {
	display: block !important;
	flex: 0 0 18px !important;
	width: 18px !important;
	height: 18px !important;
}

#oo-sport-site-header .oo-sport-header-cart-badge {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	box-sizing: border-box !important;
	min-width: 26px !important;
	height: 22px !important;
	padding: 0 8px !important;
	border-radius: 999px !important;
	font-size: 11px !important;
	font-weight: 900 !important;
	line-height: 1 !important;
}

#oo-sport-site-header .oo-webshop-hub-link {
	color: rgba(247, 249, 248, 0.7) !important;
	-webkit-text-fill-color: rgba(247, 249, 248, 0.7) !important;
}

#oo-sport-site-header .oo-language-switcher,
#oo-sport-site-header .oo-language-switcher summary,
#oo-sport-site-header .oo-sport-language-switcher {
	color: var(--oo-header-accent) !important;
	-webkit-text-fill-color: var(--oo-header-accent) !important;
}

#oo-sport-site-header .oo-search-trigger,
#oo-sport-site-header .oo-sport-header-search-trigger {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 10px !important;
	box-sizing: border-box !important;
	min-width: 96px !important;
	height: 44px !important;
	padding: 0 18px !important;
	color: #080d0c !important;
	-webkit-text-fill-color: #080d0c !important;
	background: var(--oo-header-accent) !important;
	border: 1px solid var(--oo-header-accent) !important;
	border-radius: 9px !important;
	box-shadow: none !important;
}

#oo-sport-site-header .oo-search-trigger:hover,
#oo-sport-site-header .oo-sport-header-search-trigger:hover {
	background: #dcff35 !important;
	border-color: #dcff35 !important;
	transform: translateY(-1px) !important;
}

#oo-sport-site-header .oo-sport-header-cta .wp-block-button__link,
#oo-sport-site-header .oo-sport-header-cta a,
#oo-sport-site-header a.oo-sport-header-cta,
#oo-sport-site-header .oo-sport-header-quote-link {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	box-sizing: border-box !important;
	min-height: 44px !important;
	padding: 0 24px !important;
	color: #080d0c !important;
	-webkit-text-fill-color: #080d0c !important;
	background: var(--oo-header-accent) !important;
	border: 1px solid var(--oo-header-accent) !important;
	border-radius: 9px !important;
	font-weight: 800 !important;
	text-decoration: none !important;
	box-shadow: none !important;
}

#oo-sport-site-header .oo-sport-header-cta .wp-block-button__link:hover,
#oo-sport-site-header .oo-sport-header-cta a:hover,
#oo-sport-site-header a.oo-sport-header-cta:hover,
#oo-sport-site-header .oo-sport-header-quote-link:hover {
	background: #dcff35 !important;
	border-color: #dcff35 !important;
	transform: translateY(-1px) !important;
}

#oo-sport-site-header .oo-sport-header-cart,
#oo-sport-site-header .oo-webshop-header-cart,
#oo-sport-site-header .oo-sport-header-cart-link,
#oo-sport-site-header .oo-sport-header-cart-icon,
#oo-sport-site-header .oo-sport-header-menu-toggle,
#oo-sport-site-header .oo-sport-mobile-menu-toggle,
#oo-sport-site-header .oo-sport-header-mobile-menu-toggle,
#oo-sport-site-header .oo-webshop-menu-trigger {
	color: var(--oo-header-text) !important;
}

#oo-sport-site-header .oo-sport-header-cart svg,
#oo-sport-site-header .oo-webshop-header-cart svg,
#oo-sport-site-header .oo-sport-header-cart-link svg,
#oo-sport-site-header .oo-sport-header-cart-icon svg,
#oo-sport-site-header .oo-sport-header-menu-toggle svg,
#oo-sport-site-header .oo-sport-mobile-menu-toggle svg,
#oo-sport-site-header .oo-sport-header-mobile-menu-toggle svg {
	color: currentColor !important;
	fill: none;
	stroke: currentColor !important;
}

#oo-sport-site-header .oo-search-trigger svg,
#oo-sport-site-header .oo-sport-header-search-trigger svg,
body.oo-sport-hub-gateway .oo-search-trigger svg {
	color: currentColor !important;
	fill: none !important;
	stroke: currentColor !important;
}

#oo-sport-site-header .oo-sport-header-cart-count,
#oo-sport-site-header .oo-webshop-header-cart-count,
#oo-sport-site-header .oo-quote-cart-count,
#oo-sport-site-header .oo-sport-header-cart-badge {
	color: #080d0c !important;
	-webkit-text-fill-color: #080d0c !important;
	background: var(--oo-header-accent) !important;
	border-color: var(--oo-header-accent) !important;
}

@media (max-width: 1100px) {
	#oo-sport-site-header .oo-sport-header-row {
		padding-inline: 24px !important;
	}

	#oo-sport-site-header .oo-sport-header-nav-and-cta,
	#oo-sport-site-header .oo-sport-nav-and-cta,
	#oo-sport-site-header .oo-sport-header-nav > .wp-block-navigation__container {
		gap: 18px !important;
	}
}

@media (max-width: 781px) {
	html body .wp-site-blocks > header.wp-block-template-part:has(#oo-sport-site-header),
	html body .wp-site-blocks > .wp-block-template-part:has(#oo-sport-site-header),
	#oo-sport-site-header.oo-sport-header {
		height: 76px !important;
		min-height: 76px !important;
		overflow: visible !important;
	}

	#oo-sport-site-header .oo-sport-header-row {
		height: 73px !important;
		min-height: 73px !important;
		padding: 8px 16px !important;
	}

	#oo-sport-site-header .oo-sport-header-logo-wrap {
		min-width: 0 !important;
		height: 44px !important;
	}

	#oo-sport-site-header .custom-logo,
	#oo-sport-site-header .wp-block-site-logo img {
		width: 148px !important;
		max-width: 148px !important;
		max-height: 38px !important;
	}

	#oo-sport-site-header .oo-sport-header-actions {
		gap: 8px !important;
	}

	#oo-sport-site-header .oo-search-trigger,
	#oo-sport-site-header .oo-sport-header-search-trigger,
	#oo-sport-site-header .oo-sport-header-menu-toggle,
	#oo-sport-site-header .oo-sport-mobile-menu-toggle,
	#oo-sport-site-header .oo-sport-header-mobile-menu-toggle,
	#oo-sport-site-header .oo-webshop-menu-trigger {
		width: 42px !important;
		min-width: 42px !important;
		height: 42px !important;
		padding: 0 !important;
		color: var(--oo-header-text) !important;
		background: transparent !important;
		border: 1px solid rgba(255, 255, 255, 0.24) !important;
		border-radius: 9px !important;
		transform: none !important;
	}

	#oo-sport-site-header .oo-search-trigger > span,
	#oo-sport-site-header .oo-sport-header-search-trigger > span,
	#oo-sport-site-header .oo-webshop-menu-trigger > span {
		display: none !important;
	}

	#oo-sport-site-header .oo-sport-language-switcher {
		flex: 0 0 auto !important;
		width: auto !important;
		margin: 0 !important;
	}

	#oo-sport-site-header .oo-sport-language-switcher__options {
		justify-content: center !important;
		min-width: 58px !important;
		min-height: 40px !important;
	}
}

@media (max-width: 420px) {
	#oo-sport-site-header .oo-sport-header-row {
		padding-inline: 12px !important;
	}

	#oo-sport-site-header .custom-logo,
	#oo-sport-site-header .wp-block-site-logo img {
		width: 136px !important;
		max-width: 136px !important;
	}
}

/* Mobile header resilience.
 * The desktop navigation container is visibility-hidden by WordPress on
 * narrow screens, but it still keeps its intrinsic width unless removed from
 * layout. Keep every real action in one compact, non-wrapping header row. */
@media (max-width: 781px) {
	#oo-sport-site-header .oo-sport-header-row {
		flex-wrap: nowrap !important;
		gap: 8px !important;
	}

	#oo-sport-site-header .oo-sport-header-logo-wrap {
		flex: 0 0 148px !important;
		width: 148px !important;
		min-width: 0 !important;
		max-width: 148px !important;
	}

	#oo-sport-site-header .oo-sport-nav-and-cta {
		order: 2 !important;
		display: flex !important;
		flex: 0 1 auto !important;
		flex-wrap: nowrap !important;
		width: auto !important;
		min-width: 0 !important;
		height: 42px !important;
		margin: 0 0 0 auto !important;
		gap: 8px !important;
	}

	#oo-sport-site-header .oo-sport-nav-and-cta > nav.oo-sport-header-nav {
		display: none !important;
	}

	#oo-sport-site-header .oo-sport-header-row > .oo-search-trigger {
		position: static !important;
		order: 3 !important;
		flex: 0 0 42px !important;
		margin: 0 !important;
	}
}

@media (max-width: 420px) {
	#oo-sport-site-header .oo-sport-header-row {
		gap: 6px !important;
		padding-inline: 10px !important;
	}

	#oo-sport-site-header .oo-sport-header-logo-wrap,
	#oo-sport-site-header .wp-block-site-logo,
	#oo-sport-site-header .custom-logo-link {
		flex: 0 0 112px !important;
		width: 112px !important;
		min-width: 0 !important;
		max-width: 112px !important;
	}

	#oo-sport-site-header .custom-logo,
	#oo-sport-site-header .wp-block-site-logo img {
		width: 112px !important;
		max-width: 112px !important;
	}

	#oo-sport-site-header .oo-sport-nav-and-cta {
		height: 38px !important;
		gap: 5px !important;
	}

	#oo-sport-site-header .oo-search-trigger,
	#oo-sport-site-header .oo-sport-header-search-trigger,
	#oo-sport-site-header .oo-sport-header-menu-toggle,
	#oo-sport-site-header .oo-sport-mobile-menu-toggle,
	#oo-sport-site-header .oo-sport-header-mobile-menu-toggle,
	#oo-sport-site-header .oo-webshop-menu-trigger,
	#oo-sport-site-header .oo-webshop-mobile-cart-link,
	#oo-sport-site-header .oo-webshop-primary-nav {
		flex-basis: 38px !important;
		width: 38px !important;
		min-width: 38px !important;
		max-width: 38px !important;
		height: 38px !important;
		min-height: 38px !important;
		max-height: 38px !important;
	}

	#oo-sport-site-header .oo-sport-language-switcher__options {
		min-width: 52px !important;
		min-height: 38px !important;
		font-size: 10px !important;
	}
}

@media (max-width: 350px) {
	#oo-sport-site-header .oo-sport-header-row {
		gap: 5px !important;
		padding-inline: 8px !important;
	}

	#oo-sport-site-header .oo-sport-header-logo-wrap,
	#oo-sport-site-header .wp-block-site-logo,
	#oo-sport-site-header .custom-logo-link {
		flex-basis: 96px !important;
		width: 96px !important;
		max-width: 96px !important;
	}

	#oo-sport-site-header .custom-logo,
	#oo-sport-site-header .wp-block-site-logo img {
		width: 96px !important;
		max-width: 96px !important;
	}

	#oo-sport-site-header .oo-sport-nav-and-cta {
		height: 34px !important;
		gap: 4px !important;
	}

	#oo-sport-site-header .oo-search-trigger,
	#oo-sport-site-header .oo-sport-header-search-trigger,
	#oo-sport-site-header .oo-sport-header-menu-toggle,
	#oo-sport-site-header .oo-sport-mobile-menu-toggle,
	#oo-sport-site-header .oo-sport-header-mobile-menu-toggle,
	#oo-sport-site-header .oo-webshop-menu-trigger,
	#oo-sport-site-header .oo-webshop-mobile-cart-link,
	#oo-sport-site-header .oo-webshop-primary-nav {
		flex-basis: 34px !important;
		width: 34px !important;
		min-width: 34px !important;
		max-width: 34px !important;
		height: 34px !important;
		min-height: 34px !important;
		max-height: 34px !important;
	}

	#oo-sport-site-header .oo-sport-language-switcher__options {
		min-width: 48px !important;
		min-height: 34px !important;
		font-size: 9px !important;
	}
}

/* The gateway does not use #oo-sport-site-header, so give its mobile actions
 * the same compact geometry without hiding search, language or contact. */
@media (max-width: 600px) {
	body.oo-sport-hub-gateway .oo-hub-gateway-header {
		flex-wrap: nowrap !important;
		width: 100% !important;
		min-width: 0 !important;
		gap: 8px !important;
		padding-inline: 10px !important;
	}

	body.oo-sport-hub-gateway .oo-hub-gateway-header > * {
		min-width: 0 !important;
	}

	body.oo-sport-hub-gateway .oo-hub-logo,
	body.oo-sport-hub-gateway .oo-hub-logo-image {
		flex: 0 0 112px !important;
		width: 112px !important;
		max-width: 112px !important;
	}

	body.oo-sport-hub-gateway .oo-hub-gateway-header > .oo-sport-language-switcher {
		flex: 0 0 auto !important;
		margin: 0 0 0 auto !important;
	}

	body.oo-sport-hub-gateway .oo-sport-language-switcher__options {
		min-width: 52px !important;
		min-height: 38px !important;
		font-size: 10px !important;
	}

	body.oo-sport-hub-gateway .oo-search-trigger.is-gateway-trigger,
	body.oo-sport-hub-gateway .oo-hub-contact-trigger {
		box-sizing: border-box !important;
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		flex: 0 0 38px !important;
		width: 38px !important;
		min-width: 38px !important;
		max-width: 38px !important;
		height: 38px !important;
		min-height: 38px !important;
		max-height: 38px !important;
		margin: 0 !important;
		padding: 0 !important;
	}

	body.oo-sport-hub-gateway .oo-hub-contact-trigger {
		font-size: 0 !important;
	}

	body.oo-sport-hub-gateway .oo-hub-contact-trigger span {
		font-size: 22px !important;
	}
}

@media (max-width: 350px) {
	body.oo-sport-hub-gateway .oo-hub-gateway-header {
		gap: 6px !important;
		padding-inline: 8px !important;
	}

	body.oo-sport-hub-gateway .oo-hub-logo,
	body.oo-sport-hub-gateway .oo-hub-logo-image {
		flex-basis: 96px !important;
		width: 96px !important;
		max-width: 96px !important;
	}

	body.oo-sport-hub-gateway .oo-sport-language-switcher__options {
		min-width: 48px !important;
		min-height: 34px !important;
		font-size: 9px !important;
	}

	body.oo-sport-hub-gateway .oo-search-trigger.is-gateway-trigger,
	body.oo-sport-hub-gateway .oo-hub-contact-trigger {
		flex-basis: 34px !important;
		width: 34px !important;
		min-width: 34px !important;
		max-width: 34px !important;
		height: 34px !important;
		min-height: 34px !important;
		max-height: 34px !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	#oo-sport-site-header *,
	#oo-sport-site-header *::before,
	#oo-sport-site-header *::after {
		transition-duration: 0.01ms !important;
	}
}