/* https://getbootstrap.com/docs/3.4/css/#forms */
.form {}

.form__title {
	color: var(--color-blue);
	font-weight: 700;
	font-size: 1.125rem;
}
.form__description {
	font-weight: bold;
	font-size: .875rem;
	padding: 10px 0;
}
.form__note {
	color: var(--color-gray-dark);
	font-size: .875rem;
}
.form__note:not(:last-child) {
	margin-bottom: 10px;
}
.form__span-dim {
	font-weight: 500;
	font-size: .875rem;
	color: var(--color-gray-dark);
	display: flex;
	align-items: center;
	padding: 5px 0;
}

.form__input-title {
	color: var(--color-brown);
	display: block;
	font-weight: 700;
	font-size: .875rem;
	margin-bottom: .25rem;
}
.form__subtitle,
.form__span {
	font-weight: 700;
	margin-bottom: .625rem;
}
.form__span {
	display: block;
}
.form__subtitle-switch {
	font-weight: 700;
}
.form__span.required::after,
.form__subtitle.required::after,
.form__input-title.required::after,
.form__subtitle-switch.required::after {
	color: var(--color-red);
	content: '*';
	font-size: 1.25rem;
	font-weight: 700;
	line-height: 1;
	padding-left: 5px;
}

.form__input {
	background: none;
	border: 1px solid var(--color-gray);
	border-radius: 6px;
	box-sizing: border-box;
	font-size: .875rem;
	padding: 10px;
	overflow: hidden;
	white-space: nowrap;
	width: 100%;
	height: 50px;
}
.form__input:focus-visible {
	border-color: transparent;
	border-radius: 6px;
	outline: 2px solid var(--color-gray-3);
}
.form__input[disabled="disabled"] {
	background: var(--color-gray-light);
}
.form__input-wrapper .form__input {
	border: none;
}
.form__input-wrapper {
	border: 1px solid var(--color-gray);
	border-radius: 6px;
	display: block;
	width: 100%;
}

.password-input-wrapper {
	display: inline-block;
	position: relative;
}
.password-input-wrapper .show-pass {
	background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAJCAYAAAA7KqwyAAAA/klEQVQokV2RPS/EQRCHH4VOIREvhd5RKk6lRKuhoJJIfAGi0Vyuo6DzKeQqlUIhVyi9FBqNQkQEUbgI8chc5lj/X7Kb2Wdmd3ZmUKtrQT33T19pXanL1fi+2FKTwCkwCtwDh8AI8A48ABtADegAc0C7ey1fWsssL+p0siX1Un1Wt5ONq7cZu9lNrm4lOCi+1lSP026lf6/w7yRrxuEiD4NFwJF6rfar7fSfVeqP3tyFMaR+qh/qcDpXiyb2tF9cjtJCtR4YU18TridbUR+zL41k9eLBmeoUQi1gEXgDdoFvYAB4yilMADfAbLLfKZRrSj3JLFFnJ+349vy/WOUHnYuWGLWLSewAAAAASUVORK5CYII=') 50% 50% no-repeat;
	border: 0;
	cursor: pointer;
	-webkit-filter: brightness(.6) sepia(1) saturate(100%) hue-rotate(145deg);
	        filter: brightness(.6) sepia(1) saturate(100%) hue-rotate(145deg);
	padding: 0;
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 1.75rem;
	height: 1.5rem;
	z-index: 8;
}
.password-input-wrapper .show-pass.active {
	-webkit-filter: brightness(.6) sepia(1) saturate(10000%) hue-rotate(-145deg);
	        filter: brightness(.6) sepia(1) saturate(10000%) hue-rotate(-145deg);
}
.form__input-ico {
	fill: var(--color-gray);
	position: absolute;
	left: 8px;
	top: 50%;
	transform: translateY(-50%);
	width: 20px;
	height: 20px;
}
.form__input-ico + .form__input {
	padding-left: 36px;
}

.form__textarea {
	resize: vertical;
	white-space: normal;
	height: 200px;
}
.form__textarea_s {
	height: 100px;
}

