.flow-editor--resize-bar-container {
  position: relative;
  z-index: 10;
  height: 100%;
  width: 100%;
}
.flow-editor--resize-bar-container .flow-editor--resize-bar {
  position: absolute;
  opacity: 0;
}
.flow-editor--resize-bar-container .flow-editor--resize-bar .flow-editor-resize-bar-icon--icon-container {
  width: 25px;
  border-radius: 4px;
  height: 37px;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #fff;
  border: 1px solid #e8e9ec;
}
.flow-editor--resize-bar-container:hover .flow-editor--resize-bar {
  opacity: 1;
}
.flow-editor--resize-bar-container .flow-editor--resize-bar-left.flow-editor--resize-bar-icon,
.flow-editor--resize-bar-container .flow-editor--resize-bar-right.flow-editor--resize-bar-icon,
.flow-editor--resize-bar-container .flow-editor--resize-bar-left.flow-editor--resize-bar-line,
.flow-editor--resize-bar-container .flow-editor--resize-bar-right.flow-editor--resize-bar-line {
  position: absolute;
  top: 0;
  bottom: 0;
  cursor: ew-resize;
}
.flow-editor--resize-bar-container .flow-editor--resize-bar-left.flow-editor--resize-bar-line,
.flow-editor--resize-bar-container .flow-editor--resize-bar-right.flow-editor--resize-bar-line {
  width: 10px;
  opacity: 0;
  top: 0;
  bottom: 0;
  z-index: 10000;
}
.flow-editor--resize-bar-container .flow-editor--resize-bar-left.flow-editor--resize-bar-line:hover,
.flow-editor--resize-bar-container .flow-editor--resize-bar-right.flow-editor--resize-bar-line:hover,
.flow-editor--resize-bar-container .flow-editor--resize-bar-left.flow-editor--resize-bar-line.flow-editor--resize-bar-line-dragging,
.flow-editor--resize-bar-container .flow-editor--resize-bar-right.flow-editor--resize-bar-line.flow-editor--resize-bar-line-dragging {
  background-color: #d9d9d9;
  transition: opacity 0.5s ease;
  opacity: 1;
}
.flow-editor--resize-bar-container .flow-editor--resize-bar-left.flow-editor--resize-bar-icon,
.flow-editor--resize-bar-container .flow-editor--resize-bar-right.flow-editor--resize-bar-icon {
  width: 4px;
}
.flow-editor--resize-bar-container .flow-editor--resize-bar-left.flow-editor--resize-bar-line {
  left: -5px;
}
.flow-editor--resize-bar-container .flow-editor--resize-bar-left.flow-editor--resize-bar-icon {
  left: 0px;
}
.flow-editor--resize-bar-container .flow-editor--resize-bar-left.flow-editor--resize-bar-icon .flow-editor-resize-bar-icon--icon-container {
  position: absolute;
  left: 0;
  cursor: ew-resize;
  transform: translate(-100%, -50%);
  top: 50%;
  border-right: none;
}
.flow-editor--resize-bar-container .flow-editor--resize-bar-right.flow-editor--resize-bar-line {
  right: -5px;
}
.flow-editor--resize-bar-container .flow-editor--resize-bar-right.flow-editor--resize-bar-icon {
  right: 0px;
}
.flow-editor--resize-bar-container .flow-editor--resize-bar-right.flow-editor--resize-bar-icon .flow-editor-resize-bar-icon--icon-container {
  position: absolute;
  right: 0;
  cursor: ew-resize;
  transform: translate(100%, -50%);
  top: 50%;
  border-left: none;
}
.flow-editor--resize-bar-container .flow-editor--resize-bar-top.flow-editor--resize-bar-line,
.flow-editor--resize-bar-container .flow-editor--resize-bar-bottom.flow-editor--resize-bar-line,
.flow-editor--resize-bar-container .flow-editor--resize-bar-top.flow-editor--resize-bar-icon,
.flow-editor--resize-bar-container .flow-editor--resize-bar-bottom.flow-editor--resize-bar-icon {
  position: absolute;
  left: 0;
  right: 0;
  cursor: ns-resize;
}
.flow-editor--resize-bar-container .flow-editor--resize-bar-top.flow-editor--resize-bar-line,
.flow-editor--resize-bar-container .flow-editor--resize-bar-bottom.flow-editor--resize-bar-line {
  z-index: 10000;
  height: 10px;
  opacity: 0;
}
.flow-editor--resize-bar-container .flow-editor--resize-bar-top.flow-editor--resize-bar-line:hover,
.flow-editor--resize-bar-container .flow-editor--resize-bar-bottom.flow-editor--resize-bar-line:hover,
.flow-editor--resize-bar-container .flow-editor--resize-bar-top.flow-editor--resize-bar-line.flow-editor--resize-bar-line-dragging,
.flow-editor--resize-bar-container .flow-editor--resize-bar-bottom.flow-editor--resize-bar-line.flow-editor--resize-bar-line-dragging {
  background-color: #d9d9d9;
  transition: opacity 0.5s ease;
  opacity: 1;
}
.flow-editor--resize-bar-container .flow-editor--resize-bar-top.flow-editor--resize-bar-icon,
.flow-editor--resize-bar-container .flow-editor--resize-bar-bottom.flow-editor--resize-bar-icon {
  height: 4px;
}
.flow-editor--resize-bar-container .flow-editor--resize-bar-top.flow-editor--resize-bar-icon {
  top: 0;
}
.flow-editor--resize-bar-container .flow-editor--resize-bar-top.flow-editor--resize-bar-line {
  top: -5px;
}
.flow-editor--resize-bar-container .flow-editor--resize-bar-top.flow-editor--resize-bar-icon .flow-editor-resize-bar-icon--icon-container {
  position: absolute;
  bottom: -4px;
  cursor: ns-resize;
  border-right: none;
  transform: translate(-50%, 0) rotate(90deg);
  transform-origin: 50% 50%;
  left: 50%;
}
.flow-editor--resize-bar-container .flow-editor--resize-bar-bottom.flow-editor--resize-bar-line {
  bottom: -5px;
}
.flow-editor--resize-bar-container .flow-editor--resize-bar-bottom.flow-editor--resize-bar-icon {
  bottom: 0;
}
.flow-editor--resize-bar-container .flow-editor--resize-bar-bottom.flow-editor--resize-bar-icon .flow-editor-resize-bar-icon--icon-container {
  position: absolute;
  top: -4px;
  cursor: ns-resize;
  border-left: none;
  transform: translate(-50%, 0) rotate(90deg);
  transform-origin: 50% 50%;
  left: 50%;
}
