/* LaWanda Benefield CPA | EmailMeForm contact form | Refined gold edition
   Replaces the earlier custom stylesheet. Made for the burgundy footer.
   Upload under EmailMeForm > Theme > Advanced > External CSS.
   Note: changing field structure/placeholder text requires the form builder.
*/

/* Keep the form's own surface transparent so the page background shows. */
#emf-container,
#emf-form,
.emf-container,
.emf-form,
.form-all {
  background: transparent !important;
  box-shadow: none !important;
  color: #ffffff !important;
  font-family: Arial, Helvetica, sans-serif !important;
}

/* Form heading / description, including the Contact Us text. */
#emf-container .emf-form-title,
#emf-container .emf-form-description,
#emf-container .emf-section-title,
#emf-container .emf-section-description,
#emf-container h1,
#emf-container h2,
#emf-container h3,
.form-all .form-header,
.form-all .form-subHeader,
.form-all .form-header-group h1,
.form-all .form-header-group h2 {
  color: #ffffff !important;
}

/* Give the Contact Us heading the weight and breathing room it deserves. */
#emf-container .emf-form-title,
#emf-container h1,
.form-all .form-header {
  font-size: 30px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  margin-bottom: 16px !important;
}

#emf-container .emf-form-description,
.form-all .form-subHeader {
  color: #eadde0 !important;
  line-height: 1.5 !important;
}

/* Labels and supporting field instructions. */
#emf-container label,
#emf-container .emf-label,
#emf-container .emf-label-desc,
#emf-container .emf-form-label,
#emf-container .emf-field-label,
.form-all .form-label,
.form-all .form-sub-label,
.form-all .form-description {
  color: #ffffff !important;
}

/* A fresh white surface picks up the cream in LaWanda's gold logo. */
#emf-container input[type="text"],
#emf-container input[type="email"],
#emf-container input[type="tel"],
#emf-container textarea,
#emf-container select,
.form-all .form-textbox,
.form-all .form-textarea,
.form-all .form-dropdown {
  box-sizing: border-box !important;
  max-width: 100%;
  background: #ffffff !important;
  border: 1px solid #d9b75a !important;
  border-radius: 4px !important;
  color: #451019 !important;
  min-height: 40px !important;
  padding: 9px 11px !important;
  font-size: 14px !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

#emf-container textarea,
.form-all .form-textarea {
  min-height: 100px !important;
  resize: vertical;
}

#emf-container input::placeholder,
#emf-container textarea::placeholder,
.form-all input::placeholder,
.form-all textarea::placeholder {
  color: #86777b !important;
  opacity: 1;
}

#emf-container input:focus,
#emf-container textarea:focus,
#emf-container select:focus,
.form-all .form-textbox:focus,
.form-all .form-textarea:focus {
  outline: none !important;
  border-color: #e6c66a !important;
  box-shadow: 0 0 0 3px rgba(230, 198, 106, 0.32) !important;
}

/* Brand-gold call to action. */
#emf-container input[type="submit"],
#emf-container button[type="submit"],
#emf-container .emf-submit-button,
.form-all .form-submit-button {
  background: #d9b75a !important;
  background-image: none !important;
  border: 1px solid #d9b75a !important;
  border-radius: 4px !important;
  color: #451019 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 1px;
  min-height: 44px !important;
  padding: 13px 28px !important;
  cursor: pointer;
  transition: background-color 0.2s ease, transform 0.2s ease;
}

#emf-container input[type="submit"]:hover,
#emf-container button[type="submit"]:hover,
#emf-container .emf-submit-button:hover,
.form-all .form-submit-button:hover {
  background: #f0d478 !important;
  transform: translateY(-1px);
}

/* Avoid fields overflowing narrow mobile containers. */
@media (max-width: 600px) {
  #emf-container,
  .form-all { max-width: 100% !important; }
}
