/**
 * Header cart + compact desktop masthead + segmented secondary nav (v12 icon fix).
 *
 * Desktop (≥993px):
 *   - Align .main-header with .shoptimizer-primary-navigation content width
 *   - Kill Customizer 20px vertical padding that forced ~82px masthead
 *   - Secondary: transparent segmented control (inherits masthead / top-nav color) (FedEx | Sign In | Checkout)
 *     with small icons — NO lime/green checkout pill
 *   - Compact search (~38px) + 36px logo
 *   - Cart ONLY in .col-full-nav (theme default). Masthead cart hidden —
 *     v9 wrongly forced it visible and duplicated the sticky-nav cart.
 *
 * Mobile (≤992px): icon-only cart in masthead with badge overlaid —
 * account + cart only (theme already hides .col-full-nav cart).
 */

.site-header-cart .cart-contents,
.shoptimizer-cart .cart-contents {
	display: inline-flex !important;
	align-items: center !important;
	gap: 0.5rem;
	white-space: nowrap;
	line-height: 1 !important;
}

.site-header-cart .amount,
.shoptimizer-cart .amount {
	display: inline-flex !important;
	align-items: center !important;
	margin: 0 !important;
}

.site-header-cart .shoptimizer-cart-icon,
.shoptimizer-cart .shoptimizer-cart-icon {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center;
	gap: 2px;
	position: relative !important;
	top: 0 !important;
	right: 0 !important;
	margin: 0 !important;
	line-height: 1 !important;
}

.site-header-cart .shoptimizer-cart-icon svg,
.shoptimizer-cart .shoptimizer-cart-icon svg {
	display: block !important;
	position: static !important;
	top: 0 !important;
	width: 22px !important;
	height: 22px !important;
	flex: 0 0 22px;
	vertical-align: middle;
}

.site-header-cart .shoptimizer-cart-icon .mini-count,
.shoptimizer-cart .shoptimizer-cart-icon .mini-count,
.site-header-cart a.cart-contents .shoptimizer-cart-icon .mini-count,
.shoptimizer-cart a.cart-contents .shoptimizer-cart-icon .mini-count,
.site-header-cart a.cart-contents:hover .shoptimizer-cart-icon .mini-count,
.shoptimizer-cart a.cart-contents:hover .shoptimizer-cart-icon .mini-count {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	position: static !important;
	top: 0 !important;
	left: 0 !important;
	margin: 0 !important;
	width: 20px !important;
	height: 20px !important;
	line-height: 1 !important;
	border-radius: 9999px;
	font-size: 12px;
	font-weight: 700;
	flex: 0 0 20px;
	transition: background-color 0.15s ease, color 0.15s ease !important;
}

