.xprez-form-table {
	max-width: var(--x-admin-form-width);
	padding-top: $g;
	padding-bottom: $g;
	line-height: 1.25;
	margin-left: auto;
	margin-right: auto;

	label {
		font-size: .857rem;

		color: $b-gray-7;
	}

	& + & {
		border-top: 1px solid $b-gray-4;

	}

	&.ui-sortable-helper {
		background: darken($super-light-gray, 5%);
	}

	&.ui-sortable-handle {
		cursor: move;
	}
}

.xprez-title-form-table {
	border-bottom: 1px solid $b-gray-4;
}

.xprez-form-row {
	display: flex;
	flex-wrap: nowrap;
}

.xprez-cell-label {
	min-width: 130px;
	text-align: right;
	padding: 5px 10px 0 0;
	vertical-align: top;
}

.xprez-cell {
	padding: 5px 10px;
	flex: 1;
	max-width: 700px;

	label {
		display: inline-block;
		text-align: right;
		padding: 0 5px;
	}

	.clearable-file-input {
		padding-left: 10px;
	}

	input[type=checkbox] {
		width: unset;
		margin-top: .25rem;
	}

	input[type=number] {
		width: 90px;
	}

	input, textarea, select {
		box-sizing: border-box;
	}
}

.xprez-cell-info {
	@include type-b(12px);
}

.xprez-multi-field {
	float: left;
	margin-right: 10px;

	&:last-child {
		margin-right: 0;
	}

	label {
		float: left;
		margin-right: 10px;
	}
}

.xprez-multi-field-cell {
	float: left;
}

.xprez-sub-info {
	display: block;
	@include type-b(11px, 1.5);
	padding-left: 5px;

	.error & {
		color: $b-red;
	}
}

.xprez-required {
	label {
		&:after {
			content: '*';
			margin: 0 0 0 5px;
			position: absolute;
			color: $b-gray-6;
		}
	}
}

.xprez-drag-handle {
	cursor: move;
}


/// form tags

input, textarea {
	.error & {
		border-color: $b-red;
	}

	&.long {
		width: 500px;
	}

	&.short {
		width: 50px;
	}

}

textarea {
	height: 100px;
	width: calc(100% - 5px);
}
