/* Impreza Plus — search form (ip_search_form).
   Fields use Impreza form markup (w-form-row) and theme field / button styles;
   rules below only lay out rows and columns and cover what forms.css may not load. */

.ip-sf {
	--ip-sf-gap: 1rem;
	line-height: 1.4;
	/* Fixed width: a container that shrinks to its content (e.g. a centered column) must not
	   follow the selected values. Percent max-width is ignored for intrinsic size, so the
	   container gets its full available width; Design > Width overrides this. */
	width: 100vw;
	max-width: 100%;
	}
.ip-sf__row {
	display: grid;
	grid-template-columns: var(--ip-sf-cols, minmax(0, 1fr));
	gap: var(--ip-sf-gap);
	align-items: end;
	}
.ip-sf__row + .ip-sf__row {
	margin-top: var(--ip-sf-gap);
	}
.ip-sf .ip-sf__cell {
	position: relative;
	min-width: 0;
	width: auto;
	margin: 0;
	padding: 0;
	}

/* Select with the theme arrow */
.ip-sf .w-form-row-field {
	position: relative;
	}
.ip-sf select,
.ip-sf .ip-sf__range input {
	width: 100%;
	}
.ip-sf .for_select select {
	-webkit-appearance: none;
	appearance: none;
	padding-inline-end: max( var(--inputs-padding, .6em) * 2 + .8em, 1.5em );
	}
.ip-sf .for_select .w-form-row-field::after {
	content: '';
	position: absolute;
	top: calc( var(--inputs-height, 2em) / 2 + var(--inputs-border-width, 1px) );
	inset-inline-end: 0;
	font-size: var(--inputs-font-size, inherit);
	margin: -.2em calc( var(--inputs-padding, .6em) + var(--inputs-border-width, 1px) );
	color: var(--inputs-text-color, inherit);
	pointer-events: none;
	border: .4em solid;
	border-left-color: transparent;
	border-right-color: transparent;
	border-bottom-color: transparent;
	border-radius: 2px;
	}

/* Dropdown fields: List Filter markup, styles come from Impreza (.w-filter.mod_dropdown) */
.ip-sf .ip-sf__drop .w-filter-item {
	width: 100%;
	}
.ip-sf .ip-sf__drop .w-filter-item.expand {
	z-index: 100;
	}
/* The panel can be wider than the field (width in «Оформление фильтров»): in the last column it opens to the left */
.ip-sf__row > .ip-sf__cell:last-child:not(:first-child) .ip-sf__drop .w-filter-item-content {
	inset-inline-end: 0;
	}
/* Impreza forms.css gives labels in ".w-form-row.for_radio / .for_checkboxes" width: fit-content */
.ip-sf .ip-sf__drop .w-filter-item-value > label {
	width: auto;
	cursor: pointer;
	}
.ip-sf .ip-sf__drop .w-filter-item-values {
	max-height: 300px;
	overflow-y: auto;
	overflow-x: hidden;
	}
/* Range and values as Impreza buttons (layout and active state from List Filter styles): no scroll */
.ip-sf .ip-sf__drop .type_range_slider .w-filter-item-values,
.ip-sf .ip-sf__drop .values_as_btn .w-filter-item-values {
	max-height: none;
	overflow: visible;
	}

/* Long title: faded at the right edge, the arrow / reset cross keep their place */
.ip-sf .ip-sf__drop .w-filter-item-title {
	text-overflow: clip;
	}
.ip-sf .ip-sf__title {
	display: block;
	overflow: hidden;
	white-space: nowrap;
	-webkit-mask-image: linear-gradient(to left, transparent, #000 2em);
	mask-image: linear-gradient(to left, transparent, #000 2em);
	}
.ip-sf .ip-sf__drop .has_value .ip-sf__title > span::before {
	content: ':\0020';
	}
/* Impreza puts ": " before ".w-filter-item-title > span" — that is our wrapper here
   (".w-filter.state_desktop.mod_dropdown .w-filter-item.has_value .w-filter-item-title>span:before" — 6 classes + 2 elements) */
.ip-sf .w-filter.ip-sf__drop .w-filter-item.has_value .w-filter-item-title > .ip-sf__title::before {
	content: none;
	}

/* From – to */
.ip-sf__range {
	display: flex;
	gap: .5em;
	}
.ip-sf__range input {
	flex: 1 1 0;
	min-width: 0;
	}
.ip-sf .ip-sf__drop .ip-sf__range + .ip-sf__slider {
	margin-top: 1.2em;
	margin-bottom: .4em;
	}

/* Submit */
.ip-sf__submit .w-btn {
	width: 100%;
	justify-content: center;
	}

/* Error state, as in Impreza forms */
.ip-sf .w-form-row-state {
	display: none;
	font-size: .9em;
	padding-top: .3em;
	color: red;
	}
.ip-sf .check_wrong .w-form-row-state {
	display: block;
	visibility: visible;
	height: auto;
	opacity: 1;
	}
.ip-sf .check_wrong select,
.ip-sf .check_wrong .w-filter-item-title {
	box-shadow: 0 0 0 1px red;
	border-color: red;
	}

/* Live Builder hints */
.ip-sf__warnings {
	margin-bottom: 1rem;
	padding: .75em 1em;
	border-inline-start: 4px solid #dba617;
	background: #fcf9e8;
	color: #1d2327;
	font-size: 14px;
	}
.ip-sf__warnings ul {
	margin: .3em 0 0 1.2em;
	}
.ip-sf--placeholder {
	padding: 1em;
	border: 1px dashed currentColor;
	opacity: .7;
	}
