.fc-form-compact .field,
.fc-form-compact .wide,
.fc-form-compact .captcha-input-container {
	position: relative;
}
.fc-form-compact .field:not(.control) label,
.fc-form-compact .wide:not(.control) label,
.fc-form-compact .captcha-input-container label {
	pointer-events: none;

	position: absolute !important;
	margin: 0;
	color: #999;
	z-index: 5;
	left: 12px;
	top: 16px;

	white-space: nowrap;
	max-width: 85%;
	width: auto;
	display: inline-block;
	text-overflow: ellipsis;
	overflow: hidden;

	top: 10px;
	font-size: 11px;
	opacity: 0;
	transition: all 100ms ease-in-out;
}
.fc-form-compact .field input[type="checkbox"] + label,
.fc-form-compact .field input[type="radio"] + label,
.fc-form-compact .wide input[type="checkbox"] + label,
.fc-form-compact .wide input[type="radio"] + label {
	pointer-events: all;
	position: static !important;
	opacity: 1;
}
.fc-form-compact .field.fc-dirty label,
.fc-form-compact .field .fc-dirty label,
.fc-form-compact .wide.fc-dirty label,
.fc-form-compact .wide .fc-dirty label {
	top: 8px;
	opacity: 1;
	color: #bbb;
	line-height: normal;
}
.fc-form-compact .field label em,
.fc-form-compact .wide label em,
.fc-form-compact .field label.required::after,
.fc-form-compact .wide label.required::after,
.fc-form-compact .captcha-input-container label em,
.fc-form-compact .captcha-input-container label.required::after {
	right: 0 !important;
	color: currentColor;
}
.fc-form-compact .field .input-box,
.fc-form-compact .wide .input-box,
.fc-form-compact .captcha-input-container .input-box {
	position: relative;
}
.fc-form-compact .field .input-box input,
.fc-form-compact .field .input-box select,
.fc-form-compact .field .input-box textarea,
.fc-form-compact .wide .input-box input,
.fc-form-compact .wide .input-box select,
.fc-form-compact .wide .input-box textarea,
.fc-form-compact .captcha-input-container .input-box input {
	transition: all 100ms ease-in-out;
	padding: 0.68em 0.48em !important; /* important is used for third-party themes compatibility */
}
.fc-form-compact .field.fc-dirty .input-box input,
.fc-form-compact .field.fc-dirty .input-box select,
.fc-form-compact .field.fc-dirty .input-box textarea,
.fc-form-compact .wide.fc-dirty .input-box input,
.fc-form-compact .wide.fc-dirty .input-box select,
.fc-form-compact .wide.fc-dirty .input-box textarea,
.fc-form-compact .captcha-input-container.fc-dirty .input-box input {
	padding-top: 2em !important;
	padding-bottom: 0.36em !important;
}
.fc-form-compact .field .input-box select,
.fc-form-compact .wide .input-box select,
.fc-form-compact .field.fc-dirty .input-box select,
.fc-form-compact .wide.fc-dirty .input-box select {
	padding-right: 27px !important;
}

.fc-form-compact li:not(.fc-calendar) > label[for="billing:month"],
.fc-form-compact li:not(.fc-calendar) > .field > label[for="billing:month"] {
	pointer-events: all;
	opacity: 1;
	left: 4px;
	top: 0;
}
.fc-form-compact
	li:not(.fc-calendar)
	> label[for="billing:month"]
	+ .customer-dob,
.fc-form-compact
	li:not(.fc-calendar)
	> .field
	> label[for="billing:month"]
	+ .customer-dob {
	margin-top: 14px;
}
.fc-form-compact .dob-day,
.fc-form-compact .dob-month,
.fc-form-compact .dob-year {
	position: relative;
}
.fc-form-compact .dob-day label,
.fc-form-compact .dob-month label,
.fc-form-compact .dob-year label {
	display: none;
}

/* Fix for not working placeholder on DOB element */
.fc-form-compact li:not(.fc-dirty) > .input-box > input[type="date"]::after,
.fc-form-compact
	div.field:not(.fc-dirty)
	> .input-box
	> input[type="date"]::after {
	position: absolute;
	left: 8px;
	top: 50%;
	transform: translateY(-50%);
	content: attr(placeholder);
	color: #a1a1a1;
}
