/* Select2 Elemis theme overrides */
.select2-container--elemistheme{display:block}

/* Make Select2 look like the native select: white background, same border, and down arrow */
.select2-container--elemistheme .select2-selection{
  width:100%;
  padding:.6rem 2rem .6rem 1rem; /* match native select */
  font-size:.75rem;
  font-weight:500;
  line-height:1.7;
  color:#959ca9; /* native select color */
  background-color:var(--bs-body-bg, #ffffff);
  -webkit-appearance:none;
  -moz-appearance:none;
  appearance:none;
  border:1px solid rgba(8, 60, 130, .07);
  border-radius:.4rem;
  box-shadow:0 0 1.25rem rgba(30, 34, 40, .04);
  height:auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  background-repeat:no-repeat;
  background-position:right .75rem center;
  background-size:20px 20px;
}
.select2-container--elemistheme .select2-selection__rendered{line-height:1.7;color:#959ca9;flex:1;text-align:left}

.select2-container--elemistheme .select2-selection__arrow{
  display:block;
  position:absolute;
  right:.75rem;
  top:50%;
  transform:translateY(-50%);
  width:20px;
  height:20px;
  pointer-events:none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'><polyline points='5,8 10,13 15,8' fill='none' stroke='%23959ca9' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-repeat:no-repeat;
  background-position:center;
  background-size:16px 16px;
}
/* remove default b triangle if present */
.select2-container--elemistheme .select2-selection__arrow b{display:none}

/* Force border and shadow same as native select in all visible states */
.select2-container--elemistheme .select2-selection,
.select2-container--elemistheme .select2-selection--single {
  border:1px solid rgba(8, 60, 130, .07);
  box-shadow:0 0 1.25rem rgba(30, 34, 40, .04);
  background-clip:padding-box;
}

.select2-container--elemistheme .select2-selection:focus,
.select2-container--elemistheme.select2-container--focus .select2-selection,
.select2-container--elemistheme.select2-container--open .select2-selection{
  border:1px solid rgba(8, 60, 130, .07);
  box-shadow:0 0 1.25rem rgba(30, 34, 40, .04);
}

.select2-container--elemistheme .select2-selection--single .select2-selection__rendered img{margin-right:.5rem;vertical-align:middle}

/* Ensure placeholder and selection text are left aligned and grey */
.select2-container--elemistheme .select2-selection__placeholder{color:#959ca9;text-align:left}
.select2-container--elemistheme .select2-selection__choice{color:#959ca9;text-align:left}
.select2-container--elemistheme.select2-container--open .select2-selection{border-bottom-left-radius:0;border-bottom-right-radius:0}
.select2-container--elemistheme .select2-dropdown{border:1px solid #e6e9ee;border-radius:.375rem;margin-top:2px}
.select2-container--elemistheme .select2-results__option--highlighted{background:#f3f6fa;color:#0b1221}
.select2-container--elemistheme .select2-results__option[aria-selected="true"]{background:#eef6ff;color:#0b1221}
.select2-container--elemistheme .select2-selection__clear{cursor:pointer}

/* Make select2 inherit the project's form-control styles when possible */
.select2-container--elemistheme .select2-search__field{
  padding:.25rem .5rem;
  margin:0;
  border:1px solid #959ca9; /* search input border color */
  border-radius:.25rem;
  color:#959ca9;
  background:transparent;
}
.select2-container--elemistheme .select2-search__field::placeholder{
  color:#959ca9;
  opacity:1;
}

/* Dark mode tweak: slight tint to differentiate */
body[data-bs-theme='dark'] .select2-container--elemistheme .select2-selection{
  background-color:rgba(255,255,255,0.03);
  color:inherit;
}