*{margin: 0; padding: 0; }
html,body{height: 100%; background-color: #EEE;}
body{height: 100vh;background-color: #EEE;background-image: url(admin-loading.gif); background-repeat: no-repeat;background-position: 50% 50%;}
.app{height: 100%; font-size: 16px; font-family: "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif;}
.app{background-color: #EEE;}
/* 变量 */
body{
--nav-left-width: 200px;
--nav-left-width-fold: 64px;
--nav-right-1-height: 50px;
--nav-right-2-height: 35px;
}
.nav-left, .nav-right {position: fixed; top: 0; height: 100%;}
/* 左边 */
.nav-left{width: var(--nav-left-width); left: 0px; z-index: 200; overflow: hidden;}
.nav-left-top{width: 100%; box-sizing: border-box; height: 85px; line-height: 85px;/* z-index: 100; */ overflow: hidden;}
.nav-left-bottom{width: 100%; box-sizing: border-box; height: calc(100% - 85px); overflow: hidden;}
/* 右边 */
.nav-right{width: calc(100% - var(--nav-left-width)); right: 0px; z-index: 100; }
.nav-right-1{height: var(--nav-right-1-height); line-height: var(--nav-right-1-height); z-index: 200; position: relative; border-bottom: 1px #F1F1F1 solid; box-sizing: border-box; overflow: hidden;}
.nav-right-2{height: var(--nav-right-2-height); line-height: var(--nav-right-2-height); z-index: 200; position: relative; box-shadow: 0 2px 2px rgba(0,0,0,0.1);}
.nav-right-3{width: 100%; height: calc(100vh - var(--nav-right-1-height) - var(--nav-right-2-height)); position: relative; overflow: hidden;}
/* .fas{transition: all 0s;} */
/* 所有带动画的元素 */
.admin-logo,.nav-left,.nav-left-top,.nav-left-bottom, .nav-right/* , .nav-right-2 * */{transition: all 0.2s; }
/* 菜单折叠 */
.app-fold{
--nav-left-width: 64px;
}
/* 菜单折叠时 部分元素隐藏 */
.app-fold .admin-title, .app-fold .menu-name, .app-fold-right .el-submenu__icon-arrow{display: none;}
.app-fold .admin-logo{margin-left: 12px !important;}
/* .nav-right-3 包裹了太多 View,不能让它参与动画,因为实在太TM卡了 */
.nav-right-3{width: calc(100% - var(--nav-left-width)); position: fixed; transition: none;}
.app-fold-right .nav-right-3{width: calc(100% - 64px); left: 64px;}
/* -------------- 其它 --------------- */
/* 折叠时悬浮菜单样式,防止透明 */
.el-menu--vertical .el-menu--popup{background-color: #FFF !important; color: red !important;}
/* 最高层级 */
.z-index-max{z-index: 2147483647;}
/* 遮罩样式 */
.shade-fox{position: absolute; z-index: 1000000; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); color: #FFF; top: 0px;}
.shade-fox{display: flex; justify-content: center; align-items: center}
.shade-text{}
/* 去除掉便签的大边框 */
.layer-note-class .layui-layer-input{outline: 0; box-shadow: none !important; padding: 0.8em !important; font-family: 'Times New Roman', Times, serif;}
.layer-note-class .layui-layer-input{border: 0px #ddd solid; border-bottom: 1px #ddd solid;}