/* Design toolbar styling ported from desktop/src/vs/workbench/contrib/designSystem/browser/media/designToolbar.css */

.designToolbar_designToolbarContainer__i_I5S {
  position: absolute;
  bottom: 32px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 50;
  pointer-events: auto;
}

.designToolbar_designToolbar__T3Ny_ {
  /* Tokens */
  --spacer-1: 4px;
  --radius-medium: 4px;

  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6px 8px;
  border-radius: 12px;
  border: 1px solid var(--vscode-input-border, #2a2a2a);
  background-color: var(--vscode-editor-background, #1f1f1f);
  box-shadow: none;
  transition: all 0.2s ease;
}

.designToolbar_actionsContainer__KR0Cn {
  display: flex;
  align-items: center;
  gap: 6px;
}

.designToolbar_actionItem__6HItt {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  min-height: 32px;
  width: auto;
  height: auto;
  border-radius: 8px;
  transition: all 0.15s ease;
  cursor: pointer;
  position: relative;
  outline: none;
  gap: 1px;
  box-shadow: none;
  background: transparent;
  border: none;
  padding: 0;
}

.designToolbar_actionLabel__LJGqS {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--vscode-foreground);
  pointer-events: none;
  width: 24px;
  height: 24px;
  padding: var(--spacer-1);
}

.designToolbar_checked__02JAv .designToolbar_actionLabel__LJGqS,
.designToolbar_actionItem__6HItt[aria-checked='true'] .designToolbar_actionLabel__LJGqS {
  color: var(--vscode-list-activeSelectionForeground);
}

.designToolbar_checked__02JAv,
.designToolbar_actionItem__6HItt[aria-checked='true'] {
  background-color: var(--vscode-list-activeSelectionBackground);
  box-shadow: none;
}

.designToolbar_actionItem__6HItt:not(.designToolbar_checked__02JAv):not([aria-checked='true']):hover {
  background-color: var(--vscode-list-hoverBackground);
  transform: none;
  box-shadow: none;
}

.designToolbar_actionLabel__LJGqS svg {
  display: block;
  color: var(--vscode-foreground);
  fill: none !important;
  overflow: visible;
  width: 24px;
  height: 24px;
}

.designToolbar_actionLabel__LJGqS svg path {
  fill: currentColor !important;
}



.designToolbar_actionItem__6HItt:focus-visible {
  outline: 2px solid var(--vscode-focusBorder);
  outline-offset: 2px;
  box-shadow: none;
}

.designToolbar_actionItem__6HItt:not(.designToolbar_checked__02JAv):not([aria-checked='true']):active {
  background-color: var(--vscode-list-activeSelectionBackground);
  transform: translateY(0px);
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
}

.designToolbar_settingsButton__T8DSs {
  margin-left: 6px;
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 8px;
  background: transparent;
  color: var(--vscode-foreground);
  cursor: pointer;
  padding: 4px;
}

.designToolbar_settingsButton__T8DSs:hover {
  background-color: var(--vscode-list-hoverBackground);
}

.designToolbar_settingsButton__T8DSs:active {
  background-color: var(--vscode-list-activeSelectionBackground);
  color: var(--vscode-list-activeSelectionForeground);
}

.designToolbar_settingsButton__T8DSs:focus-visible {
  outline: 2px solid var(--vscode-focusBorder);
  outline-offset: 2px;
}