/* ==============================================
   WEBSITE CONTACT FORM CSS
   ============================================== */

/* reCAPTCHA text */
.captcha-text {
  font-size: 0.7rem !important;
  text-align: center !important;
  margin-top: 15px !important;
  margin-bottom: 20px !important;
  padding: 0 10px !important;
  line-height: 1.3 !important;
}
.grecaptcha-badge {
  display: none !important;
}

/* ----------------------------------------------
   FORM CONTAINER
   ---------------------------------------------- */
.website-contact-form {
  margin-top: 0px !important;
  margin-bottom: 10px !important;
}

/* ----------------------------------------------
     FORM FIELDS - BASE STYLING
     ---------------------------------------------- */
.website-contact-form-name,
.website-contact-form-biz-name,
.website-contact-form-email,
.website-contact-form-phone,
.website-contact-form-description {
  padding-bottom: 24px !important;
}

.website-contact-form-name input,
.website-contact-form-biz-name input,
.website-contact-form-email input,
.website-contact-form-phone input,
.website-contact-form-description textarea {
  width: 100%;
  padding: 12px 15px 12px 45px !important;
  border: 1px solid #ddd !important;
  border-radius: 6px !important;
  font-size: 16px !important;
  transition: all 0.3s ease !important;
  background-color: #fff !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
}

.website-contact-form-interest select {
  color: #a5a5a5 !important;
  padding: 0 15px 0 45px !important;
  border: 1px solid #ddd !important;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05) !important;
  background-color: #fff !important;
  border-radius: 6px !important;
}

.website-contact-form-interest select.wpforms-valid {
  color: #4c4c4c !important;
}

/* Focus states */
.website-contact-form-name input:focus,
.website-contact-form-biz-name input:focus,
.website-contact-form-email input:focus,
.website-contact-form-phone input:focus,
.website-contact-form-description textarea:focus,
.website-contact-form-interest select:focus {
  border-color: #144950 !important;
  outline: none !important;
  box-shadow: 0 0 0 3px rgba(20, 73, 80, 0.1) !important;
}

/* ----------------------------------------------
     TEXTAREA SPECIFIC STYLING
     ---------------------------------------------- */
.website-contact-form-description textarea {
  height: 120px;
  resize: vertical;
  padding-top: 15px !important;
  padding-bottom: 15px !important;
}

/* ----------------------------------------------
     FORM FIELD ICONS
     ---------------------------------------------- */
.website-contact-form-name::before,
.website-contact-form-biz-name::before,
.website-contact-form-email::before,
.website-contact-form-phone::before,
.website-contact-form-description::before,
.website-contact-form-interest::before {
  font-family: "Font Awesome 5 Free";
  position: absolute;
  left: 15px;
  top: 45%;
  transform: translateY(-50%);
  color: #144950;
  font-weight: 900;
  z-index: 1;
  font-size: 18px;
  opacity: 0.7;
  pointer-events: none;
}

/* Icon content */
.website-contact-form-name::before {
  content: "\f007"; /* user icon */
}

.website-contact-form-biz-name::before {
  content: "\f1ad"; /* building icon */
}

.website-contact-form-email::before {
  content: "\f0e0"; /* envelope icon */
}

.website-contact-form-phone::before {
  content: "\f095"; /* phone icon */
}

.website-contact-form-description::before {
  content: "\f086"; /* comment icon */
  top: 25px !important;
  transform: none !important;
}

.website-contact-form-interest::before {
  content: "\f02e";
  top: 50% !important;
  transform: translateY(-50%) !important;
}

.website-contact-form-description textarea {
  padding: 15px 15px 15px 50px !important; /* increased left padding from 45px to 50px */
}

/* Icon position adjustment for error states */
.website-contact-form-name.wpforms-has-error::before,
.website-contact-form-biz-name.wpforms-has-error::before,
.website-contact-form-email.wpforms-has-error::before,
.website-contact-form-phone.wpforms-has-error::before {
  top: 32% !important;
}

/* ----------------------------------------------
     SUBMIT BUTTON
     ---------------------------------------------- */
