/* ─── Gravity Forms Overrides ────────────────────────────────────────────── */

/* Form wrapper */
.gform_wrapper {
  font-family: 'Helvetica Neue', Helvetica, Arial, system-ui, sans-serif;
}

/* Labels — generic fallback */
.gform_wrapper .gfield_label {
  display: block;
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: hsl(var(--muted-foreground));
  margin-bottom: 0.5rem;
  float: none;
}

/* Inputs, textareas, selects — generic fallback */
.gform_wrapper input[type="text"],
.gform_wrapper input[type="email"],
.gform_wrapper input[type="tel"],
.gform_wrapper input[type="number"],
.gform_wrapper input[type="url"],
.gform_wrapper input[type="password"],
.gform_wrapper select,
.gform_wrapper textarea {
  width: 100%;
  padding: 0.75rem 1rem;
  background-color: hsl(var(--background));
  border: 1px solid hsl(var(--border));
  color: hsl(var(--foreground));
  font-size: 0.875rem;
  font-family: inherit;
  border-radius: 0;
  outline: none;
  transition: border-color 0.2s ease;
  appearance: none;
  -webkit-appearance: none;
}

.gform_wrapper input[type="text"]:focus,
.gform_wrapper input[type="email"]:focus,
.gform_wrapper input[type="tel"]:focus,
.gform_wrapper input[type="number"]:focus,
.gform_wrapper input[type="url"]:focus,
.gform_wrapper input[type="password"]:focus,
.gform_wrapper select:focus,
.gform_wrapper textarea:focus {
  border-color: hsl(var(--accent));
}

.gform_wrapper input::placeholder,
.gform_wrapper textarea::placeholder {
  color: hsl(var(--muted-foreground));
}

.gform_wrapper textarea {
  resize: none;
  min-height: 130px;
}

.gform_wrapper select {
  cursor: pointer;
}

.gform_wrapper .gfield {
  margin-bottom: 1.5rem;
}

/* Submit button — generic fallback */
.gform_wrapper .gform_footer input[type="submit"],
.gform_wrapper .gform_button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 0.875rem 2rem;
  background-color: hsl(var(--foreground));
  color: hsl(var(--background));
  font-size: 0.875rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  border: none;
  border-radius: 0;
  cursor: pointer;
  transition: background-color 0.3s ease;
  font-family: inherit;
}

.gform_wrapper .gform_footer input[type="submit"]:hover,
.gform_wrapper .gform_button:hover {
  background-color: hsl(var(--foreground) / 0.85);
}

/* Validation errors */
.gform_wrapper .gfield_error input,
.gform_wrapper .gfield_error textarea,
.gform_wrapper .gfield_error select {
  border-color: hsl(0 65% 55%);
}

.gform_wrapper .validation_message,
.gform_wrapper .gfield_error .gfield_description {
  font-size: 0.75rem;
  color: hsl(0 65% 55%);
  margin-top: 0.375rem;
}

.gform_wrapper .validation_error {
  display: none;
}

/* Confirmation message */
.gform_confirmation_wrapper {
  padding: 3rem 0;
  text-align: center;
}

.gform_confirmation_message {
  font-size: 1rem;
  color: hsl(var(--muted-foreground));
  line-height: 1.7;
}

/* Remove GF default chrome */
.gform_wrapper .top_label .gfield_label { float: none; }
.gform_wrapper ul.gform_fields        { list-style: none; margin: 0; padding: 0; }
.gform_wrapper li.gfield              { margin-bottom: 1.5rem; }
.gform_wrapper .gform_footer          { margin-top: 0.5rem; padding-top: 0; }
.gform_wrapper .gfield_required       { color: hsl(var(--accent)); margin-left: 2px; }


/* ─── Form 6 (Contact Page) ──────────────────────────────────────────────── */
/*
 * Fields:
 *   field_6_1  Inquiry Type  — select,   full-width
 *   field_6_3  Name          — fieldset, full-width (First + Last sub-inputs)
 *   field_6_4  Company       — text,     half-width  ┐ side by side
 *   field_6_5  Telephone     — tel,      half-width  ┘
 *   field_6_6  Email         — email,    full-width
 *   field_6_7  Message       — textarea, full-width
 *
 * React reference: Contact.tsx
 *   inputClass = "w-full px-4 py-3 bg-background border border-border
 *                 text-foreground text-sm placeholder:text-muted-foreground
 *                 focus:border-accent transition-colors"
 *   labelClass = "block text-xs font-medium tracking-wider uppercase
 *                 text-muted-foreground mb-2"
 */

/* Reset GF Orbital theme CSS variables to dark theme */
#gform_wrapper_6,
#gform_wrapper_6[data-form-index].gform-theme {
  --gf-color-primary:              hsl(var(--accent));
  --gf-color-primary-contrast:     hsl(var(--background));
  --gf-color-secondary:            hsl(var(--background));
  --gf-color-secondary-contrast:   hsl(var(--foreground));
  --gf-color-in-ctrl:              hsl(var(--background));
  --gf-color-in-ctrl-contrast:     hsl(var(--foreground));
  --gf-color-in-ctrl-primary:      hsl(var(--accent));
  --gf-color-out-ctrl-light:       hsl(var(--border));
  --gf-ctrl-border-color:          hsl(var(--border));
  --gf-ctrl-label-color-primary:   hsl(var(--foreground));
  --gf-ctrl-label-color-secondary: hsl(var(--muted-foreground));
  --gf-radius: 0px;
  --gf-font-size-secondary: 0.875rem;
	width: 100%;
}

