/* 05.12. Contact Form 7 */

// scss-lint:disable QualifyingElement

.wpcf7-select,
.wpcf7-text,
.wpcf7-number,
.wpcf7-date,
.wpcf7-textarea {
	padding: ptr(18) ptr(20);
	margin-bottom: ptr(30);
	font-size: ptr(16);
	width: 100%;
	transition: $primary-transition;
}

.wpcf7-form-control-wrap {
	display: block;
	position: relative;

	&::before,
	&::after {
		position: absolute;
		z-index: 10;
		content: '';
		width: 1px;
		height: calc(100% - 10px);
		background-color: #ffffff;
		top: 0;
	}

	&::before {
		left: 0;
	}

	&::after {
		right: 0;
	}

	textarea {
		position: relative;
		z-index: 20;
	}
}

.wpcf7-text,
.wpcf7-number,
.wpcf7-date {
	border-top: 1px solid transparent;

	&:focus {
		border-top: 1px solid transparent;
	}
}

.wpcf7-textarea {
	height: ptr(250);
	margin-bottom: ptr(40);
}

.wpcf7-submit {
	margin-bottom: ptr(15);
	margin-top: ptr(20);

	@include media-breakpoint-up(sm) {
		float: right;
		margin-top: ptr(-40);
	}
}

// Fix for the date field - Bootstrap 4.0 issue
input[type="date"].form-control.wpcf7-date {
	line-height: inherit;
}

.wpcf7 {
	.wpcf7-response-output {
		margin: ptr(5) 0;
		padding: ptr(10) ptr(20);
	}

	.wpcf7-validation-errors {
		background-color: $brand-warning;
		border: 2px solid $brand-warning;
		color: #ffffff;
	}

	.wpcf7-mail-sent-ng {
		background-color: $brand-danger;
		border: 2px solid $brand-danger;
		color: #ffffff;
	}

	.wpcf7-mail-sent-ok {
		background-color: $brand-success;
		border: 2px solid $brand-success;
		color: #ffffff;
	}

	.wpcf7-not-valid-tip {
		margin: 0 0 ptr(5);
	}
}