.website-contact-form-submit {
  background-color: #144950 !important;
  color: white !important;
  border: none !important;
  padding: 12px 30px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  border-radius: 6px !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
  display: flex !important;
  text-align: center !important;
  letter-spacing: 0.5px !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  justify-content: center !important;
}

.website-contact-form-submit:hover {
  background-color: #1c6570 !important;
  transform: translateY(-2px);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15) !important;
}

.website-contact-form-submit:active {
  transform: translateY(0);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
}

/* ==============================================
     RESPONSIVE STYLES
     ============================================== */

/* ----------------------------------------------
     TABLET & MOBILE (768px and below)
     ---------------------------------------------- */
@media (max-width: 768px) {
  /* Form headings */
  .website-contact-form h3 {
    font-size: 1.6rem !important;
    text-align: center !important;
  }

  /* Form fields */
  .website-contact-form-name input,
  .website-contact-form-biz-name input,
  .website-contact-form-email input,
  .website-contact-form-phone input,
  .website-contact-form-description textarea {
    padding: 10px 15px 10px 40px !important;
    font-size: 15px !important;
  }

  /* Form field icons */
  .website-contact-form-name::before,
  .website-contact-form-biz-name::before,
  .website-contact-form-email::before,
  .website-contact-form-phone::before,
  .website-contact-form-description::before {
    font-size: 16px !important;
    left: 12px !important;
  }

  /* Textarea adjustments */
  .website-contact-form-description textarea {
    min-height: 100px !important;
    resize: vertical !important;
    padding-top: 15px !important;
  }

  /* Submit button */
  .website-contact-form-submit {
    width: 100% !important;
    padding: 16px 20px !important;
    font-size: 1.1rem !important;
    margin-top: 10px !important;
  }
}

/* ----------------------------------------------
     SMALL MOBILE (480px and below)
     ---------------------------------------------- */
@media (max-width: 480px) {
  /* Form fields */
  .website-contact-form-name input,
  .website-contact-form-biz-name input,
  .website-contact-form-email input,
  .website-contact-form-phone input,
  .website-contact-form-description textarea {
    padding: 10px 10px 10px 35px !important;
  }

  /* Textarea height */
  .website-contact-form-description textarea {
    height: 100px !important;
  }

  /* Form field icons */
  .website-contact-form-name::before,
  .website-contact-form-biz-name::before,
  .website-contact-form-email::before,
  .website-contact-form-phone::before,
  .website-contact-form-description::before {
    left: 10px !important;
    font-size: 14px !important;
  }

  /* Submit button */
  .website-contact-form-submit {
    padding: 14px 18px !important;
    font-size: 1rem !important;
  }
}

/* About Page Submit Button */
.website-contact-form-submit-about {
  background: linear-gradient(
    135deg,
    hsl(28 68% 54% / 1) 0%,
    hsl(21 78% 46% / 1) 100%
  ) !important;
  color: white !important;
  border: none !important;
  border-radius: 8px !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  cursor: pointer !important;
  transition: all 0.3s ease !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
  width: 100% !important;
}

.website-contact-form-submit-about:hover {
  background: linear-gradient(135deg, #e67e22, #d35400) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
  transform: translateY(-1px) !important;
}

.website-contact-form-submit-about:active {
  transform: translateY(0) !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1) !important;
}

.website-contact-form-submit-about:focus {
  outline: 2px solid #f39c12 !important;
  outline-offset: 2px !important;
}
#wpforms-3329-field_6-container {
  color: white !important;
  padding-top: 0 !important;
}

#wpforms-3329-field_6-container label {
  color: white !important;
  margin-right: 20px !important;
  cursor: pointer !important;
}

#wpforms-3329-field_6-container input[type="checkbox"] {
  accent-color: #f39c12 !important;
  margin-right: 8px !important;
  transform: scale(1.1) !important;
}

#wpforms-3329-field_6-container .wpforms-field-label {
  color: white !important;
}

#wpforms-3329-field_6-container .wpforms-field-choice-label {
  color: white !important;
}
