/* Hostey / Sanum Roundcube: accessible mobile login, all branded skins. 2026-11-10 */
@media screen and (max-width: 900px) {
  html:has(body.task-login),body.task-login {
    height:auto!important;min-height:100%!important;
    overflow-x:hidden!important;overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }
  body.task-login #layout {
    height:auto!important;min-height:100vh!important;min-height:100dvh!important;
    display:block!important;overflow:visible!important;
  }
  body.task-login #layout-content.selected.no-navbar {
    display:flex!important;flex-direction:column!important;align-items:center!important;
    justify-content:center!important;box-sizing:border-box!important;
    width:100%!important;height:auto!important;min-height:100vh!important;
    min-height:100dvh!important;max-height:none!important;overflow:visible!important;
    padding: max(18px, env(safe-area-inset-top)) 14px max(28px, env(safe-area-inset-bottom))!important;
  }
  body.task-login #layout-content.selected.no-navbar > #logo {
    position:relative!important;top:auto!important;left:auto!important;right:auto!important;
    transform:none!important;display:block!important;flex:0 0 auto!important;
    width:auto!important;height:auto!important;max-width:min(190px, 60vw)!important;
    max-height:76px!important;object-fit:contain!important;
    margin:0 auto 13px!important;
  }
  body.task-login #layout-content.selected.no-navbar > #login-form {
    position:static!important;top:auto!important;left:auto!important;right:auto!important;
    transform:none!important;float:none!important;display:block!important;
    width:100%!important;max-width:430px!important;min-width:0!important;
    height:auto!important;max-height:none!important;overflow:visible!important;
    margin:0 auto!important;padding:22px clamp(16px, 5vw, 26px)!important;
    box-sizing:border-box!important;
  }
  body.task-login #login-form .hostey-remember-visible {
    display:flex!important;flex-wrap:wrap!important;justify-content:center!important;
    align-items:center!important;gap:8px!important;
  }
  body.task-login #login-form .hostey-remember-visible label {
    flex:0 1 auto!important;white-space:normal!important;
  }
  body.task-login #login-form .hostey-remember-visible select {
    max-width:100%!important;min-width:0!important;flex:0 1 180px!important;
  }
  body.task-login #login-form .sanum-reset-link,
  body.task-login #login-form #login-footer {
    position:static!important;height:auto!important;max-height:none!important;
    overflow-wrap:anywhere!important;white-space:normal!important;
  }
  body.task-login #hostey-pwa-install {display:none!important;}
}
@media screen and (max-width:900px) and (max-height:690px) {
  body.task-login #layout-content.selected.no-navbar {justify-content:flex-start!important;}
  body.task-login #layout-content.selected.no-navbar > #logo {
    max-height:62px!important;margin-bottom:10px!important;
  }
  body.task-login #layout-content.selected.no-navbar > #login-form {
    padding-top:18px!important;padding-bottom:18px!important;
  }
}
@media screen and (max-width:350px) {
  body.task-login #layout-content.selected.no-navbar {padding-left:10px!important;padding-right:10px!important;}
  body.task-login #layout-content.selected.no-navbar > #login-form {padding-left:14px!important;padding-right:14px!important;}
}
/* Small mailbox logo is a square favicon instead of a stretched full-width brand image. */
#layout-menu .popover-header #logo {object-fit:contain!important;max-width:100%!important;}