@use '../../style/themes/default.scss' as *;
@use '../../style/util.scss' as *;

.ele-admin-layout {
  display: flex;
  flex-direction: column;
  background: eleVar('layout', 'bg');
  min-height: eleVar('layout', 'height');

  .ele-admin-main {
    flex: auto;
    display: flex;
  }

  .ele-admin-body {
    width: 100%;
    display: flex;
    flex-direction: column;
    transition: width $ele-transition;
  }

  .ele-admin-wrapper {
    flex: auto;
    display: flex;
    flex-direction: column;
    position: relative;

    & > .el-backtop {
      z-index: calc(#{eleVar('layout', 'index')} + 1);
    }
  }

  .ele-admin-content {
    flex: auto;
    display: flex;
    flex-direction: column;
  }
}

/* 遮罩 */
.ele-admin-mask {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: eleVar('layout', 'mask-index');
  transition: (background-color $ele-transition, left $ele-transition);
  visibility: hidden;
}

/* 禁用过渡效果 */
.ele-transition-disabled {
  .ele-admin-header,
  .ele-admin-logo,
  .ele-admin-sidebox,
  .ele-admin-sidebar,
  .ele-admin-body,
  .ele-admin-tabs,
  .ele-admin-content,
  .ele-bottom-bar,
  .ele-modal-inner {
    transition: none !important;
  }
}

/* iframe */
.ele-admin-iframe-wrap {
  flex-shrink: 0;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  pointer-events: none;
  overflow: hidden;
}

.ele-admin-iframe {
  flex-shrink: 0;
  width: 100%;
  height: 100%;
  border: none;
  box-sizing: border-box;
  pointer-events: auto;
}

/* 弹窗容器 */
.ele-admin-modals {
  flex-shrink: 0;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: eleVar('layout', 'index');
}