@import '@delon/theme/index';

:host {
  display: block;
  width: 538px;
  margin: 0 auto;

  ::ng-deep {
    .ant-tabs .ant-tabs-bar {
      margin-bottom: 24px;
      text-align: center;
      border-bottom: 0;
    }

    .ant-tabs-tab {
      font-size: 16px;
      line-height: 24px;
    }

    .ant-input-affix-wrapper .ant-input:not(:first-child) {
      padding-left: 4px;
    }

    .icon {
      cursor: pointer;
      margin-left: 16px;
      font-size: 24px;
      color: rgb(0 0 0 / 20%);
      vertical-align: middle;
      transition: color 0.3s;

      &:hover {
        color: @primary-color;
      }
    }

    .other {
      margin-top: 24px;
      line-height: 22px;
      text-align: left;

      nz-tooltip {
        vertical-align: middle;
      }

      .register {
        float: right;
      }
    }

    .login-container {
      border-radius: 10px;
      /* 设置所有四个角都为 10px 的圆角 */
      background-image: url('/assets/bg2.jpg');
      background-size: 100%;
      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
      padding: 10px 0 0 0;
      height: 300px;
    }

    .head {
      margin: 0px 0 0 20px;
    }

    .login-form {
      justify-content: center;
      padding: 30px 120px 0px 120px;
      /* 水平方向居中对齐 */
      //width: 400px;
    }

    .header {
      height: 46px;
      line-height: 46px;

      a {
        text-decoration: none;
      }
    }

    .logo {
      height: 46px;
      margin-right: 6px;
    }

    .title {
      position: relative;
      font-family: 'Myriad Pro', 'Helvetica Neue', Arial, Helvetica, sans-serif;
      font-size: 20px;
      font-weight: 400;
      color: #515151;
      vertical-align: middle;
    }

    .color-515151 {
      color: #515151;
    }
  }
}

[data-theme='dark'] {
  :host ::ng-deep {
    .icon {
      color: rgb(255 255 255 / 20%);

      &:hover {
        color: #515151;
      }
    }
  }
}