/* ── Grid layout ──────────────────────────────────────────────────────────── */

/* 2-column grid — matches React md:grid-cols-2 gap-6 */
#gform_6 .gform_fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

/* Fields carry no margin — grid gap handles all vertical spacing */
#gform_6 .gfield {
  margin-bottom: 0;
}

/* Full-width fields span both columns */
#gform_6 .gfield--width-full,
#gform_6 .gform_validation_container {
  grid-column: 1 / -1;
}

/* Half-width fields (Company + Telephone) occupy one column each */
#gform_6 .gfield--width-half {
  grid-column: span 1;
}

/* Mobile: all fields stack to a single column */
@media (max-width: 767px) {
  #gform_6 .gform_fields {
    grid-template-columns: 1fr;
  }
  #gform_6 .gfield--width-half {
    grid-column: 1 / -1;
  }
}

/* ── Honeypot ─────────────────────────────────────────────────────────────── */
#gform_6 .gform_validation_container {
  display: none !important;
}

/* ── Labels ───────────────────────────────────────────────────────────────── */

#gform_wrapper_6 .gfield_label {
  display: block;
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: hsl(var(--muted-foreground));
  margin-bottom: 0.5rem;
  float: none;
  width: 100%;
  padding: 0;
}

/* Sublabels inside the Name fieldset (First Name / Last Name) */
#gform_wrapper_6 .gform-field-label--type-sub {
  display: block;
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: hsl(var(--muted-foreground));
  margin-bottom: 0.5rem;
}

/* ── Name fieldset ────────────────────────────────────────────────────────── */

/* Strip browser default fieldset chrome */
#gform_6 fieldset#field_6_3 {
  border: none;
  padding: 0;
  margin: 0;
  min-width: 0;
}

/* First + Last inputs sit side by side — matches React grid-cols-2 gap-6 */
#gform_wrapper_6 #field_6_3 .ginput_complex.gform-grid-row {
  display: flex;
  gap: 1.5rem;
}

#gform_wrapper_6 #field_6_3 .gform-grid-col {
  flex: 1;
  min-width: 0;
}

/* Mobile: stack First and Last vertically */
@media (max-width: 767px) {
  #gform_wrapper_6 #field_6_3 .ginput_complex.gform-grid-row {
    flex-direction: column;
    gap: 1rem;
  }
}

/* ── Inputs / Select / Textarea ───────────────────────────────────────────── */

#gform_6 input[type="text"],
#gform_6 input[type="email"],
#gform_6 input[type="tel"],
#gform_6 input[type="number"],
#gform_6 input[type="url"],
#gform_6 input[type="password"],
#gform_6 select,
#gform_6 textarea {
  width: 100% !important;
  background-color: hsl(var(--background)) !important;
  border: 1px solid hsl(var(--border)) !important;
  border-radius: 0 !important;
  color: hsl(var(--foreground)) !important;
  font-size: 0.875rem !important;
  font-family: inherit !important;
  box-shadow: none !important;
  outline: none !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  background-image: none !important;
  transition: border-color 0.2s ease !important;
}

/* Focus */
#gform_6 input[type="text"]:focus,
#gform_6 input[type="email"]:focus,
#gform_6 input[type="tel"]:focus,
#gform_6 input[type="number"]:focus,
#gform_6 input[type="url"]:focus,
#gform_6 input[type="password"]:focus,
#gform_6 select:focus,
#gform_6 textarea:focus {
  border-color: hsl(var(--accent)) !important;
  box-shadow: none !important;
  outline: none !important;
}

/* Placeholder */
#gform_6 input::placeholder,
#gform_6 textarea::placeholder {
  color: hsl(var(--muted-foreground)) !important;
  opacity: 1;
}

/* Select */
#gform_6 select {
  cursor: pointer !important;
}

/* Textarea */
#gform_6 textarea {
  resize: none !important;
  min-height: 120px !important;
}

/* ── Submit button ─────────────────────────────────────────────────────────── */

#gform_submit_button_6,
#gform_6 .gform_footer input[type="submit"],
#gform_6 .gform-footer input[type="submit"] {
  display: block !important;
  width: 100% !important;
  padding: 0.875rem 2rem !important;
  background-color: hsl(var(--foreground)) !important;
  color: hsl(var(--background)) !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  cursor: pointer !important;
  transition: background-color 0.3s ease !important;
  font-family: inherit !important;
}

#gform_submit_button_6:hover,
#gform_6 .gform_footer input[type="submit"]:hover,
#gform_6 .gform-footer input[type="submit"]:hover {
  background-color: hsl(var(--foreground) / 0.85) !important;
}

/* Footer spacing — matches React's pt-2 on submit wrapper */
#gform_6 .gform_footer,
#gform_6 .gform-footer {
  margin-top: 0.5rem;
  padding-top: 0;
}

/* ── Validation ────────────────────────────────────────────────────────────── */

#gform_wrapper_6 .gfield_error input,
#gform_wrapper_6 .gfield_error textarea,
#gform_wrapper_6 .gfield_error select {
  border-color: hsl(0 65% 55%) !important;
}

#gform_wrapper_6 .validation_message,
#gform_wrapper_6 .gfield_error .gfield_description {
  font-size: 0.75rem;
  color: hsl(0 65% 55%);
  margin-top: 0.375rem;
}

#gform_wrapper_6 .validation_error {
  display: none;
}

/* Required asterisk */
#gform_wrapper_6 .gfield_required {
  color: hsl(var(--accent));
  margin-left: 2px;
}