/* ------------------------------------------------------------------
   Post-migration fixes. Kept separate from the theme stylesheet so
   what we changed is obvious.
   ------------------------------------------------------------------ */

/* Header submenu ("Why Wonderkidz" -> FAQs, Open a centre, Centres).
   The theme sets .navigation > li > ul { display: none } and never
   provides a CSS rule to reveal it — it relied entirely on a jQuery
   .hover() handler in custom.js. That handler calls slideToggle() on
   BOTH mouseenter and mouseleave, so interrupted animations can invert
   its state and leave the menu stuck closed. The result was that the
   FAQ page had no reliable route from the navigation.

   !important is needed because jQuery writes an inline display style.  */
.navigation > li:hover > ul,
.navigation > li:focus-within > ul {
  display: block !important;
}

/* Keyboard users should get the same affordance as mouse users. */
.navigation > li > ul > li > a:focus {
  outline: 2px solid #fc7013;
  outline-offset: -2px;
}