/* jqTree theme override to mimic legacy jquery.treeview.
   Uses sprites from /graphic/jqTree-compat/images/ */

/* Reset list appearance */
ul.jqtree-tree,
ul.jqtree-tree ul.jqtree_common {
  padding: 0;
  margin: 0;
  list-style: none;
}

/* Indentation similar to treeview (16px) */
ul.jqtree-tree ul.jqtree_common {
  margin-top: 4px;
  margin-left: 0;
  padding-left: 16px;
}

/* Base item sizing/typography */
ul.jqtree-tree li.jqtree_common {
  font-size: 12px;
  margin: 0;
  background: url("/graphic/jqTree-compat/images/treeview-famfamfam-line.gif") 0 0 no-repeat;
  padding-left: 16px;
}

/* Folder items get the "branch" background position like treeview */
ul.jqtree-tree li.jqtree-folder {
  background-position: 0 -176px;
}

ul.jqtree-tree .jqtree-element {
  /* Treeview had padding on the LI; jqTree renders a div element per node. */
  display: flex;
  align-items: center;
  gap: 0;
  padding: 3px 0;
}

/* Title text */
ul.jqtree-tree .jqtree-title {
  color: inherit; /* inherit from surrounding layout */
}

ul.jqtree-tree .jqtree-title:hover {
  color: #808080; /* treeview hoverTree */
}

/* Links in titles should look like old tree anchors */
ul.jqtree-tree .jqtree-title a {
  color: inherit;
  text-decoration: none;
  display: inline-block;
  padding: 1px 2px;
}

ul.jqtree-tree .jqtree-title a:hover {
  color: #808080;
}

/* Legacy selection class support (treeview used a.selected) */
ul.jqtree-tree .jqtree-title a.selected {
  font-weight: 700;
}

/* Selected: treeview a.selected { background: #eee; } */
ul.jqtree-tree li.jqtree-selected > .jqtree-element,
ul.jqtree-tree li.jqtree-selected > .jqtree-element:hover {
  background: transparent !important;
  background-image: none !important;
  text-shadow: none !important;
}

/* Old treeview emphasized selection mostly via bold text */
ul.jqtree-tree li.jqtree-selected .jqtree-title,
ul.jqtree-tree li.jqtree-selected .jqtree-title a {
  font-weight: 700;
}

/* Toggler ("hitarea") */
ul.jqtree-tree a.jqtree-toggler {
  width: 16px;
  height: 16px;
  flex: 0 0 16px;
  margin-right: 4px;
  border-bottom: none;
  text-decoration: none;
  display: inline-block;
  overflow: hidden;
  text-indent: -9999px;
  background-image: url("/graphic/jqTree-compat/images/treeview-newDesign.gif") !important;
  background-repeat: no-repeat;
  background-position: -64px -25px; /* treeview .hitarea */
}

/* Closed (expandable) */
ul.jqtree-tree a.jqtree-toggler.jqtree-closed {
  background-position: -80px -3px; /* treeview .expandable-hitarea */
}

/* Remove jqTree default left margin that assumes toggler text */
ul.jqtree-tree .jqtree-title-button-left {
  margin-left: 0;
}

/* Make row background/hover span the container */
ul.jqtree-tree .jqtree-element {
  width: 100%;
}


