/* Custom Select2 Styles for Synth Theme */

/* Main container */
.select2-container {
  width: 100% !important;
}

/* Selection box */
.select2-container .select2-selection--single,
.select2-container .select2-selection--multiple,
.select2-container--classic .select2-selection--single,
.select2-container--classic .select2-selection--multiple {
  background-color: #121212 !important;
  border: 1px solid #2a2a2a !important;
  border-radius: 0.375rem !important;
  min-height: 42px !important;
}

/* Selection box when focused */
.select2-container--classic.select2-container--focus .select2-selection--single,
.select2-container--classic.select2-container--focus .select2-selection--multiple,
.select2-container--classic.select2-container--open .select2-selection--single,
.select2-container--classic.select2-container--open .select2-selection--multiple {
  border-color: #1e88e5 !important;
  box-shadow: 0 0 0 2px rgba(30, 136, 229, 0.25) !important;
}

/* Text color */
.select2-container .select2-selection--single .select2-selection__rendered,
.select2-container--classic .select2-selection--single .select2-selection__rendered {
  color: #ffffff !important;
  line-height: 42px !important;
  padding-left: 12px !important;
}

/* Dropdown arrow */
.select2-container .select2-selection--single .select2-selection__arrow,
.select2-container--classic .select2-selection--single .select2-selection__arrow {
  height: 42px !important;
}

/* Dropdown container */
.select2-container .select2-dropdown,
.select2-container--classic .select2-dropdown,
.select2-dropdown.synth-dropdown {
  background-color: #121212 !important;
  border: 1px solid #2a2a2a !important;
  border-radius: 0.375rem !important;
}

/* Search field */
.select2-container .select2-search--dropdown .select2-search__field,
.select2-container--classic .select2-search--dropdown .select2-search__field {
  background-color: #121212 !important;
  border: 1px solid #2a2a2a !important;
  color: #ffffff !important;
  border-radius: 0.25rem !important;
}

.select2-container .select2-search--dropdown .select2-search__field:focus,
.select2-container--classic .select2-search--dropdown .select2-search__field:focus {
  border-color: #1e88e5 !important;
  outline: none !important;
}

/* Results */
.select2-container .select2-results__option,
.select2-container--classic .select2-results__option {
  padding: 8px 12px !important;
  color: #ffffff !important;
}

/* Hover state */
.select2-container .select2-results__option--highlighted[aria-selected],
.select2-container--classic .select2-results__option--highlighted[aria-selected] {
  background-color: #1e88e5 !important;
  color: #ffffff !important;
}

/* Selected state */
.select2-container .select2-results__option[aria-selected=true],
.select2-container--classic .select2-results__option[aria-selected=true] {
  background-color: #1565c0 !important;
  color: #ffffff !important;
}

/* Multiple selection items */
.select2-container .select2-selection--multiple .select2-selection__choice,
.select2-container--classic .select2-selection--multiple .select2-selection__choice {
  background-color: #1e88e5 !important;
  border: 1px solid #1565c0 !important;
  color: #ffffff !important;
  border-radius: 0.25rem !important;
  padding: 2px 8px !important;
  margin-top: 6px !important;
  margin-left: 6px !important;
}

/* Remove button for multiple selection */
.select2-container .select2-selection--multiple .select2-selection__choice__remove,
.select2-container--classic .select2-selection--multiple .select2-selection__choice__remove {
  color: #ffffff !important;
  margin-right: 5px !important;
}

/* Placeholder */
.select2-container .select2-selection--single .select2-selection__placeholder,
.select2-container .select2-selection--multiple .select2-selection__placeholder,
.select2-container--classic .select2-selection--single .select2-selection__placeholder,
.select2-container--classic .select2-selection--multiple .select2-selection__placeholder {
  color: #9ca3af !important;
}

/* Multiple selection input */
.select2-container .select2-selection--multiple .select2-selection__rendered,
.select2-container--classic .select2-selection--multiple .select2-selection__rendered {
  padding: 4px 8px !important;
}

/* Group headers */
.select2-container .select2-results__group,
.select2-container--classic .select2-results__group {
  padding: 6px 12px !important;
  color: #9ca3af !important;
  font-weight: 600 !important;
}

/* Force override for all select elements */
select.w-full,
select.form-select,
select.form-control {
  background-color: #121212 !important;
  border: 1px solid #2a2a2a !important;
  color: #ffffff !important;
}

/* Direct styling for select elements */
select {
  background-color: #121212 !important;
  border-color: #2a2a2a !important;
  color: #ffffff !important;
}

/* Specific styling for the elements in the screenshot */
#panel_categories,
#panel_channel,
#transcripts_sort,
#cat_roles,
#cat_category,
#cat_fallback_categories,
#cat_type,
#cat_bttn_color {
  background-color: #121212 !important;
  border-color: #2a2a2a !important;
  color: #ffffff !important;
}

/* Override any Tailwind classes */
.bg-slate-700,
.bg-slate-800,
.bg-slate-900 {
  background-color: #121212 !important;
}

.border-slate-600,
.border-slate-700 {
  border-color: #2a2a2a !important;
}

.focus\:ring-blue-500:focus {
  --tw-ring-color: #1e88e5 !important;
}

.focus\:border-blue-500:focus {
  border-color: #1e88e5 !important;
}