
/* Hostey + branded Roundcube logins: shared viewport-safe responsive layout.
   Login task only; no effect on the mailbox application once signed in. */
html body.task-login {
  overflow-x: hidden !important;
  scroll-behavior: auto !important;
}
body.task-login #layout,
body.task-login #layout-content.selected.no-navbar {
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box !important;
}
body.task-login #layout-content.selected.no-navbar .mail-split {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}
body.task-login .mail-split .mail-auth,
body.task-login .mail-split .mail-hero {
  box-sizing: border-box !important;
}
@media (min-width: 761px) {
  body.task-login .mail-split .mail-hero {
    padding: clamp(18px,2.5vh,32px) clamp(24px,3vw,48px) !important;
  }
  body.task-login .mail-split .mail-logo-frame {
    width: 144px !important;
    min-height: 56px !important;
    padding: 9px 14px !important;
    border-radius: 13px !important;
  }
  body.task-login .mail-split .mail-logo-frame img {
    max-height: 42px !important;
    max-width: 100% !important;
  }
  body.task-login .mail-split .mail-hero-main {
    margin-top: 12px !important;
    max-width: 580px !important;
  }
  body.task-login .mail-split .mail-hero-label {
    font-size: 11px !important;
    margin-bottom: 13px !important;
  }
  body.task-login .mail-split .mail-hero h2 {
    font-size: clamp(32px,3.25vw,49px) !important;
    line-height: 1.07 !important;
    margin-bottom: 14px !important;
  }
  body.task-login .mail-split .mail-hero-desc {
    font-size: clamp(13px,1.04vw,16px) !important;
    line-height: 1.45 !important;
  }
  body.task-login .mail-split .mail-hero-features {
    margin-top: 20px !important;
    gap: 10px !important;
    font-size: 12px !important;
  }
  body.task-login .mail-split .mail-hero-bottom {
    margin-top: 12px !important;
  }
  body.task-login .mail-split .mail-auth {
    padding: clamp(12px,2vh,22px) clamp(22px,3vw,56px) 12px !important;
    min-height: 100dvh !important;
  }
  body.task-login .mail-split .mail-auth-main {
    width: 100% !important;
    max-width: 525px !important;
    margin: auto !important;
    padding: 4px 0 !important;
  }
  body.task-login .mail-split .mail-welcome-tag {
    padding: 6px 10px !important;
    margin-bottom: 9px !important;
    font-size: 10px !important;
  }
  body.task-login .mail-split .mail-auth h2 {
    font-size: clamp(25px,2vw,33px) !important;
    line-height: 1.13 !important;
    margin-bottom: 7px !important;
  }
  body.task-login .mail-split .mail-auth-explain {
    font-size: 13px !important;
    line-height: 1.4 !important;
    margin-bottom: 14px !important;
  }
  body.task-login .mail-split .mail-auth #login-form tr {
    margin-bottom: 10px !important;
  }
  body.task-login .mail-split .mail-auth #login-form td.title {
    margin-bottom: 4px !important;
    font-size: 12px !important;
  }
  body.task-login .mail-split .mail-auth #login-form input.form-control,
  body.task-login .mail-split .mail-auth #login-form input[type="text"],
  body.task-login .mail-split .mail-auth #login-form input[type="email"],
  body.task-login .mail-split .mail-auth #login-form input[type="password"] {
    height: 46px !important;
    min-height: 46px !important;
    border-radius: 10px !important;
  }
  body.task-login .mail-split .mail-auth #login-form .formbuttons {
    margin-top: 12px !important;
  }
  body.task-login .mail-split .mail-auth #login-form #rcmloginsubmit,
  body.task-login .mail-split .mail-auth #login-form .mainaction,
  body.task-login .mail-split .mail-auth #login-form button[type="submit"],
  body.task-login .mail-split .mail-auth #login-form input[type="submit"] {
    height: 48px !important;
    min-height: 48px !important;
  }
  body.task-login .mail-split .mail-auth #login-form .hostey-reset-link,
  body.task-login .mail-split .mail-auth #login-form .sanum-reset-link {
    margin-top: 9px !important;
  }
  body.task-login .mail-split .mail-auth #login-footer {
    margin-top: 5px !important;
  }
  body.task-login .mail-split .mail-auth-bottom {
    padding: 3px 0 !important;
    font-size: 11px !important;
  }
  body.task-login .mail-split #hostey-turnstile-widget-v1 {
    margin: 7px 0 4px !important;
  }
}
@media (min-width: 761px) and (min-height: 690px) {
  body.task-login #layout,
  body.task-login #layout-content.selected.no-navbar,
  body.task-login #layout-content.selected.no-navbar .mail-split {
    height: 100dvh !important;
    min-height: 0 !important;
    max-height: 100dvh !important;
  }
  body.task-login .mail-split .mail-hero,
  body.task-login .mail-split .mail-auth {
    height: 100dvh !important;
    min-height: 0 !important;
    max-height: 100dvh !important;
    overflow: hidden !important;
  }
}
@media (min-width: 761px) and (max-height: 689px) {
  /* A short laptop window must remain scrollable rather than hide controls. */
  body.task-login #layout,
  body.task-login .mail-split,
  body.task-login .mail-split .mail-auth {
    height: auto !important;
    max-height: none !important;
  }
  body.task-login .mail-split .mail-hero-main {
    margin-top: 8px !important;
  }
  body.task-login .mail-split .mail-hero-features {
    display: none !important;
  }
}
@media (max-width: 760px) {
  html body.task-login,
  body.task-login #layout,
  body.task-login #layout-content.selected.no-navbar {
    height: auto !important;
    min-height: 100dvh !important;
    max-height: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }
  body.task-login #layout-content.selected.no-navbar .mail-split {
    display: flex !important;
    flex-direction: column !important;
    min-height: 100dvh !important;
    height: auto !important;
  }
  body.task-login .mail-split .mail-hero {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    padding: 11px 16px !important;
    border-radius: 0 0 13px 13px !important;
  }
  body.task-login .mail-split .mail-hero-top {
    gap: 10px !important;
  }
  body.task-login .mail-split .mail-logo-frame {
    width: 88px !important;
    min-height: 48px !important;
    padding: 5px 9px !important;
  }
  body.task-login .mail-split .mail-logo-frame img {
    max-height: 38px !important;
  }
  body.task-login .mail-split .mail-hero-site {
    font-size: 15px !important;
  }
  body.task-login .mail-split .mail-hero-main,
  body.task-login .mail-split .mail-hero-bottom {
    display: none !important;
  }
  body.task-login .mail-split .mail-auth {
    flex: 1 0 auto !important;
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 10px 16px 18px !important;
  }
  body.task-login .mail-split .mail-auth-top,
  body.task-login .mail-split .mail-welcome-tag {
    display: none !important;
  }
  body.task-login .mail-split .mail-auth-main {
    margin: auto !important;
    width: 100% !important;
    max-width: 520px !important;
    padding: 4px 0 !important;
  }
  body.task-login .mail-split .mail-auth h2 {
    margin: 0 0 5px !important;
    font-size: clamp(22px,6vw,28px) !important;
    line-height: 1.17 !important;
  }
  body.task-login .mail-split .mail-auth-explain {
    margin: 0 0 13px !important;
    font-size: 12px !important;
    line-height: 1.42 !important;
  }
  body.task-login .mail-split .mail-auth #login-form tr {
    margin-bottom: 9px !important;
  }
  body.task-login .mail-split .mail-auth #login-form td.title {
    font-size: 12px !important;
    margin-bottom: 3px !important;
  }
  body.task-login .mail-split .mail-auth #login-form input.form-control,
  body.task-login .mail-split .mail-auth #login-form input[type="text"],
  body.task-login .mail-split .mail-auth #login-form input[type="email"],
  body.task-login .mail-split .mail-auth #login-form input[type="password"] {
    height: 44px !important;
    min-height: 44px !important;
    font-size: 16px !important;
  }
  body.task-login .mail-split .mail-auth #login-form .formbuttons {
    margin-top: 10px !important;
  }
  body.task-login .mail-split .mail-auth #login-form #rcmloginsubmit,
  body.task-login .mail-split .mail-auth #login-form .mainaction,
  body.task-login .mail-split .mail-auth #login-form button[type="submit"],
  body.task-login .mail-split .mail-auth #login-form input[type="submit"] {
    height: 46px !important;
    min-height: 46px !important;
  }
  body.task-login .mail-split .mail-auth #login-form .hostey-reset-link,
  body.task-login .mail-split .mail-auth #login-form .sanum-reset-link {
    margin-top: 8px !important;
  }
  body.task-login .mail-split .mail-auth-bottom {
    font-size: 11px !important;
    padding: 6px 0 !important;
  }
  body.task-login .mail-split #hostey-turnstile-widget-v1 {
    margin: 6px auto 3px !important;
  }
}
@media (max-width: 390px) {
  body.task-login .mail-split .mail-auth {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
  body.task-login .mail-split .mail-hero {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
  body.task-login .mail-split .mail-auth h2 {
    font-size: 23px !important;
  }
}

/* Avoid a floating installation prompt covering mobile login controls.
   Installation stays available in the signed-in mail application. */
@media (max-width: 760px) {
  body.task-login #hostey-pwa-install,
  body.task-login #hostey-pwa-ios-hint {
    display: none !important;
  }
}
