.node {
  position: absolute;
  background-color: rgba(0, 0, 0, 0.1);
  border-radius: 6px;
}

.alias,
.contentDivider,
.contentItem,
.contentItemMain {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.alias {
  color: #6d6d6d;
  text-align: center;
  position: relative;
  font-size: 14px;
  font-weight: 600;
}

.menuButton {
  position: absolute;
  right: 0;
  top: 0;
  width: 24px;
  height: 24px;
  font-size: 14px;
  cursor: pointer;
  display: none;
  align-items: center;
  justify-content: center;
}

.menuButton:hover {
  color: var(--text-color-link);
}

.node:hover .alias {
  padding: 0 24px;
}

.node:hover .menuButton {
  display: flex;
}

.contentDivider {
  color: #696969;
  font-size: 12px;
}

.contentItem {
  position: relative;
  padding: 0 8px;
  background-color: rgba(255, 255, 255, 0.8);
  border-radius: 6px;
  cursor: pointer;
}

.contentItemIcon :global(.anticon) {
  width: 1.4em;
  margin-right: 8px;
  vertical-align: middle;
  color: rgba(148, 148, 148, 0.61);
}

.contentItemTypeRoute .contentItemIcon :global(.anticon) {
  color: var(--theme-cyan-color);
}

.contentItemTypeBrick .contentItemIcon :global(.anticon) {
  color: var(--theme-blue-color);
}

.contentItemTypeProvider .contentItemIcon :global(.anticon) {
  color: var(--theme-orange-color);
}

.contentItemTypeTemplate .contentItemIcon :global(.anticon) {
  color: var(--theme-purple-color);
}

.contentItemTypeCustomTemplate,
.contentItemTypeViewTemplate {
  .contentItemIcon :global(.anticon) {
    color: var(--theme-green-color);
  }
}

.contentItemToolbar {
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  padding: 0 8px;
  align-items: center;
  display: none;
  background-color: var(--theme-blue-background);
}

.contentItem:hover {
  background-color: var(--theme-blue-background);
}

.contentItem {
  &:hover,
  &.actionsVisible {
    .contentItemToolbar {
      display: flex;
    }
  }
}

.contentItemMain {
  color: #696969;
}

.contentItemToolbar :global(.ant-btn) {
  vertical-align: middle;
}

.contentItemName {
  font-size: 12px;
}

.contentItemEllipsisButtonAvailable:hover {
  padding-right: 38px;
}

.highlightContentItem {
  background-color: #fcf4ea;
}