@import "./var.less";

.step-guidance-control {
  position: fixed;
  top: 10px;
  left: 10px;
  height: @height;
  display: flex;
  overflow: hidden;
  z-index: 2147483647;

  .step-guidance-btn {
    padding: 0 20px;
    height: @height;
    line-height: @height;
    color: @black;
    background: @white;
    cursor: pointer;
    border: 1px solid @borderColor;

    &.active, &:hover {
      color: @white;
      background: @btnBgColor;
      border: 1px solid @btnBgColor;
    }
  }

  .step-guidance-left {
    border-right-color: transparent;
    border-top-left-radius: 25px;
    border-bottom-left-radius: 25px;
  }

  .step-guidance-mid {
    border-right-color: transparent;
    border-left-color: transparent;
  }

  .step-guidance-right {
    border-left-color: transparent;
    border-top-right-radius: 25px;
    border-bottom-right-radius: 25px;
  }

}