@media (min-width: 993px) {
	/* Same content rail for top bar + primary nav. */
	header#masthead .main-header.col-full,
	.site-header .main-header.col-full,
	.col-full-nav .shoptimizer-primary-navigation.col-full,
	.col-full-nav .shoptimizer-primary-navigation {
		max-width: 1170px !important;
		width: 100% !important;
		margin-left: auto !important;
		margin-right: auto !important;
		padding-left: 20px !important;
		padding-right: 20px !important;
		box-sizing: border-box !important;
	}

	/* Customizer sets padding-top/bottom:20px → ~82px bar. Flatten it. */
	header#masthead .main-header.col-full,
	.site-header .main-header.col-full,
	.col-full.main-header {
		padding-top: 8px !important;
		padding-bottom: 8px !important;
		display: flex !important;
		align-items: center !important;
		min-height: 0 !important;
	}

	.site-header .main-header img.custom-logo,
	header#masthead .main-header img.custom-logo,
	.main-header .site-branding img.custom-logo,
	.site-header .custom-logo-link img {
		height: 36px !important;
		width: auto !important;
		max-height: 36px !important;
	}

	/*
	 * Segmented secondary cluster — navy (matches .col-full-nav) bar, white labels, hairline
	 * dividers. Matches the “Resources | Lists | Sign In” pattern without
	 * any green CTA (Checkout is the same segment as Sign In).
	 */
	header#masthead .secondary-navigation,
	.site-header .secondary-navigation,
	.secondary-navigation {
		padding-left: 0.75em !important;
	}

	header#masthead .secondary-navigation .menu,
	.site-header .secondary-navigation .menu,
	.secondary-navigation .menu {
		display: inline-flex !important;
		align-items: stretch !important;
		flex-wrap: nowrap !important;
		gap: 0 !important;
		margin: 0 !important;
		padding: 0 !important;
		list-style: none !important;
		/* Transparent — inherits masthead #131921 (top nav), not charcoal. */
		background: transparent !important;
		border: 1px solid rgba(255, 255, 255, 0.18) !important;
		border-radius: 6px !important;
		overflow: hidden !important;
		box-shadow: none !important;
	}

	header#masthead .secondary-navigation .menu-item,
	.site-header .secondary-navigation .menu-item,
	.secondary-navigation .menu-item {
		padding: 0 !important;
		margin: 0 !important;
		border: 0 !important;
		border-left: 0 !important;
		border-right: 0 !important;
		float: none !important;
		display: flex !important;
		align-items: stretch !important;
	}

	header#masthead .secondary-navigation .menu-item:not(:last-child),
	.site-header .secondary-navigation .menu-item:not(:last-child),
	.secondary-navigation .menu-item:not(:last-child) {
		border-right: 1px solid rgba(255, 255, 255, 0.16) !important;
	}

	header#masthead .secondary-navigation ul li a,
	.site-header .secondary-navigation ul li a,
	.secondary-navigation .menu li a,
	.secondary-navigation .menu li:not(.ri) a {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		gap: 0.4em !important;
		padding: 0.45em 0.85em !important;
		margin: 0 !important;
		min-height: 32px;
		white-space: nowrap;
		line-height: 1.2;
		text-align: center;
		font-size: 13px !important;
		font-weight: 500 !important;
		color: #fff !important;
		background: transparent !important;
		border: 0 !important;
		border-radius: 0 !important;
		box-shadow: none !important;
		text-decoration: none !important;
		transition: background-color 0.15s ease, color 0.15s ease;
	}

	header#masthead .secondary-navigation ul li a[href]:hover,
	.site-header .secondary-navigation ul li a[href]:hover,
	.secondary-navigation .menu li a[href]:hover {
		background: rgba(255, 255, 255, 0.08) !important;
		border: 0 !important;
		color: #fff !important;
		text-decoration: none !important;
	}

	/* Shipping label — same segment chrome, slightly quieter type. */
	header#masthead .secondary-navigation ul li a:not([href]),
	.site-header .secondary-navigation ul li a:not([href]),
	.secondary-navigation .menu li a:not([href]) {
		color: rgba(255, 255, 255, 0.82) !important;
		font-weight: 500 !important;
		font-size: 13px !important;
		cursor: default !important;
		pointer-events: none;
		text-decoration: none !important;
		padding: 0.45em 0.85em !important;
		margin: 0 !important;
		border: 0 !important;
		border-radius: 0 !important;
		background: transparent !important;
	}

	/* Checkout — same navy (matches .col-full-nav) segment as the rest (no lime / green). */
	header#masthead .secondary-navigation ul li a[href*="/checkout"],
	.site-header .secondary-navigation ul li a[href*="/checkout"],
	.secondary-navigation .menu li a[href*="/checkout"] {
		color: #fff !important;
		background: transparent !important;
		font-weight: 600 !important;
		padding: 0.45em 0.85em !important;
		margin: 0 !important;
		border-radius: 0 !important;
		text-decoration: none !important;
	}

	header#masthead .secondary-navigation ul li a[href*="/checkout"]:hover,
	.site-header .secondary-navigation ul li a[href*="/checkout"]:hover,
	.secondary-navigation .menu li a[href*="/checkout"]:hover {
		background: rgba(255, 255, 255, 0.08) !important;
		color: #fff !important;
		text-decoration: none !important;
		border: 0 !important;
	}

	/* Theme puts icon after the label — pull it left like the reference.
	 * Theme also absolute-positions .icon-wrapper; force static so flex works. */
	header#masthead .secondary-navigation .icon-wrapper,
	.site-header .secondary-navigation .icon-wrapper,
	.secondary-navigation .icon-wrapper {
		display: inline-flex !important;
		align-items: center !important;
		justify-content: center !important;
		position: static !important;
		top: auto !important;
		right: auto !important;
		left: auto !important;
		bottom: auto !important;
		order: -1 !important;
		width: 15px !important;
		height: 15px !important;
		margin: 0 !important;
		padding: 0 !important;
		flex: 0 0 15px !important;
		color: inherit !important;
		transform: none !important;
	}

	header#masthead .secondary-navigation .icon-wrapper svg,
	.site-header .secondary-navigation .icon-wrapper svg,
	.secondary-navigation .icon-wrapper svg {
		display: block !important;
		width: 15px !important;
		height: 15px !important;
		stroke: currentColor !important;
	}

	/* Compact search (Customizer + theme often leave this ~50–54px). */
	.site-search .widget_product_search input[type="search"].search-field,
	.site-search input[type="search"].search-field,
	.site-search .search-field {
		height: 38px !important;
		min-height: 38px !important;
		padding-top: 0 !important;
		padding-bottom: 0 !important;
		line-height: 38px !important;
		font-size: 14px !important;
	}

	.site-search .widget_product_search form button[type="submit"],
	.site-search form.woocommerce-product-search button[type="submit"] {
		height: 38px !important;
		min-height: 38px !important;
	}

	/* One cart on desktop: primary nav bar only (not masthead). */
	header#masthead .main-header .site-header-cart,
	.site-header .main-header .site-header-cart,
	.main-header .site-header-cart {
		display: none !important;
	}

	.col-full-nav .site-header-cart,
	.col-full-nav .shoptimizer-cart,
	.shoptimizer-primary-navigation .site-header-cart {
		display: flex !important;
		align-items: center !important;
		flex-shrink: 0;
	}
}

