.solid-select-container[data-disabled="true"] {
  @apply pointer-events-none;
}
.solid-select-container {
  @apply relative;
}
.solid-select-control[data-disabled="true"] {
}
.solid-select-control {
  @apply w-full p-2 rounded-lg bg-white/10 placeholder-neutral-400;
  @apply grid leading-6;
  grid-template-columns: repeat(1, minmax(0, 1fr));
}
.solid-select-control[data-multiple="true"][data-has-value="true"] {
  @apply flex items-stretch gap-1 flex-wrap;
}

.solid-select-placeholder {
  @apply text-neutral-400;
  @apply col-start-1 row-start-1;
}
.solid-select-single-value {
  @apply col-start-1 row-start-1;
}
.solid-select-multi-value {
  @apply flex bg-white/20 rounded items-center px-1;
}

.solid-select-multi-value-remove {
  /* TODO: there's gotta be a better way to vertically center this */
  @apply pl-2 pr-1 leading-3 -mt-2 text-2xl;
}

.solid-select-input {
  @apply bg-transparent caret-transparent flex-grow flex-shrink;
  outline: 2px solid transparent;
  @apply col-start-1 row-start-1;
}
.solid-select-input:read-only {
  @apply cursor-default;
}
.solid-select-input[data-multiple="true"] {
  @apply caret-current;
}
.solid-select-input[data-is-active="true"] {
  @apply caret-current;
}

.solid-select-list {
  @apply max-h-[50vh] min-w-full overflow-y-auto absolute whitespace-nowrap z-10 bg-neutral-950 p-2 rounded-lg;
}

.solid-select-option[data-focused="true"] {
}

.solid-select-option > mark {
  @apply underline bg-white/10 text-white;
}
.solid-select-option {
  @apply cursor-default select-none p-1 hover:bg-neutral-800 rounded;
}
.solid-select-option[data-disabled="true"] {
  @apply pointer-events-none opacity-50;
}
.solid-select-list-placeholder {
  @apply cursor-default select-none;
}
