/* LawnLogic lead-form layout normalizer.
   Scoped ENTIRELY under .ll-styled so it can only affect a lead <form> that
   opts in — it cannot touch anything else on the site.
   Goal: every field full-width, stacked, consistent, and mobile-safe
   (no 2-column rows that run off small screens; 16px text stops iOS zoom).
   Theme-agnostic: does NOT force background/text color, so light forms stay
   light and dark popups stay dark — only layout + sizing is normalized. */

.ll-styled {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Stack any multi-column rows (name+phone, project+timeline, etc.) */
.ll-styled .form-row,
.ll-styled .lead-row,
.ll-styled .ll-2col {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
  width: 100% !important;
  margin: 0 !important;
}

.ll-styled .form-group,
.ll-styled .lead-field {
  width: 100% !important;
  margin: 0 !important;
  min-width: 0 !important;
}

/* The Mapbox autocomplete wraps the address input in a relative div — keep it
   full-width so the address field matches every other field. */
.ll-styled .form-group > div,
.ll-styled .lead-field > div,
.ll-styled > div:not(.ll-2col) {
  width: 100%;
  min-width: 0;
}

/* Fields: full-width, consistent size, iOS-zoom-safe. Colors left to the form's
   own theme so nothing looks out of place on dark popups. */
.ll-styled input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([name="_ll_hp"]),
.ll-styled select,
.ll-styled textarea {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  display: block !important;
  font-size: 16px !important;
  margin: 0 !important;
}

/* Consistent, comfortable focus ring (theme-agnostic green glow) */
.ll-styled input:focus,
.ll-styled select:focus,
.ll-styled textarea:focus {
  border-color: #8BC53F !important;
  box-shadow: 0 0 0 3px rgba(139, 197, 63, .18) !important;
}

.ll-styled textarea { resize: vertical !important; }

/* Full-width submit button */
.ll-styled button[type=submit],
.ll-styled .form-submit,
.ll-styled .lead-submit,
.ll-styled .btn-submit {
  width: 100% !important;
  box-sizing: border-box !important;
}
