.ce-settings {
  position: absolute;
  z-index: 2;
  --gap: 8px;

  @media (--not-mobile){
    position: absolute;
    top: calc(var(--toolbox-buttons-size) + var(--gap));
    left: 0;

    &--opened-top {
      top: calc(-1 * (var(--gap) + var(--popover-height)));
    }
  }

  &__button {
    @apply --toolbar-button;

    &:not(:nth-child(3n+3)) {
      margin-right: 3px;
    }

    &:nth-child(n+4) {
      margin-top: 3px;
    }

    line-height: 32px;

    &--disabled {
        cursor: not-allowed !important;
        opacity: .3;
    }

    &--selected {
      color: var(--color-active-icon);
    }
  }
}