/* Site-wide styles (every page). */

/*
 * Main menu row as a full-width band in the logo's "X" blue (#29527D), on every page
 * (Bob 2026-11-04 08:52 and 09:12: edge to edge, the logo's blue).
 * The header itself (header.nx-header > nav.nx-nav) is printed by Commerce Toolkit;
 * only its colours and spacing change here, not its markup or links.
 * The Shop All mega-menu panel keeps its own white background and dark text.
 */
header.nx-header nav.nx-nav {
	background: #29527D; /* Logo "X" blue (Bob 09:12). */
	/* Edge to edge even when the header sits in a narrower box: border-image paints the
	   colour out to both screen edges, left and right only, without making the page wider.
	   2.0.12: replaces 2.0.9's box-shadow + clip-path, because clip-path also cut off
	   the Shop All panel that opens below this row (Bob 14:39: Shop All did nothing). */
	border-image: linear-gradient(#29527D, #29527D) fill 0 / 0 / 0 100vmax;
	padding-top: 12px !important;
	padding-bottom: 12px !important;
	align-items: center;
}
header.nx-header nav.nx-nav > a,
header.nx-header nav.nx-nav > details.nx-mega > summary {
	color: #fff !important;
	font-weight: 600;
	text-decoration: none;
}
header.nx-header nav.nx-nav > a:hover,
header.nx-header nav.nx-nav > a:focus-visible,
header.nx-header nav.nx-nav > details.nx-mega > summary:hover,
header.nx-header nav.nx-nav > details.nx-mega[open] > summary {
	color: #FFD3B8 !important;
}
header.nx-header nav.nx-nav > details.nx-mega > summary::marker,
header.nx-header nav.nx-nav > details.nx-mega > summary svg { color: #fff; }

/*
 * Add to cart buttons on every page are orange (Bob 2026-11-04 09:11), the same as on
 * the product page: shop / category / search cards, related products, Recently viewed,
 * the mini cart's checkout button. 44 px tall like the product page buttons.
 */
.woocommerce ul.products li.product .button.add_to_cart_button,
.woocommerce ul.products li.product .button.product_type_simple,
.woocommerce ul.products li.product .button.product_type_variable,
.woocommerce ul.products li.product a.button,
.woocommerce-page ul.products li.product a.button,
.wc-block-grid__product .wp-block-button__link,
.wc-block-components-product-button__button,
.woocommerce-mini-cart__buttons .button.checkout,
.single_add_to_cart_button {
	background: #F26B1D !important;
	border-color: #F26B1D !important;
	color: #fff !important;
	min-height: 44px;
	padding: 0 18px !important;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	border-radius: 10px !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	line-height: 1.2 !important;
	box-shadow: none !important;
}
.woocommerce ul.products li.product a.button:hover,
.woocommerce-page ul.products li.product a.button:hover,
.wc-block-grid__product .wp-block-button__link:hover,
.wc-block-components-product-button__button:hover,
.woocommerce-mini-cart__buttons .button.checkout:hover,
.single_add_to_cart_button:hover {
	background: #D85A12 !important;
	border-color: #D85A12 !important;
	color: #fff !important;
}

/*
 * Product cards in a row: price and Add to cart line up at the same level even when the
 * titles have different lengths (Bob 09:11). Each card is a column and the button is
 * pushed to the bottom of the card.
 */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product,
.wc-block-grid__product {
	display: flex !important;
	flex-direction: column;
}
.woocommerce ul.products li.product > .button,
.woocommerce ul.products li.product > a.button,
.woocommerce ul.products li.product .ast-woo-product-actions,
.wc-block-grid__product > .wp-block-button,
.wc-block-grid__product > .wc-block-components-product-button {
	margin-top: auto !important;
	align-self: flex-start;
}
/* Titles take the same room on every card (3 lines, longer titles end with "…"), so the
   prices below them also line up. */
.woocommerce ul.products li.product .woocommerce-loop-product__title {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	line-clamp: 3;
	overflow: hidden;
	min-height: calc(3 * 1.3em);
	line-height: 1.3 !important;
}
/* Cards in a row get the same height (the shop grid is a CSS grid in Astra). */
.woocommerce ul.products,
.woocommerce-page ul.products { align-items: stretch; }

/*
 * Footer in the logo's "X" blue with white text (Bob 09:12). Astra's footer and the
 * Commerce Toolkit footer (if present) only get colours; their content is unchanged.
 */
footer.site-footer,
footer.nx-footer,
.site-footer .site-primary-footer-wrap,
.site-footer .site-below-footer-wrap,
.site-footer .site-above-footer-wrap {
	background-color: #29527D !important;
	color: #fff !important;
}
footer.site-footer a,
footer.nx-footer a,
footer.nx-footer :is(p, li, span, small, strong, h2, h3, h4, h5, h6, address, label) { color: #fff !important; }
footer.site-footer a:hover,
footer.nx-footer a:hover { color: #FFD3B8 !important; }

/*
 * Header cart count (inc/cart.php, assets/cart.js; Bob 14:40): a small orange badge on the
 * Cart link, hidden when the cart is empty, updated without a page reload.
 */
a.nx-cart { position: relative; }
a.nx-cart .nexsaver-cart-count {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 18px; height: 18px; padding: 0 5px; margin-inline-start: 4px;
	border-radius: 9px; background: #F26B1D; color: #fff;
	font-size: 11px; font-weight: 700; line-height: 1; vertical-align: top;
}
a.nx-cart .nexsaver-cart-count[hidden] { display: none; }
/* Product page: "Added to cart. View cart" / error text under the Add to cart form. */
.nxc-cart-msg { margin: 8px 0 0; font-size: 14px; line-height: 20px; color: #1E7B34; }
.nxc-cart-msg.is-error { color: #B42318; }
.nxc-cart-msg a { margin-inline-start: 6px; font-weight: 700; text-decoration: underline; }
.single_add_to_cart_button.loading { opacity: .7; pointer-events: none; }