/* MINGYI UI; MIT flag assets from intl-tel-input 29.5.7, ../phone-country/SOURCE.json. */
body.mgs-site .mgs-request-phone .mgs-phone-picker {
  position: relative;
  display: block;
  flex: 0 0 72px;
  width: 72px;
  min-width: 0;
  height: 48px;
  z-index: 2;
}
body.mgs-site .mgs-phone-picker:has(.mgs-phone-country-popup:not([hidden])) { z-index: 30; }
body.mgs-site .mgs-request-phone select.mgs-phone-native { display: none !important; }
body.mgs-site .mgs-phone-picker .mgs-phone-country-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  width: 72px;
  min-width: 0;
  height: 48px;
  min-height: 0;
  padding: 0 8px;
  margin: 0;
  border: 0;
  border-right: 1px solid #ddd;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
  color: #222;
  cursor: pointer;
}
body.mgs-site .mgs-phone-picker .mgs-phone-country-button:hover { background: #e2e5e9; }
body.mgs-site .mgs-phone-picker .mgs-phone-country-button:disabled { cursor: default; opacity: .55; }
body.mgs-site .mgs-phone-picker .mgs-phone-country-arrow { width: 0; height: 0; border: 4px solid transparent; border-top-color: #444; transform: translateY(2px); }
body.mgs-site .mgs-phone-picker .mgs-phone-flag {
  display: inline-block;
  flex: 0 0 20px;
  width: 20px;
  height: 15px;
  padding: 0;
  margin: 0;
  background-image: url('../phone-country/flags.webp');
  background-repeat: no-repeat;
  background-size: 4880px 15px;
  box-shadow: 0 0 1px #aaa;
}
body.mgs-site .mgs-phone-picker .mgs-phone-flag-other { background: none; box-shadow: none; font: 600 20px/15px Arial, sans-serif; text-align: center; }
body.mgs-site .mgs-phone-picker .mgs-phone-country-popup {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100;
  box-sizing: border-box;
  width: 320px;
  max-width: calc(100vw - 24px);
  display: flex;
  flex-direction: column;
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: #fff;
  color: #222;
  box-shadow: none;
  text-align: left;
}
body.mgs-site .mgs-phone-picker .mgs-phone-country-popup[hidden] { display: none !important; }
body.mgs-site .mgs-phone-picker .mgs-phone-popup-up { top: auto; bottom: 0; }
body.mgs-site .mgs-phone-picker .mgs-phone-popup-up .mgs-phone-country-search { order: 2; }
body.mgs-site .mgs-phone-picker .mgs-phone-search-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
body.mgs-site .mgs-phone-picker input.mgs-phone-country-search {
  display: block;
  box-sizing: border-box;
  width: 100%;
  flex: 0 0 48px;
  height: 48px;
  min-height: 48px;
  min-width: 0;
  padding: 12px 16px;
  margin: 0;
  border: 1px solid #222;
  border-radius: 0;
  background: #eee;
  color: #222;
  box-shadow: none;
  font: 400 18px/22px Abel, Arial, sans-serif !important;
  letter-spacing: 1px;
}
body.mgs-site .mgs-phone-picker .mgs-phone-country-list {
  display: block;
  max-height: 150px;
  margin: 0;
  padding: 0;
  overflow-y: auto;
  border: 1px solid #222;
  border-top: 0;
  overscroll-behavior: contain;
  list-style: none;
}
body.mgs-site .mgs-phone-picker .mgs-phone-country-option {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  margin: 0;
  padding: 8px;
  border: 0;
  color: #222;
  background: #f6f6f6;
  font: 400 14px/18px Oswald, Arial, sans-serif;
  letter-spacing: normal;
  cursor: pointer;
}
body.mgs-site .mgs-phone-picker .mgs-phone-country-option:hover,
body.mgs-site .mgs-phone-picker .mgs-phone-country-option.is-active { background: var(--mgs-blue, #003087); color: #fff; }
body.mgs-site .mgs-phone-picker .mgs-phone-country-name { flex: 0 1 auto; min-width: 0; overflow-wrap: anywhere; }
body.mgs-site .mgs-phone-picker .mgs-phone-country-code { flex: 0 0 auto; margin-left: -4px; color: inherit; white-space: nowrap; }
body.mgs-site .mgs-phone-picker .mgs-phone-country-empty { padding: 8px; margin: 0; font: 400 16px/22px Abel, Arial, sans-serif; }
body.mgs-site .mgs-phone-picker :is(button, input):focus-visible { outline: 2px solid var(--mgs-blue, #003087); outline-offset: 2px; }
body.mgs-site .mgs-phone-picker input.mgs-phone-country-search:focus-visible { outline-offset: -2px; }
@media (min-resolution: 2dppx) { body.mgs-site .mgs-phone-picker .mgs-phone-flag:not(.mgs-phone-flag-other) { background-image: url('../phone-country/flags@2x.webp'); } }
