/* ============================================
   Dark Theme Overrides for Third-Party Widgets
   Select2, SumoSelect, jQuery UI
   ============================================ */

/* === SELECT2 === */
.select2-container--default .select2-selection--single {
  background-color: var(--bg-tertiary);
  border-color: var(--border-secondary);
  color: var(--text-primary);
  height: 40px;
  border-radius: var(--radius-sm);
  transition: all var(--transition-normal);
}

.select2-container--default .select2-selection--single:hover {
  border-color: var(--accent-primary);
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  color: var(--text-primary);
  line-height: 38px;
}

.select2-container--default .select2-selection--single .select2-selection__placeholder {
  color: var(--text-muted);
}

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

.select2-dropdown {
  background-color: var(--bg-secondary);
  border-color: var(--border-secondary);
  box-shadow: var(--shadow-dropdown);
  border-radius: var(--radius-md);
  overflow: hidden;
}

.select2-container--default .select2-results__option {
  color: var(--text-primary);
  padding: 10px 14px;
  transition: background var(--transition-fast);
}

.select2-container--default .select2-results__option[aria-selected=true] {
  background-color: var(--bg-tertiary);
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
  background: var(--accent-gradient);
  color: white;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
  background: var(--bg-tertiary);
  color: var(--text-primary);
  border-color: var(--border-secondary);
  padding: 8px 12px;
  border-radius: var(--radius-sm);
}

.select2-container--default .select2-selection--multiple {
  background-color: var(--bg-tertiary);
  border-color: var(--border-secondary);
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
  background: var(--accent-gradient);
  border: none;
  color: white;
  border-radius: var(--radius-pill);
  padding: 2px 10px;
  font-weight: 600;
}

/* === SUMOSELECT === */
.SumoSelect > .CaptionCont {
  background-color: var(--bg-tertiary);
  border-color: var(--border-secondary);
  border-radius: var(--radius-sm);
  transition: all var(--transition-normal);
}

.SumoSelect > .CaptionCont > span {
  color: var(--text-primary);
}

.SumoSelect > .CaptionCont > span.placeholder {
  color: var(--text-muted);
}

.SumoSelect > .CaptionCont > label > i {
  border-color: var(--text-muted) transparent transparent transparent;
}

.SumoSelect > .optWrapper {
  background: var(--bg-secondary);
  border-color: var(--border-secondary);
  box-shadow: var(--shadow-dropdown);
  border-radius: 0 0 var(--radius-md) var(--radius-md);
}

.SumoSelect > .optWrapper > .options li.opt {
  border-bottom-color: var(--border-primary);
  color: var(--text-primary);
  padding: 10px 12px;
  transition: background var(--transition-fast);
}

.SumoSelect > .optWrapper > .options li.opt:hover {
  background-color: rgba(57, 255, 20, 0.1);
}

.SumoSelect > .optWrapper > .options li.opt.selected {
  background-color: var(--bg-tertiary);
}

.SumoSelect > .optWrapper > .options li.opt.sel {
  background-color: rgba(57, 255, 20, 0.15);
  color: var(--accent-primary-hover);
}

.SumoSelect:focus > .CaptionCont,
.SumoSelect:hover > .CaptionCont,
.SumoSelect.open > .CaptionCont {
  box-shadow: 0 0 0 3px var(--accent-primary-glow);
  border-color: var(--accent-primary);
}

.SumoSelect .search-txt {
  background: var(--bg-tertiary);
  color: var(--text-primary);
  border-bottom-color: var(--border-secondary);
}

.SumoSelect .no-match {
  color: var(--text-muted);
}

.SumoSelect > .optWrapper.multiple > .options li.opt span i {
  background-color: var(--bg-tertiary);
  border-color: var(--border-secondary);
  border-radius: var(--radius-sm);
}

.SumoSelect > .optWrapper.multiple > .options li.opt.selected span i {
  background: var(--accent-gradient);
  border-color: var(--accent-primary);
}

/* === JQUERY UI DATEPICKER (extra overrides beyond base CSS) === */
.ui-datepicker-header {
  background: transparent;
  border: none;
}

.ui-state-default {
  background: transparent;
  border: none;
  color: var(--text-primary);
}

.ui-state-hover {
  background: var(--accent-primary);
  color: white;
  border-radius: var(--radius-sm);
}