/*
 * Language switcher: SVG flags in a dropdown.
 *
 * WPML shipped one raster flag (a ~20px png) that jumped straight to the other
 * language. The flags are inline SVG now — crisp on any screen, no extra request —
 * and they sit in a dropdown that names both languages and marks the current one,
 * so it is clear what you are switching from as well as to.
 */

.mvh-lang {
  position: relative;
}

.mvh-flag {
  width: 22px;
  height: 15px;
  flex: 0 0 auto;
  border-radius: 2px;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.12);
  display: block;
}

/* ------------------------------------------------------------------ trigger */

.mvh-lang-toggle {
  display: flex !important;
  align-items: center;
  gap: 7px;
  background: none;
  border: 0;
  padding: 0;
  margin: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
  line-height: 1;
}

.mvh-lang-code {
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.mvh-lang-caret {
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 4px solid currentColor;
  opacity: 0.55;
  transition: transform 0.18s ease;
}

.mvh-lang.is-open .mvh-lang-caret {
  transform: rotate(180deg);
}

/* ------------------------------------------------------------------- menu */

.mvh-lang-menu {
  list-style: none;
  margin: 0;
  padding: 6px 0;
  background: #fff;
  border: 1px solid #e8e8e8;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
  min-width: 168px;
}

.mvh-lang-menu li {
  margin: 0;
  padding: 0;
  border: 0 !important;
  list-style: none;
}

.mvh-lang-menu a {
  display: flex !important;
  align-items: center;
  gap: 10px;
  padding: 9px 16px !important;
  font-size: 13px !important;
  line-height: 1.3 !important;
  color: #303030 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  white-space: nowrap;
  background: none !important;
}

.mvh-lang-menu a:hover,
.mvh-lang-menu a:focus-visible {
  background: #f5f5f5 !important;
  color: #000 !important;
}

.mvh-lang-menu a.is-current {
  font-weight: 600;
}

/* A check mark rather than colour alone, so it does not depend on seeing a tint. */
.mvh-lang-menu a.is-current::after {
  content: "\2713";
  margin-left: auto;
  padding-left: 10px;
  opacity: 0.5;
}

/* --------------------------------------------------- desktop: floating panel */

@media only screen and (min-width: 1001px) {
  .mvh-lang-menu {
    position: absolute;
    top: 100%;
    right: 0;
    z-index: 1400;
    display: none;
  }

  .mvh-lang.is-open .mvh-lang-menu {
    display: block;
  }

  /* The menu is a row of floated <li>, each as tall as its link's line-height.
     `display:flex` here turned this one into a block that broke out of that row and
     hung above it. Keep it a plain floated item and give the button the same height
     as its neighbours, so the flag sits on the line with Contact.

     75px and 50px are the theme's own menu heights, before and after the header
     sticks; they come from the generated style_dynamic.css. */
  .main_menu > ul > li.mvh-lang {
    display: block;
  }

  .main_menu > ul > li.mvh-lang .mvh-lang-toggle {
    height: 75px;
    padding: 0 17px;
  }

  .page_header.sticky .main_menu > ul > li.mvh-lang .mvh-lang-toggle,
  .page_header.stick.sticky .main_menu > ul > li.mvh-lang .mvh-lang-toggle {
    height: 50px;
  }
}

/* ------------------------------------------- mobile: expands inside the panel */

@media only screen and (max-width: 1000px) {
  nav.mobile_menu > ul > li.mvh-lang {
    padding: 0 !important;
  }

  .mvh-lang-toggle {
    width: 100%;
    padding: 15px 26px !important;
    justify-content: flex-start;
    color: #303030;
  }

  .mvh-lang-caret { margin-left: auto; }

  .mvh-lang-menu {
    /* Bridge hides every nested <ul> inside the mobile menu, on the assumption that
       it is a collapsed submenu. This one is ours and does its own collapsing. */
    display: block !important;
    border: 0;
    box-shadow: none;
    background: #fafafa;
    padding: 0;
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.24s ease;
  }

  .mvh-lang.is-open .mvh-lang-menu {
    max-height: 140px;
  }

  .mvh-lang-menu a {
    padding: 13px 26px 13px 34px !important;
    font-size: 14px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mvh-lang-caret,
  .mvh-lang-menu { transition: none !important; }
}
