/* Select2 Custom Premium Styling */
.select2-container--default .select2-selection--single {
  border-radius: 0.375rem;
  border: 1px solid #d9dee3;
  min-height: 3.125rem; /* ~50px to match premium theme form controls */
  padding: 0.75rem 0.875rem;
  background-color: #fff;
  display: flex;
  align-items: center;
  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.select2-container--default .select2-selection--single:focus {
  border-color: #696cff;
  outline: 0;
  box-shadow: 0 0 0.25rem 0.05rem rgba(105, 108, 255, 0.1);
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: inherit;
  padding-left: 0;
  color: #435971;
  width: 100%;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 100%;
  right: 0.5rem;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: #b4bdc6 transparent transparent transparent;
  border-width: 5px 4px 0 4px;
}

.select2-dropdown {
  border: 0;
  box-shadow: 0 0.25rem 1rem rgba(161, 172, 184, 0.45);
  border-radius: 0.375rem;
  z-index: 10001 !important;
  /* Ensure it's above modals and offcanvas */
}


.select2-container--default .select2-search--dropdown .select2-search__field {
  border: 1px solid #d9dee3;
  border-radius: 0.375rem;
  padding: 0.4375rem 0.875rem;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background-color: rgba(105, 108, 255, 0.08) !important;
  color: #696cff !important;
}

.select2-results__option {
  padding: 0.5rem 0.875rem;
  font-size: 0.9375rem;
}

/* Dark Mode Support */
[data-bs-theme="dark"] .select2-container--default .select2-selection--single {
  background-color: #2b2c40;
  border-color: #444564;
}

[data-bs-theme="dark"] .select2-container--default .select2-selection--single .select2-selection__rendered {
  color: #cbcbe2;
}

[data-bs-theme="dark"] .select2-dropdown {
  background-color: #2b2c40;
  box-shadow: 0 0.25rem 1rem rgba(0, 0, 0, 0.4);
}

[data-bs-theme="dark"] .select2-container--default .select2-search--dropdown .select2-search__field {
  background-color: #232333;
  border-color: #444564;
  color: #cbcbe2;
}

[data-bs-theme="dark"] .select2-results__option[aria-selected="true"] {
  background-color: rgba(105, 108, 255, 0.16);
  color: #fff;
}

[data-bs-theme="dark"] .select2-container--default .select2-results__option--highlighted[aria-selected] {
  background-color: rgba(105, 108, 255, 0.16) !important;
  color: #696cff !important;
}



/* Placeholder visibility */
.select2-container--default .select2-selection--single .select2-selection__placeholder {
  color: #a1acb8;
}

/* Fix for unwanted scrollbars and layout shift */
.select2-container {
  width: 100% !important;
}

body.select2-open {
  overflow: hidden !important;
}



.select2-container--open .select2-dropdown {
  z-index: 10001 !important;
}

.select2-container--open .select2-dropdown--below {
  border-top: none;
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.select2-container--open .select2-dropdown--above {
  border-bottom: none;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

/* Ensure the search field implementation doesn't push height too much */
/* Only apply flex when displayed, to not override Select2's internal display:none */
.select2-container--open .select2-dropdown {
  max-height: 400px;
  display: flex !important;
  flex-direction: column;
  overflow: hidden;
}

.select2-results__options {
  max-height: 320px !important;
  overflow-y: auto;
  flex-grow: 1;
}

.select2-search--dropdown {
  flex-shrink: 0;
}


/* Loading and No Results state consistency */
.select2-results__option--load-more,
.select2-results__option--loading {
  padding: 0.75rem 0.875rem;
  color: #a1acb8;
  font-style: italic;
  text-align: center;
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Ensure the offcanvas doesn't hide the dropdown */
.offcanvas .select2-container {
  z-index: 10001;
}

/* Prevent layout shift in form-floating */
.form-floating > .select2-container {
  margin-top: -0.25rem;
}