/**
 * The slider deliberately reuses WooCommerce's `ul.products > li.product` markup so
 * your theme's product-card styling applies automatically. These rules only strip the
 * theme's GRID LAYOUT (widths, floats, gutters) from that markup, leaving the card's
 * visual styling (borders, padding, typography, buttons) untouched. Splide controls
 * the outer .splide__slide, so nothing here fights the carousel.
 */

/* Keep Splide's track as a flex row even if the theme is aggressive elsewhere. */
.wps-splide.splide .splide__list {
	display: flex;
}

/* Each slide hosts a standalone single-item product list. Force it to a plain block
   so the theme's grid/flex column layout doesn't apply inside one slide. */
.wps-splide .splide__slide > ul.products {
	display: block !important;
	width: 100%;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	gap: 0 !important;
}
.wps-splide .splide__slide > ul.products::before,
.wps-splide .splide__slide > ul.products::after {
	content: none !important;
	display: none !important;
}

/* The product fills its slide. Splide sets the slide width; the card just stretches. */
.wps-splide .splide__slide li.product {
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	float: none !important;
	clear: none !important;
	box-sizing: border-box;
}
.wps-splide .splide__slide li.product::before,
.wps-splide .splide__slide li.product::after {
	content: none !important;
}

/* Editor-only empty state */
.wps-empty {
	padding: 24px;
	border: 1px dashed #c3c4c7;
	border-radius: 6px;
	color: #50575e;
	text-align: center;
	font-size: 14px;
}