/* RCM live-site cleanup. Elementor editor canvases remain unaffected. */
.rcm-content-is-empty,
.rcm-content-is-empty[hidden] {
	display: none !important;
}

/* Vehicle templates can render empty ACF variant wrappers/slides. */
.car-card[hidden],
.swiper-slide.rcm-empty-vehicle-slide,
.swiper-slide.rcm-empty-vehicle-slide[hidden] {
	display: none !important;
}

/*
 * Mixed Offers landing page.
 *
 * Some brands (notably Volkswagen) use two independent Elementor Loop Grids
 * inside one `.rcm-offer-mixed-grid` container: one query returns Offer
 * Categories and the other returns standalone Offers. Elementor normally lays
 * those widgets out as separate rows. `display: contents` removes only the
 * intermediary Loop Grid boxes so both sets of loop items participate in one
 * parent grid without changing either query, Loop Item template or permalink.
 *
 * Keep this frontend-only: the Elementor editor must retain its native widget
 * boxes so the two queries remain independently editable.
 */
body:not(.elementor-editor-active):not(.elementor-editor-preview) .rcm-offer-mixed-grid {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--gap, 20px);
	align-items: stretch;
}

body:not(.elementor-editor-active):not(.elementor-editor-preview) .rcm-offer-mixed-grid > .elementor-widget-loop-grid,
body:not(.elementor-editor-active):not(.elementor-editor-preview) .rcm-offer-mixed-grid > .elementor-widget-loop-grid > .elementor-widget-container,
body:not(.elementor-editor-active):not(.elementor-editor-preview) .rcm-offer-mixed-grid > .elementor-widget-loop-grid > .elementor-widget-container > .elementor-loop-container {
	display: contents !important;
}

body:not(.elementor-editor-active):not(.elementor-editor-preview) .rcm-offer-mixed-grid > .elementor-widget-loop-grid > .elementor-widget-container > .elementor-loop-container > .e-loop-item {
	min-width: 0;
	max-width: 100%;
}

@media (max-width: 1024px) {
	body:not(.elementor-editor-active):not(.elementor-editor-preview) .rcm-offer-mixed-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 767px) {
	body:not(.elementor-editor-active):not(.elementor-editor-preview) .rcm-offer-mixed-grid {
		grid-template-columns: minmax(0, 1fr);
	}
}
