// 应用布局样式
.app-layout {
    height: 100vh;
    width: 100vw;

    .app-header__left__logo {
        img {
            width: 34px !important;
            height: 34px !important;
            object-fit: contain;
        }
    }
    
    .app-header__center--center {
        .app-control-menu--top {
            .app-control-menu__content {
                justify-content: center;
            }
        }
    }

    .app-header__center--right {
        .app-control-menu--top {
            .app-control-menu__content {
                justify-content: flex-end;
            }
        }
    }

    .app-page {
        overflow: auto;
        display: flex;
        flex-direction: column;
        >.app-nav-pos {
            flex-grow: 1;
            background-color: @container-background;
            >.view-layout {
                height: calc(100% - 32px);
                width: calc(100% - 32px);
                margin: 16px;
            }
        }

        .app-footer {
            height: 100px;
            display: flex;
            justify-content: center;
            align-items: center;
            flex-shrink: 0;
        }
    }

    .app-header {
        +.app-content {
            height: calc(100vh - 50px);
            .app-page-tag {
                +.app-page {
                    height: calc(100vh - 106px);
                }
            }
            .app-page {
                height: calc(100vh - 50px);
            }
        }
    }

    .app-content {
        background-color: @container-background;
        .app-page-tag { 
            +.app-page {
                height: calc(100vh - 56px);
            }
        }
        .app-page {
            height: 100vh;
        }
    }

    // ProjectSetting 内容模式 contentMode = 'FIXED' 样式
    .app-content__right--fixed,
    .app-content__content--fixed {
        .app-page-tag,.app-page {
            padding: 0 20vw;
            >.app-nav-pos {
                >.view-container.view-container--route-no-tab {
                    >.view-header {
                        padding-left: 16px;
                        padding-right: 16px;
                    }
                }
            }
        }
    }

    .app-layout-split {
        position: absolute;
        width: 4px;
        height: 100%;
        cursor: w-resize;
    }

    .app-content__left--light {
        .ant-layout-sider-trigger {
            background: @config-menu-bg-light;
            color: darken(@config-menu-bg-light, 80%);
        }
    }

    .app-content__left--dark {
        .ant-layout-sider-trigger {
            background: @config-menu-bg-dark;
            color: lighten(@config-menu-bg-dark, 80%);
        }
    }

    // 菜单位于首页头部
    &.app-layout--top {
        .app-header--hidden {
            +.app-content {
                height: 100vh;
                .app-page-tag {
                    +.app-page {
                        height: calc(100vh - 56px);
                    }
                }
                .app-page {
                    height: 100vh;
                }
            }
        }
    }

    .ant-layout-sider-collapsed {
        .app-content__left__container__top {
            padding: 10px 18px;
        }
        .app-search__input:hover {
            width: 140px;
        }
    }
}