.plain-form #contact-form {
    background: transparent;
}

.plain-form #contact-form .submit-btn {
    background: var(--wc-green);
}

.plain-form #contact-form:hover {
    background: var(--wc-light-dark);
}

.plain-form #contact-form .submit-btn:hover {
    background: var(--wc-green-2);
}

#contact-form {
    background: linear-gradient(to right, var(--wc-green-2), var(--wc-green) 30%, var(--wc-green) 70%, var(--wc-green-2));
    background-size: 100%;
    background-position: center;
    border-radius: 1rem;
    padding: 1rem;
    color: var(--wc-white);
    box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.4);
    transition: all ease 1s;
}

#contact-form input,
#contact-form select,
#contact-form textarea {
    color: var(--wc-dark);
}

#contact-form:has(form .submit-btn:hover) {
    background-size: 200%;
}

#contact-form ul li small {
    color: white;
    background-color: var(--bs-danger);
    padding: 0.2rem;
}

@media screen and (min-width: 768px) {
    #contact-form {
        padding: 5%;
    }
}

@media screen and (min-width:992px) {
    #contact-form {
        padding: 5% 10%;
    }
}