/**
 * Cartridgewereld — Elementor + Woodmart layout (zoals eerder in de chat).
 * Gebruikt Woodmart’s --wd-container-w uit theme-instellingen (niet forceren in child style.css).
 * Laadt via wp_enqueue (ná elementor-post-*) + kopie in wp_footer.
 */

/* Basis: pagina-schaal (alle breakpoints) */
html body.cw-elementor-layout {
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
	box-sizing: border-box !important;
}

html body.cw-elementor-layout .wd-page-wrapper.website-wrapper {
	width: 100% !important;
	max-width: none !important;
	min-width: 100% !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	box-sizing: border-box !important;
}

/**
 * Header (WHB): niet de brede “full width header”-container volgen.
 * Woodmart zet bij .whb-full-width o.a. .whb-row > .container op clamp(..., 95%, 100%);
 * na onze brede .wd-page-wrapper lijkt de balk visueel over de hele viewport uitgerekt.
 * Binnen .whb-header/.whb-clone weer de gewone .container-breedte van het thema.
 */
@media (min-width: 481px) {
	html body.cw-elementor-layout .whb-header .whb-row > .container,
	html body.cw-elementor-layout .whb-clone .whb-row > .container {
		max-width: var(--wd-container-w) !important;
		width: 100% !important;
		margin-inline: auto !important;
		padding-inline: 15px !important;
	}

	html body.cw-elementor-layout .wd-page-wrapper,
	html body.cw-elementor-layout .wd-page-content,
	html body.cw-elementor-layout main.wd-content-layout,
	html body.cw-elementor-layout .wd-content-area,
	html body.cw-elementor-layout article.entry-content,
	html body .wd-footer,
	html body .wd-footer .container {
		overflow-x: visible !important;
	}

	html body.cw-elementor-layout .wd-page-content.main-page-wrapper,
	html body.cw-elementor-layout main.wd-content-layout {
		width: 100% !important;
		max-width: none !important;
		min-width: 100% !important;
		box-sizing: border-box !important;
	}

	html body.cw-elementor-layout .wd-content-area.site-content,
	html body.cw-elementor-layout article.entry-content {
		max-width: none !important;
		width: 100% !important;
		min-width: 100% !important;
		box-sizing: border-box !important;
	}

	/* Elementor kit (1140px): naar theme-containerbreedte */
	html body .elementor .e-con {
		--container-max-width: min(100%, calc(var(--wd-container-w) - 30px)) !important;
	}

	html body.cw-elementor-layout .wd-page-wrapper .wd-page-content main.wd-content-layout .wd-content-area.site-content article.entry-content > .elementor[data-elementor-id]:not([data-elementor-type="popup"]),
	html body.elementor-page .wd-content-area .entry-content > .elementor[data-elementor-id]:not([data-elementor-type="popup"]),
	html body .wd-footer .container > .elementor[data-elementor-id]:not([data-elementor-type="popup"]) {
		--cw-vw: calc(100vw - var(--wd-scroll-w, 0px) - var(--wd-sticky-nav-w, 0px));
		--cw-shift: calc(50% - 50vw + var(--wd-scroll-w, 0px) / 2 + var(--wd-sticky-nav-w, 0px) / 2);
		width: var(--cw-vw) !important;
		max-width: none !important;
		min-width: min(100%, var(--cw-vw)) !important;
		margin-inline: unset !important;
		margin-left: var(--cw-shift) !important;
		margin-right: 0 !important;
		position: relative !important;
		left: 0 !important;
		right: auto !important;
		transform: none !important;
		box-sizing: border-box !important;
	}

	html body .wd-content-area .elementor[data-elementor-id]:not([data-elementor-type="popup"]) > .e-con,
	html body .wd-footer .elementor[data-elementor-id]:not([data-elementor-type="popup"]) > .e-con {
		--width: 100% !important;
		max-width: none !important;
		width: 100% !important;
		min-width: 0 !important;
		left: 0 !important;
		--content-width: min(100%, calc(var(--wd-container-w) - 30px)) !important;
	}

	html body .wd-content-area .elementor[data-elementor-id]:not([data-elementor-type="popup"]) > .e-con.e-con-boxed > .e-con-inner,
	html body .wd-footer .elementor[data-elementor-id]:not([data-elementor-type="popup"]) > .e-con.e-con-boxed > .e-con-inner {
		max-width: min(100%, calc(var(--wd-container-w) - 30px)) !important;
		width: 100% !important;
		margin-left: auto !important;
		margin-right: auto !important;
		box-sizing: border-box !important;
	}

	html body .elementor-section[class*="wd-section-stretch"]:not(.e-con) {
		--cw-vw: calc(100vw - var(--wd-scroll-w, 0px) - var(--wd-sticky-nav-w, 0px));
		--cw-shift: calc(50% - 50vw + var(--wd-scroll-w, 0px) / 2 + var(--wd-sticky-nav-w, 0px) / 2);
		width: var(--cw-vw) !important;
		min-width: var(--cw-vw) !important;
		max-width: none !important;
		left: var(--cw-shift) !important;
		position: relative !important;
		box-sizing: border-box !important;
	}

	html body .elementor-section.elementor-section-boxed > .elementor-container,
	html body .elementor-section.wd-section-stretch > .elementor-container {
		max-width: min(100%, calc(var(--wd-container-w) - 30px)) !important;
		margin-left: auto !important;
		margin-right: auto !important;
		box-sizing: border-box !important;
	}
}