.esim-search {
  --esim-height: 40px;
  --esim-font-size: 18px;
  --esim-active: #5299e7;
  position: relative; width: 100%; max-width: 100%; min-width: 0;
  color: #424850; font-family: inherit; text-align: start; isolation: isolate;
}
.esim-search, .esim-search * { box-sizing: border-box; }
.esim-search [hidden] { display: none !important; }
.esim-search__field {
  display: flex; align-items: center; gap: 10px; height: var(--esim-height);
  padding: 0 10px; background: #fff; border: 1px solid #bdbdbd; border-radius: 4.5px;
}
.esim-search:focus-within .esim-search__field, .esim-search.is-open .esim-search__field { border-color: #383838; }
.esim-search.is-open { z-index: 1000; }
.esim-search.is-open .esim-search__field { border-bottom-color: transparent; border-radius: 4.5px 4.5px 0 0; }
.esim-search .esim-search__input {
  display: block; flex: 1; min-width: 0; width: 100%; height: 100%; margin: 0; padding: 0;
  border: 0; border-radius: 0; outline: none; box-shadow: none; background: transparent;
  color: #424850; font: inherit; font-size: var(--esim-font-size); line-height: 1.25;
  text-overflow: ellipsis; appearance: none;
}
.esim-search .esim-search__input:focus { outline: none; border: 0; box-shadow: none; background: transparent; }
.esim-search .esim-search__input::placeholder { color: #808489; opacity: 1; }
.esim-search__icon { flex: 0 0 16px; width: 16px; height: 16px; color: #bdbdbd; }
.esim-search .esim-search__clear {
  display: flex; align-items: center; justify-content: center; width: auto; max-height: 100%; padding: 0; margin-right: -10px;
  background: transparent; border: none !important; box-shadow: none; cursor: pointer;
}
.esim-search .esim-search__clear:hover { color: #424850; background: #f3f3f3; }
.esim-search .esim-search__clear:focus-visible { outline: 2px solid #225fa6; outline-offset: 1px; }
.esim-search__panel {
  position: absolute; inset-inline: 0; top: calc(var(--esim-height) - 1px);
  background: #fff; border: 1px solid #383838; border-top: 0; border-radius: 0 0 4.5px 4.5px;
  overflow: hidden;
}
.esim-search .esim-search__list {
  display: block; list-style: none; padding: 0; margin: 0;
  max-height: min(400px, 50vh); overflow-y: auto; overscroll-behavior: contain;
}
.esim-search .esim-search__list > li {
  list-style: none; margin: 0; padding: 10px; border: 0;
  color: #424850; font: inherit; font-size: var(--esim-font-size); line-height: 1.2;
  cursor: pointer; overflow-wrap: anywhere;
}
.esim-search .esim-search__list > li::before { content: none; }
.esim-search .esim-search__list > li[aria-selected="true"] { background: var(--esim-active); color: #202b38; }
.esim-search .esim-search__empty { margin: 0; padding: 18px; font-size: 16px; color: #424850; }
.esim-search .esim-search__sr {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
@media (forced-colors: active) {
  .esim-search .esim-search__list > li[aria-selected="true"] { outline: 2px solid Highlight; outline-offset: -2px; }
}