.tree-view {
  margin-left: -20px;
  margin-top: 2em;
  margin-bottom: 2em; }
  .tree-view__folder {
    padding-left: 20px;
    position: relative; }
    .tree-view__folder-title {
      margin-left: -20px; }
  .tree-view__folder-title {
    margin-bottom: 0.2em;
    cursor: pointer; }
  .tree-view__subfolders {
    margin-bottom: 1em;
    display: none; }
    .tree-view__subfolders:empty {
      margin-bottom: 0; }
  .tree-view__files {
    display: none;
    margin-bottom: 0.8em; }
  .tree-view .tree-view__folder > .tree-view__subfolders,
  .tree-view .tree-view__folder > .tree-view__files {
    display: block; }

.tree-file {
  margin-bottom: 0.8em;
  line-height: 1em; }
  .tree-file:first-child {
    margin-top: 0.4em; }
  .tree-file__title {
    display: flex;
    justify-content: space-between; }
  .tree-file__size {
    font-size: 0.7em; }
  .tree-file__filename {
    margin-top: 0.2em;
    font-size: 0.7em;
    opacity: 0.5; }