.home-layout {
  .ant-layout {
    .header-description {
      margin: 16px 0 6px 36px;
      color: @font-color;
    }
  }
  .ant-layout-sider.home-sider {
    position: fixed;
    left: 0;
    width: @sider-width !important;
    min-width: @sider-width !important;
    max-width: @sider-width !important;
    height: 100vh;
    padding: @sider-padding-lr;
    overflow: auto;

    .ant-menu {
      .ant-menu-item {
        display: flex;
        align-items: center;
        width: calc(@sider-width - 2 * @sider-padding-lr) !important;
        margin: 10px 0 !important;
        color: @font-color;
        border-radius: @border-radius;
        span,
        span a {
          color: @font-color-dark;
        }
        &:hover {
          color: @font-color-dark;
          span {
            color: @font-color-dark;
          }
        }
        .anticon {
          font-size: 24px !important;
        }
      }
      .ant-menu-item-selected {
        color: @white;
        background-color: @azure !important;
        span,
        span a {
          color: @white;
        }
        &:hover {
          color: @white;
          span {
            color: @white;
          }
        }
      }
    }
    .logo {
      position: relative;
      height: 28px;
      margin-bottom: 20px;
      background: url('../../assets/logo-products-chain.svg');
      background-repeat: no-repeat;
      background-position: center;
      background-size: contain;
    }
    .version {
      color: @font-color;
      font-size: 12px;
      text-align: center;
    }
    .wallet-selection {
      position: absolute;
      bottom: 0;
      display: flex;
      align-items: center;
      width: calc(@sider-width - 2 * @sider-padding-lr);
      height: 40px;
      margin-bottom: 20px;
      border-radius: @border-radius;
      cursor: pointer;
      img {
        margin-right: 10px;
        margin-left: 18px;
      }
      span {
        position: absolute;
        right: 0;
      }
      svg {
        transition: transform 0.1s linear;
      }
      &.ant-dropdown-open {
        background: rgba(17, 153, 250, 0.1);
        svg {
          margin-right: 10px;
          transform: rotate(180deg);
        }
      }
    }
    .restart-button {
      position: absolute;
      bottom: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      width: calc(@sider-width - 2 * @sider-padding-lr);
      height: 40px;
      margin: 0;
      margin-bottom: 130px;
      border-radius: @border-radius;
    }
    .bottom-icon {
      position: absolute;
      bottom: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      width: calc(@sider-width - 2 * @sider-padding-lr);
      height: 40px;
      margin: 0;
      margin-bottom: 80px;
      border-radius: @border-radius;
    }
    .ant-menu-item:hover {
      background: #e4f4ff;
    }
  }
}
.ant-layout-sider.home-sider,
.ant-menu {
  background: @background-color !important;
}
.ant-layout-header {
  height: auto;
  margin: 36px 0 0 0;
  padding-left: 36px !important;
  font-size: 24px;
  line-height: inherit;
}
.ant-layout-content {
  margin: 16px 32px 0;
  .site-layout-background {
    background: @white;
    border-radius: @border-radius;
    box-shadow: 2px 0 12px 2px rgba(11, 20, 38, 0.05);
  }
  &.center-layout {
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
  }
}
.home-page {
  height: 100vh;
  width: calc(100vw - 200px);
  overflow-x: hidden;

  margin-left: @sider-width;
  > .ant-spin-nested-loading :not(.ant-spin-container) .ant-spin {
    max-height: none !important;
  }
  &.loading {
    .ant-spin {
      height: 100vh !important;
    }
  }
}

.wallet-menu.ant-dropdown-menu {
  ul.ant-dropdown-menu-root {
    margin-bottom: 16px;
    border-radius: 8px;
    box-shadow: 0 4px 10px 3px rgba(0, 0, 0, 0.05);
  }
  .ant-dropdown-menu-item {
    padding: 10px 12px;
    a,
    div {
      color: @azure;
    }
    a:hover {
      color: @azure;
    }
    .anticon {
      margin-right: 10px;
    }
  }
  .delete-wallet-item {
    color: @red !important;
  }
}
.ant-menu-submenu-popup ul {
  margin-top: -5px !important;
}
