/**
Theme Name: Astra Child
Author: Brainstorm Force
Author URI: http://wpastra.com/about/
Description: Astra is the fastest, fully customizable & beautiful theme suitable for blogs, personal portfolios and business websites. It is very lightweight (less than 50KB on frontend) and offers unparalleled speed. Built with SEO in mind, Astra comes with schema.org code integrated so search engines will love your site. Astra offers plenty of sidebar options and widget areas giving you a full control for customizations. Furthermore, we have included special features and templates so feel free to choose any of your favorite page builder plugin to create pages flexibly. Some of the other features: # WooCommerce Ready # Responsive # Compatible with major plugins # Translation Ready # Extendible with premium addons # Regularly updated # Designed, Developed, Maintained & Supported by Brainstorm Force. Looking for a perfect base theme? Look no further. Astra is fast, fully customizable and beautiful theme!
Version: 1.0.46
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: astra-child
Template: astra
*/

/* TABLE OF CONTENTS
	1. Custom Styling for Contact Form 7
*/

/* 1. Custom Styling for Contact Form 7 */

/* remove default p margin in form */
.cmpv-form .wpcf7 p {
	margin-bottom: 0px;
}

/* space between fields in contact form */
.cmpv-form .wpcf7-form-control-wrap  {
    display: block;
	margin-bottom: 20px;
}

/* space between fields exception for textarea before submit button */
.cmpv-form .wpcf7-form-control-wrap:has(.before-button) {
	margin-bottom: 5px;
}

.cmpv-form .wpcf7-not-valid-tip {
	margin-top: 0px;
	font-size: 12px !important;
}

/* font-style for field labels in contact form */
.cmpv-form label {
	font-family: var(--e-global-typography-primary-font-family);
	color: var(--e-global-color-text);
	font-size: 15px;
	font-weight: 600;
}

/* font-style for placeholder text in contact form */
.cmpv-form input::placeholder,
.cmpv-form textarea::placeholder {
	font-family: var(--e-global-typography-secondary-font-family);
	color: var(--e-global-color-secondary);
	font-size: 18px;
}

/* style for the input and textarea fields in contact form */
.cmpv-form input,
.cmpv-form textarea  {
	border: none;
	border-radius: 0;
	border-bottom: solid 1px !important;
	background-color: transparent;
	color: var(--e-global-color-text);
  	font-family: var(--e-global-typography-secondary-font-family);
	font-size: 15px;
    align-self
}

/* style for the input and textarea fields in contact form */
.cmpv-form input,
.cmpv-form textarea  {
	border: none;
	border-radius: 0;
	border-bottom: solid 1px !important;
	background-color: transparent;
	color: var(--e-global-color-text);
  	font-family: var(--e-global-typography-secondary-font-family);
	font-size: 15px;
    align-self;
}

/* styling of input fields in contact form to space out validation tip */
.cmpv-form input,
.cmpv-form textarea {
	margin-bottom: 0px;
}

/* style for the input and textarea text in contact form while selected by user */
.cmpv-form input:focus,
.cmpv-form textarea:focus  {
	color: var(--e-global-color-text) !important;
	border: none;
	border-color: none;
	border-bottom: solid 1px !important;
	border-color: var(--e-global-color-primary) !important;
	background-color: transparent;
}

/* ok style for the input and textarea text in contact form while selected by user */
.cmpv-form .wpcf7-form-control,
.cmpv-form .wpcf7-form-control {
	border-width: 1px;
	border-color: var(--e-global-color-85324e5) !important;
}

/* style for the input and textarea text in contact form while selected by user */
body .cmpv-form .wpcf7-form-control:focus,
body .cmpv-form .wpcf7-form-control:active {
	border-width: 1px;
	border-color: var(--e-global-color-primary) !important;
}

/* line height and spacing for text input in both input and textarea fields */
.cmpv-form .wpcf7-form-control.wpcf7-text,
.cmpv-form .wpcf7-form-control.wpcf7-textarea {
	line-height: 1.3;
	height: auto;
	padding: 1px !important;
}

/* highlight color when text is selected */
.cmpv-form input::selection,
.cmpv-form textarea::selection {
	background-color:  var(--e-global-color-primary) !important;
}

/* styling of input and texarea fields in contact form when field is invalid */
.cmpv-form .wpcf7-form-control.has-value {
	border-bottom: solid;
  	border-width: 1px;
  	border-color: var(--e-global-color-secondary) !important;
}

/* styling of input and texarea fields in contact form when field is invalid */
.cmpv-form .wpcf7-form-control.wpcf7-not-valid {
	border-width: 1px !important;
}

/* changes the height of the textarea in the contact form */
.cmpv-form .wpcf7-form-control-wrap textarea.wpcf7-form-control.wpcf7-textarea	{
/*   height: 150px !important; */
}


/* style for submit button in contact form */
.cmpv-contact-button {
/* 	all: unset; */
	display: block;
	background-color: transparent;
	font-family: var(--e-global-typography-primary-font-family);
	color: var(--e-global-color-primary);
	border-color: var(--e-global-color-primary);
	padding-left: 20px;
	padding-right: 20px;
	padding-top: 8px !important;
	padding-bottom: 8px !important;
	border-width: 2px;
	font-size: 14px;
	font-weight: 600;
	margin: 0 auto;
}

/* style for submit button in contact form on hover */
.cmpv-contact-button:hover {
	background-color: var(--e-global-color-primary) !important;
	font-family: var(--e-global-typography-primary-font-family);
	color: #1e1e1e;
	background: none;
	border: none;
	padding-top: 10px !important;
	padding-bottom: 10px !important;
}

/* style for submit button in contact form after click */
.cmpv-contact-button:focus,
.cmpv-contact-button:active {
	border: none;
}

/* validation message styling per field */
.wpcf7-not-valid-tip {
	display: block !important;
	color: orange !important;
	font-family: var(--e-global-typography-primary-font-family);
	font-size: 12px;
}


/* customize the response output when the send button is clicked */
.cmpv-form .wpcf7-response-output {
	font-family: var(--e-global-typography-primary-font-family);
	text-align: center;
	font-size: 12px;
	border: none !important;
}

/* customize the response output when email is successful */
.wpcf7 form.sent .wpcf7-response-output {
	font-weight: 600;
	color: #4ab454;
}

/* customize the response output when email is invalid */
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output {
	color: orange;
/* 	color: var(--e-global-color-primary); */
}

/* customize the response output when email failed */
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output {
	color: red;
}