.select-control {
  position: relative;
  width: 100%;
}

.select-control.form-select {
  align-items: stretch;
  appearance: none;
  background: var(--admin-control-bg, var(--bs-body-bg, var(--marketing-input, #fff)));
  background-image: none;
  border: 1px solid var(--admin-border-strong, var(--bs-border-color, var(--marketing-line-strong, #cbd5e1)));
  border-radius: var(--admin-control-radius, 13px);
  color: var(--admin-text, var(--bs-body-color, var(--marketing-ink, #111827)));
  display: block;
  min-height: var(--admin-control-height, 44px);
  padding: 0;
  box-shadow: none;
}

.select-control.form-select-sm {
  min-height: var(--admin-control-height-sm, 36px);
}

.select-control > select {
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

.select-control-trigger {
  align-items: center;
  appearance: none;
  background: transparent;
  border: 0;
  border-radius: inherit;
  color: inherit;
  display: flex;
  font: inherit;
  font-weight: 600;
  justify-content: space-between;
  min-height: inherit;
  padding: 9px 13px;
  text-align: left;
  width: 100%;
}

.select-control.form-select-sm .select-control-trigger {
  font-size: 13px;
  padding: 6px 10px;
}

.select-control-trigger:focus:not(:focus-visible) {
  box-shadow: none;
  outline: 0;
}

.select-control-trigger:focus-visible {
  box-shadow: 0 0 0 3px var(--admin-focus-ring, var(--marketing-focus-ring, rgb(36 107 254 / 16%)));
  outline: 0;
}

.select-control-trigger:disabled {
  color: var(--admin-muted, var(--marketing-muted, #667085));
  cursor: not-allowed;
  opacity: .62;
}

.select-control-value {
  min-width: 0;
  overflow-wrap: anywhere;
}

.select-control-chevron {
  border-bottom: 1.5px solid currentColor;
  border-right: 1.5px solid currentColor;
  flex: 0 0 8px;
  height: 8px;
  margin-left: 12px;
  opacity: .72;
  transform: rotate(45deg) translateY(-2px);
  transition: transform .18s ease;
  width: 8px;
}

.select-control.is-open .select-control-chevron {
  transform: rotate(225deg) translate(-1px, -1px);
}

.select-control-menu {
  background: var(--admin-surface, var(--bs-body-bg, var(--marketing-surface, #fff)));
  border: 1px solid color-mix(in srgb, var(--admin-primary, var(--bs-primary, var(--marketing-primary, #246bfe))) 16%, var(--admin-border, var(--bs-border-color, var(--marketing-line, #dbe2ec))));
  border-radius: 12px;
  box-shadow: 0 18px 42px rgb(23 32 51 / 16%);
  display: grid;
  gap: 4px;
  left: 0;
  max-height: min(320px, 45vh);
  overflow-y: auto;
  padding: 6px;
  position: absolute;
  right: 0;
  top: calc(100% + 7px);
  z-index: 1065;
}

.select-control.is-open-upward .select-control-menu {
  bottom: calc(100% + 7px);
  top: auto;
}

.select-control-menu[hidden] {
  display: none;
}

.select-control-option {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: 9px;
  color: var(--admin-text, var(--bs-body-color, var(--marketing-ink, #111827)));
  display: flex;
  font: inherit;
  justify-content: flex-start;
  min-height: 38px;
  padding: 9px 11px;
  text-align: left;
  white-space: normal;
  width: 100%;
}

.select-control-option:hover,
.select-control-option:focus-visible,
.select-control-option[aria-selected="true"] {
  background: var(--admin-primary-soft, var(--marketing-primary-soft, #edf3ff));
  color: var(--admin-primary, var(--marketing-primary, #246bfe));
  outline: 0;
}

.select-control-option:focus-visible {
  box-shadow: inset 0 0 0 2px var(--admin-focus-ring, var(--marketing-focus-ring, rgb(36 107 254 / 16%)));
}

.select-control-option:focus:not(:focus-visible) {
  outline: 0;
}

.select-control-option:disabled {
  color: var(--admin-muted, var(--marketing-muted, #667085));
  cursor: not-allowed;
  opacity: .52;
}

.select-control-empty {
  color: var(--admin-muted, var(--marketing-muted, #667085));
  padding: 10px 11px;
}

@media (prefers-reduced-motion: reduce) {
  .select-control-chevron {
    transition: none;
  }
}