.tree-line .tree-cross {
  display: inline-block;
  position: relative;
  width: 1.5em;
  vertical-align: top;
  margin: 0;
  padding: 0;
}

/* Dynamiczna wysokość – zależna od zawartości */
.tree-line {
  display: flex;
  align-items: stretch;
}

/* Pełna pionowa linia na środku */
.v-full::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  width: 1px;
  height: 100%;
  background: #999;
  transform: translateX(-50%);
}

/* Połowa pionowa z góry */
.v-top::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  width: 1px;
  height: 50%;
  background: #999;
  transform: translateX(-50%);
}

/* Połowa pionowa z dołu */
.v-bottom::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 1px;
  height: 50%;
  background: #999;
  transform: translateX(-50%);
}

/* Pełna pozioma linia na środku */
.h-full::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 100%;
  height: 1px;
  background: #999;
  transform: translateY(-50%);
}

/* Połowa pozioma z lewej */
.h-left::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 50%;
  height: 1px;
  background: #999;
  transform: translateY(-50%);
}

/* Połowa pozioma z prawej */
.h-right::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 50%;
  height: 1px;
  background: #999;
  transform: translateY(-50%);
}

.tree-label {
  padding: 0.5em;
  flex-grow: 1;
  text-align: left;
  display: flex;
  align-items: center;
}

.tree-node-filter {
  background: #FFFF00;
}



.tree-toggle {
  cursor: pointer;
  user-select: none;
  margin-right: 0.3em;
}

.tree-icon-toggle {
  position: relative;
  z-index: 1;
  display: inline-flex;
  width: 1.5em;
  height: 100%;
  align-items: center;
  justify-content: center;
}

.tree-icon-bg {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0.8em;
  height: 0.8em;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background-color: white;
  z-index: 1;
}

.tree-icon-inner {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1em;
  height: 1em;
}

.tree-icon-toggle .icon-rotatable {
  transform: rotate(0deg);
  transition: transform 0.3s ease;
  display: inline-block;
}

.tree-icon-toggle.rotated .icon-rotatable {
  transform: rotate(-180deg);
}

.tree-insert-point-node {
  background: #FFFF00;
  border-radius: 0.3em;
  padding: 0.3em;
}

.tree-insert-point-leaf {
  background: #ff8c00;
  border-radius: 0.3em;
  padding: 0.3em;
}

.tree-line.tree-drop-active {
  background: #ffe580 !important;
  box-shadow: 0 0 0 2px #ffb800;
  transition: background 0.1s;
}