@import '~assets/less/variable';

.container {
  position: absolute;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  .header {
    height: 64px;
    background-color: @body-background;
    box-shadow: @header-box-shadow;
    flex-shrink: 0;
    z-index: @header-index;
    display: flex;
    flex-direction: row;
    align-items: center;

    .resetPw {
      border-left: 1px solid #ccc;
      user-select: none;
      text-indent: 20px;
      color: #006595;
      font-size: 18px;
    }
  }

  .content {
    display: flex;
    flex: 1;
    overflow: auto;
    .panel {
      flex: 1;
      display: flex;
      flex-direction: column;
      overflow: auto;
      background-color: @white;
      margin: 120px 24%;
      align-items: center;

      .form {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        margin: 66px auto;
        width: 80%;
        height: 100%;
        
        .top {
          span{
            font-size: 16px;
          }
        }
        .bottom {
          .next {
            margin-top: 20px;
          }
          .tip {
            font-size: 16px;
            b {
              padding: 0 4px;
              color: #006595;
            }
          }
        }
      }
    }
  }
}

.logo {
  width: 200px;
  height: 64px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;

  a {
    line-height: 0;
  }

  img {
    width: 160px;
    height: 32px;
  }
}