/*
  healcode-forms.css
  Styles for the Healcode / Mindbody prospect widget.
  Scoped to .healcode to avoid bleed into other elements.
  Uses s440 brand tokens via CSS variables.
  ──────────────────────────────────────────────────────
*/

/* ── Wrapper ── */
.healcode.prospect.modern-theme-wrapper {
  font-family: var(--font-body) !important;
  background:  transparent !important;
  padding:     0 !important;
}

/* ── 2-column grid for the name/email/phone fields on desktop ── */
.hc_prospect {
  display:               grid !important;
  grid-template-columns: 1fr 1fr !important;
  column-gap:            8px !important;
  row-gap:               0 !important;
}

/* Full-width exceptions */
.hc-prospect-email,
.hc-prospect-mobile-phone,
.communication-wrapper,
.hc-actions {
  grid-column: 1 / -1 !important;
}

/* ── Hide referral field (value set via JS) ── */
.hc-prospect-referred-by {
  display: none !important;
}

/* ── Hide MBO footer entirely ── */
.hc-privacy-footer {
  display: none !important;
}

/* ── Individual field wrappers ── */
.hc-prospect-field {
  margin: 0 !important;
  padding: 0 !important;
}

/* ── Text inputs ── */
.hc_prospect input[type="text"],
.hc_prospect input[type="email"] {
  width:         100% !important;
  padding:       12px 16px !important;
  border:        1.5px solid var(--gray-mid) !important;
  border-radius: var(--r-md) !important;
  background:    var(--white) !important;
  color:         var(--dark) !important;
  font-family:   var(--font-body) !important;
  font-size:     1rem !important;
  line-height:   1.4 !important;
  transition:    border-color var(--ease) !important;
  box-shadow:    none !important;
  outline:       none !important;
  box-sizing:    border-box !important;
  margin:        0 !important;
}

.hc_prospect input[type="text"]:focus,
.hc_prospect input[type="email"]:focus {
  border-color: var(--blue) !important;
  outline:      none !important;
}

.hc_prospect input[type="text"]::placeholder,
.hc_prospect input[type="email"]::placeholder {
  color: #a09faa !important;
}

/* Error state */
.hc_prospect input.parsley-error {
  border-color: #e53e3e !important;
}

/* ── Communication opt-in block ── */
.communication-wrapper {
  margin:     4px 0 0 !important;
  padding:    0 !important;
  background: transparent !important;
  border:     none !important;
  border-radius: 0 !important;
}

.communication-settings {
  display:         flex !important;
  align-items:     center !important;
  gap:             12px !important;
  margin-bottom:   4px !important;
  padding:         4px 0 !important;
  border-bottom:   1px solid var(--gray-mid) !important;
}

.communication-settings:last-child {
  margin-bottom: 0 !important;
  border-bottom: none !important;
}

/* Text takes most of the width */
.communication-text {
  flex:        1 !important;
  font-size:   0.82rem !important;
  color:       var(--gray) !important;
  line-height: 1.35 !important;
}

/* Checkboxes stay compact on the right */
.checkbox-wrapper {
  display:     flex !important;
  gap:         12px !important;
  flex-shrink: 0 !important;
}

.checkbox-wrapper span {
  display:     inline-flex !important;
  align-items: center !important;
  gap:         5px !important;
  font-size:   0.82rem !important;
  color:       var(--gray) !important;
  font-family: var(--font-body) !important;
  white-space: nowrap !important;
}

.hc_prospect input[type="checkbox"] {
  width:        15px !important;
  height:       15px !important;
  accent-color: var(--blue) !important;
  cursor:       pointer !important;
  margin:       0 !important;
  flex-shrink:  0 !important;
}

/* ── Submit button ── */
.hc-actions {
  margin-top: 10px !important;
}

input.submit.hc-prospect-submit {
  display:        block !important;
  width:          100% !important;
  padding:        15px 24px !important;
  background:     var(--lime) !important;
  color:          var(--dark) !important;
  font-family:    var(--font-head) !important;
  font-style:     italic !important;
  font-weight:    700 !important;
  font-size:      1.05rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  border:         none !important;
  border-radius:  var(--r-sm) !important;
  cursor:         pointer !important;
  transition:     filter var(--ease) !important;
  line-height:    1.2 !important;
  box-shadow:     none !important;
}

input.submit.hc-prospect-submit:hover {
  filter: brightness(0.92) !important;
}

/* ── Parsley validation errors ── */
.parsley-errors-list {
  list-style: none !important;
  margin:     4px 0 0 !important;
  padding:    0 !important;
}

.parsley-errors-list li {
  font-size:  0.78rem !important;
  color:      #e53e3e !important;
  margin:     0 !important;
  padding:    0 !important;
  border:     none !important;
  background: none !important;
}

/* ── Thank-you / error messages ── */
.prospect__thank-you--message {
  color:          var(--blue) !important;
  font-family:    var(--font-head) !important;
  font-style:     italic !important;
  text-transform: uppercase !important;
  font-size:      1rem !important;
}

.prospect__error {
  color: #e53e3e !important;
}

/* ── Mobile: single column ── */
@media (max-width: 767px) {
  .hc_prospect {
    grid-template-columns: 1fr !important;
  }
  .hc-prospect-email,
  .hc-prospect-mobile-phone {
    grid-column: auto !important;
  }
}