/* Select2 Flowbite-style Overrides - Must load AFTER Select2 default CSS */

/* Base container styling - single select */
.select2-container--default .select2-selection--single,
.select2-container .select2-selection--single,
.select2-selection--single {
  background-color: #f9fafb !important; /* gray-50 */
  background: #f9fafb !important;
  border: 1px solid rgb(209 213 219) !important;
  border-radius: 0.5rem !important;
  min-height: 42px !important;
  height: auto !important;
  padding: 0.625rem 2.5rem 0.625rem 0.625rem !important; /* p-2.5 = 0.625rem to match text inputs */
}

/* Base container styling - multiple select */
.select2-container--default .select2-selection--multiple,
.select2-container .select2-selection--multiple,
.select2-selection--multiple {
  background-color: #f9fafb !important; /* gray-50 */
  background: #f9fafb !important;
  border: 1px solid rgb(209 213 219) !important;
  border-radius: 0.5rem !important;
  min-height: 42px !important;
  padding: 0.375rem 0.625rem !important; /* Adjusted to align with text inputs */
}

/* Text styling for single select - must match input font size (14px) */
.select2-container--default .select2-selection--single .select2-selection__rendered,
.select2-container .select2-selection--single .select2-selection__rendered,
.select2-selection--single .select2-selection__rendered {
  color: rgb(33 37 41) !important;
  font-size: 14px !important;
  line-height: 20px !important;
  padding: 0 !important;
  font-family: "Public Sans", system-ui, -apple-system, sans-serif !important;
  font-weight: 400 !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__rendered,
.select2-container .select2-selection--multiple .select2-selection__rendered,
.select2-selection--multiple .select2-selection__rendered {
  padding: 0 !important;
  font-family: "Public Sans", system-ui, -apple-system, sans-serif !important;
  font-size: 14px !important;
  color: rgb(33 37 41) !important;
}

/* Arrow positioning for single select */
.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 100% !important;
  top: 0 !important;
  right: 0.5rem !important;
  width: 1.5rem !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
  border-color: rgb(107 114 128) transparent transparent transparent !important;
}

/* Placeholder styling - match input placeholder color rgb(206, 212, 218) */
.select2-container--default .select2-selection--single .select2-selection__placeholder,
.select2-container--default .select2-selection--multiple .select2-selection__placeholder,
.select2-container .select2-selection__placeholder,
.select2-selection__placeholder {
  color: rgb(206, 212, 218) !important;
  font-size: 14px !important;
  line-height: 20px !important;
  font-family: "Public Sans", system-ui, -apple-system, sans-serif !important;
  font-weight: 400 !important;
}

/* Focus state - primary green ring */
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--default.select2-container--open .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--multiple,
.select2-container--open .select2-selection--single,
.select2-container--open .select2-selection--multiple,
.select2-container--focus .select2-selection--single,
.select2-container--focus .select2-selection--multiple {
  border-color: #28b157 !important;
  box-shadow: 0 0 0 1px #28b157 !important;
  outline: none !important;
  outline-offset: 0 !important;
}

/* Dropdown container styling */
.select2-container--default .select2-dropdown,
.select2-dropdown {
  border: 1px solid rgb(209 213 219) !important;
  border-radius: 0.5rem !important;
  box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1) !important;
  background-color: white !important;
}

/* Search field in dropdown */
.select2-container--default .select2-search--dropdown .select2-search__field,
.select2-search--dropdown .select2-search__field {
  background-color: rgb(249 250 251) !important;
  border: 1px solid rgb(209 213 219) !important;
  border-radius: 0.5rem !important;
  padding: 0.625rem !important;
  font-size: 0.875rem !important;
  font-family: inherit !important;
  outline: none !important;
}

.select2-container--default .select2-search--dropdown .select2-search__field:focus,
.select2-search--dropdown .select2-search__field:focus {
  border-color: #28b157 !important;
  box-shadow: 0 0 0 1px #28b157 !important;
  outline: none !important;
}

/* Results/options styling */
.select2-container--default .select2-results__option,
.select2-results__option {
  font-size: 0.875rem !important;
  color: rgb(17 24 39) !important;
  padding: 0.625rem 0.75rem !important;
  font-family: inherit !important;
}

/* Highlighted option - primary green (NOT blue) */
.select2-container--default .select2-results__option--highlighted,
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable,
.select2-container--default .select2-results__option.select2-results__option--highlighted,
.select2-results__option--highlighted,
.select2-results__option.select2-results__option--highlighted {
  background-color: #28b157 !important;
  color: white !important;
}

/* Already selected option (not highlighted) */
.select2-container--default .select2-results__option--selected:not(.select2-results__option--highlighted),
.select2-container--default .select2-results__option[aria-selected="true"]:not(.select2-results__option--highlighted),
.select2-results__option[aria-selected="true"]:not(.select2-results__option--highlighted) {
  background-color: #dcfce7 !important;
  color: rgb(17 24 39) !important;
}

/* Selected tags in multiple select - primary green */
.select2-container--default .select2-selection--multiple .select2-selection__choice,
.select2-container .select2-selection--multiple .select2-selection__choice,
.select2-selection__choice {
  background-color: #dcfce7 !important;
  border: 1px solid #28b157 !important;
  border-radius: 0.375rem !important;
  padding: 0.25rem 0.5rem !important;
  margin: 0.25rem 0.25rem 0.25rem 0 !important;
  font-size: 14px !important;
  font-family: "Public Sans", system-ui, -apple-system, sans-serif !important;
  font-weight: 400 !important;
  color: rgb(33 37 41) !important;
  background-image: none !important;
  line-height: 1.5 !important;
  position: relative !important;
  padding-right: 1.5rem !important; /* Space for X on right */
}

/* X button to remove tag - positioned on the right */
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove,
.select2-container .select2-selection--multiple .select2-selection__choice__remove,
.select2-selection__choice__remove {
  border: none !important;
  background: transparent !important;
  background-color: transparent !important;
  cursor: pointer !important;
  position: absolute !important;
  right: 0.25rem !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 1.125rem !important;
  height: 1.125rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  text-indent: -9999px !important; /* Hide original × character */
}

/* Use ::after to show proper × character */
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove::after,
.select2-container .select2-selection--multiple .select2-selection__choice__remove::after,
.select2-selection__choice__remove::after {
  content: "×" !important;
  text-indent: 0 !important;
  color: #047857 !important;
  font-size: 1.125rem !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  font-family: Arial, sans-serif !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%, -50%) !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover,
.select2-container .select2-selection--multiple .select2-selection__choice__remove:hover,
.select2-selection__choice__remove:hover {
  background: transparent !important;
  background-color: transparent !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover::after,
.select2-container .select2-selection--multiple .select2-selection__choice__remove:hover::after,
.select2-selection__choice__remove:hover::after {
  color: #dc2626 !important;
}

/* Search field inside multiple select */
.select2-container--default .select2-selection--multiple .select2-search--inline .select2-search__field,
.select2-container .select2-selection--multiple .select2-search--inline .select2-search__field,
.select2-selection--multiple .select2-search--inline .select2-search__field {
  font-size: 14px !important;
  color: rgb(33 37 41) !important;
  font-family: "Public Sans", system-ui, -apple-system, sans-serif !important;
  font-weight: 400 !important;
}