/**
 * Essential contact form styles.
 *
 * Provides only the layout and functional styles required by the form.
 * Colours, typography, controls and buttons are otherwise styled by the theme.
 */

/* Form container */

.fwsacf-container {
	width: 100%;
}

.fwsacf-form,
.fwsacf-form *,
.fwsacf-form *::before,
.fwsacf-form *::after {
	box-sizing: border-box;
}

.fwsacf-form {
	width: 100%;
}
.fwsacf-container #contactform, .fwsacf-message {
    margin-left: auto;
    margin-right: auto;
    max-width: 640px;

}


/* Honeypot */

#contactform div.fwsacf-field:first-child {
	display: none;
}


/* Fields */

#contactform .fwsacf-field > label {
	display: inline-block;
	margin-bottom: 5px;
}

#contactform .fwsacf-control {
	display: block;
	margin-bottom: 8px;
	width: 100%;
}

/**
 * Provide usable fallback dimensions when the active theme does not
 * define its own form control styles.
 */
:where(#contactform .fwsacf-control) {
	font: inherit;
	min-height: 44px;
	padding: 0.5em 0.75em;
}

:where(#contactform textarea.fwsacf-control) {
	min-height: 10em;
}


/* Terms checkbox */

#contactform .fwsacf-checkbox {
	display: block;
	margin-bottom: 1.0rem;
	min-height: 1.5rem;
	padding-left: 1.5em;
}

#contactform .fwsacf-check-inline {
	display: inline-block;
	margin-right: 1rem;
}

#contactform .fwsacf-checkbox-input {
	float: left;
	margin-left: -1.5em;
	margin-top: 0.25em;
}


/* Accessible challenge */

#contactform .fwsacf-challenge {
	display: inline-flex;
	flex-direction: column;
	float: left;
}

#contactform .fwsacf-challenge input[type="number"] {
	width: 80px;
}


/* Invalid fields */

#contactform .fwsacf-control.error {
	border-color: #dc3444;
}

#contactform input[type="text"].fwsacf-control.error,
#contactform input[type="email"].fwsacf-control.error,
#contactform textarea.fwsacf-control.error {
	background-image: url("ico-error.png");
	background-position: right 9px top 9px;
	background-repeat: no-repeat;
	background-size: 16px 16px;
	padding-right: 32px;
}


/* Messages */

.fwsacf-message:empty {
	display: none;
}

.fwsacf-alert {
	background-color: #fff5f5;
	border: 1px solid #dc3444;
	border-left-width: 5px;
	border-radius: 4px;
	color: #8f1d2c;
	margin: 0 0 24px;
	padding: 16px 20px;
}

.fwsacf-alert p {
	font: inherit;
	font-weight: 700;
	margin: 0 0 8px;
}

.fwsacf-alert ul {
	margin: 0;
	padding-left: 24px;
}

.fwsacf-alert li {
	margin: 0;
}

.fwsacf-alert li + li {
	margin-top: 4px;
}

.fwsacf-alert-success {
	background-color: #f0f9f2;
	border-color: #218739;
	color: #185f2a;
}


/* Turnstile */

#contactform .fwsacf-turnstile {
	max-width: 100%;
	width: 300px;
}


/* Form actions */

.fwsacf-clearfix::before,
.fwsacf-clearfix::after {
	content: "";
	display: table;
}

.fwsacf-clearfix::after {
	clear: both;
}

#contactform .fwsacf-submit {
	margin-bottom: 1rem;
	min-height: 40px;
	text-align: right;
}


/* Responsive layout */

@media screen and (min-width: 768px) {
	#contactform .fwsacf-turnstile {
		float: left;
	}
}

@media screen and (max-width: 480px) {
	#contactform .fwsacf-turnstile {
		float: none;
		width: 100%;
	}

	#contactform .fwsacf-submit-button {
		width: 100%;
	}
}

