/* Quietwork 2026-10-29: the menu toggle is now a <button> (it was a <div>), keeping its id and
   class so the megamenu CSS and mobile-header.css still size and place it. This file only:
   - strips the browser's button look (border, background, font, colour) so it renders exactly as
     the old <div> did. Specificity is kept below the megamenu's own toggle rules
     (#jux_megamenucss3 .megamenu.noJS #css3-megaMenuToggle) so their sizes still win;
   - hides it on desktop. style.css hides it with "div.megaMenuToggle", which no longer matches,
     so the same rule is repeated for the button (same specificity, same place in the cascade);
   - gives it a visible keyboard focus ring, drawn inside the 48px box so nothing clips it. */

#jux_megamenucss3 button.megaMenuToggle {
   -webkit-appearance: none;
   appearance: none;
   border: 0;
   background: transparent;
   color: inherit;
   font: inherit;
   letter-spacing: inherit;
   line-height: inherit;
   text-align: left;
   cursor: pointer;
}

#jux_megamenucss3 .megamenu button.megaMenuToggle {
   display: none;
}

#jux_megamenucss3 button.megaMenuToggle:focus {
   outline: none;
}
#jux_megamenucss3 button.megaMenuToggle:focus-visible {
   outline: 3px solid #1a1a1a;
   outline-offset: -3px;
   box-shadow: inset 0 0 0 5px #f5cd07;
}