
.horizontaltreeview {
  position: relative;
  overflow: auto;
}

.horizontaltreeview-node {
  position: relative;
  margin-left: $horizontalnodeGutter + $horizontalnodeLabelWidth;
  &:before {
    content: "";
    width: $horizontalnodeGutter / 2;
    border-top: 2px solid $horizontalnodeColor;
    position: absolute;
    left: -$horizontalnodeGutter;
    top: 50%;
    margin-top: 1px;
  }
}

.horizontaltreeview-node-entry {
  position: relative;
  min-height: $horizontalnodeEntryMinHeight;
  &:before {
    content: "";
    height: 100%;
    border-left: 2px solid $horizontalnodeColor;
    position: absolute;
    left: -($horizontalnodeGutter / 2);
  }
  &:after {
    content: "";
    width: $horizontalnodeGutter / 2;
    border-top: 2px solid $horizontalnodeColor;
    position: absolute;
    left: -($horizontalnodeGutter / 2);
    top: 50%;
    margin-top: 1px;
  }
  &:first-child {
    &:before {
      width: $horizontalnodeBorderRadius;
      height: 50%;
      top: 50%;
      margin-top: 2px;
      border-radius: $horizontalnodeBorderRadius 0 0 0;
    }
    &:after {
      height: $horizontalnodeBorderRadius;
      border-radius: $horizontalnodeBorderRadius 0 0 0;
    }
  }
  &:last-child {
    &:before {
      width: $horizontalnodeBorderRadius;
      height: 50%;
      border-radius: 0 0 0 $horizontalnodeBorderRadius;
    }
    &:after {
      height: $horizontalnodeBorderRadius;
      border-top: none;
      border-bottom: 2px solid $horizontalnodeColor;
      border-radius: 0 0 0 $horizontalnodeBorderRadius;
      margin-top: -$horizontalnodeBorderRadius + 1px;
    }
  }
  &.sole {
    &:before {
      display: none;
    }
    &:after {
      width: $horizontalnodeGutter / 2;
      height: 0;
      margin-top: 1px;
      border-radius: 0;
    }
  }
}

.horizontaltreeview-node-label {
  display: block;
  min-width: $horizontalnodeLabelWidth;
  padding: 5px 10px;
  line-height: $horizontalnodeLabelHeight - 5px * 2;
  text-align: center;
 // border: 2px solid $horizontalnodeColor;
  border-radius: $horizontalnodeLabelBorderRadius;
  position: absolute;
  left: 0;
  top: 50%;
  margin-top: -($horizontalnodeLabelHeight / 2);
  //background-color: $horizontalnodeColor;
  cursor: pointer;

  span{
    padding-right: 5px;
  }
}
