/* ===== Login page only — safe override ===== */

/* If you really must touch #layout, do it only on login */
.task-login #layout{
  overflow:hidden !important;
  display:block !important;   /* don’t inherit from anywhere weird */
  width:100% !important;
}

/* Our split layout: left form ~55%, right image ~45% */
/* 68% form / 32% image */
.task-login .yb-login{
  display: grid;
  grid-template-columns: minmax(360px,68%) 32%;
  min-height: 100vh;
}

@media (max-width:980px){
  .task-login .yb-login{ grid-template-columns:1fr; }
  .task-login .yb-right{ display:none; }  /* hide image on small screens */
}

/* Left column */
.task-login .yb-left{ display:flex; align-items:center; justify-content:center; padding:24px; }
.task-login .yb-left .inner{ max-width:420px; width:100%; }

/* Keep Roundcube logo; just center it and remove Elastic’s offsets */
.task-login #logo{ display:block; margin:8px auto 16px; position:static; top:auto; }
.task-login #login-form{ position:static; top:auto; margin:0 auto; }

/* Minimal text */
.task-login .yb-welcome{ text-align:center; font-size:22px; font-weight:600; margin:6px 0 18px; }
.task-login .yb-tagline{ text-align:center; font-size:13px; margin-top:10px; opacity:.85; }

/* Right image pane (no background set, so dark/light stays intact) */
.task-login .yb-right{ position:relative; overflow:hidden; }
.task-login .yb-right .yb-hero{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }

/* Avoid horizontal scroll */
.task-login{ overflow-x:hidden; }

#login-footer {
  text-align: center;
}