.zl-lagre-screen-scene {
  overflow: hidden;
  min-height: 186px;

  flex: 1;
  //firefox修改滚动条样式
  scrollbar-width: thin;
  scrollbar-color: var(--color-scrollbar-thumb) var(--color-scrollbar-track);

  //chrome修改滚动条样式
  &::-webkit-scrollbar {
    width: 8px;
    height: 8px;
  }

  /* chrome滚动槽 */
  &::-webkit-scrollbar-track {
    border-radius: 4px;
    background: var(--color-scrollbar-track);
  }

  /* chrome滚动条滑块 */
  &::-webkit-scrollbar-thumb {
    border-radius: 4px;
    background: var(--color-scrollbar-thumb);
  }

  &::-webkit-scrollbar-thumb:hover {
    background: var(--color-scrollbar-thumb-hover);
  }

  /* chrome滚动条边角 */
  &::-webkit-scrollbar-corner {
    border-radius: 50%;
    background: var(--color-scrollbar-track);
  }

  .zl-lagre-screen-scene-tree-3d {
    height: calc(100% - 35px);

    .zl-lagre-screen-scene-tree-parent {
      border-top: 1px solid var(--color-black);
    }

    .zl-ls-ant-tree-treenode:last-child .zl-lagre-screen-scene-tree-parent {
      border-bottom: 1px solid var(--color-black);
    }

    .zl-ls-ant-tree-treenode:first-child  .zl-lagre-screen-scene-tree-parent {
      border-top: none;
    }
  }

  .zl-lagre-screen-scene-tree {
    padding-bottom: 10px;

    .zl-lagre-screen-scene-ui-active {
      background: var(--color-stroies-page-btn);
    }

    .zl-lagre-screen-scene-ui {
      display: flex;
      width: 100%;
      height: 34px;
      margin: 0;
      padding: 0 var(--spacing20);
      color: var(--color-white);
      font-weight: var(--font-weight-400);
      font-size: var(--font-size-12);
      cursor: pointer;

      align-items: center;

      .zl-icon {
        width: var(--font-size-14);
        height: var(--font-size-14);
        margin-right: 10px;
      }

      &:hover {
        background: var(--color-stroies-page-bg);
      }

      .active
      , .active:hover {
        background: var(--color-stroies-page-bg);
      }
    }

    .zl-ls-ant-tree
    , .ant-tree
    , .zl-ant-tree {
      overflow: auto;
      width: 100%;
      height: 100%;
      border-radius: 0;
      background: transparent;
      //firefox修改滚动条样式

      scrollbar-width: thin;
      scrollbar-color: var(--color-scrollbar-thumb) var(--color-scrollbar-track);

      //chrome修改滚动条样式
      &::-webkit-scrollbar {
        width: 8px;
        height: 8px;
      }

      /* chrome滚动槽 */
      &::-webkit-scrollbar-track {
        border-radius: 4px;
        background: var(--color-scrollbar-track);
      }

      /* chrome滚动条滑块 */
      &::-webkit-scrollbar-thumb {
        border-radius: 4px;
        background: var(--color-scrollbar-thumb);
      }

      &::-webkit-scrollbar-thumb:hover {
        background: var(--color-scrollbar-thumb-hover);
      }

      /* chrome滚动条边角 */
      &::-webkit-scrollbar-corner {
        border-radius: 50%;
        background: var(--color-scrollbar-track);
      }

      .zl-ls-ant-tree-indent
      , .zl-ant-tree-indent
      , .ant-tree-indent {
        display: none;
      }

      .zl-ls-ant-tree-switcher
      , .zl-ant-tree-switcher
      , .ant-tree-switcher {
        display: none;
      }

      .zl-ls-ant-tree-treenode
      , .zl-ant-tree-treenode
      , .ant-tree-treenode {
        width: 100%;
        padding: 0;
      }

      .zl-ls-ant-tree-node-content-wrapper
      , .zl-ant-tree-node-content-wrapper
      , .ant-tree-node-content-wrapper {
        width: 100%;
        padding: 0;
      }

      .zl-ls-ant-tree-show-line .zl-ls-ant-tree-switcher
      , .zl-ant-tree-show-line .zl-ant-tree-switcher
      , .ant-tree-show-line .ant-tree-switcher {
        background: transparent;
        color: var(--color-stories-font);
      }

      .zl-ls-ant-tree-node-content-wrapper
      , .zl-ant-tree-node-content-wrapper
      , .ant-tree-node-content-wrapper {
        overflow: hidden;
        width: 198px;
        height: 34px;
        border-radius: 0;
        line-height: 34px;
        color: var(--color-white);
        font-weight: var(--font-weight-400);
        font-size: var(--font-size-12);
        white-space: nowrap;
        text-overflow: ellipsis;

        .zl-ls-ant-tree-title
        , .zl-ant-tree-title
        , .ant-tree-title {
          color: var(--color-font);
          font-weight: var(--font-weight-400);
          font-size: var(--font-size-12);
        }
      }

      .zl-ls-ant-tree-node-selected
      , .zl-ant-tree-node-selected
      , .ant-tree-node-selected {
        background: var(--color-stroies-page-btn);

        .zl-ls-ant-tree-node-content-wrapper
        , .zl-ant-tree-node-content-wrapper
        , .ant-tree-node-content-wrapper {
          background: var(--color-stroies-page-btn);
        }
      }

      .zl-ls-ant-tree-node-content-wrapper:hover
      , .zl-ant-tree-node-content-wrapper:hover
      , .ant-tree-node-content-wrapper:hover {
        background: var(--color-stroies-page-btn);
      }

      .zl-lagre-screen-scene-tree-parent-name {
        display: flex;
        margin: 0;
        font-size: var(--font-size-12);

        align-items: center;
      }

      .zl-lagre-screen-scene-tree-children {
        height: 34px;
        padding-left: 44px;

        span {
          overflow: hidden;
          display: inline-block;
          width: 130px;
          white-space: nowrap;
          text-overflow: ellipsis;
        }

        input {
          width: 138px;
        }

        .zl-lagre-screen-scene-tree-children-hidden-icon {
          width: 24px;
          height: 34px;
          text-align: center;
          cursor: pointer;
        }
      }

      .zl-lagre-screen-scene-tree-parent {
        display: flex;
        height: 34px;
        padding: 0 var(--spacing20);

        justify-content: space-between;
        align-items: center;

        .zl-lagre-screen-scene-tree-parent-name span:not(.anticon) {
          overflow: hidden;
          display: inline-block;
          width: 100px;
          white-space: nowrap;
          text-overflow: ellipsis;
        }

        span.anticon {
          width: var(--font-size-14);
          height: var(--font-size-14);
          margin-right: 10px;
        }

        .zl-lagre-screen-scene-tree-parent-add {
          margin: 0;
          padding: 0;
          line-height: 12px;
          font-size: var(--font-size-14);
          cursor: pointer;
        }

        .zl-ls-scene-operation-menu {
          cursor: pointer;
        }

        .zl-lagre-screen-layer-tree-parent-name {
          display: flex;
          width: 100%;
          margin: 0;
          font-size: var(--font-size-12);

          justify-content: space-between;
          align-items: center;
        }
      }
    }
  }

  .zl-lagre-screen-3D-scene {
    display: flex;
    width: 100%;
    margin-right: -3px;
    padding: 0 20px;
    border-bottom: 1px solid var(--color-black);
    line-height: 34px;
    color: var(--color-font);
    font-weight: var(--font-weight-400);
    font-size: var(--font-size-12);

    justify-content: space-between;
    align-items: center;

    p {
      text-align: right;

      .zl-lagre-screen-layer-tree-parent-name-use {
        display: inline-block;
        margin-left: var(--spacing);
        padding: 0 5px;
        border: 1px solid var(--color-main);
        border-radius: var(--border-radius-4);
        line-height: 16px;
        color: var(--color-main);
        font-weight: var(--font-weight-400);
        transform: scale(.84);
      }
    }
  }
}