.oflow-client--toolbar {
  height: 40px;
  background-color: #fff;
  display: flex;
  flex-shrink: 0;
  align-items: center;
  padding: 0 12px;
  justify-content: space-between;
  border-bottom: 1px solid #DEDEDE;
  border-top: 1px solid #DEDEDE;

  &.oflow-client--toolbar-float {
    position: absolute;
    z-index: 9999;
    top: 20px;
    left: 20px;
    border-left: 1px solid #DEDEDE;
    border-right: 1px solid #DEDEDE;
  }

  .oflow-client--toolbar-left {
    display: flex;
    align-items: center;
  }

  .oflow-client--toolbar-right {
    display: flex;
    align-items: center;
  }

  .toolbar--custom-action {
    padding: 0 5px;
    &:hover {
      background: #f2f6ff;
      border-radius: 2px;
    }
  }

  .toolbar--group {
    display: flex;
    padding: 0 7px;
    align-items: center;
    height: 16px;
    border-right: 1px solid #ccc;

    &:last-child {
      border-right: none;
    }

    .toolbar--action {
      width: 24px;
      height: 24px;
      display: flex;
      align-items: center;
      justify-content: center;

      &.clickable {
        cursor: pointer;

        &:hover {
          background: #f2f6ff;
          border-radius: 2px;
        }
      }
    }
  }
}