/* Mobile: two icons only — account + cart (count badge on the cart). */
@media (max-width: 992px) {
	.site-header-cart .amount,
	.shoptimizer-cart .amount,
	.site-header-cart .woocommerce-Price-amount,
	.shoptimizer-cart .woocommerce-Price-amount,
	.site-header-cart a.cart-contents > .amount,
	a.cart-contents > span.amount {
		display: none !important;
	}

	.main-header .shoptimizer-myaccount,
	.main-header .site-header-cart {
		display: flex !important;
		align-items: center !important;
	}

	.site-header .main-header .shoptimizer-myaccount,
	header#masthead .main-header .shoptimizer-myaccount,
	.main-header .shoptimizer-myaccount {
		position: absolute !important;
		right: 44px !important;
		margin: 0 !important;
	}

	.site-header .main-header .site-header-cart,
	header#masthead .main-header .site-header-cart,
	.main-header .site-header-cart {
		right: 10px !important;
	}

	.main-header .shoptimizer-myaccount a {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		width: 28px;
		height: 28px;
		padding: 0 !important;
	}

	.main-header .shoptimizer-myaccount svg {
		width: 22px !important;
		height: 22px !important;
	}

	.site-header-cart .cart-contents,
	.shoptimizer-cart .cart-contents {
		gap: 0 !important;
		padding: 0 !important;
		min-width: 28px;
		min-height: 28px;
		justify-content: center !important;
	}

	.site-header-cart .shoptimizer-cart-icon,
	.shoptimizer-cart .shoptimizer-cart-icon {
		gap: 0 !important;
		width: 24px !important;
		height: 24px !important;
		flex: 0 0 24px !important;
	}

	.site-header-cart .shoptimizer-cart-icon svg,
	.shoptimizer-cart .shoptimizer-cart-icon svg {
		width: 22px !important;
		height: 22px !important;
		flex: 0 0 22px !important;
	}

	.site-header .main-header img.custom-logo,
	header#masthead .main-header img.custom-logo,
	.main-header .site-branding img.custom-logo,
	img.custom-logo {
		height: 28px !important;
		width: auto !important;
		max-height: 28px !important;
	}

	.site-header-cart .shoptimizer-cart-icon .mini-count,
	.shoptimizer-cart .shoptimizer-cart-icon .mini-count,
	.site-header-cart a.cart-contents .shoptimizer-cart-icon .mini-count,
	.shoptimizer-cart a.cart-contents .shoptimizer-cart-icon .mini-count,
	.site-header-cart a.cart-contents:hover .shoptimizer-cart-icon .mini-count,
	.shoptimizer-cart a.cart-contents:hover .shoptimizer-cart-icon .mini-count,
	.site-header-cart .mini-count,
	.shoptimizer-cart .mini-count {
		position: absolute !important;
		top: -7px !important;
		right: -9px !important;
		left: auto !important;
		bottom: auto !important;
		margin: 0 !important;
		width: 16px !important;
		height: 16px !important;
		min-width: 16px !important;
		flex: none !important;
		font-size: 10px !important;
		line-height: 16px !important;
		z-index: 2;
	}
}