.form-builder .form .form__hidden {
	display: none;
}

.form-builder .form .form__row {
	display: grid;
	grid-gap: 16px;
	grid-template-columns: repeat(12, 1fr);
	margin-bottom: 16px;
}

.form-builder .form .form__col {
	grid-column: span var(--span);
}

.form-builder .form .form__element {}

.form-builder .form .form__label {
	display: block;
	margin-bottom: 8px;
}

.form-builder .form .form__input {
	width: 100%;
	padding: 12px;
}

.form-builder .form .form__input.form__input--textarea {
	min-height: 160px;
}

.form-builder .form .form__input.form__input--select {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	background-image: url("../media/icon_chevron_down.svg");
	background-repeat: no-repeat;
	background-position: right 12px center;
	padding: 13px 12px;
}

.form-builder .form .form__fieldset {
}

.form-builder .form .form__fieldset .form__input {
	padding: 0;
}

.form-builder .form .form__fieldset .form__input.form__input--checkbox {
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	gap: 8px;
}

.form-builder .form .form__fieldset .form__input.form__input--checkbox input[type="checkbox"] {
	flex: 0 0 auto;
	transform: translateY(4px);
}

.form-builder .form .form__fieldset .form__input.form__input--radio {
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	gap: 8px;
}

.form-builder .form .form__fieldset .form__input.form__input--radio input[type="radio"] {
	flex: 0 0 auto;
	transform: translateY(4px);
}

.form-builder .form .form__input.success {
	border-color: #00FF00;
}

.form-builder .form .form__input.error {
	border-color: #FF0000;
}

.form-builder .form .form__fieldset.success {
	border-color: #00FF00;
}

.form-builder .form .form__fieldset.error {
	border-color: #FF0000;
}

.form-builder .form .form__notice--error:not(:empty) {
	padding-left: 4px;
	margin-top: 8px;
}

.form-builder .form__notice.success {
	color: #00FF00;
}

.form-builder .form__notice.error {
	color: #FF0000;
}

.form-builder .notice--send {
	margin-top: 8px;
}

.form-builder .notice--send.success {
	color: #00FF00;
}

.form-builder .notice--send.error {
	color: #FF0000;
}

@media screen and (max-width: 1024px) {
	.form-builder .form .form__row {
		grid-template-columns: repeat(1, 1fr);
	}

	.form-builder .form .form__col {
		grid-column: span 1;
	}
}