/* =============================================================
   Layout stability — prevents horizontal shift when the browser
   scrollbar appears/disappears during page load.
   Loaded globally via Magento_Theme/layout/default.xml.
   ============================================================= */

/* Force scrollbar to ALWAYS be visible. Guaranteed to work in
   every browser back to IE. Was previously behind an @supports
   fallback, but scrollbar-gutter compatibility varies with
   browser/OS/user-styles — making this the primary rule ensures
   the scrollbar column is reserved from first paint no matter
   what. Modern browsers still honour the scrollbar-gutter hint
   for the visual style of the reservation. */
html {
    overflow-y: scroll;
    scrollbar-gutter: stable;
}

/* Prevent horizontal shift caused by modal / dropdown widgets that
   set `overflow: hidden` on body when opened. Without this, the
   scrollbar column vanishes momentarily when a modal opens, and
   all content shifts right by ~15px, then back when it closes. */
body {
    overflow-x: hidden;
}

/* Pre-hide Magento's authenticationPopup and similar KO-managed
   modals. The DOM element carries a `style: {display: 'none'}`
   Knockout binding, but that binding only applies AFTER KO boots
   AND after the template has been rendered. Between "template
   rendered" and "binding applied" there is a visible window where
   the modal has real DOM content and — because .column.main is
   flex — it participates in the flex row, shoving the product-
   image row sideways. Hiding via CSS closes that window entirely
   with no functional impact (the binding will hide it too). */
#authenticationPopup,
[data-role="checkout-messages"] {
    display: none;
}