/* 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: the colour is painted
	   out to both screen edges without making the page wider. */
	box-shadow: 0 0 0 100vmax #29527D;
	clip-path: inset(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; }