@use 'common/var' as *;
@use 'mixins/mixins' as *;
@use 'mixins/_col' as *;

.el-layout-column {
  width: 100%;
  height: 100%;
  padding: 12px;
  box-sizing: border-box;
  display: flex;
  .el-layout-item-left {
    width: 260px;
    height: 100%;
    overflow: hidden;
    background: #fff;
    display: flex;
    flex-direction: column;
    .el-layout-item-left-title {
      height: 48px;
      box-sizing: border-box;
      color: #303133;
      transition: 0.3s;
      border-bottom: 1px solid #ebeef5;
      display: flex;
      align-items: center;
      padding: 0 10px;
      font-size: 16px;
      flex-direction: row;
      justify-content: space-between;
      .el-layout-item-icon {
        display: flex;
        align-items: center;
        justify-content: center;
      }
    }
    .el-layout-item-left-body {
      height: calc(100% - 48px);
      .el-scrollbar__wrap {
        overflow-x: hidden;
      }
      .el-scrollbar__view {
        height: 100%;
      }
    }
  }
  .el-layout-item-split-trigger {
    width: 10px;
    height: 100%;
    cursor: e-resize;
  }
  .el-layout-item-right {
    flex: 1;
    overflow: hidden;
    height: 100%;
    background: #fff;
  }
  .h-full {
    height: 100%;
  }
}