/**
 * Contact page: restyles the Gravity Forms markup to the legacy CI form
 * (#contact-form / #form-top / #form-main / #form-left / #form-right rules
 * in /public/css/style.css). Fields carrying .adc-right (the Question /
 * Comment textarea + Turnstile) form the right column; everything else
 * stacks in the left column, exactly like the legacy layout.
 */

/* The container plays the legacy <form> role: drops below the floated
   #address / #map and carries the gray panel (#contact-page form rule). */
#contact-form {
	display: inline-block;
	width: 100%;
	box-sizing: border-box;
	background-color: #eeeeee;
	border: 1px solid #e1e1e1;
}

/* The nested GF <form> must not double-apply the legacy gray panel rule. */
#contact-page #contact-form form,
#contact-form form {
	background: transparent;
	border: none;
	width: auto;
	display: block;
}

#contact-form .gform_wrapper {
	padding: 20px; /* legacy #form-main */
}

/* Two columns like legacy #form-left / #form-right: left fields stack in
   column 1, the Question / Comment textarea spans column 2 from the top. */
#contact-form .gform_fields {
	display: grid;
	grid-template-columns: 1fr 1fr;
	column-gap: 0;
}

#contact-form .gfield {
	grid-column: 1;
	margin-bottom: 15px;
	position: relative;
}

#contact-form .gfield.adc-right {
	grid-column: 2;
	margin-bottom: 0;
}

#contact-form .gfield--type-textarea.adc-right {
	grid-row: 1 / span 8;
}

#contact-form .gform_validation_container {
	display: none !important;
}

#contact-form .gfield_label {
	display: block;
	margin-bottom: 3px;
	font-weight: normal;
	font-size: inherit;
	color: inherit;
}

/* Legacy red asterisk instead of GF "(Required)" text. */
#contact-form .gfield_required_text {
	display: none;
}

#contact-form .gfield_contains_required .gfield_label::after {
	content: ' *';
	color: red;
}

#contact-form .gfield input[type=text],
#contact-form .gfield input[type=email],
#contact-form .gfield input[type=tel] {
	width: 293px; /* legacy #form-main input */
	max-width: 100%;
	height: 28px;
	line-height: 28px;
	background-color: #F7F7F7;
	border: none;
	border-top: 1px solid #d5d6d6;
	border-left: 1px solid #d5d6d6;
	border-radius: 0;
	padding: 0 4px;
	font-size: inherit;
	color: #4e4e4e;
}

#contact-form .gfield select {
	width: 304px; /* legacy #form-main select */
	max-width: 100%;
	height: 29px;
	background-color: #F7F7F7;
	border: none;
	border-top: 1px solid #d5d6d6;
	border-left: 1px solid #d5d6d6;
	border-radius: 0;
	color: #4e4e4e;
}

#contact-form .gfield.adc-right textarea {
	height: 379px; /* legacy #form-right textarea */
	width: 100%;
	resize: none;
	background-color: #F7F7F7;
	border: none;
	border-top: 1px solid #d5d6d6;
	border-left: 1px solid #d5d6d6;
	border-radius: 0;
	box-sizing: border-box;
	color: #4e4e4e;
}

#contact-form .gfield--type-turnstile {
	margin-top: 10px;
}

#contact-form .gform_footer {
	clear: both;
	margin: 0;
	padding: 0;
}

/* Legacy #contact-form input[type=submit] + the site's blue button look. */
#contact-form .gform_footer input[type=submit] {
	float: right;
	margin-top: 15px;
	margin-right: 15px;
	margin-bottom: 25px;
	background: -webkit-gradient(linear, left top, left bottom, from(#26506F), to(#1B4766));
	background: linear-gradient(#26506F, #1B4766);
	border: medium none;
	border-radius: 3px;
	color: #FFFFFF;
	cursor: pointer;
	font-family: "Economica", Arial, Helvetica, sans-serif;
	font-weight: 700;
	font-size: 18px;
	height: 30px;
	line-height: 30px;
	letter-spacing: 0.1em;
	padding: 0 10px;
	text-align: center;
	width: auto;
}

#contact-form .gform_ajax_spinner {
	float: right;
	margin: 18px 8px 0 0;
}

/* Confirmation / validation in the legacy voice. */
#contact-form .gform_confirmation_message {
	float: right;
	color: #4e4e4e;
	padding: 15px 25px;
}

#contact-form .gfield_validation_message {
	color: red;
	font-size: 12px;
	margin-top: 2px;
}

#contact-form .gform_validation_errors {
	margin: 10px 20px 0;
	padding: 8px;
	border: 1px solid #c02b0a;
	background: #fff;
}

/* Legacy responsive behavior (style.css ~3538). */
@media (max-width: 991px) {
	#contact-form .gform_fields {
		grid-template-columns: 1fr;
	}

	#contact-form .gfield,
	#contact-form .gfield.adc-right {
		grid-column: 1;
	}

	#contact-form .gfield--type-textarea.adc-right {
		grid-row: auto;
	}

	#contact-form .gfield input[type=text],
	#contact-form .gfield input[type=email],
	#contact-form .gfield input[type=tel],
	#contact-form .gfield select {
		width: 100%;
		max-width: 100%;
		box-sizing: border-box;
	}

	#contact-form .gfield.adc-right textarea {
		height: 200px;
		padding: 10px;
	}
}