.wuim-searchable-select,
.wss-popup {
  --wss-bg:#fff;
  --wss-text:#263247;
  --wss-muted:#697386;
  --wss-border:#dfe3ec;
  --wss-hover:#f6f8fc;
  --wss-accent:#635bff;
  --wss-selected:#f0eeff;
  --wss-selected-text:#5148d6;
  box-sizing:border-box;
  font-family:inherit;
  font-size:13px;
  line-height:1.4;
  color:var(--wss-text);
}
.wuim-searchable-select.is-dark,
.wss-popup.is-dark {
  --wss-bg:#101827;
  --wss-text:#e8edf6;
  --wss-muted:#9daac0;
  --wss-border:#344258;
  --wss-hover:#192438;
  --wss-accent:#938aff;
  --wss-selected:#2d2850;
  --wss-selected-text:#cec9ff;
}
.wuim-searchable-select { display:block; position:relative; min-width:0; width:100%; margin:0; padding:0; }
.wuim-searchable-select.is-native { display:contents; }
/* Hide the native select before the enhancer wraps it, so a native multi-select
   listbox never flashes on page load while the deferred script is still loading. */
select[data-searchable-select]:not([data-searchable-enabled="false"]) {
  position:absolute!important;
  width:1px!important;
  min-width:0!important;
  height:1px!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  overflow:hidden!important;
  clip:rect(0 0 0 0)!important;
  clip-path:inset(50%)!important;
  white-space:nowrap!important;
}
/* The original select remains in the form, including its options, value and validity. */
.wuim-searchable-select > select.wss-native {
  position:absolute!important;
  width:1px!important;
  min-width:0!important;
  height:1px!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  overflow:hidden!important;
  clip:rect(0 0 0 0)!important;
  clip-path:inset(50%)!important;
  white-space:nowrap!important;
}
.wuim-searchable-select > .wss-trigger {
  appearance:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  width:100%;
  min-width:0;
  min-height:38px;
  margin:0;
  padding:8px 11px;
  border:1px solid var(--wss-border);
  border-radius:7px;
  background:var(--wss-bg);
  background-image:none;
  color:var(--wss-text);
  font:inherit;
  font-weight:450;
  text-align:left;
  box-shadow:0 1px 2px rgb(15 23 42 / 3%);
  cursor:pointer;
  transform:none;
  filter:none;
}
.wuim-searchable-select > .wss-trigger:hover:not(:disabled) { background:var(--wss-hover); border-color:var(--wss-accent); transform:none; }
.wuim-searchable-select > .wss-trigger:focus-visible,
.wuim-searchable-select.is-open > .wss-trigger { outline:2px solid var(--wss-accent); outline-offset:2px; }
.wuim-searchable-select > .wss-trigger[aria-invalid="true"] { border-color:#d92d20; }
.wuim-searchable-select > .wss-trigger:disabled { opacity:.55; cursor:not-allowed; }
.wuim-searchable-select > .wss-trigger.is-placeholder { color:var(--wss-muted); }
.wss-value { display:block; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.wss-chevron { flex:0 0 7px; width:7px; height:7px; margin:0 2px 3px 0; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:rotate(45deg); opacity:.7; }
.wuim-searchable-select.is-open .wss-chevron { transform:rotate(225deg); margin-top:5px; }
.wss-popup {
  position:fixed!important;
  z-index:2147483000!important;
  inset:auto;
  display:flex;
  flex-direction:column;
  width:280px;
  min-width:0;
  max-width:calc(100vw - 16px);
  margin:0!important;
  padding:0;
  overflow:hidden;
  border:1px solid var(--wss-border);
  border-radius:10px;
  background:var(--wss-bg);
  color:var(--wss-text);
  box-shadow:0 12px 36px rgb(15 23 42 / 18%),0 2px 8px rgb(15 23 42 / 7%);
}
.wss-popup *, .wuim-searchable-select * { box-sizing:border-box; }
.wss-popup[hidden], .wuim-searchable-select > .wss-trigger[hidden], .wss-popup [hidden] { display:none!important; }
.wss-popup::backdrop { background:transparent; pointer-events:none; }
.wss-search-wrap { flex:0 0 auto; padding:9px; border-bottom:1px solid var(--wss-border); }
.wss-popup .wss-search {
  appearance:none;
  display:block;
  width:100%;
  min-width:0;
  height:36px;
  min-height:36px;
  margin:0;
  padding:7px 10px;
  border:1px solid var(--wss-border);
  border-radius:6px;
  background:var(--wss-bg);
  color:var(--wss-text);
  font:inherit;
  font-weight:450;
  box-shadow:none;
}
.wss-popup .wss-search::placeholder { color:var(--wss-muted); opacity:1; }
.wss-popup .wss-search:focus { outline:2px solid var(--wss-accent); outline-offset:0; border-color:transparent; }
.wss-options { display:block; flex:1 1 auto; min-height:0; padding:5px; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; }
.wss-popup .wss-option {
  appearance:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  width:100%;
  min-width:0;
  min-height:36px;
  height:auto;
  margin:0;
  padding:8px 9px;
  border:0;
  border-radius:6px;
  background:transparent;
  color:var(--wss-text);
  font:inherit;
  font-weight:450;
  line-height:1.4;
  text-align:left;
  white-space:normal;
  box-shadow:none;
  cursor:pointer;
  transform:none;
  filter:none;
}
.wss-popup .wss-option:not(:disabled):hover,
.wss-popup .wss-option.is-active:not(:disabled) { background:var(--wss-hover); transform:none; }
.wss-popup .wss-option[aria-selected="true"] { background:var(--wss-selected); color:var(--wss-selected-text); }
.wss-popup .wss-option[aria-selected="true"].is-active { box-shadow:inset 0 0 0 1px var(--wss-accent); }
.wss-popup .wss-option:disabled { opacity:.5; cursor:not-allowed; }
.wss-option-text { min-width:0; overflow-wrap:anywhere; }
.wss-check { flex:0 0 14px; width:14px; color:var(--wss-accent); font-size:13px; font-weight:700; visibility:hidden; }
.wss-option[aria-selected="true"] .wss-check { visibility:visible; }
.wss-empty { flex:0 0 auto; padding:16px 12px; color:var(--wss-muted); text-align:center; font-size:12px; }
@media(max-width:640px) {
  .wuim-searchable-select > .wss-trigger { min-height:40px; }
  .wss-popup .wss-search { height:40px; min-height:40px; font-size:16px; }
  .wss-popup .wss-option { min-height:40px; padding:9px; }
}