@import '../scss/global/variables';

.wpforms-field input, .wpforms-field-container select, .wpforms-field-container textarea, .form-control, .gform_wrapper input[type="email"], .gform_wrapper input[type="date"], .gform_wrapper input[type="datetime"], .gform_wrapper input[type="datetime-local"], .gform_wrapper input[type="month"], .gform_wrapper input[type="number"], .gform_wrapper input[type="password"], .gform_wrapper input[type="search"], .gform_wrapper input[type="tel"], .gform_wrapper input[type="text"], .gform_wrapper input[type="time"], .gform_wrapper input[type="week"], .gform_wrapper input[type="url"], .gform_wrapper select, .gform_wrapper textarea {
	display: block;
	width: 100%;
	max-width: 100%;
    min-height: 50px;
    color: $text-color;
    background-color: white;
    background-image: none;
    border: 2px solid $breaker;
    border-radius: 2px;
    &:focus {
    	border-color: nth($blue,1);
    	outline: 0;
    }
}
.wpforms-field-container, .gform_fields {
	.wpforms-field, .gfield {
		margin-bottom: 15px;
		padding: 10px 0;
    	position: relative;
	}
	input.wpforms-error {
		border-color: #a94442 !important;
    	box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    }
    label.wpforms-error  {
    	display: block;
	    margin-top: 5px;
	    margin-bottom: 10px;
	    color: #a94442;
	    font-weight: initial;
    }
	button {
		@include lsx-button-scaffolding();
		@include lsx-button-colour();
	}
	ul {
		padding: 0 !important;
    	margin: 0 !important;
    	li {
			list-style-type: none;
			label.wpforms-field-label-inline, label {
				font-weight: initial;
			}
		}
	}
	input[type='checkbox'], input[type='radio'] {
		display: initial;
	    float: left;
	    width: initial;
	    height: inherit;
	    margin-right: 0.5em;
	}
	.wpforms-field-textarea {
		textarea {
			height: initial;
		}
	}
	.wpforms-one-half {
	    width: 50%;
	    float: left;
	    padding-right: 1em;
	    margin-bottom: 15px;
	    &:last-child {
	    	padding-right: 0;
	    }
	}
	.wpforms-field-file-upload input {
		width: initial;
	    height: inherit;
	    border: none;
	    background: none;
	    padding: 0;
	    margin-bottom: 1em;
	}
	.wpforms-field-credit-card {
		select {
			display: inline;
    		width: initial;
		}
	}
	.wpforms-field-address {
		display: inline-block;
    	width: 100%;
	}
	.wpforms-field-rating-items {
		label {
			display: block;
			span {
				position: relative;
			    bottom: 10px;
			    margin-right: 5px;
			}
		}
	}
}
.wpforms-submit-container {
	margin-top: 1em;
	button {
		@include lsx-button-scaffolding();
		@include lsx-button-colour();
	}
}

.lsx-modal .wpforms-submit-container {
	margin-top: 0;
}

.form-control, .wpforms-field-container input, .wpforms-field-container button, .wpforms-field-container select, .wpforms-field-container textarea {
	@extend %lsx-form-field;
}

.caldera-form-page { padding: 2em; }

.caldera-grid {
	.breadcrumb {
		list-style: none;
		@extend %lsx-tabs;
	}
}

/** Gravity Forms */
.wpforms-field-container .wpforms-field, .wpforms-field-container .gfield, .gform_fields .wpforms-field, .gform_fields .gfield {
    margin-bottom: 0px;
    padding: 5px 0;
    position: relative;
}

.gform_wrapper form {
	margin-bottom: 0;
}

.gform_wrapper ul {
	@extend .list-unstyled;
}

.gform_wrapper li {
	@extend .form-group;
}

.gform_wrapper .gfield_required {
	padding-left: 1px;
	color: $red-accent;
}

.gform_wrapper input[type="email"],
.gform_wrapper input[type="date"],
.gform_wrapper input[type="datetime"],
.gform_wrapper input[type="datetime-local"],
.gform_wrapper input[type="month"],
.gform_wrapper input[type="number"],
.gform_wrapper input[type="password"],
.gform_wrapper input[type="search"],
.gform_wrapper input[type="tel"],
.gform_wrapper input[type="text"],
.gform_wrapper input[type="time"],
.gform_wrapper input[type="week"],
.gform_wrapper input[type="url"],
.gform_wrapper select,
.gform_wrapper textarea {
	@extend .form-control;
	box-shadow: none !important;
	transition: all 150ms ease !important;

	&:focus {
		@extend %lsx-form-field;
		border-width: 1px;
    	box-shadow: inset 0 1px 1px rgba(0,0,0,0.075), 0 0 8px rgba(65,138,208,0.6) !important;
	}
	&::placeholder {
		color: $breaker;
		font-weight: 600;
	}
}

.gform_wrapper .button, .gform_wrapper button {
	@extend .btn;
	@extend .btn-primary;

	span {
		color: white;
	}
}

.gform_wrapper .gfield_error {
	.gfield_label {
		@extend .alert-danger;
		background-color: transparent;
	}
	.ginput_container {
		input,
		select,
		textarea {
			border-color: #a94442;
			box-shadow: inset 0 1px 1px rgba(0,0,0,0.075);
			background-color: white;
			&:active, &:focus {
				border-color: #a94442;
				box-shadow: inset 0 1px 1px rgba(0,0,0,0.075), 0 0 6px #ce8483 !important;
			}
		}
	}
	.alert-danger, .gfield_label {
		background-color: transparent;
	}

	input,
	select,
	textarea {
		@extend .alert-danger;
		border-color: #cc0000;
	}
}

.validation_error {
	@extend .alert;
	@extend .alert-danger;
}

.validation_message {
	display: none;
}

@media screen and (max-width: 768px) {
	.gform_wrapper button, .wpforms-submit-container button {
		width: 100%;
	}
}

#primary {
	.wpforms-container {
		.wpforms-field-description {
			color: nth($blue,1);
		}
		input[type=checkbox],
		input[type=radio] {
			width: auto;
			float: initial;
			min-height: auto;
		}
	}
}

.wpforms-field-pagebreak {
	margin-top: 3em;
	.wpforms-page-button.wpforms-page-prev {
		margin-right: 3em;
	}
}

.wpforms-field.wpforms-field-file-upload {
	label {
		border-radius: 3px;
		color: $text-color;
		cursor: pointer;
		display: inline-block;
		font-weight: 700;
		padding-left: 20px;
		padding-right: 20px;
		transition: background-color 0.3s;
		background-color: nth($gray,1);
		box-shadow: 2px 2px 0 0 nth($gray,2);
		&:hover {
			background-color: nth($gray,2);
		}
	}
	input[type="file"] {
		border: 0;
		clip: rect(0, 0, 0, 0);
		height: 1px;
		overflow: hidden;
		padding: 0;
		position: absolute;
		white-space: nowrap;
		width: 1px;
	}
}