.graphiql-execute-button-wrapper {
  position: relative;
}

button.graphiql-execute-button {
  background-color: hsl(var(--color-primary));
  border: none;
  border-radius: var(--border-radius-8);
  cursor: pointer;
  height: var(--toolbar-width);
  padding: 0;
  width: var(--toolbar-width);

  &:hover {
    background-color: hsla(var(--color-primary), 0.9);
  }

  &:active {
    background-color: hsla(var(--color-primary), 0.8);
  }

  &:focus {
    outline: hsla(var(--color-primary), 0.8) auto 1px;
  }

  & > svg {
    color: white;
    display: block;
    height: var(--px-16);
    margin: auto;
    width: var(--px-16);
  }
}
