/*
    tree-nav.css 
    credito: johnbarnitz - https://codepen.io/johnbarnitz/pen/gOPbVer


 Only custom marker for summary/details
 For cross browser compatible styling hide Firefox's marker by setting summary { display: block }
 and Chrome and Safari's marker by setting ::-webkit-details-marker {display: none;}
*/
summary {
  display: block;
  cursor: pointer;
  outline: 0; 
}

summary::-webkit-details-marker {
    display: none;
  }


  /*
body {
  background-color: #191c1e;
  color: white;  
  font-size: 1.6rem;
  font-family: arial;
  margin: 0;
  padding: 3rem;
}
*/


.tree-nav__item {
  display: block;
  white-space: nowrap;
  color: #ccc;
  position: relative;
}
.tree-nav__item.is-expandable::before {
  border-left: 1px solid rgb(99, 99, 99);
  content: "";
  height: 100%;
  left: 0.8rem;
  position: absolute;
  top: 2.2rem;
  height: calc(100% - 2.4rem);
}
.tree-nav__item .tree-nav__item {
  margin-left: 0.9rem;

}
.tree-nav__item.is-expandable[open] > .tree-nav__item-title::before {
  font-family: "ionicons";
  transform: rotate(90deg);
}
.tree-nav__item.is-expandable > .tree-nav__item-title {
  padding-left: 1.5rem;

}
.tree-nav__item.is-expandable > .tree-nav__item-title::before {
  position: absolute;
  will-change: transform;
  transition: transform 300ms ease;
  font-family: "ionicons";
  color: #fff;
  font-size: 0.9rem;
  content: "\f125";
  left: 0;
  display: inline-block;
  width: 1.6rem;
  text-align: center;

}

.tree-nav__item-title {
  cursor: pointer;
  display: block;
  outline: 0;
  color: #fff;
  font-size: 1.25rem;
  line-height: 1.5rem;  
  user-select: none;
  text-shadow: 2px 2px 3px black;
}

.tree-nav__item-title:hover {
  color: #e7e7e7;
  transition: 0.25s;
}



.tree-nav__item-title .icon {
  display: inline;
  padding-left: 1.6rem;
  margin-right: 0.8rem;
  color: #666;
  font-size: 1.0rem;
  position: relative;
}
.tree-nav__item-title .icon::before {
  top: 0;
  position: absolute;
  left: 0;
  display: inline-block;
  width: 1.6rem;
  text-align: center;
}

.tree-nav__item-title::-webkit-details-marker {
  display: none;
}


/*
  esta class estava em uso mas "sumiu", provisoriamente
  definindo a cor que ela tinha (bug de layer fora grupo)
*/
.label_layer {
  color: rgb(218, 218, 218);
  /*font-size: 1.0rem;*/
  font-stretch: 50%;
}

.label_layer:hover {
  color: rgb(238, 238, 238);
  transition: 0.25s;
}


.label_link {
  color: rgb(218, 218, 218);

}



.icon_flash:hover {
  background-color: gray;
  transition: 0.25s;
}