

.tree-view {
    /* background-color: var(--cobalt--bleu-digital-10); */
    border: 1px solid var(--cobalt--grey-20);
    border-radius: 8px;
    height: 250px;
    list-style-type: none;
    margin-bottom: 10px;
    overflow: auto;
    padding: 15px;
}

.tree-view .hidden {
    display: none;
}

.tree-view ul {
    margin-left: 16px;
    list-style: none;
}

.tree-view span.nodeLabel {
    cursor: pointer
}

.tree-view span.nodeLabel.selected {
    border: 1px solid #aaa;
    background-color: #ddd;
    padding: 1px 3px
}

.tree-view li .node {
    padding-bottom: 5px
}

.tree-view li div.selected {
    border-color: lightblue;
    background-color: lightblue
}

.tree-view li>ul {
    display: none
}

.tree-view li>ul.expanded {
    display: block
}

.tree-view li a.nav {
    cursor: pointer;
    display: inline-block;
    width: 16px;
    height: 16px;
    vertical-align: middle;
    background-image: url(/ngax/img/treeicons.png);
    background-repeat: no-repeat;
    background-position: -80px 0;
    background-size: 112px 64px
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.25),only screen and (min-resolution:192dpi),only screen and (min-resolution:1.25dppx) {
    .tree-view li a.nav {
        background-image:url('/ngax/img/treeicons_2x.png')
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 2.25),only screen and (min-resolution:288dpi),only screen and (min-resolution:2.25dppx) {
    .tree-view li a.nav {
        background-image:url('/ngax/img/treeicons_3x.png')
    }
}

.tree-view li a.nav.leaf {
    background: none
}

.tree-view li a.nav.expanded {
    background-position: -80px -16px
}

.tree-view li a.type {
    cursor: auto;
    display: inline-block;
    width: 16px;
    height: 16px;
    vertical-align: middle;
    background-image: url(/ngax/img/treeicons.png);
    background-repeat: no-repeat;
    background-position: 0 -16px;
    background-size: 112px 64px
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.25),only screen and (min-resolution:192dpi),only screen and (min-resolution:1.25dppx) {
    .tree-view li a.type {
        background-image:url('/ngax/img/treeicons_2x.png')
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 2.25),only screen and (min-resolution:288dpi),only screen and (min-resolution:2.25dppx) {
    .tree-view li a.type {
        background-image:url('/ngax/img/treeicons_3x.png')
    }
}

.tree-view li a.type.invisible {
    background-position: 0 -32px
}

.tree-view li a.type.loading {
    cursor: progress;
    background-image: url(/ngax/img/loader-16.gif);
    background-repeat: no-repeat;
    background-position: 0px 0px;
    background-size: 16px 16px
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.25),only screen and (min-resolution:192dpi),only screen and (min-resolution:1.25dppx) {
    .tree-view li a.type.loading {
        background-image:url('/ngax/img/loader-32.gif')
    }
}

.tree-view li a.type.x-tree-icon-drive {
    background-position: -16px -16px
}

.tree-view li a.type.x-tree-icon-leaf {
    background-position: -32px -16px
}

.tree-view li a.type.x-tree-icon-symlink {
    background-position: -48px -16px
}

.tree-view li a.type.x-tree-icon-userdata {
    background-position: -16px -48px
}

.tree-view li a.type.x-tree-icon-locked {
    background-position: -64px -16px
}

.tree-view li a.type.x-tree-icon-broken {
    background-position: -64px -16px
}

.tree-view li a.type.x-tree-icon-computer {
    background-position: 0 -48px
}

.tree-view li a.type.x-tree-icon-hyperv {
    background-position: -96px -16px
}

.tree-view li a.type.x-tree-icon-hypervmachine {
    background-position: -96px 0
}

.tree-view li a.type.x-tree-icon-mssql {
    background-position: -96px -32px
}

.tree-view li a.type.x-tree-icon-mssqldb {
    background-position: -80px -32px
}

.tree-view li a.type.x-tree-icon-mydocuments {
    background-position: -32px -48px
}

.tree-view li a.type.x-tree-icon-mymusic {
    background-position: -48px -48px
}

.tree-view li a.type.x-tree-icon-mypictures {
    background-position: -64px -48px
}

.tree-view li a.type.x-tree-icon-desktop {
    background-position: -80px -48px
}

.tree-view li a.type.x-tree-icon-home {
    background-position: -96px -48px
}

.tree-view li a.type.x-tree-icon-drive.invisible {
    background-position: -16px -32px
}

.tree-view li a.type.x-tree-icon-leaf.invisible {
    background-position: -32px -32px
}

.tree-view li a.type.x-tree-icon-symlink.invisible {
    cursor: auto;
    background-position: -48px -32px
}

.tree-view li a.type.x-tree-icon-locked.invisible {
    background-position: -64px -32px
}

.tree-view li a.check {
    height: 16px;
    width: 16px;
    display: inline-block;
    cursor: pointer;
    background-image: url(/ngax/img/treeicons.png);
    background-repeat: no-repeat;
    background-position: 0 0;
    vertical-align: middle;
    background-size: 112px 64px
}

@media only screen and (-webkit-min-device-pixel-ratio: 1.25),only screen and (min-resolution:192dpi),only screen and (min-resolution:1.25dppx) {
    .tree-view li a.check {
        background-image:url('/ngax/img/treeicons_2x.png')
    }
}

@media only screen and (-webkit-min-device-pixel-ratio: 2.25),only screen and (min-resolution:288dpi),only screen and (min-resolution:2.25dppx) {
    .tree-view li a.check {
        background-image:url('/ngax/img/treeicons_3x.png')
    }
}

.tree-view li a.partial {
    background-position: -32px 0
}

.tree-view li a.include {
    background-position: -16px 0
}

.tree-view li a.exclude {
    background-position: -48px 0
}

.tree-view li a.root {
    background: none;
    display: none
}
