/* =============================================================
   Select2 → Station Owner Panel skin — same structure/reasoning as the
   Super Admin panel's ev-select2.init.css, re-skinned to this theme's own
   .vg-select/.vg-filter tokens instead of the admin theme's .select/
   .filter-select. select2.min.css loads first (vendored, untouched);
   this file only re-skins its surface.
   ============================================================= */

.select2-container--default .select2-selection--single {
  height: 42px;
  background: var(--vg-surface);
  border: 1px solid var(--vg-ink-200);
  border-radius: var(--vg-r-sm);
  display: flex;
  align-items: center;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
  color: var(--vg-ink-800);
  line-height: 40px;
  padding-left: 13px;
  /* Reserved space covers both the dropdown arrow AND an optional clear
     button so neither ever overlaps the selected text. */
  padding-right: 56px;
}
.select2-container--default .select2-selection--single .select2-selection__placeholder {
  color: var(--vg-ink-400);
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 40px;
  right: 8px;
}

/* Clear ("x") button — same absolute-positioned, centered, sized hit
   target as the admin theme's own fix, resolved against .select2-container
   (the only ancestor Select2 itself marks position:relative). */
.select2-container--default .select2-selection--single .select2-selection__clear {
  position: absolute;
  top: 50%;
  right: 34px;
  transform: translateY(-50%);
  float: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  margin: 0;
  padding: 0;
  border-radius: var(--vg-r-sm);
  font-size: 15px;
  font-weight: 400;
  line-height: 1;
  color: var(--vg-ink-400);
  transition: background .15s, color .15s;
}
.select2-container--default .select2-selection--single .select2-selection__clear:hover {
  background: var(--vg-ink-100);
  color: var(--vg-ink-900);
}

.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--single {
  border-color: var(--vg-focus-border);
  box-shadow: var(--vg-ring);
}

.select2-dropdown {
  background: var(--vg-surface);
  border: 1px solid var(--vg-ink-200);
  border-radius: var(--vg-r-sm);
  box-shadow: var(--vg-sh-lg);
  overflow: hidden;
  font-family: var(--vg-font);
}
.select2-container--default .select2-search--dropdown .select2-search__field {
  background: var(--vg-surface);
  border: 1px solid var(--vg-ink-200);
  border-radius: 6px;
  color: var(--vg-ink-800);
  padding: 6px 10px;
}
.select2-container--default .select2-results__option {
  color: var(--vg-ink-800);
  padding: 8px 12px;
  font-size: 13.5px;
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background: var(--vg-accent);
  color: var(--vg-on-accent);
}
.select2-container--default .select2-results__option[aria-selected="true"] {
  background: var(--vg-ink-050);
  color: var(--vg-ink-800);
}

/* .vg-filter's own compact (36px) toolbar-pill height */
.vg-filter.select2-hidden-accessible + .select2-container--default .select2-selection--single { height: 36px; }
.vg-filter.select2-hidden-accessible + .select2-container--default .select2-selection__rendered { line-height: 34px; font-size: 13px; font-weight: 500; }
.vg-filter.select2-hidden-accessible + .select2-container--default .select2-selection__arrow { height: 34px; }
.vg-table-toolbar .select2-container,
.vg-toolbar .select2-container { min-width: 150px; }

/* The theme's own .vg-select arrow icon is redundant once Select2 renders
   its own — dropping it only for elements Select2 has taken over. */
select.vg-select.select2-hidden-accessible { display: none; }
