:root[savor-tabbar="vertical"]  {
    --custom-tab-width: 150px;

    body:not(.body--mobile,.body--window)>#toolbar{
	margin-bottom: 0px;
}
#dockLeft,#dockRight,.layout__dockl:not(.layout--float),.layout__dockr:not(.layout--float){
    padding-top: 0px;
}

body:not(.body--mobile,.body--window) .layout__center [data-type='wnd'][data-id]:not(.tab-horizontal){
    border-radius: 8px;
    padding-top: 0px;
}
body:not(.body--mobile,.body--window) [data-type='wnd'][data-id]:not(.tab-horizontal) .fn__flex:not(.av__views){
    & > .layout-tab-bar{
	margin:0 -10px 0 0; 
	border-bottom: none;
    display: block;
	flex: 1;
    padding-left: 5px;
    &.layout-tab-bar--readonly {
        flex: initial;
        width: calc(100% - 5px);
        border-radius: 0 8px 0 0;
    }
    .item:not(.item--readonly) {
        margin:0 -5px 5px 0!important;
        max-width:unset;
        width: 100%;
        padding: 2.5px 0 ;
        & .item__close{
            margin-left: auto;
        }
        &.item--focus{
            border-radius: 8px 0 0 8px;
            transition: opacity .2s cubic-bezier(0, 0, .2, 1) 0ms;
        &::after {
            background-color: transparent;
            top: calc(-1* var(--Sv-dock-item-radius) - 2px);
            right: -5px; 
            left: auto; 
            height: calc(100% + var(--Sv-dock-item-radius)* 2 + 4px);
            width: 10px;
            border-radius: 0;
            background-image: var(--Sv-tab-bar-V-item-after);
            background-size: 10px 10px, 10px 10px, calc(100% + var(--Sv-dock-item-radius)* 2 + 8px) calc(100% - var(--Sv-dock-item-radius)* 2 - 4px);
            background-position: left bottom, left top, center right;
            background-repeat: no-repeat;
            box-shadow: none; 
        }}
        &.item--pin .item__text.fn__none{
            display: block!important;
        }
        &:hover::after{
            opacity: 0;
        }
        &.item--focus:hover::after{
            opacity: 1;
        }
        }
        .item--pin:not(.item--readonly) {
            padding: 2.5px 1.5px;
        }
    }
}
body:not(.body--mobile,.body--window)  .layout__center [data-type='wnd'][data-id]:not(.tab-horizontal){
	display: flex;
	flex-direction: row;
    & > .fn__flex:not(.layout-tab-container) {
        flex-direction: column-reverse;
    }
}
body:not(.body--mobile,.body--window) .layout__center [data-type='wnd'][data-id]:not(.tab-horizontal)>.fn__flex>.layout-tab-bar {
    width: var(--custom-tab-width);
    transition: width 0.3s ease;
    background-color: var(--Sv-vertical-bg);
    &:not(.layout-tab-bar--readonly) {
        margin-bottom: 5px;
        border-radius: 0 0 0 8px;
    }
}



#vertical-resize-handle:hover{
    background-color: var(--Sv-layout--resize-hover)!important;
    border-radius: 3px;
}

/* 拖拽时的样式 */
body.tabbar-resizing {
    user-select: none !important;
}

/* 拖拽时的页签栏样式 */
body.tabbar-resizing .layout-tab-bar:not(.layout-tab-bar--readonly) {
    transition: none !important;
}

/* 拖拽结束时的平滑过渡 */
.layout-tab-bar:not(.layout-tab-bar--readonly) {
    transition: width 0.1s ease-out;
}
}