/*
 * Additions layered on top of the vendored theme CSS (which is kept byte-identical
 * to the original). These only match states that do not exist on a pristine page,
 * so the default rendering is unchanged.
 */

/* The theme forces a grey field border with !important, so an invalid field looked
   identical to a valid one - only the tip text was red. */
.wpcf7-form .wpcf7-not-valid,
.wpcf7-form input.wpcf7-not-valid,
.wpcf7-form textarea.wpcf7-not-valid,
.wpcf7-form .wpcf7-not-valid input {
  border-color: #dc3232 !important;
}

.wpcf7-form input.wpcf7-not-valid:focus,
.wpcf7-form textarea.wpcf7-not-valid:focus {
  outline: 2px solid rgba(220, 50, 50, 0.35);
  outline-offset: 1px;
}

/* Keep the inline tip tight under its field rather than inheriting paragraph spacing. */
.wpcf7-form .wpcf7-not-valid-tip {
  margin-top: 4px;
  line-height: 1.35;
}

/* The submit button is disabled while a submission is in flight. */
.wpcf7-form .wpcf7-submit[disabled] {
  opacity: 0.65;
  cursor: progress;
}

/*
 * The child theme paints the mobile menu button white:
 *   .menu-button-container #primary-mobile-menu .dropdown-icon.open .svg-icon path { fill: #fff }
 * The header is white, so the hamburger was invisible - mobile visitors had no
 * discoverable way into the menu. Inherit the button's own colour instead, which
 * is what the theme does for every other .svg-icon.
 */
.menu-button-container #primary-mobile-menu .dropdown-icon.open .svg-icon path {
  fill: currentColor;
}

/*
 * In the open mobile menu the panel is dark slate rgb(67,87,113) but the theme
 * keeps the desktop active-item colour rgb(22,41,112) - roughly 1.8:1 contrast,
 * so the current page was unreadable while every other item was white. Mark it
 * with white + an underline instead (7.5:1). Scoped to the mobile panel so the
 * desktop navigation is untouched. The theme sets its colour with !important
 * (.primary-navigation > div > .menu-wrapper .current-menu-item a), hence the
 * matching !important here.
 */
@media (max-width: 991px) {
  .primary-navigation-open .primary-navigation > div > .menu-wrapper .current-menu-item a,
  .primary-navigation-open .primary-navigation > div > .menu-wrapper .current_page_item a {
    color: #fff !important;
    text-decoration: underline;
    text-underline-offset: 4px;
  }
}
