/**
 * Standalone open/close + alignment rules for the language switcher.
 *
 * The dropdown <ul> is wrapped in a ".mptf-weglot-dropdown" <div> (see
 * un_weglot.js) so it is never a direct child of the <li> - Superfish's JS
 * only acts on a menu item's direct child <ul>, so it can never find or
 * mutate this one, and open/close here is driven purely by :hover /
 * :focus-within below, independent of the Superfish plugin.
 */
#mptf-menu-weglot-switcher {
  position: relative;
}

/*
 * The icon is 24px tall, taller than a plain text line (~16px), which would
 * otherwise grow this anchor's box past the 48px height shared by every
 * other top-level item (2 * 1em padding + ~16px text line-height) and shift
 * the whole menu row. Shaving 4px off the top/bottom padding on this anchor
 * only exactly offsets that extra height, so this item stays 48px tall too.
 */
#mptf-menu-weglot-switcher > a {
  align-items: center;
  display: inline-flex;
  padding-bottom: calc(1em - 4px);
  padding-top: calc(1em - 4px);
}

#mptf-menu-weglot-switcher .mptf-weglot-icon {
  display: inline-flex;
  flex: 0 0 auto;
  height: 24px;
  margin-right: 8px;
  width: 24px;
}

#mptf-menu-weglot-switcher .mptf-weglot-icon svg {
  display: block;
  height: 100%;
  width: 100%;
}

#mptf-menu-weglot-switcher > .mptf-weglot-dropdown > ul {
  background-color: #fff;
  border: 0 none;
  left: auto;
  margin: 10px 0;
  opacity: 0;
  padding: 20px 0 20px 30px;
  right: 0;
  top: -9999px;
  transition: opacity 0.2s ease-in-out;
  visibility: hidden;
  width: 12em;
}

#mptf-menu-weglot-switcher:hover > .mptf-weglot-dropdown > ul,
#mptf-menu-weglot-switcher:focus-within > .mptf-weglot-dropdown > ul {
  opacity: 1;
  top: 2.5em;
  visibility: visible;
}

/* The currently-selected language listed in the dropdown: plain text, not a
   link - no hover effect, no pointer/hand cursor, just muted-gray text. */
#mptf-menu-weglot-switcher .mptf-weglot-current {
  color: #787878;
  cursor: default;
  display: block;
  padding: 1em 1.5em;
}