.radio {
	font-size: 0;
	padding: 5px 0;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	vertical-align: middle;
}
.radio__choice {
	display: none;
}
.radio__label {
	box-sizing: border-box;
	cursor: pointer;
	display: block;
	font-size: .875rem;
	line-height: 1.125rem;
	padding: 5px 0 5px 25px;
	position: relative;
	transition: .1s;
}
.radio__label::before {
	background: var(--color-gray-xlight);
	border: 1px solid var(--color-gray);
	border-radius: 50%;
	box-sizing: border-box;
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	width: 16px;
	height: 16px;
}
.radio__choice:checked + .radio__label::before {
	border: 2px solid var(--color-blue);
}
.radio__choice:checked + .radio__label::after {
	background: var(--gradient-blue);
	border-radius: 50%;
	content: '';
	position: absolute;
	top: 50%;
	left: 4px;
	transform: translateY(-50%);
	width: 8px;
	height: 8px;
}

.form__btn-remove-all {
	display: flex;
	align-items: center;
	gap: 5px;
	color: var(--color-red);
}
.form__btn-remove-ico,
.form__btn-remove-item {
	border-radius: 50%;
	background: var(--gradient-red);
	cursor: pointer;
	display: block;
	position: relative;
}
.form__btn-remove-ico {
	display: flex;
}
.form__btn-remove-item.max575-visible {
	display: none;
}
.form__btn-remove-item > .ico,
.form__btn-remove-all > .ico {
	position: absolute;
	left: 50%; top: 50%;
	transform: translate(-50%, -50%);
}
.form__btn-remove-item > .ico {
	width: 12px;
	height: 12px;
}

.form__label {
	display: block;
	position: relative;
}
.form__label_narrow {
	width: 150px;
}
.form__label-text {
	color: var(--color-gray-dark);
	display: block;
	font-size: .875rem;
	padding: 0 5px 0 10px;
	position: absolute;
	bottom: 50%;
	transform: translate(0, 50%);
	width: fit-content;
}
.form__label-rub {
	color: var(--color-gray-dark);
	font-weight: 500;
	font-size: 1.125rem;
	position: absolute;
	right: 0.6rem;
	top: 50%;
	transform: translateY(-50%);
	width: fit-content;
}

.form-multi-checkboxes {
	border-radius: 5px;
	width: 100%;
}
.form-multi-checkboxes .checkbox,
.form-bordered-checkboxes .checkbox,
.form-bordered-checkboxes .radio {
	box-sizing: border-box;
	cursor: pointer;
	display: flex;
	align-items: flex-start;
	padding: 15px;
	width: 100%;
}
.form-multi-checkboxes .checkbox {
	border: 1px solid var(--color-gray);
}
.form-multi-checkboxes .checkbox:first-child {
	border-radius: 6px 0 0 6px;
}
.form-multi-checkboxes .checkbox:last-child {
	border-radius: 0 6px 6px 0;
}
.form-multi-checkboxes .svg-ico-bordered__img,
.form-bordered-checkboxes .svg-ico-bordered__img {
	fill: var(--color-gray);
	margin: 0 10px;
	width: 22px;
	height: 22px;
}
.form-bordered-checkboxes {
	border: 1px solid var(--color-gray);
	border-radius: 5px;
	width: 100%;
}
.form-bordered-checkboxes .ico {
	fill: var(--color-gray);
}
.form__autofill-list {
	background: #FFF;
	border-radius: 6px;
	box-shadow: 0 3px 6px rgba(0, 0, 0, .2);
	padding: 8px;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	transform: translateY(100%);
	transition: .3s;
	z-index: 8001;
}
.form__autofill-list:not(.active) {
	opacity: 0;
	pointer-events: none;
}
.form__autofill-list > a {
	color: var(--color-brown);
	font-size: .875rem;
	transition: .3s;
}
.form__autofill-list > a:hover {
	color: var(--color-blue)
}

