.shared-select {
  @apply inline-block;
}

.shared-select:focus {
  @apply outline-none;
}

.shared-select-toggle {
  @apply w-full grid grid-flow-col items-center justify-between;
  @apply px-4 py-[1.125rem] rounded;
  @apply border border-[#AEB7C1] border-solid;
}

.shared-select:focus .shared-select-toggle,
.shared-select:focus-within .shared-select-toggle {
  @apply bg-white;
}

.shared-select-toggle.has-value {
  @apply bg-white;
}

.shared-select-toggle.has-value .shared-select-display-value {
  @apply text-black;
}

.shared-select-toggle.is-open,
.shared-select:focus .shared-select-toggle {
  @apply border-b-0 rounded-b-none;
}

.shared-select-display-value {
  @apply truncate text-[#89949E];
}

.shared-select-options-outlet {
  @apply relative;
}

.shared-select-options {
  @apply absolute top-0 left-0 w-full;
  @apply z-dropdown;
  @apply overflow-y-auto;
  @apply max-h-[15rem] h-0;
  @apply flex flex-col;
}

.shared-select-options.is-open,
.shared-select:focus .shared-select-options {
  @apply h-auto;
  @apply bg-white rounded-b border border-[#AEB7C1] border-solid border-t-0;
}

.shared-select-options.force-close {
  height: 0 !important;
}
