@mixin clearfix {
  &:after {
    content: "";
    display: table;
    clear: both;
  }
}

@mixin noselect {
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}



@mixin fix_paddings_for_hovered_group($item-offset-left, $treeline-thick, $border-left-width, $border-left-width-hover) {
  & > .group--header,
  & > .group--footer,
  & > .group--field--count--rule {
    padding-left: calc($item-offset-left / 2 - $treeline-thick - $border-left-width-hover + $border-left-width);
  }
  & > .group--children {
    padding-left: calc($item-offset-left - $border-left-width-hover + $border-left-width);
  }
}

@mixin fix_padding_for_hovered($padding, $border-left-width, $border-left-width-hover) {
  padding-left: calc($padding - ($border-left-width-hover - $border-left-width));
}

@mixin line_position_for_header($treeline-offset-from-conjs, $item-offset-left, $treeline-thick, $treeline-color) {
  &::before {
    border-color: $treeline-color;
    border-width: 0 0 0 $treeline-thick;
    top: calc($treeline-offset-from-conjs);
    height: calc(100% + $item-offset - $treeline-offset-from-conjs);
    left: calc(+1 * ($item-offset-left / 2 - $treeline-thick / 2));
    width: calc($item-offset-left / 2 + $treeline-thick / 2);
  }
}

@mixin fix_line_position_for_hovered_header($item-offset-left, $treeline-thick, $border-left-width, $border-left-width-hover) {
  &::before {
    left: calc(+1 * ($item-offset-left / 2 - $treeline-thick / 2) - ($border-left-width-hover - $border-left-width));
  }
}



/******************************************************************************/
/** TREE LINES ****************************************************************/
/******************************************************************************/


@mixin hide_conjs_for_group(
  $item-offset, $treeline-thick, $treeline-radius,
  $rule-border-width, $group-border-width, $rulegroup-border-width, $rulegroupext-border-width
) {
  & > .group-or-rule-container:first-child {
    & > .group-or-rule {
      &::before {
        display: none;
      }
      &::after {
        border-radius: $treeline-radius 0 0 0;
        border-width: $treeline-thick 0 0 $treeline-thick;
      }
      &::after {
        top: calc(50% - $treeline-thick / 2);
        height: calc(50% + $treeline-thick / 2 + $item-offset + $rule-border-width);
      }
    }
    & > .simple_group {
      &::after {
        height: calc(50% + $treeline-thick / 2 + $item-offset + $group-border-width);
      }
    }
    & > .rule_group {
      &::after {
        height: calc(50% + $treeline-thick / 2 + $item-offset + $rulegroup-border-width);
      }
    }
    & > .rule_group_ext {
      &::after {
        height: calc(50% + $treeline-thick / 2 + $item-offset + $rulegroupext-border-width);
      }
    }
  }
}

@mixin line_position_for_item($item-border-left-width, $item-border-left-width-hover, $item-border-width, $item-offset-left, $item-offset, $treeline-thick) {
  &::before {
    border-width: 0 0 $treeline-thick $treeline-thick;
    top: calc(-1 * $item-border-width);
    height: calc(50% + $treeline-thick / 2 + $item-border-width);
  }

  &::after {
    border-width: 0 0 0 $treeline-thick;
    top: calc(50% + $treeline-thick / 2);
    height: calc(50% - $treeline-thick / 2 + $item-offset + $item-border-width);
  }

  &::before, &::after {
    left: calc(-1 * ($item-offset-left / 2 + $treeline-thick / 2 + $item-border-left-width));
    width: calc($item-offset-left / 2 + $treeline-thick / 2);
  }

  &:hover {
    &::before, &::after {
      left: calc(-1 * ($item-offset-left / 2 + $treeline-thick / 2 + $item-border-left-width-hover));
    }
  }
}

@mixin line_positions_for_group(
  $item-offset-left, $item-offset,
  $treeline-thick, $treeline-radius, $treeline-color,
  $rule-border-width, $group-border-width, $rulegroup-border-width, $rulegroupext-border-width,
  $rule-border-left-width-hover, $group-border-left-width-hover, $rulegroup-border-left-width-hover, $rulegroupext-border-left-width-hover
) {
  & > .group-or-rule-container:last-child {
    & > .group-or-rule {
      &::before {
        border-radius: 0 0 0 $treeline-radius;
      }
    }
  }
  & > .group-or-rule-container {
    & > .group-or-rule {
      &::before, &::after {
        border-color: $treeline-color;
      }
    }
    & > .rule {
      @include line_position_for_item($rule-border-width, $rule-border-left-width-hover, $rule-border-width, $item-offset-left, $item-offset, $treeline-thick);
    }
    & > .simple_group {
      @include line_position_for_item($group-border-width, $group-border-left-width-hover, $group-border-width, $item-offset-left, $item-offset, $treeline-thick);
    }
    & > .rule_group {
      @include line_position_for_item($rulegroup-border-width, $rulegroup-border-left-width-hover, $rulegroup-border-width, $item-offset-left, $item-offset, $treeline-thick);
    }
    & > .rule_group_ext {
      @include line_position_for_item($rulegroupext-border-width, $rulegroupext-border-left-width-hover, $rulegroupext-border-width, $item-offset-left, $item-offset, $treeline-thick);
    }
    & > .case_group {
      @include line_position_for_item($case-border-width, $case-border-width, $case-border-width, $item-offset-left, $item-offset, $treeline-switch-thick);
    }
  }
}

