.yt-file-tree {
  cursor: pointer;
  color: #4a4a66;
  width: calc(100% - 16px);
  height: 32px;
  margin: 2px 8px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  .menu-icon {
    margin: 0 8px;
  }
  .name {
    margin-left: 8px;
  }
  svg path {
    fill: #4a4a66;
  }
  .file-icon {
    margin-left: 30px;   
  }
  .file-item{
    &:hover {
      .file-action {
        display: flex;
      }
    }
  }
  &.folder-item {
    &:hover {
      .folder-action {
        display: flex;
      }
    }
    .up-down {
      &.open {
        transform: rotate(0deg);
      }
      &.close {
        transform: rotate(-90deg);
      }
      &.hide {
        visibility: hidden;
      }
    }
  }
  &:hover {
    background-color: rgba(28, 27, 113, 0.07);
  }
  &.active {
    color: #3071ef;
    background-color: rgba(48, 113, 239, 0.1);
    svg path {
      fill: #3071ef;
    }
  }
}