/*
 * April Fixes - front-end CSS
 * (#6 mobile menu spacing is injected dynamically in includes/fixes-css.php)
 */

/* =========================================================================
 * #7 - 1240px content width on sub-pages (category, product, cart, checkout...)
 *
 * The home page is built with Elementor and uses Elementor's content width
 * (already 1240px). Sub-pages use the theme's `.container`, which the theme
 * leaves full-width up to 1470px. Cap it to 1240px on desktop. The Elementor
 * home content (.e-con / .site-content) is unaffected. The header keeps its own
 * width (a more specific rule), so only page content is constrained here.
 * ========================================================================= */
@media (min-width: 1240px) {
	.container {
		max-width: 1240px;
	}
}

/*
 * Single products and category archives don't use `.container` - their content
 * sits in a full-width `#primary.content-area` (inside #bwp-main, no wrapper),
 * so the rule above misses them. Cap + centre that wrapper on WooCommerce pages.
 * Harmless on cart/checkout/shop where #primary is already <=1240px.
 */
.woocommerce-page #primary.content-area {
	max-width: 1240px;
	margin-left: auto;
	margin-right: auto;
}

/* =========================================================================
 * #8 - Footer divider line on sub-pages.
 *
 * Elementor enqueues widget-divider.min.css only on pages that contain the
 * divider in their own content. On theme-rendered sub-pages (shop, cart, etc.)
 * the footer template's divider loses its line-drawing rule and falls back to an
 * unstyled dark line. Re-supply Elementor's own rule, using its CSS variables so
 * every divider keeps its configured colour / width / style (no hardcoded IDs or
 * colours - reproducible across environments).
 * ========================================================================= */
.elementor-widget-divider:not(.elementor-widget-divider--view-line_text):not(.elementor-widget-divider--view-line_icon) .elementor-divider-separator {
	border-block-start: var(--divider-border-width) var(--divider-border-style) var(--divider-color);
}

.elementor-widget-divider--view-line_icon .elementor-divider-separator::before,
.elementor-widget-divider--view-line_icon .elementor-divider-separator::after,
.elementor-widget-divider--view-line_text .elementor-divider-separator::before,
.elementor-widget-divider--view-line_text .elementor-divider-separator::after {
	content: "";
	display: block;
	flex-grow: 1;
	border-block-start: var(--divider-border-width) var(--divider-border-style) var(--divider-color);
}

/* =========================================================================
 * Client follow-up - hide the catalog view-mode switcher (list / 2- / 3- /
 * 4-column grid toggle) on product listings so visitors can't change the
 * layout. The theme renders it as `<ul class="display">` (antisa_grid_list()),
 * and it only appears on category/shop archives. Hidden on all product
 * listings for a consistent layout.
 * ========================================================================= */
.woocommerce-page ul.display {
	display: none !important;
}