@charset "utf-8";
/**
 * Styling form elements sucks :(
 *
 */



/* Standardize inputs */
input,
textarea,
select {
	font: inherit;
	font-size: 16px;
	padding: 0.5em;
	border: 1px solid #ddd;
	border-radius: 4px; /* NOTE: This matches select2 fields. */
	width: 100%;
}
/* Special case field types */
input[type="submit"] {
	width: auto;	
}
input[type="radio"],
input[type="checkbox"] {
	width: auto;
	padding: inherit;
	border-color: #ddd;
}
input[type="number"] {
	width: 60px;
}


/* Gravity forms specific */


.gform_fields,
.gfield_radio,
.gfield_checkbox {
	list-style: none;
	margin: 0;
	padding: 0;	
}
.gform_fields > li {
	margin: 1em 0;	
}
.gform_fields > li.gform_hidden {
	margin: 0;
}
.ginput_complex > span:not(:first-child) {
	display: block;
	margin-top: 1em;	
}

.gfield > label {
	display: block;
	font-weight: bold;
}
.gfield_radio input {
	margin-right: 0.25em;	
}

.gfield_description {
	font-size: 0.875em;	
}
.validation_message {
	color: #e2401c;	
}
.gform_footer {
	margin-top: 1em;	
}
.gform_button.button {
	padding: 0.5em;
	width: 100%;
	border: 1px solid transparent;	
}

/* Honeypot fields */
.gform_validation_container {
	position: absolute;
	left: -9999em;
	top: -9999em;
}

/* Put the hide-labels class on the form to hide all labels */
.hide-labels label {
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	white-space: nowrap;	
}

/* TODO: Probably want a class to optionally show labels (checkbox, radio fields) */


/* NOET: These validation styles require some custom js to mimick default WC form validation */

/* Required field has no value */
.invalid > input {
	box-shadow: inset 2px 0 0 #e2401c;	
}
/* Required field has value */
.valid > input {
	box-shadow: inset 2px 0 0 #0f834d;	
}




/* WC forms? */