/*
文档菜单右键菜单样式
*/
.tree-menu {
  @include box(170px, auto);
  @include themeBg(#f9f9f9, #333434);
  @include themeShadow(2px 2px 5px 1px rgba(49, 49, 49, 0.2), 2px 3px 7px 2px #0f0f0f);
  position: fixed;
  z-index: 2002;
  border-radius: 5px;
  font-size: 12px;

  .doc-name {
    font-size: 13px;
    padding: 5px 10px;
    color: var(--el-color-primary);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  .menu-content {
    margin: 0;
    color: var(--bl-text-color);
    border-top: 1px solid var(--el-border-color);
    padding: 5px 0;

    & > div,
    .menu-item {
      @include flex(row, flex-start, center);
      line-height: 0.9;
      padding: 5px 5px 5px 10px;
      margin: 0 5px 5px 5px;
      border-radius: 5px;
      cursor: pointer;
      position: relative;

      .iconbl {
        margin-right: 5px;
      }

      // 拥有二级菜单的箭头指示
      .bl-a-rightsmallline-line {
        position: absolute;
        right: -2px;
      }

      .bl-pen {
        font-size: 13px;
        margin-right: 8px;
      }

      &:hover {
        background: var(--el-color-primary-light-8);

        .tree-menu-level2 {
          display: block;
          position: absolute;
          left: 160px;
          // top: 0;
        }
      }

      &:last-child {
        margin-bottom: 0;
      }
    }

    .menu-item-divider {
      height: 1px;
      border-bottom: 1px solid var(--el-border-color);
      margin: 0 0 5px 0;
      padding: 0;
    }
  }
}

// 二级菜单
.tree-menu-level2 {
  @include box(170px, auto);
  @include themeBg(#f9f9f9, #333434);
  @include themeShadow(2px 2px 5px 1px rgba(49, 49, 49, 0.2), 2px 3px 7px 2px #0f0f0f);
  position: fixed;
  border-radius: 5px;
  font-size: 12px;
  padding: 5px 0;
  display: none;
  z-index: 2002;

  &:hover {
    display: block;
  }

  & > div {
    @include flex(row, flex-start, center);
    line-height: 0.9;
    padding: 5px 5px 5px 10px;
    margin: 0 5px 5px 5px;
    border-radius: 5px;
    cursor: pointer;
    position: relative;

    .iconbl {
      margin-right: 5px;
    }

    &:hover {
      background: var(--el-color-primary-light-8);
    }

    &:last-child {
      margin-bottom: 0;
    }
  }
}
