 /* Remove default bullets */
 .cn_tree ul {
    list-style-type: none;
    padding-left: 10px;
  }
  .caret {
    cursor: pointer;
    user-select: none; /* Prevent text selection */
    padding: 4px;
    display:flex;
    align-items: center;   
  }
  .caret::before {
    content: url('../../img/chevron-right-solid.png');
    color: black;
    display: block;
    margin-right: 12px;    
    padding: 0px;
    background-color: none;
    align-content: center;            
  }
  .caret div {
    position: relative;  
    padding: 4px;
  }
  .caret-down::before {
    transform: rotate(90deg);
  }
  /* Hide the nested list */
  .nested {
    display: none;
  }
  /* Show the nested list when the user clicks on the caret/arrow */
  .active {
    display: flex;
    flex-direction: column;
  } 
  ul.cn_tree li {
    padding: 4px;
    display: flex;
    flex-direction: column;
  }
  ul.cn_tree li.cn_bkm {
    background-color: none;
  }
  .cn_bkm {
    display: flex;
    flex-direction: row;
    gap:10px;
    cursor: pointer;
    margin: 2px;
  }
  .cn_bkm:hover {    
    background-color: #f3f3f3;   
    color: var(--main-color);  
  }
  .cn_tree_row {
    display: flex;
    flex-direction: row;;
    gap:15px;
    align-items:center;
    padding: 6px;
  }