.multiselect {
  border-radius: theme(borderRadius.md) !important;
  box-shadow: theme(boxShadow.sm) !important;
  border-width: 0 !important;
}
.multiselect[readonly] {
  pointer-events: none;
}
.multiselect[readonly] :is(.multiselect-clear, .multiselect-caret, .multiselect-tags-search-wrapper, .multiselect-tag-remove) {
  display: none;
}
.multiselect [class^='fa'] {
  margin-left: theme(margin.2);
  margin-right: theme(margin[0.5]);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: theme(padding[1.5]);
  border-left: 1px solid theme(colors.gray.300);
}
.multiselect-wrapper {
  border-width: 1px;
  border-style: solid;
  border-color: theme(colors.gray.300);
  padding: 0.563rem 0;
  border-radius: 0.375rem;
}
.multiselect-wrapper:has(.multiselect-tags) {
  padding: 0.313rem 0;
}
.multiselect-tags {
  margin-top: 0 !important;
  gap: 0.25rem;
}
.multiselect-tag {
  margin-right: 0 !important;
  margin-bottom: 0 !important;
}
.multiselect--error .multiselect-wrapper {
  border-color: theme(colors.red.300);
}
.multiselect--error .multiselect-tags-search::placeholder,
.multiselect--error .multiselect-placeholder {
  color: theme(colors.red.300);
}
.multiselect.is-active .multiselect-wrapper {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important;
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
  --tw-ring-opacity: 1 !important;
  --tw-ring-color: rgb(48 80 157 / var(--tw-ring-opacity)) !important;
  --tw-border-opacity: 1;
  border-color: rgb(48 80 157 / var(--tw-border-opacity));
}
.multiselect--error .multiselect.is-active .multiselect-wrapper {
  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;
  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important;
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow) !important;
  --tw-ring-opacity: 1 !important;
  --tw-ring-color: rgb(252 165 165 / var(--tw-ring-opacity)) !important;
  --tw-border-opacity: 1;
  border-color: rgb(252 165 165 / var(--tw-border-opacity));
}
.multiselect--error .multiselect-single-label {
  color: theme(colors.red.900);
}
.multiselect-clear-icon,
.multiselect-caret {
  width: 1.025rem !important;
}
.multiselect-clear {
  padding-right: 0.475rem !important;
}
.multiselect--error .multiselect-tags {
  padding-right: theme(padding.10);
}
.multiselect-tag {
  background-color: theme(colors.gray.200) !important;
  color: theme(colors.gray.600) !important;
}
.multiselect--error .multiselect-tag {
  background-color: theme(colors.red.200) !important;
  color: theme(colors.red.600) !important;
}
.multiselect-no-options,
.multiselect-no-results {
  visibility: hidden;
  font-size: 1px;
}
.multiselect-no-options::after,
.multiselect-no-results::after {
  visibility: initial;
  font-size: theme(fontSize.base);
}
.multiselect-no-options::after {
  content: "List is empty";
}
.multiselect-no-results::after {
  content: "No results found";
}
.multiselect-placeholder {
  padding-right: 2rem;
  width: 78%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.multiselect--error .multiselect-placeholder {
  padding-right: 4rem;
}
.multiselect-option span,
.multiselect-placeholder,
.multiselect-single-label-text {
  font-size: theme(fontSize.base);
  line-height: 1.25rem;
}
.popper .multiselect-option span {
  color: theme(colors.gray.700);
}
@media (min-width: 640px) {
  .multiselect-option span,
  .multiselect-placeholder,
  .multiselect-single-label-text {
    font-size: theme(fontSize.sm);
    line-height: 1.25rem;
  }
}
.multiselect--error__icon {
  padding-right: theme(padding.10);
}
.multiselect--error:has(.multiselect-clear) .multiselect--error__icon {
  padding-right: theme(padding.16);
}

.multiselect-option.is-selected,
.multiselect-option.is-selected.is-pointed {
  --l-select-color: 53 97 192;
  background-color: rgb(var(--l-select-color) / var(--tw-bg-opacity)) !important;
}
