:global {
  @backend-prefix: backend;

  .@{backend-prefix} {
    position        : relative;
    width           : 100%;
    height          : 100% !important;
    background-color: #f2f2f2;

    &__sider {
      background-color: #ffffff;

      &-collapsed {
        display        : flex;
        flex-direction : row;
        justify-content: space-around;
        align-items    : center;
        height         : 39px;
        margin         : 0 8px;
        border-bottom  : 1px solid #333333;

        &--icon {
          font-size: 20px;
          cursor   : pointer;
        }
      }

      &-scrollbar {
        height: ~'calc(100% - 40px)' !important;
      }
    }

    &__content {
      padding: 8px;
    }

    &__tab {
      &.ant-tabs {
        height: 100%;

        &>.ant-tabs-bar {
          margin-bottom: 8px;

          .ant-tabs-tab-active {
            border-bottom-color: #e8e8e8;
          }
        }

        &>.ant-tabs-content {
          /* 减去 ant-tabs-bar 的高度 */
          height: ~'calc(100% - 48px)';

          &>.ant-tabs-tabpane.ant-tabs-tabpane-active {
            height: 100%;
          }
        }
      }

      &-nav {
        margin-top: 13px;
      }

      &-content {
        height  : 100%;
        overflow: hidden auto;
      }
    }

    .ant-menu-inline,
    .ant-menu-vertical,
    .ant-menu-vertical-left {
      border-right: none;
    }
  }
}