/* Login split-screen layout fix for the Framer export.
 *
 * Password/label FOUC polish lives only in the inline
 * <style data-verita-login-fouc> from patch_export (fail-open removes that
 * tag). Do not duplicate those hide/reserve rules here.
 *
 * This lives in CSS, not in the markup, because Framer's runtime re-renders
 * the page from its own props: an edit to the exported HTML survives into
 * dist/ and into the HTTP response, then vanishes on hydration (see README,
 * "What patching can and cannot fix"). A stylesheet styles whatever Framer
 * renders, so it holds across re-export as long as patch_export.py keeps
 * re-attaching this file.
 *
 * The /login route is a two-column flex row: an "Editorial cover" photo on
 * the left, the sign-in panel on the right. Framer authored both columns as
 * `height: min-content; min-height: 760px` and the row as
 * `align-items: flex-start`, so the two agree at exactly 760px and only while
 * nothing on either side is taller than that.
 *
 * backend.js's say() reports sign-in failures by appending a <p> to the form
 * (`Couldn't sign you in`), which pushes the panel past 760px. The row is
 * `height: min-content`, so it grows to match the panel -- but flex-start
 * leaves the photo at its own 760px, and the extra height renders as a band
 * of page background under the image. A wrapped, longer message makes the
 * band taller.
 *
 * Stretching the cover to the row's height fixes it at the source: the photo
 * inside is already absolutely positioned to `inset: 0` with
 * `object-fit: cover`, so it fills whatever height the column ends up with
 * and crops rather than distorts. `height: auto` is required as well as
 * `align-self` -- `stretch` is ignored while the cross-size is anything but
 * `auto`, and Framer sets `min-content`. `min-height` is left alone, so the
 * column still can't collapse below the authored 760px when the panel is
 * short.
 *
 * !important because Framer's rule (`.framer-ptq6z .framer-gb9f8f`) is two
 * classes and outranks the attribute selector; data-framer-name is used
 * rather than that hashed class because the hash changes on every re-export.
 *
 * Under 810px the row becomes a column and the cover is already full-width at
 * its own min-height, so the rule is a no-op there rather than a change.
 */

[data-framer-name="Login editorial composition"] > [data-framer-name="Editorial cover"] {
  align-self: stretch !important;
  height: auto !important;
}