/* =========================================================
   FormAssembly / TFA Form Styling
   ========================================================= */

.wForm{
	padding: 0 !important;
}
.wFormContainer {
	max-width: 800px !important;
	margin: 0 !important;
	padding: 2rem 0 !important;
	background: transparent;
}

.wFormContainer .wForm {
	width: 100%;
	font-family: inherit;
	color: inherit;
}

/* Remove FormAssembly default sizing */
.wFormContainer .oneField,
.wFormContainer .inputWrapper {
	width: 100% !important;
	max-width: none !important;
}

/* Individual fields */
.wFormContainer .oneField {
	margin: 0 0 24px;
	padding: 0;
}

/* Remove unnecessary line breaks created by the embed */
.wFormContainer .oneField > br {
	display: none;
}

/* Labels */
.wFormContainer .label,
.wFormContainer label {
	display: block;
	margin: 0 0 8px;
	padding: 0;
	font-size: 16px;
	font-weight: 600;
	line-height: 1.4;
	color: #222;
}

/* Required indicator */
.wFormContainer .reqMark::after {
	content: " *";
	color: #d63638;
}

/*
 * FormAssembly may already insert its own required marker,
 * so remove this rule if you see two asterisks.
 */

/* Inputs */
.wFormContainer input[type="text"],
.wFormContainer input[type="email"],
.wFormContainer input[type="tel"],
.wFormContainer input[type="number"],
.wFormContainer input[type="password"],
.wFormContainer textarea,
.wFormContainer select {
	display: block;
	box-sizing: border-box;
	width: 100% !important;
	max-width: none !important;
	min-height: 52px;
	margin: 0;
	padding: 12px 16px !important;

	font-family: inherit;
	font-size: 16px;
	line-height: 1.4;

	color: #222;
	background: #fff;

	border: 1px solid #c8c8c8;
	border-radius: 6px;

	outline: none;

	transition:
		border-color 0.2s ease,
		box-shadow 0.2s ease;
}

/* Textarea */
.wFormContainer textarea {
	min-height: 140px;
	resize: vertical;
}

/* Selects */
.wFormContainer select {
	appearance: none;
	-webkit-appearance: none;

	padding-right: 46px;

	background-image:
		linear-gradient(45deg, transparent 50%, #555 50%),
		linear-gradient(135deg, #555 50%, transparent 50%);
	background-position:
		calc(100% - 20px) 22px,
		calc(100% - 15px) 22px;
	background-size:
		5px 5px,
		5px 5px;
	background-repeat: no-repeat;
}

/* Placeholder */
.wFormContainer input::placeholder,
.wFormContainer textarea::placeholder {
	color: #777;
	opacity: 1;
}

/* Focus */
.wFormContainer input[type="text"]:focus,
.wFormContainer input[type="email"]:focus,
.wFormContainer input[type="tel"]:focus,
.wFormContainer input[type="number"]:focus,
.wFormContainer textarea:focus,
.wFormContainer select:focus {
	border-color: #333;
	box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.08);
}

/* Validation errors */
.wFormContainer .errFld input,
.wFormContainer .errFld textarea,
.wFormContainer .errFld select,
.wFormContainer input.error,
.wFormContainer textarea.error,
.wFormContainer select.error {
	border-color: #c62828;
}

.wFormContainer .errMsg,
.wFormContainer .errorMessage {
	display: block;
	margin-top: 6px;
	font-size: 14px;
	color: #c62828;
}

/* Character counter */
.wFormContainer .lengthIndicator {
	position: static !important;
	margin-top: 5px;
	font-size: 12px;
	color: #666;
}

/* =========================================================
   Conditional messages
   ========================================================= */

.wFormContainer fieldset.section {
	margin: 0 0 24px;
	padding: 0;
	border: 0;
	min-width: 0;
}

.wFormContainer .htmlSection {
	margin: 0;
	padding: 16px 18px;

	background: #f5f5f5;
	border-left: 4px solid #333;
	border-radius: 4px;
}

.wFormContainer .htmlContent {
	font-size: 15px;
	line-height: 1.6;
	color: #333;
}

.wFormContainer .htmlContent b {
	font-weight: 600;
}

/* Don't interfere with FormAssembly conditional visibility */
.wFormContainer .offstate {
	/* FormAssembly JS controls visibility */
}

/* =========================================================
   Submit button
   ========================================================= */

.wFormContainer .actions {
	margin-top: 32px;
}

.wFormContainer input[type="submit"],
.wFormContainer .primaryAction {
	display: inline-flex;
	align-items: center;
	justify-content: center;

	min-width: 150px;
	min-height: 52px;
	padding: 12px 28px;

	font-family: inherit;
	font-size: 16px;
	font-weight: 600;
	line-height: 1;

	color: #fff;
	background: #222;

	border: 2px solid #222;
	border-radius: 6px;

	cursor: pointer;

	transition:
		background 0.2s ease,
		color 0.2s ease,
		border-color 0.2s ease,
		opacity 0.2s ease;
}

.wFormContainer input[type="submit"]:hover,
.wFormContainer .primaryAction:hover {
	color: #222;
	background: #fff;
}

.wFormContainer input[type="submit"]:focus-visible {
	outline: 3px solid rgba(0, 0, 0, 0.2);
	outline-offset: 3px;
}

/* Disabled conditional submit button */
.wFormContainer input[type="submit"]:disabled {
	opacity: 0.45;
	cursor: not-allowed;
}

/* =========================================================
   Footer / FormAssembly leftovers
   ========================================================= */

.wFormContainer .wFormHeader,
.wFormContainer .wFormFooter {
	margin: 0;
	padding: 0;
}

.wFormContainer .supportInfo {
	display: none;
}

/* =========================================================
   Mobile
   ========================================================= */

@media (max-width: 767px) {

	.wFormContainer .oneField {
		margin-bottom: 20px;
	}

	.wFormContainer input[type="text"],
	.wFormContainer input[type="email"],
	.wFormContainer input[type="tel"],
	.wFormContainer input[type="number"],
	.wFormContainer textarea,
	.wFormContainer select {
		min-height: 50px;
		padding: 11px 14px !important;
		font-size: 16px;
	}

	.wFormContainer input[type="submit"],
	.wFormContainer .primaryAction {
		width: 100%;
	}

}