.layout-container {
  display: flex;
  width: 100%;
  height: 100%;
}

.sider-drawer {

  :global {

    .ant-drawer-body {
      overflow: hidden;
      padding: 0;
      width: 200px;
      height: 100%;
    }
  }
}

/* logo */
.logo {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  height: 56px;

  .logo-image {
    width: 30px;
    height: 30px;
    background: url('@/assets/images/logo.png') no-repeat;
    background-size: 100%;
  }

  .logo-font {
    margin-top: -3px;
    font-size: 22px;
    font-weight: bold;
    white-space: nowrap;
    color: rgb(255 255 255);
  }
}

.sider-menu {
  overflow-y: auto;
  margin-top: 2px;
  height: 92vh;
  border-right: 1px solid #eae6e6;

  :global {

    .ant-menu-inline {
      width: 99%;
      border-right: 0;
    }
  }
}

#components-layout-demo-custom-trigger .trigger {
  padding: 0 24px;
  font-size: 18px;
  line-height: 64px;
  cursor: pointer;
  transition: color 0.3s;
}

#components-layout-demo-custom-trigger .trigger:hover {
  color: #1890ff;
}

#components-layout-demo-custom-trigger .logo {
  margin: 16px;
  height: 32px;
  background: rgb(255 255 255 / 30%);
}

/* 顶部与内容区背景色 */
.site-layout {

  :global {

    .ant-layout-content {
      position: relative;
    }
  }
}
