.FileIcon,
.FolderIcon {
  height: 20px;
  width: 20px;
  margin-right: 5px;
  margin-bottom: -5px;
}
.FileIcon {
  fill: grey;
}
.FolderIcon {
  fill: rgb(116, 209, 248);
}
.Active .FileIcon,
.Active .FolderIcon {
  fill: white;
}

.IconsWrapper {
  display: none;
  position: relative;
  top: 3px;
}

.Header {
  white-space: pre-wrap;
}

.HeaderWrapper:hover .IconsWrapper {
  display: inline-block;
}

.InfoIcon :global(.cls-1) {
  fill: var(--primary-color);
}

.InfoIcon :global(.cls-2) {
  fill: white;
}

.Active .InfoIcon :global(.cls-1) {
  fill: white;
}

.Active .InfoIcon :global(.cls-2) {
  fill: var(--primary-color);
}

.InfoIcon,
.DeleteIcon,
.RenameIcon,
.AddFolderIcon {
  fill: var(--primary-color);
  height: 14px;
  width: 14px;
  margin-left: 15px;
  padding: 1px;
}

.InfoIcon:hover :global(.cls-1),
.DeleteIcon:hover,
.RenameIcon:hover,
.AddFolderIcon:hover {
  fill: rgba(var(--primary-color-rgb, 0.7));
}

.Active .InfoIcon,
.Active .DeleteIcon,
.Active .RenameIcon,
.Active .AddFolderIcon {
  fill: white;
}

.Active .InfoIcon:hover :global(.cls-1),
.Active .DeleteIcon:hover,
.Active .RenameIcon:hover,
.Active .AddFolderIcon:hover {
  fill: lightgrey;
}

.NodeName {
}

.Counter {
  font-size: 12px;
  border-radius: 22px;
  color: white;
  display: inline;
  padding-left: 5px;
  padding-right: 5px;
  font-weight: bold;
  text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.2);
  background-color: var(--icon-neutral-color);
}