@import "~@/assets/varible.less";

@headerHeight: 55px;
@footerHeight: 80px;
.app-login {
  height: 100%;

  .app-login-layout {
    height: 100%;

    .header {
      z-index    : 10;
      height     : @headerHeight;
      line-height: @headerHeight;
      background : @primary-color;
      box-shadow : @box-shadow-base;
      width      : 100%;
      margin     : 0;
      padding    : 0;

      .ant-row {
        max-width: 1024px;
        margin   : auto;
        height   : 100%;

        .left {
          height: 100%;
          padding-left: 30px;

          img {
            height: 100%;
          }
        }

        .right {
          text-align   : right;
          padding-right: 30px;
          color        : #fff;
        }
      }
    }

    .container {
      height    : calc(100% - @footerHeight - @headerHeight);
      position  : relative;
      overflow-y: auto;
      background: url("~@/assets/img/login-bg-1.jpg") no-repeat 100% center;
      width      : 100%;

      .login-form {
        position     : absolute;
        left         : 70%;
        top          : 50%;
        width        : 400px;
        transform    : translate(-50%, -50%);
        padding      : 20px;
        border-radius: 5px;
        border       : @border;
        background   : rgba(255, 255, 255, 0.8);
      }
    }

    .footer {
      width      : 100%;
      height    : @footerHeight;
      background: #fff;
      text-align: center;
    }
  }
}