/*
 * Gravity Forms skin – makes form 1 (Orbital theme) match the static
 * .contact-form / .form-field design. Scoped to .gf-contact-form and only
 * enqueued on the Contact page and homepage. Orbital prints its own inline
 * <style> after this file, hence the !important on overridden properties.
 */

.gf-contact-form{background:rgba(255,248,181,0.5); padding:32px;}
body.home .gf-contact-form{border-bottom-left-radius:48px;}

.gf-contact-form .gform_wrapper.gform-theme{
  --gf-color-primary:#242425 !important;
  --gf-color-primary-rgb:36, 36, 37 !important;
  --gf-color-primary-contrast:#fff !important;
  --gf-color-in-ctrl:#FAFAFA !important;
  --gf-ctrl-border-color:var(--border) !important;
  --gf-ctrl-radius:var(--radius) !important;
  --gf-font-family-base:var(--font-body) !important;
  margin:0 !important;
  font-family:var(--font-body) !important;
}

/* Two-column grid, like .form-row */
.gf-contact-form .gform_wrapper .gform_fields{row-gap:16px !important; column-gap:16px !important;}

/* Labels */
.gf-contact-form .gform_wrapper .gfield_label,
.gf-contact-form .gform_wrapper .gform-field-label:not(.gform-field-label--type-sub){
  font-family:var(--font-body) !important;
  font-size:13px !important;
  font-weight:700 !important;
  color:var(--charcoal) !important;
  margin-bottom:6px !important;
  padding:0 !important;
}
/* Single-input Name field: hide the redundant "First" sub-label */
.gf-contact-form .gform_wrapper .gform-field-label--type-sub{display:none !important;}
.gf-contact-form .gform_wrapper .gfield_required{color:var(--text-secondary) !important;}

/* Inputs */
.gf-contact-form .gform_wrapper input[type="text"],
.gf-contact-form .gform_wrapper input[type="tel"],
.gf-contact-form .gform_wrapper input[type="email"],
.gf-contact-form .gform_wrapper select,
.gf-contact-form .gform_wrapper textarea{
  font-family:var(--font-body) !important;
  font-size:15px !important;
  line-height:1.4 !important;
  padding:12px 14px !important;
  border:1px solid var(--border) !important;
  border-radius:var(--radius) !important;
  background-color:#FAFAFA !important;
  color:var(--text-primary) !important;
  box-shadow:none !important;
  min-block-size:0 !important;
  height:auto !important;
}
.gf-contact-form .gform_wrapper select{
  appearance:none !important; -webkit-appearance:none !important;
  padding-right:46px !important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23242425' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
  background-repeat:no-repeat !important;
  background-position:right 20px center !important;
  background-size:16px !important;
}
.gf-contact-form .gform_wrapper textarea{resize:vertical !important; min-height:110px !important; block-size:auto !important;}
.gf-contact-form .gform_wrapper input:focus,
.gf-contact-form .gform_wrapper select:focus,
.gf-contact-form .gform_wrapper textarea:focus{
  outline:2px solid var(--charcoal) !important;
  outline-offset:1px !important;
  background-color:var(--surface) !important;
  box-shadow:none !important;
}

/* Submit – mirrors .btn.btn-primary inside .contact-form */
.gf-contact-form .gform_wrapper .gform_footer{margin-top:24px !important; padding:0 !important;}
.gf-contact-form .gform_wrapper .gform_footer .gform_button{
  display:inline-flex !important; align-items:center !important;
  font-family:var(--font-body) !important;
  font-weight:700 !important;
  font-size:15.5px !important;
  line-height:1.5 !important;
  padding:14px 26px !important;
  border-radius:999px !important;
  border:2px solid transparent !important;
  background-clip:padding-box !important;
  background-color:transparent !important;
  background-image:linear-gradient(to right, var(--charcoal) 0%, var(--charcoal) 50%, #fffcda 100%) !important;
  background-size:200% 100% !important;
  background-position:0 0 !important;
  color:#fff !important;
  box-shadow:none !important;
  cursor:pointer;
  transition:background-position .2s ease, color .2s ease !important;
}
.gf-contact-form .gform_wrapper .gform_footer .gform_button:hover{background-position:100% 0 !important; color:#fff !important;}

/* Validation + confirmation */
.gf-contact-form .gform_wrapper .gfield_validation_message,
.gf-contact-form .gform_wrapper .validation_message{font-size:13px !important; background:none !important; border:0 !important; padding:4px 0 0 !important;}
.gf-contact-form .gform_confirmation_message{font-weight:600; font-size:15px; color:var(--text-primary);}

@media (max-width:640px){
  .gf-contact-form{padding:24px;}
}
