/* ---------------------------------------------------------------------
 * Gravity Forms Orbital theme override — reskins all 5 forms (Contact +
 * 4 service Book Now forms) to the site's real brand values instead of
 * Orbital's own default blue color scheme.
 *
 * Values below are pulled from the theme's own real design system, not
 * invented: colors reuse the exact custom properties already defined in
 * amanigo.webflow.css's :root (--rad / --accent-color / --title-color /
 * --primary-color / --red / --green — the same tokens .primary-button,
 * headings, and body copy already use); fonts reuse the exact families
 * .text-field (Inter Tight, for field values) and .primary-button
 * (Satoshi Variable, for button text) already use; the border tone
 * (#ede7dc) is the same warm neutral the .service-card-modern /
 * .package-card-modern / .blog-card-modern card family already uses.
 *
 * Every rule below needs !important, and that's not a shortcut around
 * normal CSS practice here — it's required. Each individual Gravity
 * Forms instance injects its own inline <style id="#gform_wrapper_N">
 * block directly into the page, scoped to that form's own wrapper *id*
 * (specificity 1-0-0), setting every one of these same custom properties
 * to Orbital's own defaults. An id selector beats any class-based
 * selector regardless of specificity math, and that inline block prints
 * after this stylesheet regardless of enqueue order (it's part of the
 * page content, not <head>) — !important is the standard, correct tool
 * for overriding exactly this kind of external, per-instance inline
 * style a theme doesn't control the markup for.
 *
 * The full --gf-* property surface is enormous (400+ properties) because
 * most of it derives from a small set of seed tokens via internal
 * var(--x) fallback chains inside Gravity Forms' own framework CSS
 * (confirmed by reading gravity-forms-theme-framework.css directly —
 * e.g. --gf-ctrl-btn-bg-color-primary: var(--gf-color-primary)). Only
 * the seed tokens below need overriding; the rest of the framework's own
 * internal cascade does the work.
 * --------------------------------------------------------------------- */
.gform_wrapper {
  /* Brand color seeds */
  --gf-color-primary: var(--rad) !important;
  --gf-color-primary-rgb: 184, 134, 59 !important; /* var(--rad) as R,G,B — CSS can't decompose a hex custom property on its own */
  --gf-color-primary-contrast: var(--white) !important;
  --gf-color-primary-contrast-rgb: 255, 255, 255 !important;
  --gf-color-primary-darker: #a3762f !important; /* matches .primary-button:hover's exact real hover shade */
  --gf-color-primary-lighter: var(--accent-color) !important;

  --gf-color-secondary: var(--white) !important;
  --gf-color-secondary-contrast: var(--title-color) !important;

  --gf-color-danger: var(--red) !important;
  --gf-color-danger-rgb: 255, 0, 0 !important;
  --gf-color-danger-contrast: var(--white) !important;

  --gf-color-success: var(--green) !important;
  --gf-color-success-rgb: 31, 119, 27 !important; /* var(--green) as R,G,B */
  --gf-color-success-contrast: var(--white) !important;

  /* Input/select/textarea appearance */
  --gf-color-in-ctrl: var(--white) !important;
  --gf-color-in-ctrl-dark: #ede7dc !important; /* same warm-neutral border as the site's card family */
  --gf-color-in-ctrl-dark-lighter: #ede7dc !important;
  --gf-color-in-ctrl-dark-darker: var(--rad) !important; /* border on focus = brand gold */
  --gf-color-in-ctrl-contrast: var(--primary-color) !important; /* typed text color */
  --gf-color-in-ctrl-primary: var(--rad) !important;

  /* Typography — Inter Tight for field text/labels, matching the site's
     one existing real precedent for a styled input (.text-field) */
  --gf-font-family-base: var(--_font-famly---font-famaly--primary-font) !important;

  /* Radius — a smaller sibling of the site's 20px card-family radius */
  --gf-radius: 10px !important;
  --gf-ctrl-radius: 10px !important;
  --gf-ctrl-select-dropdown-radius: 10px !important;

  /* Required-field asterisk */
  --gf-ctrl-label-color-req: var(--red) !important;

  /* Field-level validation error state (a single field showing invalid) */
  --gf-ctrl-bg-color-error: var(--white) !important;
  --gf-ctrl-border-color-error: var(--red) !important;
  --gf-ctrl-color-error: var(--primary-color) !important;
  --gf-ctrl-desc-color-error: var(--red) !important;

  /* Validation summary (the error list shown at the top of the form) */
  --gf-form-validation-bg-color: #fff5f5 !important;
  --gf-form-validation-border-color: var(--red) !important;
  --gf-form-validation-color: var(--primary-color) !important;
  --gf-form-validation-heading-color: var(--red) !important;
  --gf-form-validation-summary-color: var(--red) !important;

  /* Submit button — should look like .primary-button: same font
     (Satoshi Variable, not the Inter Tight used for field text above),
     same brand-gold fill, same real hover shade, full pill shape */
  --gf-ctrl-btn-font-family: var(--_font-famly---font-famaly--seckendry-font) !important;
  --gf-ctrl-btn-radius: 100px !important;
  --gf-ctrl-btn-bg-color-primary: var(--rad) !important;
  --gf-ctrl-btn-color-primary: var(--white) !important;
  --gf-ctrl-btn-border-color-primary: var(--rad) !important;
  --gf-ctrl-btn-bg-color-hover-primary: #a3762f !important;
  --gf-ctrl-btn-border-color-hover-primary: #a3762f !important;
  --gf-ctrl-btn-bg-color-focus-primary: #a3762f !important;
  --gf-ctrl-btn-border-color-focus-primary: #a3762f !important;
  --gf-ctrl-btn-padding-x: 32px !important;
  --gf-ctrl-btn-padding-y: 16px !important;
}

/* Confirmation/success message. No dedicated --gf-* custom property
 * covers this container's own background/border, so it's styled
 * directly rather than through the token system above. */
.gform_confirmation_message {
  font-family: var(--_font-famly---font-famaly--seckendry-font);
  color: var(--primary-color);
  font-size: var(--_typography---paragraph--paragraph-l);
  line-height: var(--_font-famly---line-height--extra-extra-large);
  padding: 24px;
  background-color: var(--white);
  border: 1px solid var(--green);
  border-radius: 10px;
}

/* Known gap, not covered here: the date-picker calendar icon and the
 * number-field spinner icon are baked-in inline SVG data-URIs
 * (--gf-icon-ctrl-datepicker, --gf-icon-ctrl-number) with Orbital's blue
 * fill color hardcoded into the SVG itself, not a plain color property —
 * recoloring them means constructing new encoded SVG data-URIs, not a
 * simple override. Left at Orbital's default (a neutral blue-gray) since
 * none of the 5 forms were specified as needing this and it's a small,
 * self-contained follow-up if it's ever worth doing.
 */
