.doc-menu {max-height: calc(100vh - 105px); min-height: 32px;}
.doc-menu .active {color: var(--color-primary-600); font-weight: 500;}
.doc-menu header a:hover > .icon {color: var(--color-primary-600) !important;}
.doc-menu .tree-item * {white-space: nowrap;}
.doc-menu .tree-item .item-content {color: var(--color-gray-700)}
.doc-menu .tree-item > .selected .item-content {color: var(--color-fore)}

#docDropmenu .primary {--tw-ring-color: var(--btn-border-color); background-color: var(--btn-bg); color: inherit; width: 100%;}
#pick-docDropmenuMenu {width: 200px; border: solid 1px; border-radius: 4px; border-color: var(--color-primary-500); --skin-ghost-rgb: #FFF; justify-content: flex-start; position: absolute; top: -44px;}
#pick-docDropmenuMenu > .icon.is-leading {width: 18px; height: 18px; border-radius: 50%; border: 1px solid var(--color-primary-500); display: flex; align-items: center; justify-content: center; transform: rotate(90deg); transition: .2s all; left: 0.75rem;}
#pick-docDropmenuMenu > .text {flex: auto; display: flex; align-items: center; justify-content: flex-start; font-size: 14px; padding: 0 4px; padding-left: 1.75rem;}
#pick-docDropmenuMenu .is-caret {display: none;}

.doc-menu .tree .tree-item .item-content {overflow: clip;}
.doc-menu .tree .tree-item .icon-move {margin-left: 0; visibility: hidden;}
.doc-menu .tree .tree-item .listitem:hover .icon-move {visibility: visible;}
.doc-menu .tree .tree-item .toolbar {margin-left: 0; visibility: hidden;}
.doc-menu .tree .tree-item .listitem:hover .toolbar {visibility: visible;}
.doc-menu .tree .tree-item .toolbar .versions-list .text{overflow: hidden; width: 25px;}
.doc-menu .tree .tree-item .tree-link {text-overflow: clip; overflow: hidden; flex: 1 10 auto;}
.doc-menu .tree .tree-item .tree-actions {margin-left: 0;}
.doc-menu .tree .tree-item .tree-actions .icon-ellipsis-v {display: none;}
.doc-menu .tree .tree-item .tree-item-content:hover .tree-actions .icon {display: block;}
.doc-menu .tree .tree-item .tree-item-content .tree-actions .with-popover-show .icon {display: block;}

.doc-menu-header.is-fixed {position: absolute; left: 0; top: -44px; width: 190px; height: 32px; border: 1px solid var(--color-border); justify-content: center; padding: 0 24px; border-right: 0;}
.doc-menu-header.is-fixed::before,
.doc-menu-header.is-fixed::after {content: ''; position: absolute; top: 0; right: -12px; width: 0; height: 0; border-style: solid; border-color: transparent transparent transparent var(--color-border); border-width: 15px 0 15px 12px;}
.doc-menu-header.is-fixed::after {right: -11px; border-color: transparent transparent transparent var(--color-canvas);}
.has-doc-menu-header.is-sidebar-left-collapsed .doc-menu-header.is-fixed {left: var(--gutter-width)}
.doc-menu-header.is-fixed .module-title {font-size: var(--font-size-base);}
.doc-menu-header.is-fixed > .btn-close {position: absolute; right: 0; font-weight: normal;}
.doc-menu-header.is-fixed > .btn-close:not(:hover) {opacity: .5;}

.tree > .tree-item.project-tree-title {margin-bottom: 0.5rem; pointer-events: none;}
.tree > .tree-item.project-tree-title .text {margin-left: 0.5rem;}
.tree > .tree-item.project-tree-title .item-icon {color: var(--nav-active-color); opacity: 1;}
.tree > .tree-item.project-tree-title > .tree-toggle-icon {display: none;}

.has-doc-menu-header #mainMenu {padding-left: 216px;}
.has-doc-menu-header.is-sidebar-left-collapsed #mainMenu {padding-left: 0;}
#mainContent > .sidebar:not(.is-collapsed) {min-width: 200px !important;}

.doc-setting-modal > .modal-dialog > .modal-content > .modal-body {padding: 0 2rem;}