.vtk-tree {
}

.vtk-tree ul {
    margin: 0 0 0 -1.5em;
    padding: 0 0 0 1.5em;
}

.vtk-tree li .node {
  list-style: none;
  line-height: 1.5em;
  position: relative;
  top: 0px;
}

.vtk-tree li .node .node-line {
  cursor: pointer;
  margin-left: 20px;
  margin-right: 5px;
  top: .25em;
  position: relative;
}

.vtk-tree li .node .node-line div {
  display: inline-block;
}

.vtk-tree li .node .node-line .head {
  position: absolute;
  background-image: url("resources/file.png");
  height: 1.5em;
  width: 1.5em;
  background-repeat: no-repeat;
  background-position: right center;
  overflow: hidden;
  left: -1.6em;
}

.vtk-tree li .label {
    font-family: Arial,sans-serif;
    font-size: 1em;
    font-weight: bold;
    position: relative;
    margin-left: 7px;
}

.vtk-tree li .node .node-line .label {
}

.vtk-tree li .node .node-line .tail {
  height: 1.5em;
  margin-right: 10px;
  position: relative;
  float: right;
}

.vtk-tree li .node .children {
}

.vtk-tree .action {
    cursor: pointer;
}

/* Tree images */

.vtk-tree ul ul {
  background: url("resources/list-item-contents.png") repeat-y scroll 5px center transparent;
}

.vtk-tree li {
  background: url("resources/list-item-root.png") no-repeat scroll left top transparent;
  list-style: none;
  margin: 0;
  padding: 0;
}

.vtk-tree li li {
  background-image: url("resources/list-item.png");
  padding-left: 1.5em;
}

.vtk-tree li.lastChild > ul {
    background-image: none;
}

.vtk-tree li.lastChild {
    background-image: url("resources/list-item-last.png");
}

.vtk-tree li.open {
    background-image: url("resources/list-item-open.png");
}

.vtk-tree li.open.lastChild {
    background-image: url("resources/list-item-last-open.png");
}

.vtk-tree li ul {
    position: relative;
}

.vtk-tree .label {

}

/* Root node tree image */
.vtk-tree > ul > li {
  background-image: none !important;
}

.vtk-tree > ul > li .head {
  position: absolute;
  background-image: url("resources/folder.png");
  height: 1.5em;
  width: 1.5em;
  background-repeat: no-repeat;
  background-position: right center;
  overflow: hidden;
  left: -6px;
  top: 0;
}

.vtk-tree > ul > li > div > .label {
  margin-left: 20px;
}

/* Selection management */

.vtk-tree li .node .node-line:hover {
  background: #eeeeee;
  border-radius: 5px;
}

.vtk-tree li .node .node-line .tail div {

}

.vtk-tree li .node .node-line.selected {
  background: #cccccc;
  border-radius: 5px;
}

/* Type icon management */

.vtk-tree li[type='root'] .head {
  background-image: url("resources/server.png") !important;
}

.vtk-tree li[type='source'] .head {
  background-image: url("resources/source.png") !important;
}

.vtk-tree li[type='filter'] .head {
  background-image: url("resources/filter.png") !important;
}

/* ==================== Custom Pipeline usage ==================================== */
.vtk-tree .tail div {
  position: relative;
  width: 25px;
  height: 25px;
}

/* =========== REPRESENTATION ========= */
.vtk-tree .tail div[type='representation'] {

  background: url("resources/pipeline/representations.png") no-repeat center center transparent;
}

.vtk-tree .tail div[type='representation'][data='hide'] {
    background-position: 0px;
}

.vtk-tree .tail div[type='representation'][data='outline'] {
    background-position: -34px;
}

.vtk-tree .tail div[type='representation'][data='wireframe'] {
    background-position: -68px;
}

.vtk-tree .tail div[type='representation'][data='surface'] {
    background-position: -102px;
}

.vtk-tree .tail div[type='representation'][data='surface_edge'] {
    background-position: -136px;
}

.vtk-tree .tail div[type='representation'][data='volume'] {
    background-position: -170px;
}

/* =========== COLOR BY ========= */

.vtk-tree .tail div[type='colorBy'] {
    background: url("resources/pipeline/colorBy.png") no-repeat center center transparent;
    background-position: 2px;
}

.vtk-tree .tail div[type='colorBy'][field='points'] {
    background-position: 2px;
}

.vtk-tree .tail div[type='colorBy'][field='cells'] {
    background-position: -22px;
}

.vtk-tree .tail div[type='colorBy'][field='color'] {
  background: none;
}

/* =========== SCALAR BAR ========= */

.vtk-tree .tail div[type='bar'] {
    background: url("resources/pipeline/scalarbar.png") no-repeat center center transparent;
    background-position: -22px;
}

.vtk-tree .tail div[type='bar'][data='on'] {
    background: url("resources/pipeline/scalarbar.png") no-repeat transparent;
    background-position: 2px;
}
