/* TungstenCloud Auth v3 - desktop authentication shell */
@media (min-width: 751px) {
  html[theme="tungstencloud"] body.tc-auth-page {
    width: 100% !important;
    height: 100% !important;
    min-height: 100% !important;
    margin: 0 !important;
    overflow: hidden !important;
  }

  html[theme="tungstencloud"] #login,
  html[theme="tungstencloud"] #regist {
    width: 100vw !important;
    height: 100vh !important;
    min-height: 0 !important;
    padding: 16px 22px !important;
    box-sizing: border-box !important;
    align-items: center !important;
    justify-content: center !important;
    overflow: hidden !important;
  }

  html[theme="tungstencloud"] #login .login-container,
  html[theme="tungstencloud"] #regist .login-container {
    width: min(1080px, calc(100vw - 44px)) !important;
    height: min(680px, calc(100vh - 32px)) !important;
    min-height: 540px !important;
    max-height: calc(100vh - 32px) !important;
    display: grid !important;
    grid-template-columns: minmax(0, 48%) minmax(0, 52%) !important;
    align-items: stretch !important;
    overflow: hidden !important;
    border: 1px solid #e4e9f0 !important;
    border-radius: 20px !important;
    background: #fff !important;
    box-shadow: 0 16px 44px rgba(15, 23, 42, .08) !important;
  }

  html[theme="tungstencloud"] #login .container-back,
  html[theme="tungstencloud"] #regist .container-back {
    min-height: 0 !important;
    height: 100% !important;
  }

  html[theme="tungstencloud"] #login .back-text,
  html[theme="tungstencloud"] #regist .back-text {
    padding: 88px 40px 48px !important;
  }
  html[theme="tungstencloud"] #login .text-welcome,
  html[theme="tungstencloud"] #regist .text-welcome { font-size: clamp(38px, 4vw, 52px) !important; }
  html[theme="tungstencloud"] #login .text-title,
  html[theme="tungstencloud"] #regist .text-title { margin-top: 46px !important; font-size: 21px !important; }
  html[theme="tungstencloud"] #login .text-level,
  html[theme="tungstencloud"] #regist .text-level { margin-top: 22px !important; font-size: 13px !important; }

  html[theme="tungstencloud"] #login .container-before,
  html[theme="tungstencloud"] #regist .container-before {
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    padding: 72px 54px 38px !important;
    box-sizing: border-box !important;
    align-items: flex-start !important;
    justify-content: center !important;
    overflow: hidden !important;
  }

  html[theme="tungstencloud"] #login .login,
  html[theme="tungstencloud"] #regist .login {
    width: 100% !important;
    max-width: 400px !important;
    height: 100% !important;
    min-height: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }
  html[theme="tungstencloud"] #regist .login {
    overflow-y: auto !important;
    overflow-x: hidden !important;
    scrollbar-width: thin;
    scrollbar-color: #d7dde6 transparent;
    padding-right: 5px !important;
  }
  html[theme="tungstencloud"] #regist .login::-webkit-scrollbar { width: 5px; }
  html[theme="tungstencloud"] #regist .login::-webkit-scrollbar-thumb { background: #d7dde6; border-radius: 999px; }

  html[theme="tungstencloud"] .tc-auth-switch {
    display: inline-flex !important;
    align-items: center !important;
    gap: 3px !important;
    margin: 0 0 24px !important;
    padding: 3px !important;
    border: 1px solid #e4e9f0 !important;
    border-radius: 9px !important;
    background: #f7f9fc !important;
  }
  html[theme="tungstencloud"] .tc-auth-switch button {
    min-width: 58px !important;
    height: 30px !important;
    padding: 0 12px !important;
    border: 0 !important;
    border-radius: 7px !important;
    color: #667085 !important;
    background: transparent !important;
    font: inherit !important;
    font-size: 12px !important;
    cursor: pointer !important;
  }
  html[theme="tungstencloud"] .tc-auth-switch button.is-active {
    color: #1769e0 !important;
    background: #fff !important;
    box-shadow: 0 1px 4px rgba(16,24,40,.08) !important;
    font-weight: 600 !important;
  }


  html[theme="tungstencloud"] #login .login-text-regist,
  html[theme="tungstencloud"] #regist .login-text-regist { display: none !important; }
  html[theme="tungstencloud"] #login .login-text-title,
  html[theme="tungstencloud"] #regist .login-text-title { font-size: 28px !important; }
  html[theme="tungstencloud"] #login .login-form,
  html[theme="tungstencloud"] #regist .login-form { margin-top: 28px !important; }
  html[theme="tungstencloud"] #login .form-main,
  html[theme="tungstencloud"] #regist .form-main { margin-top: 20px !important; }
  html[theme="tungstencloud"] #login .form-item,
  html[theme="tungstencloud"] #regist .form-item { margin-top: 16px !important; }

  /* Correct Element-UI phone prefix geometry. */
  html[theme="tungstencloud"] #login .input-with-select.el-input-group--prepend,
  html[theme="tungstencloud"] #regist .input-with-select.el-input-group--prepend {
    display: inline-table !important;
    width: 100% !important;
  }
  html[theme="tungstencloud"] #login .input-with-select .el-input-group__prepend,
  html[theme="tungstencloud"] #regist .input-with-select .el-input-group__prepend {
    width: 94px !important;
    min-width: 94px !important;
    padding: 0 !important;
    overflow: hidden !important;
    border-color: #d8dee8 !important;
    border-right: 0 !important;
    border-radius: 8px 0 0 8px !important;
    background: #fff !important;
    box-sizing: border-box !important;
  }
  html[theme="tungstencloud"] #login .input-with-select .el-input-group__prepend .el-select,
  html[theme="tungstencloud"] #regist .input-with-select .el-input-group__prepend .el-select {
    width: 94px !important;
    margin: 0 !important;
  }
  html[theme="tungstencloud"] #login .input-with-select .el-input-group__prepend .el-input,
  html[theme="tungstencloud"] #regist .input-with-select .el-input-group__prepend .el-input { width: 94px !important; }
  html[theme="tungstencloud"] #login .input-with-select .el-input-group__prepend .el-input__inner,
  html[theme="tungstencloud"] #regist .input-with-select .el-input-group__prepend .el-input__inner {
    width: 94px !important;
    height: 44px !important;
    padding: 0 30px 0 13px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    font-size: 12px !important;
  }
  html[theme="tungstencloud"] #login .input-with-select.el-input-group--prepend > .el-input__inner,
  html[theme="tungstencloud"] #regist .input-with-select.el-input-group--prepend > .el-input__inner {
    height: 44px !important;
    border-color: #d8dee8 !important;
    border-left: 1px solid #d8dee8 !important;
    border-radius: 0 8px 8px 0 !important;
    background: #fff !important;
  }
  html[theme="tungstencloud"] #login .el-input__inner,
  html[theme="tungstencloud"] #regist .el-input__inner { height: 44px !important; line-height: 44px !important; border-radius: 8px !important; }
  html[theme="tungstencloud"] #login .login-btn,
  html[theme="tungstencloud"] #regist .login-btn { height: 44px !important; border-radius: 8px !important; font-size: 14px !important; }

  html[theme="tungstencloud"] #login .login-jump-btn,
  html[theme="tungstencloud"] #regist .login-jump-btn { top: 18px !important; right: 22px !important; }
}

@media (min-width: 751px) and (max-height: 620px) {
  html[theme="tungstencloud"] #login .login-container,
  html[theme="tungstencloud"] #regist .login-container { min-height: 0 !important; height: calc(100vh - 20px) !important; max-height: calc(100vh - 20px) !important; }
  html[theme="tungstencloud"] #login,
  html[theme="tungstencloud"] #regist { padding: 10px 18px !important; }
  html[theme="tungstencloud"] #login .container-before,
  html[theme="tungstencloud"] #regist .container-before { padding-top: 52px !important; padding-bottom: 24px !important; }
  html[theme="tungstencloud"] #login .back-text,
  html[theme="tungstencloud"] #regist .back-text { padding-top: 66px !important; }
}