.desktop-language .language-menu {
  inset-inline-end: auto;
  right: auto;
  left: 50%;
  width: min(410px, calc(100vw - 24px));
  max-height: min(520px, calc(100vh - 150px));
  transform: translateX(-50%);
  overscroll-behavior: contain;
}

.mobile-language .language-menu {
  transform: none;
}

.language-flag {
  width: 24px;
  height: 18px;
  flex: 0 0 24px;
  overflow: hidden;
  border-radius: 2px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  box-shadow: 0 0 0 1px rgba(10, 15, 24, 0.12);
  color: transparent;
  font-size: 0 !important;
}

.language-menu button:nth-child(1) .language-flag,
html[lang="ar"] .language-trigger .language-flag {
  background-image: url("./flags/iq.svg");
}

.language-menu button:nth-child(3) .language-flag,
html[lang="ku"] .language-trigger .language-flag {
  background-image: url("./flags/ku.png");
}

.language-menu button:nth-child(2) .language-flag,
html[lang="en"] .language-trigger .language-flag {
  background-image: url("./flags/en.png");
}

.language-menu button:nth-child(4) .language-flag,
html[lang="zh"] .language-trigger .language-flag {
  background-image: url("./flags/cn.svg");
}

.language-menu button:nth-child(5) .language-flag,
html[lang="ko"] .language-trigger .language-flag {
  background-image: url("./flags/kr.svg");
}

.language-menu button:nth-child(6) .language-flag,
html[lang="ja"] .language-trigger .language-flag {
  background-image: url("./flags/jp.svg");
}

.language-menu button:nth-child(7) .language-flag,
html[lang="tr"] .language-trigger .language-flag {
  background-image: url("./flags/tr.svg");
}

.language-menu button:nth-child(8) .language-flag,
html[lang="it"] .language-trigger .language-flag {
  background-image: url("./flags/it.svg");
}

.language-menu button:nth-child(9) .language-flag,
html[lang="fr"] .language-trigger .language-flag {
  background-image: url("./flags/fr.svg");
}

.language-menu button:nth-child(10) .language-flag,
html[lang="de"] .language-trigger .language-flag {
  background-image: url("./flags/de.svg");
}

.language-menu button:nth-child(11) .language-flag,
html[lang="es"] .language-trigger .language-flag {
  background-image: url("./flags/es.svg");
}

.language-menu button:nth-child(12) .language-flag,
html[lang="pt"] .language-trigger .language-flag {
  background-image: url("./flags/pt.svg");
}

.language-menu button:nth-child(13) .language-flag,
html[lang="ru"] .language-trigger .language-flag {
  background-image: url("./flags/ru.svg");
}

.language-menu button:nth-child(14) .language-flag,
html[lang="hi"] .language-trigger .language-flag {
  background-image: url("./flags/in.svg");
}

@media (max-width: 1480px) {
  .mobile-language .language-menu {
    inset-inline: auto;
    width: 100%;
    max-width: 100%;
  }
}

@media (max-width: 580px) {
  .language-menu {
    max-height: min(420px, calc(100vh - 180px));
  }
}
