/* Shared Select2 theme for all Select2 controls */
/* Keep Select2 control height aligned with Bootstrap form controls */
:root {
  --select2-control-height: calc(2.25rem + 2px);
}

select.js-select2-single + .select2-container,
select.js-select2-multi + .select2-container,
select.locatorServiceSelect + .select2-container {
  width: 100% !important;
}

.locatorFiltersWrap .select2-container {
  width: 100% !important;
}

select.js-select2-multi + .select2-container .select2-selection--multiple,
select.locatorServiceSelect + .select2-container .select2-selection--multiple {
  background: var(--app-surface-2) !important;
  border: 1px solid var(--app-border-strong) !important;
  border-radius: 0 !important;
  min-height: var(--select2-control-height) !important;
}

select.js-select2-single + .select2-container .select2-selection--single {
  background: var(--app-surface-2) !important;
  border: 1px solid var(--app-border-strong) !important;
  min-height: var(--select2-control-height) !important;
  height: var(--select2-control-height) !important;
  display: flex !important;
  align-items: center !important;
  border-radius: 0 !important;
}

select.js-select2-multi
  + .select2-container.select2-container--focus
  .select2-selection--multiple,
select.js-select2-single
  + .select2-container.select2-container--focus
  .select2-selection--single,
select.locatorServiceSelect
  + .select2-container.select2-container--focus
  .select2-selection--multiple {
  border-color: var(--app-accent) !important;
  box-shadow: 0 0 0 3px rgba(124, 180, 255, 0.2) !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  color: var(--app-text-secondary) !important;
  line-height: calc(2.25rem) !important;
  display: flex !important;
  align-items: center !important;
  height: calc(2.25rem) !important;
  padding-left: 0.75rem !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: calc(2.25rem) !important;
  right: 0.35rem !important;
}

.select2-container--default .select2-selection--single .select2-selection__placeholder {
  display: none !important;
  color: transparent !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: var(--app-text-muted) transparent transparent transparent !important;
}

.select2-container .select2-selection--multiple .select2-selection__rendered {
  flex-wrap: wrap !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  white-space: normal !important;
  gap: 0.18rem !important;
  padding: 0.14rem 0.26rem !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
  background: var(--app-chip-bg) !important;
  border: 1px solid var(--app-chip-border) !important;
  color: var(--app-text-secondary) !important;
  margin-top: 0 !important;
  line-height: 1.05rem !important;
  font-size: 0.72rem !important;
  max-width: none !important;
  white-space: normal !important;
  border-radius: 0 !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice:first-of-type {
  margin-left: 0;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
  color: var(--app-chip-remove) !important;
  border-right: 1px solid var(--app-chip-border) !important;
  font-size: 1rem !important;
  border-radius: 0 !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
  color: var(--app-chip-remove-hover) !important;
  background-color: rgba(255, 0, 0, 0.5) !important;
}

.select2-dropdown {
  background: var(--app-surface-2) !important;
  border: 1px solid var(--app-border-strong) !important;
}

.select2-container--default .select2-results__option {
  color: var(--app-text-secondary) !important;
  padding: 0.3rem 0.42rem !important;
  font-size: 0.78rem !important;
}

.select2-container--default .select2-results__option--selected {
  background: var(--app-surface-1) !important;
  color: var(--app-text-secondary) !important;
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
  background: var(--app-accent-strong) !important;
  color: var(--app-text-primary) !important;
}

.select2-search--dropdown .select2-search__field {
  background: var(--app-surface-2) !important;
  color: var(--app-text-secondary) !important;
  border: 1px solid var(--app-border-strong) !important;
}

.select2-search--dropdown .select2-search__field::placeholder {
  color: transparent !important;
}

.select2-suggest-option {
  border-top: 1px solid var(--app-border) !important;
  color: var(--app-accent) !important;
  font-weight: 600 !important;
}

.select2-container--default .select2-search--inline .select2-search__field{
  border: 0 !important;
}

.select2-suggest-option-label::before {
  content: "+ " !important;
}

.modal .nav-tabs {
  border-bottom: 1px solid var(--app-border) !important;
}

.modal .nav-tabs .nav-link {
  background: var(--app-surface-1) !important;
  border: 1px solid var(--app-border) !important;
  border-bottom: 0 !important;
  border-radius: 0 !important;
  text-transform: uppercase !important;
  font-size: 0.78rem !important;
  letter-spacing: 0.04em !important;
}

.modal .nav-tabs .nav-link:hover {
  background: var(--app-surface-hover) !important;
}

.modal .nav-tabs .nav-link.active {
  background: var(--app-surface-0) !important;
  border-color: var(--app-border-strong) !important;
}

.modal .js-suggestion-react.is-active {
  color: var(--app-text-primary) !important;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--app-text-primary) 18%, transparent) !important;
}

.modal .js-suggestion-react.is-active[data-value="1"] {
  background: var(--bs-success) !important;
  border-color: var(--bs-success) !important;
}

.modal .js-suggestion-react.is-active[data-value="-1"] {
  background: var(--bs-danger) !important;
  border-color: var(--bs-danger) !important;
}

.modal .suggestionVoteSplit {
  display: flex !important;
  width: 100% !important;
  gap: 0 !important;
}

.modal td.suggestionVoteCell {
  padding: 0 !important;
}

.modal .suggestionVoteSplit .suggestionVoteButton {
  flex: 1 1 50% !important;
  width: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.35rem !important;
  border-radius: 0 !important;
}

.modal .suggestionVoteSplit .suggestionVoteButton:first-child {
  height: 35px;
}

.modal .suggestionVoteSplit .suggestionVoteButton:last-child {
  height: 35px;
}

.languageSelect2Option {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.4rem !important;
}

.languageSelect2Flag {
  width: 18px !important;
  height: 18px !important;
  object-fit: cover !important;
  border-radius: 2px !important;
}
