/*
    Theme Name: Spectra One Child
    Template: spectra-one
*/

.wpcf7 label {
    font-size: 1rem;
    font-weight: 500;
    color: #334155;
}

.wpcf7 input, 
.wpcf7 textarea,
.wpcf7 select {
    width: 100%;
    font-size: 1rem;
	font-weight: 400;
    padding: 0.75rem 1rem;
    margin-top: 8px;
    border-radius: 0.75rem;
    border: 1px solid #cbd5e1;
    outline: none;
    transition: outline 0.4s ease;
    resize: vertical;
}

.wpcf7 select {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	position: relative;
}

.wpcf7 label:has(select)::after {
	content: '\25BC';
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-50%);
	font-size: 12px;
	color: #000;
}

.wpcf7 input:focus-within {
    outline: 1px solid var(--e-global-color-text);
}

.wpcf7 input::placeholder, 
.wpcf7 textarea::placeholder {
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    color: #334155;
}

.wpcf7 select {
    cursor: pointer;
}

.wpcf7 .row {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.wpcf7 .row .col-6 {
    width: 50%;
}

.wpcf7 p:has(input[type="submit"]) {
    display: none;
}

.wpcf7 button {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 1rem 0;
    border-radius: 0.75rem;
    color: #fff;
    border: none;
    font-size: 1rem;
    font-weight: 500;
    background: -webkit-linear-gradient(0deg, var(--e-global-color-primary), var(--e-global-color-secondary));
    transition: transform 0.4s ease, box-shadow 0.4s ease;
    cursor: pointer;
}

.wpcf7 button:hover {
    box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
    transform: scale(1.03);
}

/* Mobile Menu Bar */
/* 
body:not(.elementor-editor-active) #mobile-menu-bar {
    max-height: 0px;
    overflow: hidden;
    transition: all 0.8s ease-in-out;
}

body:not(.elementor-editor-active) #mobile-menu-bar.active {
    max-height: 600px;
    margin-top: 20px;
    padding-top: 10px;
    border-top: 1px solid #E2E8F080;
} */

#mobile-menu-bar {
    max-height: 0px;
    overflow: hidden;
    transition: all 0.8s ease-in-out;
}

#mobile-menu-bar.active {
    max-height: 600px;
    margin-top: 20px;
    padding-top: 10px;
    border-top: 1px solid #E2E8F080;
}