/* -------------------------------------------------------------------------- */
/* Tree view */
/* original idea http://www.bootply.com/phf8mnMtpe */
.tv {
    /* entire tree */
    min-height: 20px;
    margin: 10px 0 200px -80px;
    /*  border-radius: 4px; */
    /*  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05); */
    z-index: 999;
}
.tv table.boxview th,
.tv table.boxview td {
  padding: 0;
  padding: 5px 0 0 0;
}
.tv table.action th {
  padding: 5px 0 5px 0;
}
.tv table.action td {
  padding: 5px 0 5px 0;
}

.tv li {     /* location of box */
    list-style-type: none;
    padding: 10px 5px 0 5px;
    position: relative;
    padding: 10px 5px 0 5px;
    margin: 0 0 0 100px;

    margin: 0 0 -5px 100px;  /* reduce horizontal space 29/3/2025*/
  }
  .tv li::before,
  .tv li::after {
    content: "";
    left: -24px;          /* contact point of horizontal link */
    position: absolute;
    right: auto;
  }
  .tv li::before {
    /* vertical contact position to the box */
    border-left: 1px solid var(--dark-border);
    bottom: 0;
    height: 100%;
    top: 0;       /* corner to the box */
    width: 1px;
  }
  .tv li::after {
    /* horizontal contact position to the box */
    border-top: 1px solid var(--dark-border);
    height: 20px;
    top: 60px;    /* contact point to the side */
    width: 38px;
  }
  .tv li div {
    /* box */
    border: 1px solid var(--dark-border);
    border-radius: 6px;
    display: inline-block;

    /* contact point to the bottom */
    text-decoration: none;
    width: max-content;
    background-color: #f7f7f7;
    border: 10px solid transparent;
    border-image: url(/gia_pha/img/borders/fg_03.png) 30 stretch;

    min-width: 60px;
    min-height: 10px;

    padding: 0;
    margin: 0 0 0 8px;        /* horizontal connector */
    margin: 0 0 -8px 8px;     /* horizontal connector */
  }
  .tv li.parent_li>span {
    cursor: pointer;
  }
  .tv>ul>li::before,
  .tv>ul>li::after {
    border: 0;
  }
  .tv li:last-child::before {
    /* contact point */
    height: 60px;
  }
  .tv li.parent_li>span:hover,
  .tv li.parent_li>span:hover+ul li span {
    background: #eee;
    border: 1px solid #94a0b4;
    color: var(--v-text);
  }
/* ========================================================================== */