/**
 * Task 5a — sitewide top bar, one line.
 *
 *   left   : School & Municipal PO's · Tax-exempt & PO upload · Quote builder
 *   centre : the shipping qualifier
 *   right  : phone + My Account
 *
 * Without this the secondary menu stacks vertically (3+ lines) and the
 * phone/account HTML wraps to two. Everything here is layout only - the wording
 * lives in the menu and in the Customizer html2 module.
 *
 * Legacy CSS on this site leans on !important, so a few rules match it to win.
 */

/* ---- the row itself: one line, no wrapping ---- */
.site-top-header-inner-wrap {
	flex-wrap: nowrap !important;
	align-items: center;
}

.site-header-top-section-left,
.site-header-top-section-center,
.site-header-top-section-right {
	align-items: center;
}

/* ---- left: horizontal list with middot separators ---- */
.site-header-top-section-left .secondary-menu-container ul,
.site-header-top-section-left ul.menu,
.site-header-top-section-left ul {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap;
	align-items: center;
	gap: 0;
	margin: 0;
	padding: 0;
	list-style: none;
}

.site-header-top-section-left ul li {
	display: inline-flex !important;
	align-items: center;
	margin: 0;
	padding: 0;
	white-space: nowrap;
	float: none !important;
}

/* Separator between items, never before the first or after the last. */
.site-header-top-section-left ul li + li::before {
	content: "\00b7";
	display: inline-block;
	padding: 0 10px;
	opacity: .55;
	font-weight: 400;
}

.site-header-top-section-left ul li a {
	padding: 0 !important;
	white-space: nowrap;
}

/* ---- centre: the qualifier, one line ---- */
.header-html2 {
	white-space: nowrap;
	text-align: center;
}

.header-html2 .spartan-bar-qual {
	opacity: .78;
	font-weight: 400;
}

/* ---- right: phone + account inline ---- */
.ledt_top_menu {
	display: inline-flex !important;
	flex-direction: row !important;
	align-items: center;
	gap: 18px;
	white-space: nowrap;
}

.ledt_top_menu a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	white-space: nowrap;
}

.ledt_top_menu img {
	display: inline-block;
	vertical-align: middle;
	max-height: 16px;
	width: auto;
}

/* ---------------------------------------------------------------------------
 * Type size. Measured at the inherited 18px (centre) / 16px (left) the row
 * needed 1731px of width - left 561 + centre 870 + right 243 - so the phone and
 * My Account block sat off-screen even at 1440. A utility bar does not need
 * 18px. At 14px the whole row fits on a normal desktop with nothing dropped,
 * which beats dropping content at every width.
 * ------------------------------------------------------------------------- */
.site-top-header-wrap .site-header-top-section-left a,
.site-top-header-wrap .site-header-top-section-left ul li,
.site-top-header-wrap .header-html2,
.site-top-header-wrap .ledt_top_menu,
.site-top-header-wrap .ledt_top_menu a {
	font-size: 13px !important;
	line-height: 1.5 !important;
	letter-spacing: 0 !important;
}

/* Tighten the gaps too - at 14px the row still needed 1445px against a 1440
 * viewport, i.e. it missed by five pixels. */
.site-header-top-section-left ul li + li::before {
	padding: 0 8px;
}

.ledt_top_menu {
	gap: 14px;
}

/* ---------------------------------------------------------------------------
 * Narrower desktops: shed content in the order the brief specifies - the
 * quote-builder mention first, the qualifier tail second. Both remain reachable
 * elsewhere (quote builder from the product page and header; the qualifier is
 * restated as the shipping fact on every product page).
 *
 * Below 1025px none of this applies: Kadence swaps to its mobile header, which
 * has no top row at all, so the bar is not rendered rather than wrapped.
 * ------------------------------------------------------------------------- */

/* 1. (removed 2026-09-13 - see the note at the foot of this file) */

/* 2. Then drop the qualifier tail. */
@media (max-width: 1199px) {
	.header-html2 .spartan-bar-qual {
		display: none;
	}
}

/* ---------------------------------------------------------------------------
 * 2026-09-12: keep the shipping line in the header at ALL desktop widths.
 *
 * The qualifier tail was being dropped below 1199px and the quote-builder link
 * below 1399px, because the centre string alone was 628px - over half the bar.
 * Shipping stays in the header by decision, so the tail shrinks instead of
 * disappearing: it is a caveat, not the message, and reads fine a size down.
 *
 * The two school links are now one item, which returns ~150px on its own.
 * Between them nothing needs to drop at 1280.
 * ------------------------------------------------------------------------- */

.site-top-header-wrap .header-html2 .spartan-bar-qual {
	font-size: 11px !important;
	opacity: .88;
}

/* Both shed-rules are now unnecessary - the row fits. */
@media (max-width: 1199px) {
	.header-html2 .spartan-bar-qual {
		display: inline !important;
	}
}

/* ---------------------------------------------------------------------------
 * 2026-09-13: the quote builder left this bar.
 *
 * It moved to the main menu as "Build a Quote", alongside the new "Request a
 * Quote", which is where a buyer looks for it. Every rule that hid
 * .spartan-topbar--quote-builder at narrow widths is therefore gone - a rule
 * matching an element that no longer exists is not a backstop, it is a
 * misleading comment.
 *
 * The freed width paid for the longer "Schools & Government Uploads" label,
 * which is the same page as before (/po-tax-exempt/) named for what it is.
 * Net effect on the row: narrower than it was.
 *
 * The left side is now a single item, so there is no shed-ladder left to get
 * wrong. If a second item is ever added back here, give it a slug class and
 * target it by name - never by :last-child. See class-top-bar.php.
 * ------------------------------------------------------------------------- */

/* ---- top bar link states -------------------------------------------------
 * Reported 2026-09-13: clicking a top-bar link made its text vanish. The bar is
 * navy and the theme's :visited / :active colour is dark, so a clicked link
 * went dark-on-navy and effectively disappeared.
 *
 * All five states are pinned to white. :visited has to be stated explicitly -
 * it does not inherit from the base rule - and the centre text and right-hand
 * items are covered too so the whole row stays legible whatever has been
 * clicked.
 * ------------------------------------------------------------------------- */

.site-top-header-wrap a,
.site-top-header-wrap a:link,
.site-top-header-wrap a:visited,
.site-top-header-wrap a:hover,
.site-top-header-wrap a:focus,
.site-top-header-wrap a:active,
.site-top-header-wrap .header-html2,
.site-top-header-wrap .ledt_top_menu a {
	color: #fff !important;
}

.site-top-header-wrap a:hover,
.site-top-header-wrap a:focus {
	text-decoration: underline;
	opacity: .92;
}
