/* ============================================================================
   05-GRAVITYFORMS — style Gravity Forms PRO output to match the design.
   Theme-only (not part of the static build). Harmless when no GF form renders.
   Targets GF 2.5+ "gravity-theme" markup. The client's actual fields may need
   minor tweaks, but newsletter (inline) + modal (stacked) are covered here.
   ============================================================================ */

/* ---------------------------------------------------------------------------
   Newsletter (footer) — inline pill: [ email ............. (Sign Up) ]
   --------------------------------------------------------------------------- */
.footer-col--newsletter .gform_wrapper form {
  display: flex;
  align-items: center;
  gap: 8px;
  background: var(--color-rust-light);
  border-radius: var(--radius);
  padding-left: 24px;
  max-width: 356px;
  margin: 24px 0 16px;
}
.footer-col--newsletter .gform_wrapper .gform_body,
.footer-col--newsletter .gform_wrapper .gform_fields,
.footer-col--newsletter .gform_wrapper .gfield { flex: 1; margin: 0; padding: 0; display: block; }
/* hide labels/desc for the inline single field */
.footer-col--newsletter .gform_wrapper .gfield_label,
.footer-col--newsletter .gform_wrapper .gfield_required,
.footer-col--newsletter .gform_wrapper .gfield_description,
.footer-col--newsletter .gform_wrapper .gform_validation_errors {
  position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}
.footer-col--newsletter .gform_wrapper input[type="email"],
.footer-col--newsletter .gform_wrapper input[type="text"] {
  width: 100%; background: transparent; border: 0; color: var(--color-cream-warm);
  padding: 12px 0; font: inherit; letter-spacing: var(--tracking-body);
}
.footer-col--newsletter .gform_wrapper input::placeholder { color: var(--color-tan); }
.footer-col--newsletter .gform_wrapper input:focus { outline: none; }
.footer-col--newsletter .gform_wrapper .gform_footer { margin: 0; padding: 0; flex: 0 0 auto; }
/* override Gravity Forms' Orbital theme button (its own vars + !important to beat the inline ID styles) */
.footer-col--newsletter .gform_wrapper {
  --gf-ctrl-btn-bg-color-primary: var(--color-cream);
  --gf-ctrl-btn-bg-color-hover-primary: #ffffff;
  --gf-ctrl-btn-color-primary: var(--color-rust);
  --gf-ctrl-btn-border-color-primary: transparent;
  --gf-ctrl-btn-border-color-hover-primary: transparent;
}
.footer-col--newsletter .gform_wrapper .gform_button {
  background: var(--color-cream) !important; color: var(--color-rust) !important;
  border: 0 !important; box-shadow: none !important; border-radius: var(--radius) !important;
  padding: 12px 24px !important; font-family: var(--font-sans); font-weight: 500; font-size: var(--fs-body);
  letter-spacing: var(--tracking-body); white-space: nowrap; cursor: pointer;
  transition: transform var(--dur-fast) var(--ease);
}
.footer-col--newsletter .gform_wrapper .gform_button:hover {
  background: #ffffff !important; transform: translateY(-2px);
}

/* ---------------------------------------------------------------------------
   Membership modal — stacked fields
   --------------------------------------------------------------------------- */
.modal__gf .gform_wrapper .gform_fields { display: flex; flex-direction: column; gap: 16px; }
.modal__gf .gform_wrapper .gfield { margin: 0; }
.modal__gf .gform_wrapper .gfield_label {
  font-family: var(--font-sans); font-size: var(--fs-small); color: var(--ink-60);
  margin-bottom: 6px; display: block;
}
.modal__gf .gform_wrapper input[type="text"],
.modal__gf .gform_wrapper input[type="email"],
.modal__gf .gform_wrapper input[type="tel"],
.modal__gf .gform_wrapper textarea {
  width: 100%; padding: 12px 24px; border-radius: var(--radius);
  background: var(--color-cream-warm); border: 1px solid transparent; color: var(--color-ink);
  font: inherit; letter-spacing: var(--tracking-body);
}
.modal__gf .gform_wrapper input:focus,
.modal__gf .gform_wrapper textarea:focus { outline: none; border-color: var(--color-rust); }
.modal__gf .gform_wrapper input::placeholder { color: var(--ink-60); }

/* interests (checkboxes / radios) — rust accent, matching the bespoke control */
.modal__gf .gform_wrapper .gfield--type-checkbox > .gfield_label,
.modal__gf .gform_wrapper .gfield--type-radio > .gfield_label,
.modal__gf .gform_wrapper legend.gfield_label {
  color: var(--color-rust); font-weight: 500; margin-bottom: 12px;
}
.modal__gf .gform_wrapper .gfield_checkbox,
.modal__gf .gform_wrapper .gfield_radio { display: flex; flex-wrap: wrap; gap: 12px 24px; }
.modal__gf .gform_wrapper .gchoice { display: flex; align-items: center; gap: 8px; }
.modal__gf .gform_wrapper .gchoice input { accent-color: var(--color-rust); width: 16px; height: 16px; }
.modal__gf .gform_wrapper .gchoice label { color: var(--ink-80); }

/* submit → full-width rust button (override Orbital theme) */
.modal__gf .gform_wrapper {
  --gf-ctrl-btn-bg-color-primary: var(--color-rust);
  --gf-ctrl-btn-bg-color-hover-primary: #82390f;
  --gf-ctrl-btn-color-primary: var(--color-offwhite);
  --gf-ctrl-btn-border-color-primary: transparent;
  --gf-ctrl-btn-border-color-hover-primary: transparent;
}
.modal__gf .gform_wrapper .gform_footer { margin-top: 16px; padding: 0; }
.modal__gf .gform_wrapper .gform_button {
  width: 100% !important; background: var(--color-rust) !important; color: var(--color-offwhite) !important;
  border: 0 !important; box-shadow: none !important; border-radius: var(--radius) !important;
  padding: 12px 24px !important; font-family: var(--font-sans); font-weight: 500;
  font-size: var(--fs-body); letter-spacing: var(--tracking-body); cursor: pointer;
  transition: transform var(--dur-fast) var(--ease), background-color var(--dur-fast) var(--ease);
}
.modal__gf .gform_wrapper .gform_button:hover { background: #82390f !important; transform: translateY(-2px); }

/* ---------------------------------------------------------------------------
   Shared — validation + confirmation messages
   --------------------------------------------------------------------------- */
.gform_wrapper .gfield_validation_message,
.gform_wrapper .validation_message { color: #b3261e; font-size: var(--fs-small); margin-top: 6px; }
.gform_confirmation_message { color: var(--ink-80); }