/* ---------- The checkout's masthead: the wordmark alone, flush with the form
 * The checkout is the most sensitive page: nothing there leads away from paying (owner,
 * 2026-10-10). The theme's minimal checkout (body.min-ck — Customizer "simple checkout")
 * already strips the masthead to the wordmark + the page title; on top of that:
 *   • the search is gone (inc/search/search.php) and the wordmark is plain text, not a link
 *     home (the get_custom_logo filter in functions.php);
 *   • no line under the header, at rest or scrolled;
 *   • no visible page title ("לקופה") — it stays for screen readers;
 *   • desktop: the wordmark is the header's only item, in flow, centred, the site's height;
 *   • mobile: the form starts right under the header.
 * Every rule is scoped to the minimal checkout; the thank-you page (order-received) has the
 * full header and is untouched. `body` in front = one more type in the specificity, enough to
 * beat the theme's rules without !important (and the child's !important ones with it).
 * Tests: tests/suites/checkout_live.py. */

/* No line under the header: the theme's 1px #eee (cart-checkout.min.css) … */
body.woocommerce-checkout.min-ck:not(.woocommerce-order-received) .site-header {
	border-bottom: 0;
}
/* … and the menu bar, printed empty here, never draws header-sticky.css's scroll divider. */
body.woocommerce-checkout.min-ck:not(.woocommerce-order-received) .col-full-nav {
	border-bottom: none !important;
}

/* The page title: unseen, still the page's <h1> for screen readers (WordPress's
 * .screen-reader-text). Overrides the theme's display:flex (desktop) / display:none (mobile). */
body.woocommerce-checkout.min-ck:not(.woocommerce-order-received) .site-header h1 {
	display: block;
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

@media (min-width: 993px) {
	/* style.css pins the branding absolutely at the centre so the controls can flank it; here
	 * nothing flanks it, and absolutely placed it would leave the header without height once
	 * the title is gone — so it goes back in flow, centred. Elsewhere the row's height is the
	 * cart's (the theme's Navigation Height); with no cart here the branding takes that height
	 * itself (--lp-nav-h, inc/content-width), so the masthead is the site's 70px and the
	 * wordmark sits exactly where it sits on every other page. */
	body.woocommerce-checkout.min-ck:not(.woocommerce-order-received) div.main-header {
		justify-content: center !important;
	}
	body.woocommerce-checkout.min-ck:not(.woocommerce-order-received) div.site-branding {
		position: static !important;
		transform: none !important;
		display: flex;
		align-items: center;
		height: var(--lp-nav-h);
	}
}

@media (max-width: 992px) {
	/* The form closer to the wordmark: no top padding on main (the theme's 1.5rem) — the
	 * header's own air under the wordmark and the form's padding are the gap. */
	body.woocommerce-checkout.min-ck:not(.woocommerce-order-received) .site-main {
		padding-top: 0;
	}
}