@import '../../../../styles';

.jse-context-menu-button {
  position: absolute;
  top: calc(-0.5 * var(--jse-context-menu-button-size));
  right: calc(-0.5 * var(--jse-context-menu-button-size));
  width: var(--jse-context-menu-button-size);
  height: var(--jse-context-menu-button-size);
  padding: 0;
  margin: 0;
  z-index: 2;

  cursor: pointer;
  background: transparent;

  border-radius: 2px;
  background: var(--jse-context-menu-button-background);
  color: var(--jse-context-menu-button-color);
  border: none;
  box-shadow: var(--jse-controls-box-shadow);

  &:hover {
    background: var(--jse-context-menu-button-background-highlight);
  }
}