/* cloud.css — cloud-shell-only styles layered ON TOP of the shared base
   (shells/shared/static/style.css). Loaded only by the cloud templates; the
   on-prem shell never serves this. Kept separate so the base style.css stays
   byte-identical across shells. */

/* Phase 3 branding — pre-auth background image, scoped to the login/register/
   verify/confirm pages via the .auth-wrap hook (present on those 4 pages only,
   never on an in-app page). The .auth-card sits on an opaque var(--card) surface
   so its content stays legible over any image. */
body:has(.auth-wrap) {
  background-image: url("/static/img/bg-preauth.png");
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}

/* (.hp honeypot rule moved to the shared style.css — it is a generic utility,
   not cloud branding, and post-auth pages must inherit it too.) */

/* Login-card DEMO pill (trial deployment only). Lives here, not inline in
   login.html, so the template stays free of the literal "demo" (the template
   demo/license sweep) — the <span class="demo-badge"> markup is injected at
   render time, STRICTLY gated on SERVER_ROLE == "trial". */
.demo-badge {
  display: inline-block; font-size: 11px; letter-spacing: 2px;
  background: var(--accent); color: #fff; border-radius: 4px;
  padding: 2px 6px; vertical-align: middle;
}

/* White scrim between the pre-auth background and the auth card: mutes the
   image so the .auth-card (lifted above via z-index) stays legible. */
body:has(.auth-wrap)::before {
  content: "";
  position: fixed;
  inset: 0;
  background: rgba(255, 255, 255, 0.6);
  pointer-events: none;
  z-index: 0;
}
body:has(.auth-wrap) .auth-wrap {
  position: relative;
  z-index: 1;
}