@HEADER_HEIGHT: 0px;

.wrapper {
  position: relative;
  width: 390px;
  border-left: 1px solid var(--ant-color-split);
  transition: width 0.3s ease;
  height: calc(
    100vh - @HEADER_HEIGHT - 2px - var(--page-content-padding) -
      var(--page-content-padding) - var(--page-header-height)
  );
  padding-top: 16px;
  display: flex;
  flex-direction: column;
  overflow: hidden;

  &::-webkit-scrollbar {
    width: 0;
  }

  .box {
    width: 390px;
    padding-inline: 24px;
    flex: 1;
    overflow-y: hidden;
  }

  &.collapsed {
    width: 0;
    overflow: hidden;
    transition: width 0.3s ease;
    border-left: none;

    .box {
      width: 0;
      padding: 0;
      overflow: hidden;
    }
  }
}
