/*
 * Qode uses these inputs as the internal state for the price slider. They must
 * remain in the DOM, but the theme exposes them as editable text fields on
 * smaller screens. The slider already provides the complete user interface.
 */
.qodef-woo-product-list .qodef-e-price-filter .qodef-price-slider-amount {
	display: none !important;
}

/*
 * The child theme's mobile CSS forces every filter row back to
 * display:block!important. The contextual script marks unavailable values with
 * aria-hidden="true", so this more specific rule keeps only those values
 * hidden without changing the mobile layout of available values.
 */
@media only screen and (max-width: 767px) {
	.qodef-woo-product-list
		.qodef-filter-right
		.qodef-e-checkbox[aria-hidden="true"],
	.qodef-woo-product-list
		.qodef-filter-right
		.qodef-grid-item[aria-hidden="true"] {
		display: none !important;
	}

	.qodef-woo-product-list
		.qodef-filter-right
		.qodef-price-slider-amount {
		display: none !important;
	}

	/*
	 * Restore a compact, positioned label on mobile. The child CSS sets the
	 * label text to position:static and width:100%, which prevents the active
	 * underline from being attached to the selected text.
	 */
	.qodef-woo-product-list
		.qodef-filter-right
		.qodef-filter-checkbox-type
		.qodef-e-checkbox
		.qodef-e-label {
		position: relative !important;
		display: inline-block !important;
		width: auto !important;
	}

	.qodef-woo-product-list
		.qodef-filter-right
		.qodef-filter-checkbox-type
		.qodef-e-checkbox.qodef--active
		.qodef-e-label::after {
		content: "";
		position: absolute;
		left: 0;
		right: 0;
		bottom: -4px;
		height: 2px;
		background: currentColor;
	}
}
