/* JetFormBuilder form styling -- S157 (a11y: axe color-contrast, 24 nodes).
 *
 * PER elementor-patterns.md RULE 5: I confirmed no native setting satisfies this.
 * The four live forms are all the `jet-form-builder-form` Elementor widget whose
 * ENTIRE settings object is `{form_id}` -- it exposes no colour or typography
 * controls at all. JFB's own style controls live in `jet-style-manager`, which is
 * NOT an active plugin on this site (verified via `wp plugin list --status=active`).
 * So CSS is the documented last resort here, scoped per component, in the child
 * theme -- never a mu-plugin (Rule 3), never global.
 *
 * TWO DEFECTS, ONE CAUSE. Both are S154 fallout: swapping the Elementor Pro `form`
 * widget for `jet-form-builder-form` replaced the whole settings object, dropping
 * the styling AND the `bf-home-loop-form` CSS class the old design hung on.
 *
 *   1. Submit buttons (12 nodes: booking, edc, home, volunteer x 3vp)
 *      #ffffff on #f05b5b = 3.3:1, needs 4.5:1. The kit's global
 *      `.elementor-kit-194 button{background-color:#F05B5B}` paints every
 *      unstyled button. Fixed with the project's --bf-red-aa token (#c41e3a,
 *      5.92:1 white-on-red). Per visual-parity-protocol.md this brand-red ->
 *      AA-red substitution is an always-acceptable improvement, no approval
 *      needed, and it matches the existing precedent for the donate pill.
 *
 *   2. Home "Stay In The Loop" labels (12 nodes: 4 labels x 3vp)
 *      #2b312f on #0a5a8c = 1.8:1 -- the worst ratio on the site.
 *      NOT a colour mistake: home-stay-loop.css always intended the form to sit
 *      on a light-gray CARD (`.bf-home-loop-form{background:#ececec}`) with dark
 *      labels reading against it. But `.bf-home-loop-form` occurs ZERO times in
 *      the served HTML (verified) because S154 dropped the class, so the card
 *      never painted and the dark labels ended up directly on the navy section.
 *      The honest fix is to restore the intended card, not to recolour the text
 *      -- so the dark-on-light design the page was built for is what ships.
 *
 * Specificity note: `.elementor-kit-194 button` is (0,1,1) and the kit loads at
 * stylesheet position 22, while this file is enqueued after it as a child-theme
 * asset. The button rules below are (0,2,0)+ and still carry !important because
 * the kit's own declaration is what we are displacing on a shared element type.
 */

/* ---- 1. Submit buttons: AA-safe red on all four forms ------------------- */
.jet-form-builder button.jet-form-builder__action-button,
.jet-form-builder .jet-form-builder__action-button {
  background-color: var(--bf-red-aa, #c41e3a) !important;
  color: #ffffff !important;
}
.jet-form-builder button.jet-form-builder__action-button:hover,
.jet-form-builder .jet-form-builder__action-button:hover {
  background-color: var(--bf-red-aa-hover, #a01730) !important;
}
/* Keyboard focus must stay visible against the darker red. */
.jet-form-builder .jet-form-builder__action-button:focus-visible {
  outline: 3px solid #ffffff;
  outline-offset: 2px;
}

/* ---- 2. Home "Stay In The Loop": restore the light form card ------------
   Scoped to the home newsletter section (#97935e5 -> column 4d369d0 -> the JFB
   widget 7a9847e) so no other form inherits the card treatment. */
.elementor-element-7a9847e .jet-form-builder {
  background: #ececec;
  border-radius: 18px;
  padding: 30px 28px;
  max-width: 940px;
  margin: 0 auto;
}
/* Dark label text now reads against the light card (#2b312f on #ececec = 11.6:1)
   instead of against the navy section (1.8:1). */
.elementor-element-7a9847e .jet-form-builder__label-text {
  color: #2b312f;
  font-weight: 600;
}
/* The navy submit this section was designed with, kept distinct from the
   AA-red default above -- it reads 8.6:1 on the light card.
   SPECIFICITY: must out-specify the sitewide button rule above, which is
   `.jet-form-builder button.jet-form-builder__action-button` = (0,2,1). A
   two-class selector here would be (0,2,0) and LOSE despite being the more
   specific INTENT -- both carry !important, so the cascade is decided purely on
   specificity. Measured in-browser: the first attempt rendered AA-red, not navy.
   Repeating `.jet-form-builder` + the element tag takes this to (0,3,1). */
.elementor-element-7a9847e .jet-form-builder button.jet-form-builder__action-button,
.elementor-element-7a9847e .jet-form-builder .jet-form-builder__action-button {
  background-color: #0a3d62 !important;
  border-radius: 8px;
  font-weight: 700;
}
.elementor-element-7a9847e .jet-form-builder button.jet-form-builder__action-button:hover,
.elementor-element-7a9847e .jet-form-builder .jet-form-builder__action-button:hover {
  background-color: #08304d !important;
}
.elementor-element-7a9847e .jet-form-builder__action-button:focus-visible {
  outline: 3px solid #ffffff;
  outline-offset: 2px;
}