html, body, #root {
  width: 100%;
  height: 100%;
  margin: 0;
}

:root {
  --theme-color: #fff;
  --theme-front: #000;
  --header-height: 48px;
  --siderbar-width: 240px;
}

.main-layout {
  height: 100vh;
  display: flex;
  flex-direction: column;
}

.fixd-header {
  width: 100%;
  position: fixed;
  top: 0;
  height: var(--header-height);
  line-height: var(--header-height);
  z-index: 100;
}

.ant-layout {
  background-color: #f0f2f5;
}

.ant-layout-header {
  line-height: var(--header-height);
  box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
  // border-bottom: 1px solid gainsboro;
  z-index: 10;
}

.layout-sidebar {
  width: var(--siderbar-width);
  background-color: var(--theme-color);
  color: var(--theme-front);
  box-shadow: 1px 0 4px 0 rgba(0, 21, 41, 0.08);

  .ant-menu {
    background: transparent;
  }
}


// 兼容 360
.ant-pro-sider-collapsed-button {
  top: 18px;
  right: -13px;
}

.ant-pro .ant-pro-layout .ant-pro-sider-logo {
  padding: 16px;
}

.ant-pro .ant-pro-query-filter .ant-form-item {
  margin: 0;
}

.ant-pro-page-container .ant-pro-page-container-warp-page-header ~ .ant-pro-grid-content .ant-pro-page-container-children-content {
  margin: 8px 40px 40px 40px;
}

.ant-pro-table-list-toolbar-container {
  padding: 16px 0;
}

.ant-pro-card .ant-pro-card-body {
  padding: 16px 24px;
}
