[data-he-tree-svg-icon~="root-open"] {background-image: url(svg-tree-icons/tree-view-root-open.svg) !important;}
[data-he-tree-svg-icon~="root-no-children"] {background-image: url(svg-tree-icons/tree-view-root-no-children.svg) !important;}
[data-he-tree-svg-icon~="root-close"] {background-image: url(svg-tree-icons/tree-view-root-close.svg) !important;}
[data-he-tree-svg-icon~="pipe"] {background-image: url(svg-tree-icons/tree-view-pipe.svg) !important;}
[data-he-tree-svg-icon~="pipe-branch"] {background-image: url(svg-tree-icons/tree-view-pipe-branch.svg) !important;}
[data-he-tree-svg-icon~="pipe-branch-last"] {background-image: url(svg-tree-icons/tree-view-pipe-branch-last.svg) !important;}
[data-he-tree-svg-icon~="node-close"] {background-image: url(svg-tree-icons/tree-view-node-close.svg) !important;}
[data-he-tree-svg-icon~="node-no-children"] {background-image: url(svg-tree-icons/tree-view-node-no-children.svg) !important;}
[data-he-tree-svg-icon~="node-open"] {background-image: url(svg-tree-icons/tree-view-node-open.svg) !important;}

[data-he~="tree"]{
    padding: 5px;
}

[data-he~="tree-branch"]{
    display:flex;
    flex-direction:column;
}

[data-he~="tree-branch-head"]{
    display:flex;
    align-items:stretch;
    height:3.5em;   /* 明确高度 */
}

[data-he~="tree-svg-icon"]{
    flex:0 0 auto;
    height:100%;
    aspect-ratio:1/2;
    background-repeat:no-repeat;
    background-size:contain;
    background-position:center;
    background-image: url(svg-icons/tree-view-blank.svg);
    opacity: .1;
}

[data-he~="tree-branch-head-content"]{
    display:flex;
    align-items:center;
    margin: 0 0 0 0.5em;
    padding: 0.4em 0 0 0.5em;
    border-bottom: #cccccc 1px solid;
    flex: 1;
    white-space: nowrap;
    gap: 0.4em;
}
/*
[data-he="tree-branch-head-content"]>[data-he="button"]{
    padding-top: 0.1em !important;
    padding-bottom: 0.1em !important;
}
*/
[data-he~="tree-branch-tree"]{
    margin:0;
    padding:0;
  overflow: hidden;
  max-height: 1000px; /* 最大高度，根据内容自行估计 */
  transition: max-height 0.3s ease, opacity 0.5s ease, transform 0.5s ease;
}
[data-he~="tree-collapse-button"]{
    cursor: pointer;
}
[data-he~="tree-branch-tree"][data-he-show~="true"]{
	visibility: visible;
	opacity: 1;
	transform: translateY(0);
	pointer-events: auto;
    max-height: 1000px; /* 高度收缩 */
}
[data-he~="tree-branch-tree"][data-he-show~="false"]{
	opacity: 0;
	transform: translateY(-5px);
	pointer-events: none;
    max-height: 0; /* 高度收缩 */
}
/*
table{
    width:100%;
    border-collapse:collapse;
}

td, th{
    white-space:nowrap;
}

td:last-child{
    width:100%;
}
 */

[he-data-prefix]::before{
    content: attr(he-data-prefix);
    padding-right:4px;
    opacity: .3;
}

[he-data-suffix]::after{
    content: attr(he-data-suffix);
    padding-left:4px;
    opacity: .3;
}
thead th {
    position: sticky;
    top: 0;
    background: #fff;   /* 必须，不然会透出内容 */
    z-index: 1;
    border-bottom: #6c757d 1px solid;
}
th{
    vertical-align:middle;
    white-space:nowrap;
}
td{
    vertical-align:top;
}