.form-select-label,
.form-select-label_disabled,
.form-select__without-arrow {
	display: block;
	position: relative;
	width: 100%;
	height: 50px;
	border: 1px solid var(--color-gray);
	border-radius: 6px;
	box-sizing: border-box;
	align-content: center;
	font-size: .875rem;
	cursor: pointer;
}
.form-select-label_disabled {
	border: none;
}
.form-select-label_disabled .form-select {
	color: var(--color-brown);
	cursor: auto;
}
.form-select-label::before,
.form-select-label::after {
	content: '';
	display: block;
	pointer-events: none;
	position: absolute;
	top: 50%;
	right: 4px;
	transform: translateY(-50%);
	transition: .4s;
	width: 24px;
	height: 24px;
}
.form-select-label::before {
	background-image: url('data:image/svg+xml;base64, PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCiAgICA8cGF0aCBkPSJNMTAuNzUgMS4yOTkwNEMxMS41MjM1IDAuODUyNDU2IDEyLjQ3NjUgMC44NTI0NTYgMTMuMjUgMS4yOTkwNEwyMC42NDIzIDUuNTY2OTlDMjEuNDE1OCA2LjAxMzU3IDIxLjg5MjMgNi44Mzg4OSAyMS44OTIzIDcuNzMyMDVWMTYuMjY3OUMyMS44OTIzIDE3LjE2MTEgMjEuNDE1OCAxNy45ODY0IDIwLjY0MjMgMTguNDMzTDEzLjI1IDIyLjcwMUMxMi40NzY1IDIzLjE0NzUgMTEuNTIzNSAyMy4xNDc1IDEwLjc1IDIyLjcwMUwzLjM1NzcgMTguNDMzQzIuNTg0MTkgMTcuOTg2NCAyLjEwNzcgMTcuMTYxMSAyLjEwNzcgMTYuMjY4TDIuMTA3NyA3LjczMjA1QzIuMTA3NyA2LjgzODg5IDIuNTg0MTkgNi4wMTM1NyAzLjM1NzcgNS41NjY5OUwxMC43NSAxLjI5OTA0WiIgZmlsbD0iI0U3RjBGMCIgc3Ryb2tlPSIjQzFEMkQyIi8+DQo8L3N2Zz4=');
}
.form-select-label::after {
	background-image: url('data:image/svg+xml;base64, PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCiAgICA8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZD0iTTYuMDg2MjUgMTEuMzEzM0M2LjEzNTEzIDExLjM5MDYgNy40MTg1OCAxMi42OTUxIDguOTM4MzMgMTQuMjEyMkMxMS42NTkyIDE2LjkyODMgMTEuNzA0OCAxNi45NzA5IDExLjkxMjQgMTYuOTk0M0MxMi4wNTMxIDE3LjAxMDIgMTIuMTc2NiAxNi45OTI3IDEyLjI4NDEgMTYuOTQxN0MxMi4zNzUgMTYuODk4NiAxMy42NDEyIDE1LjY2NzEgMTUuMTkyOCAxNC4xMTI3QzE4LjE1MzMgMTEuMTQ2NyAxOC4wNTcxIDExLjI1OTQgMTcuOTY5NyAxMC44NjE0QzE3LjkzMjUgMTAuNjkyMSAxNy40NSAxMC4xNTQ0IDE3LjIzNTQgMTAuMDQzMkMxNy4wODQ5IDkuOTY1MTggMTYuODc4OSA5Ljk1ODk0IDE2LjY5NzEgMTAuMDI2OUMxNi42MjQ2IDEwLjA1NDEgMTUuNTM3IDExLjEwMzEgMTQuMjgwMyAxMi4zNTgxTDExLjk5NTQgMTQuNjM5OUw5LjcxMDkxIDEyLjM2MDVDOC40NTQ0NSAxMS4xMDY4IDcuMzgwMzkgMTAuMDU3OCA3LjMyNDEgMTAuMDI5M0M3LjE4MTg2IDkuOTU3NDQgNi45MDcyOCA5Ljk2NDcxIDYuNzU2MjggMTAuMDQ0M0M2LjU3NTEgMTAuMTM5OSA2LjEwNDkgMTAuNjMzMiA2LjA0NjUgMTAuNzg5MUM1Ljk3MzM5IDEwLjk4NDEgNS45ODYzNyAxMS4xNTUyIDYuMDg2MjUgMTEuMzEzM1oiIGZpbGw9IiM5MUE4QTgiLz4NCjwvc3ZnPg==');
}
.form-select-label.active .form-select__options {
	display: flex;
}
.form-select-label.w-50 {
	width: 49%;
}
.form-select__options {
	background: var(--color-white);
	box-shadow: 0 1px 6px rgb(0 0 0 / 25%);
	box-sizing: border-box;
	border-radius: 6px;
	font-size: .875rem;
	overflow: auto;
	padding: 10px;
	position: absolute;
	left: 0;
	top: calc(100% + 4px);
	max-height: 250px;
	width: 100%;
	z-index: 10;
}
.form-select {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background: none;
	border: none;
	box-sizing: border-box;
	cursor: pointer;
	outline: none;
	overflow: hidden;
	padding: 10px 30px 10px 10px;
	white-space: nowrap;
	width: 100%;
	min-width: max-content;
	height: 50px;
	border-radius: 6px;
}
.form-select:focus-visible {
	outline: 2px solid var(--color-gray-3);
}
.form-select__item-insert {
	color: var(--color-gray-dark);
	line-height: 20px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.form-select__without-arrow {
	padding: 10px;
}
.selected-item {
	color: var(--color-brown);
	font-weight: 600;
	margin-right: 8px;
	position: relative;
}
.selected-item:not(:last-child):after {
	content: ",";
	position: absolute;
}
.responsive-remove-button {
	align-self: center;
	flex-shrink: 0;
}

.form-container_auth {
	padding: 40px 70px;
}
.form_auth {
	font-size: .875rem;
	text-align: center;
}
.form_auth .form__title {
	font-size: 1.25rem;
}
.form_auth .form__subtitle {
	text-align: left;
}
.form_auth label,
.form_auth .form__subtitle {
	display: block;
}

.captcha--password-reset {
	border: 1px solid var(--color-gray);
	border-radius: 6px;
	padding: 5px 30px;
}
.captcha--refresh {
	text-decoration: underline dashed;
}

.changeable-counter {
	background: var(--color-white);
	border-radius: 8px;
}
.changeable-counter__input {
	border: none;
	line-height: 20px;
	text-align: center;
	width: 40px;
}
.changeable-counter__input:focus-visible {
	outline: none;
}
.changeable-counter:has(.changeable-counter__input:focus-visible) {
	outline: 2px solid var(--color-gray-3);
}
.changeable-counter__button {
	display: flex;
	justify-content: center;
	align-items: center;
	background: transparent;
	border: none;
	padding: 10px 5px;
	cursor: pointer;
}

.contact-form {
	gap: 1em;
}
.contact-form > label {
	width: 100%;
}
.contact-form-buttons {
	display: flex;
	gap: 1em;
}
.contact-form-buttons .button_m {
	width: 140px;
}

.form .dnd-area {
	background-color: var(--color-gray-light);
	border-radius: 6px;
	box-sizing: border-box;
	gap: 20px;
	margin: 16px auto;
	transition: all .2s;
	width: 100%;
	padding: 10px;
	font-size: .75rem;
	font-weight: 600;
}
.form .dnd-area__example-img {
	background: var(--color-gray-xlight);
	border-radius: 6px;
	border: 1px solid var(--color-gray);
	padding: 5px 0;
	text-align: center;
	width: 100%;
	height: 100px;
}
.form .dnd-area.xfu__drop-area_over {
	background-color: var(--color-blue-light);
	box-shadow: 0 0 8px 0 rgba(63, 67, 71, 80);
	color: #FFF;
}
.form .xfu__progress {
	display: none;
}
.form .xfu__file-field {
	text-align: center;
}

.form__input--rub {
	padding-right: 25px;
}

.form-part-as-list {
	display: grid;
}
.form-part-as-list .form__btn-remove-item {
	justify-self: right;
}

/* mobile first */
@media (min-width: 576px) {
	.form .dnd-area__example-img {
		width: 80px;
		height: 80px;
		padding: 0;
	}
	.form .xfu__drop-area__label {
		width: 75%;
	}
}

@media (min-width: 768px) {
	.form-multi-checkboxes .checkbox,
	.form-bordered-checkboxes .checkbox {
		width: 50%;
	}
	.form-multi-checkboxes.form-multi-checkboxes_3 .checkbox,
	.form-bordered-checkboxes.form-multi-checkboxes_3 .checkbox,
	.form-multi-checkboxes.form-multi-checkboxes_3 .radio,
	.form-bordered-checkboxes.form-multi-checkboxes_3 .radio {
		width: 33%;
	}
	.form-multi-checkboxes.form-multi-checkboxes_4 .checkbox,
	.form-bordered-checkboxes.form-multi-checkboxes_4 .checkbox {
		width: 25%;
	}
	.form-multi-checkboxes.choice-modifiers--two-elements .checkbox:nth-child(1),
	.form-multi-checkboxes.choice-modifiers--two-elements .checkbox:nth-child(2) {
		border-top: 1px solid var(--color-gray);
	}
	.form-multi-checkboxes.form-multi-checkboxes_3 .checkbox:nth-child(1),
	.form-multi-checkboxes.form-multi-checkboxes_3 .checkbox:nth-child(2),
	.form-multi-checkboxes.form-multi-checkboxes_3 .checkbox:nth-child(3) {
		border-top: 1px solid var(--color-gray);
	}
	.form-multi-checkboxes.form-multi-checkboxes_4 .checkbox:nth-child(1),
	.form-multi-checkboxes.form-multi-checkboxes_4 .checkbox:nth-child(2),
	.form-multi-checkboxes.form-multi-checkboxes_4 .checkbox:nth-child(3),
	.form-multi-checkboxes.form-multi-checkboxes_4 .checkbox:nth-child(4) {
		border-top: 1px solid var(--color-gray);
	}
	.form-multi-checkboxes .checkbox:not(:first-child) {
		border-left: none;
	}
	.form-multi-checkboxes.choice-modifiers--two-elements .checkbox:nth-child(2n+1) {
		border-left: 1px solid var(--color-gray);
	}.form-multi-checkboxes.form-multi-checkboxes_3 .checkbox:nth-child(3n+1) {
		 border-left: 1px solid var(--color-gray);
	 }
	.form-multi-checkboxes.form-multi-checkboxes_4 .checkbox:nth-child(4n+1) {
		border-left: 1px solid var(--color-gray);
	}
	.form .dnd-area__example-img {
		width: 80px;
		height: 80px;
	}
}

@media (min-width: 992px) {
	.form .xfu__drop-area__label {
		width: 45%;
	}
	.form .xfu__file-field {
		text-align: end;
	}
}

@media (min-width: 1200px) {
	.form-multi-checkboxes div {
		width: calc(100% / 3);
	}
}

/* desktop first */
@media (max-width: 991px) {
	.products-filter__range-inputs .form__label {
		width: 50%;
	}
}

@media (max-width: 767px) {
	.contact-form {
		flex-direction: column;
	}
	.contact-form .contact-form-buttons {
		flex-direction: row;
		justify-content: space-between;
	}
	.responsive-remove-button {
		align-self: flex-end;
	}

	.form-multi-checkboxes .checkbox:first-child {
		border-radius: 6px 6px 0 0;
	}
	.form-multi-checkboxes .checkbox:last-child {
		border-radius: 0 0 6px 6px;
	}
	.form-multi-checkboxes_2 .checkbox:not(:first-child) {
		border-top: none;
	}
}

@media (max-width: 575px) {
	.form-container.form-container_auth {
		padding: 30px 40px;
	}
	.form-container.form-container_auth .separate-block-dotted {
		margin: 20px auto;
	}
	.form__btn-remove-item.max575-hidden {
		display: none;
	}
	.form__btn-remove-item.max575-visible {
		display: flex;
		justify-self: right;
	}
}