.form-creator-intro {
	display: flex;
	align-items: center;
	gap: .75rem;
	margin-bottom: 1rem;
}

.form-creator-intro h5 {
	margin: 0;
	font-size: .95rem;
	font-weight: 600;
}

.form-creator-intro p {
	margin: .15rem 0 0;
	color: var(--bs-secondary-color, #74788d);
	font-size: .78rem;
}

.form-creator-section-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 2.5rem;
	height: 2.5rem;
	border: 1px solid rgba(111, 66, 193, .25);
	border-radius: .65rem;
	background-color: rgba(111, 66, 193, .12);
	color: #6f42c1;
	font-size: 1.25rem;
}

.form-creator-shell {
	padding: 1rem;
	border: 1px solid var(--bs-border-color, #e4e7f0);
	border-radius: .85rem;
	background-color: var(--bs-tertiary-bg, #f8f9fa);
}

.form-creator-tip {
	display: flex;
	align-items: center;
	gap: .65rem;
	margin-bottom: 1.5rem;
	padding: .75rem 1rem;
	border-radius: .65rem;
	background-color: rgba(85, 110, 230, .1);
	color: #556ee6;
	font-size: .82rem;
	font-weight: 500;
}

.form-creator-builder {
	min-height: 22rem;
}

.form-creator-builder-wrap {
	position: relative;
}

.form-creator-loading {
	position: absolute;
	inset: 0;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: .75rem;
	min-height: 22rem;
	color: var(--bs-secondary-color, #74788d);
	background-color: var(--bs-tertiary-bg, #f8f9fa);
}

.form-creator-builder.form-builder,
.form-creator-builder .form-builder {
	display: flex !important;
	align-items: flex-start !important;
	gap: 1.5rem !important;
}

.form-creator-builder .cb-wrap,
.form-creator-builder .stage-wrap {
	float: none !important;
	border-radius: .75rem !important;
}

.form-creator-builder .cb-wrap {
	flex: 0 0 15rem !important;
	width: 15rem !important;
	padding: .75rem !important;
	border: 1px solid var(--bs-border-color, #e4e7f0) !important;
	background-color: var(--bs-card-bg, #fff) !important;
}

.form-creator-builder .stage-wrap {
	flex: 1 1 auto;
	width: auto !important;
	min-width: 0;
	min-height: 22rem;
	padding: 1rem !important;
	border: 1px dashed rgba(85, 110, 230, .4);
	background-color: color-mix(in srgb, var(--bs-card-bg, #fff) 96%, #556ee6);
}

.form-creator-builder .frmb-control {
	display: grid !important;
	gap: .5rem !important;
	margin: 0 !important;
	padding: 0 !important;
}

.form-creator-builder .frmb-control li {
	margin: 0 !important;
	padding: .75rem .85rem !important;
	border: 1px solid var(--bs-border-color, #e4e7f0) !important;
	border-radius: .6rem !important;
	background-color: var(--bs-card-bg, #fff) !important;
	box-shadow: 0 1px 2px rgba(18, 38, 63, .05) !important;
	transition: border-color .15s, box-shadow .15s, transform .15s;
}

.form-creator-builder .frmb-control li:hover {
	border-color: rgba(85, 110, 230, .45) !important;
	box-shadow: 0 .25rem .75rem rgba(18, 38, 63, .08) !important;
	transform: translateY(-1px) !important;
}

.form-creator-builder .frmb li.form-field {
	margin-bottom: .75rem !important;
	border: 1px solid var(--bs-border-color, #e4e7f0) !important;
	border-radius: .7rem !important;
	background-color: var(--bs-card-bg, #fff) !important;
	box-shadow: 0 2px 8px rgba(18, 38, 63, .06) !important;
}

.form-creator-builder .frmb .form-elements {
	padding: 1rem !important;
	border: 1px solid var(--bs-border-color, #e4e7f0) !important;
	border-radius: .7rem !important;
	background-color: var(--bs-tertiary-bg, #f8f9fa) !important;
}

.form-creator-builder .form-control,
.form-creator-builder .form-select {
	width: 100% !important;
	border-color: var(--bs-border-color, #dfe3eb) !important;
	border-radius: .55rem !important;
	box-shadow: none !important;
}

.form-creator-builder .stage-wrap .form-group>label {
	margin-bottom: .4rem !important;
	color: var(--bs-body-color, #495057) !important;
	font-size: .8125rem !important;
	font-weight: 500 !important;
}

.form-creator-builder .checkbox-group,
.form-creator-builder .radio-group {
	display: grid !important;
	gap: .4rem !important;
}

.form-creator-builder .formbuilder-checkbox,
.form-creator-builder .formbuilder-radio,
.form-creator-builder .formbuilder-checkbox-inline,
.form-creator-builder .formbuilder-radio-inline {
	display: flex !important;
	align-items: flex-start !important;
	gap: .5rem !important;
	min-height: 1.25rem !important;
}

.form-creator-builder .formbuilder-checkbox-inline,
.form-creator-builder .formbuilder-radio-inline {
	display: inline-flex !important;
	margin-right: 1rem !important;
}

.form-creator-builder .formbuilder-checkbox>.form-check-input,
.form-creator-builder .formbuilder-radio>.form-check-input,
.form-creator-builder .formbuilder-checkbox-inline>.form-check-input,
.form-creator-builder .formbuilder-radio-inline>.form-check-input {
	float: none !important;
	flex: 0 0 auto !important;
	margin: .15rem 0 0 !important;
}

.form-creator-builder .formbuilder-checkbox>label,
.form-creator-builder .formbuilder-radio>label,
.form-creator-builder .formbuilder-checkbox-inline>label,
.form-creator-builder .formbuilder-radio-inline>label {
	margin: 0 !important;
	color: var(--bs-body-color, #495057) !important;
	font-size: .8125rem !important;
	line-height: 1.4 !important;
	cursor: pointer;
}

.form-creator-builder .form-control:focus,
.form-creator-builder .form-select:focus {
	border-color: rgba(85, 110, 230, .65) !important;
	box-shadow: 0 0 0 .15rem rgba(85, 110, 230, .12) !important;
}

body[data-style-mode="dark"] .form-creator-shell,
body[data-style-mode="dark"] .form-creator-builder .cb-wrap,
body[data-style-mode="dark"] .form-creator-builder .stage-wrap,
body[data-style-mode="dark"] .form-creator-builder .frmb-control li,
body[data-style-mode="dark"] .form-creator-builder .frmb li.form-field {
	border-color: rgba(255, 255, 255, .1) !important;
}

@media (max-width: 767.98px) {

	.form-creator-builder .cb-wrap,
	.form-creator-builder .stage-wrap {
		flex-basis: auto !important;
		width: 100% !important;
	}

	.form-creator-builder.form-builder,
	.form-creator-builder .form-builder {
		flex-direction: column !important;
		gap: 1rem !important;
	}
}