/* TomSelect Dark Mode Styles */

.dark .ts-control {
  background-color: rgb(31 41 55); /* gray-800 */
  border-color: rgb(75 85 99); /* gray-600 */
  color: rgb(243 244 246); /* gray-100 */
}

.dark .ts-control > input {
  color: rgb(243 244 246); /* gray-100 */
}

.dark .ts-control > input::placeholder {
  color: rgb(156 163 175); /* gray-400 */
}

.dark .disabled .ts-control {
  background-color: rgb(55 65 81); /* gray-700 */
}

.dark .ts-wrapper.multi .ts-control > div {
  background: rgb(55 65 81); /* gray-700 */
  color: rgb(229 231 235); /* gray-200 */
  border-color: rgb(75 85 99); /* gray-600 */
}

.dark .ts-wrapper.multi .ts-control > div.active {
  background: rgb(75 85 99); /* gray-600 */
  color: rgb(243 244 246); /* gray-100 */
  border-color: rgb(107 114 128); /* gray-500 */
}

.dark .ts-wrapper.multi.disabled .ts-control > div,
.dark .ts-wrapper.multi.disabled .ts-control > div.active {
  color: rgb(156 163 175); /* gray-400 */
  background: rgb(55 65 81); /* gray-700 */
  border-color: rgb(55 65 81); /* gray-700 */
}

.dark .ts-dropdown {
  background: rgb(31 41 55); /* gray-800 */
  border-color: rgb(75 85 99); /* gray-600 */
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.3), 0 2px 4px -2px rgba(0, 0, 0, 0.3);
}

.dark .ts-dropdown,
.dark .ts-control,
.dark .ts-control input {
  color: rgb(229 231 235); /* gray-200 */
}

.dark .ts-dropdown .optgroup-header {
  color: rgb(209 213 219); /* gray-300 */
  background: rgb(55 65 81); /* gray-700 */
}

.dark .ts-dropdown .active {
  background-color: rgb(55 65 81); /* gray-700 */
  color: rgb(243 244 246); /* gray-100 */
}

.dark .ts-dropdown .active.create {
  color: rgb(243 244 246); /* gray-100 */
}

.dark .ts-dropdown .create {
  color: rgb(156 163 175); /* gray-400 */
}

.dark .ts-dropdown [data-selectable] .highlight {
  background: rgba(99, 102, 241, 0.3); /* indigo highlight */
}

.dark .ts-dropdown .spinner::after {
  border-color: rgb(75 85 99) transparent rgb(75 85 99) transparent;
}

.dark .ts-wrapper .dropdown-header {
  border-bottom-color: rgb(75 85 99); /* gray-600 */
  background: rgb(55 65 81); /* gray-700 */
}

.dark .ts-wrapper .dropdown-header-close {
  color: rgb(209 213 219); /* gray-300 */
}

.dark .ts-wrapper .dropdown-header-close:hover {
  color: rgb(243 244 246); /* gray-100 */
}

.dark .plugin-dropdown_input.focus.dropdown-active .ts-control {
  border-color: rgb(75 85 99); /* gray-600 */
}

.dark .plugin-dropdown_input .dropdown-input {
  border-color: rgb(75 85 99); /* gray-600 */
  color: rgb(229 231 235); /* gray-200 */
}

.dark .ts-wrapper.plugin-remove_button .item .remove:hover {
  background: rgba(255, 255, 255, 0.1);
}

.dark .ts-wrapper.plugin-remove_button:not(.rtl) .item .remove {
  border-left-color: rgb(75 85 99); /* gray-600 */
}

.dark .ts-wrapper.plugin-remove_button:not(.rtl) .item.active .remove {
  border-left-color: rgb(107 114 128); /* gray-500 */
}

.dark .ts-wrapper.plugin-remove_button:not(.rtl).disabled .item .remove {
  border-left-color: rgb(55 65 81); /* gray-700 */
}

.dark .ts-wrapper.plugin-remove_button.rtl .item .remove {
  border-right-color: rgb(75 85 99); /* gray-600 */
}

.dark .ts-wrapper.plugin-remove_button.rtl .item.active .remove {
  border-right-color: rgb(107 114 128); /* gray-500 */
}

.dark .ts-wrapper.plugin-remove_button.rtl.disabled .item .remove {
  border-right-color: rgb(55 65 81); /* gray-700 */
}

.dark .ts-dropdown.plugin-optgroup_columns .optgroup {
  border-right-color: rgb(75 85 99); /* gray-600 */
}