/*
Theme Name: Divi Child
Theme URI: http://www.elegantthemes.com/gallery/divi/
Template: Divi
Author: Elegant Themes
Author URI: http://www.elegantthemes.com
Description: Smart. Flexible. Beautiful. Divi is the most powerful theme in our collection.
Tags: responsive-layout,one-column,two-columns,three-columns,four-columns,left-sidebar,right-sidebar,custom-background,custom-colors,featured-images,full-width-template,post-formats,rtl-language-support,theme-options,threaded-comments,translation-ready
Version: 3.22.5.1556550215
Updated: 2019-04-29 15:03:35

*/

/* ============================================
   WATER DAMAGE SPECIALISTS — CONTACT FORM STYLES
   
   Apply CSS class "wds-contact-form" to your
   Divi Contact Form module under:
   Advanced → CSS ID & Classes → CSS Class
   
   Paste this into:
   Divi → Theme Options → Custom CSS
   OR the page-level Custom CSS box
   ============================================ */

/* ---- Form Container ---- */
.wds-contact-form .et_pb_contact_form {
  background: #ffffff;
  border-radius: 12px;
  padding: 40px 36px;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
  border: 1px solid #e5e7eb;
}

/* ---- All Input Fields ---- */
.wds-contact-form .et_pb_contact_form input.input,
.wds-contact-form .et_pb_contact_form textarea.input,
.wds-contact-form .et_pb_contact_form select {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 15px !important;
  color: #111827 !important;
  background: #f9fafb !important;
  border: 1px solid #d1d5db !important;
  border-radius: 8px !important;
  padding: 14px 16px !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
  width: 100% !important;
  margin-bottom: 0 !important;
}

/* ---- Focus State ---- */
.wds-contact-form .et_pb_contact_form input.input:focus,
.wds-contact-form .et_pb_contact_form textarea.input:focus,
.wds-contact-form .et_pb_contact_form select:focus {
  border-color: #1a56db !important;
  box-shadow: 0 0 0 3px rgba(26, 86, 219, 0.12) !important;
  background: #ffffff !important;
  outline: none !important;
}

/* ---- Placeholder Text ---- */
.wds-contact-form .et_pb_contact_form input.input::placeholder,
.wds-contact-form .et_pb_contact_form textarea.input::placeholder {
  color: #9ca3af !important;
  font-weight: 400 !important;
}

/* ---- Textarea ---- */
.wds-contact-form .et_pb_contact_form textarea.input {
  min-height: 130px !important;
  resize: vertical !important;
}

/* ---- Select Dropdown ---- */
.wds-contact-form .et_pb_contact_form select {
  appearance: none !important;
  -webkit-appearance: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%236B7280' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 16px center !important;
  padding-right: 40px !important;
  cursor: pointer !important;
}

/* ---- Field Spacing ---- */
.wds-contact-form .et_pb_contact_form .et_pb_contact_field {
  margin-bottom: 20px !important;
}

/* ---- Submit Button ---- */
.wds-contact-form .et_pb_contact_form .et_pb_contact_submit {
  font-family: 'Lato', sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  background: #1a56db !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 16px 36px !important;
  cursor: pointer !important;
  transition: background 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease !important;
  width: 100% !important;
}

.wds-contact-form .et_pb_contact_form .et_pb_contact_submit:hover {
  background: #1345b5 !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 12px rgba(26, 86, 219, 0.3) !important;
}

/* ---- Error Messages ---- */
.wds-contact-form .et_pb_contact_error {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 13px !important;
  color: #dc2626 !important;
  background: #fef2f2 !important;
  border: 1px solid #fecaca !important;
  border-radius: 8px !important;
  padding: 12px 16px !important;
}

/* ---- Success Message ---- */
.wds-contact-form .et-pb-contact-message p {
  font-family: 'Montserrat', sans-serif !important;
  font-size: 15px !important;
  color: #15803d !important;
  background: #f0fdf4 !important;
  border: 1px solid #bbf7d0 !important;
  border-radius: 8px !important;
  padding: 16px 20px !important;
}

/* ============================================
   RESPONSIVE — TABLET
   ============================================ */
@media (max-width: 768px) {
  .wds-contact-form .et_pb_contact_form {
    padding: 28px 22px;
  }

  .wds-contact-form .et_pb_contact_form .et_pb_contact_submit {
    padding: 14px 28px !important;
  }
}

/* ============================================
   RESPONSIVE — MOBILE
   ============================================ */
@media (max-width: 480px) {
  .wds-contact-form .et_pb_contact_form {
    padding: 20px 16px;
  }

  .wds-contact-form .et_pb_contact_form input.input,
  .wds-contact-form .et_pb_contact_form textarea.input,
  .wds-contact-form .et_pb_contact_form select {
    font-size: 14px !important;
    padding: 12px 14px !important;
  }
}

/* ============================================
   HIDE FIELD LABELS — UNSCOPED OVERRIDE
   Placed last to beat any Divi specificity.
   Targets the exact elements Divi renders.
   ============================================ */
label.et_pb_contact_form_label,
.et_pb_contact_form_label,
.et_pb_contact_field_options_title {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 0 !important;
  line-height: 0 !important;
  overflow: hidden !important;
  position: absolute !important;
  clip: rect(0, 0, 0, 0) !important;
}