/* Source-copied Workspace Switcher styles from the ClearMarket toolkit. */
.dt-workspace-switcher {
  position: relative;
  width: min(18rem, calc(100vw - 2rem));
}

.dt-workspace-switcher__label {
  color: var(--dt-color-text-muted);
  display: block;
  font: var(--dt-weight-semibold) var(--dt-text-xs) var(--dt-font-compact);
  letter-spacing: 0;
  margin: 0 0 .375rem .25rem;
  text-transform: uppercase;
}

.dt-workspace-switcher__trigger {
  align-items: center;
  background: var(--dt-color-surface);
  border: 1px solid var(--dt-color-border);
  border-radius: var(--dt-radius-sm);
  color: var(--dt-color-text);
  cursor: pointer;
  display: grid;
  gap: .75rem;
  grid-template-columns: 2rem 1fr auto;
  min-height: 3.75rem;
  padding: .625rem .75rem;
  text-align: left;
}

.dt-workspace-switcher__trigger:hover {
  border-color: var(--dt-color-border-strong);
  box-shadow: none;
}

.dt-workspace-switcher__trigger:focus-visible {
  box-shadow: 0 0 0 3px var(--dt-color-focus);
  outline: none;
}

.dt-workspace-switcher__mark {
  align-items: center;
  background: color-mix(in srgb, var(--dt-color-brand) 10%, var(--dt-color-surface));
  border-radius: var(--dt-radius-sm);
  color: var(--dt-color-brand);
  display: inline-flex;
  font: var(--dt-weight-semibold) var(--dt-text-sm) var(--dt-font-compact);
  height: 2rem;
  justify-content: center;
  width: 2rem;
}

.dt-workspace-switcher__mark img,
.dt-workspace-switcher__option > span:first-child img {
  display: block;
  height: 1.125rem;
  width: 1.125rem;
}

[data-theme='dark'] .dt-workspace-switcher__mark img,
[data-theme='dark'] .dt-workspace-switcher__option > span:first-child img {
  filter: invert(1);
}

.dt-workspace-switcher__copy {
  display: grid;
  gap: .125rem;
  min-width: 0;
}

.dt-workspace-switcher__copy strong {
  font-size: var(--dt-text-md);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.dt-workspace-switcher__copy small {
  color: var(--dt-color-text-muted);
  font-size: var(--dt-text-sm);
}

.dt-workspace-switcher__chevron {
  color: var(--dt-color-text-muted);
  display: inline-flex;
  transition: transform .15s ease;
}

.dt-workspace-switcher__chevron svg {
  display: block;
}

.dt-workspace-switcher.is-open .dt-workspace-switcher__chevron {
  transform: rotate(180deg);
}

.dt-workspace-switcher__menu {
  background: var(--dt-color-surface);
  border: 1px solid var(--dt-color-border);
  border-radius: var(--dt-radius-lg);
  box-shadow: var(--dt-shadow-md);
  display: grid;
  gap: .125rem;
  left: 0;
  padding: .375rem;
  position: absolute;
  right: 0;
  top: calc(100% + .5rem);
  z-index: 12;
}

.dt-workspace-switcher__menu[hidden] {
  display: none;
}

.dt-workspace-switcher__option {
  align-items: center;
  background: transparent;
  border: 0;
  border-radius: var(--dt-radius-sm);
  color: var(--dt-color-text);
  cursor: pointer;
  display: grid;
  gap: .625rem;
  grid-template-columns: 1.75rem 1fr auto;
  min-height: 3rem;
  padding: .5rem .625rem;
  text-align: left;
}

.dt-workspace-switcher__option:hover,
.dt-workspace-switcher__option:focus-visible,
.dt-workspace-switcher__option[aria-checked='true'] {
  background: var(--dt-color-surface-muted);
}

.dt-workspace-switcher__option:focus-visible {
  box-shadow: inset 0 0 0 2px var(--dt-color-focus);
  outline: none;
}

.dt-workspace-switcher__option > span:first-child {
  align-items: center;
  color: var(--dt-color-brand);
  display: inline-flex;
  font: var(--dt-weight-semibold) var(--dt-text-sm) var(--dt-font-compact);
  justify-content: center;
}

.dt-workspace-switcher__option strong {
  font-size: var(--dt-text-sm);
}

.dt-workspace-switcher__option i {
  color: var(--dt-color-brand);
  display: inline-flex;
  font-style: normal;
}

.dt-workspace-switcher__option i[hidden] {
  display: none;
}

.dt-workspace-switcher__option i svg {
  display: block;
}