/* Select2 "darujme-multiselect" theme — scoped to .darujme-multiselect so it
   cannot affect the Django admin or any other select2 instances on the page.
   The hidden native <select> keeps its .registration-input class; select2
   inserts .select2-container as the immediate next DOM sibling, so the
   adjacent-sibling invalid rule works. */

.darujme-multiselect .select2-container--darujme-multiselect {
  display: block;
}

.darujme-multiselect .select2-container--darujme-multiselect .select2-selection--multiple {
  border: 2px solid #D1E4FF;
  border-radius: 25px;
  padding: 6px 12px;
  min-height: 30px;
  font-size: 16px;
  color: var(--darujme-tmava);
  transition: border-color .3s ease;
}

.darujme-multiselect .select2-container--darujme-multiselect.select2-container--focus .select2-selection,
.darujme-multiselect .select2-container--darujme-multiselect.select2-container--open .select2-selection {
  border-color: var(--darujme-fialova);
}

/* Chips */
.darujme-multiselect .select2-container--darujme-multiselect .select2-selection__choice {
  background: #D1E4FF;
  border: none;
  border-radius: 16px;
  padding: 2px 8px;
  margin: 4px 4px 0 0;
  color: var(--darujme-tmava);
}

.darujme-multiselect .select2-container--darujme-multiselect .select2-selection__choice__remove {
  margin-right: 6px;
  cursor: pointer;
}

.darujme-multiselect .select2-container--darujme-multiselect .select2-selection__choice__remove:hover {
  color: var(--darujme-malinova);
}

/* Placeholder / search field */
.darujme-multiselect .select2-container--darujme-multiselect .select2-search__field {
  color: var(--darujme-tmava);
  width: 100% !important;
  outline: none;
}

.darujme-multiselect .select2-container--darujme-multiselect .select2-search__field::placeholder {
  color: #999;
}

/* Open dropdown panel (appended outside .darujme-multiselect, scoped by theme) */
.select2-container--darujme-multiselect .select2-dropdown {
  border: 2px solid #D1E4FF;
  border-radius: 16px;
  overflow: hidden;
}

.select2-container--darujme-multiselect .select2-results__options {
  max-height: 240px;
  overflow-y: auto;
  overflow-x: hidden;
}

.select2-container--darujme-multiselect .select2-results__option--highlighted {
  background: var(--darujme-modra);
  color: #fff;
}

/* Invalid mirror: native select keeps .registration-input, select2 container
   is its immediate next sibling. */
.darujme-multiselect select.registration-input.is-invalid + .select2-container--darujme-multiselect .select2-selection {
  border-color: var(--darujme-malinova) !important;
}

.darujme-multiselect .select2-container--darujme-multiselect ul.select2-selection__rendered {
  margin-bottom: 0;
}
