/* ============================================================
   배때지 V2 · SHOP 레이아웃 시프트(CLS) 제거

   문제
     .v2live-loading("상품을 불러오는 중...")은 shop-live.css:366 에서
     .v2live-empty 와 함께 padding:55px 20px 를 받는다. 그래서
       숨김([hidden] → display:none) : 높이 0px
       표시                          : 높이 123px
     무한스크롤이 페이지를 부를 때마다 이 123px 가 생겼다 사라지고,
     바로 아래의 페이지 네비(.v2live-seo-pagination)와 그 아래 전체가
     같은 폭만큼 위아래로 튄다.
     실측 CLS 1.45~1.68 (권장 0.1). 시프트 1회당 0.145~0.168 이 반복 누적.

   해결
     로딩 표시를 흐름에서 빼지 않고 "항상 같은 높이를 차지"하게 만든다.
     보이고 숨기는 것은 display 가 아니라 visibility 로 처리한다
     → 토글해도 주변 요소가 1px 도 움직이지 않는다.

   .v2live-empty(빈 결과 안내)는 건드리지 않는다. 그쪽은 넉넉한 여백이 맞고
   토글이 자주 일어나지도 않는다.
   ============================================================ */

/* 로딩 표시를 문서 흐름에서 완전히 뺀다.
   높이를 고정하는 것만으로는 부족했다 — 흐름에 남아 있는 한
   위쪽 상품 그리드가 커질 때마다 함께 밀려 시프트를 만든다(실측 기여도 0.148).
   화면 하단에 뜨는 토스트 형태로 바꾸면 나타나고 사라져도
   주변 어떤 요소도 움직이지 않는다. */
.v2live-loading {
    position: fixed;
    left: 50%;
    bottom: calc(84px + env(safe-area-inset-bottom, 0px));  /* 하단 고정 네비 위 */
    z-index: 30;

    display: block !important;
    box-sizing: border-box;
    width: auto;
    min-height: 0;
    margin: 0;
    padding: 10px 18px !important;
    transform: translateX(-50%);

    border-radius: 999px;
    background: rgba(22, 22, 26, .88);
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    white-space: nowrap;
    pointer-events: none;

    visibility: hidden;
    opacity: 0;
}

/* 실제로 불러오는 중일 때만 보인다 */
.v2live-loading:not([hidden]) {
    visibility: visible;
    opacity: 1;
}

@media (min-width: 1024px) {
    .v2live-loading { bottom: 28px; }
}

@media (prefers-reduced-motion: no-preference) {
    .v2live-loading { transition: opacity .15s ease; }
}

/* ------------------------------------------------------------
   스크롤 앵커링 끄기

   브라우저는 목록에 콘텐츠가 추가되면 "보고 있던 요소를 유지"하려고
   스크롤 위치를 자동으로 조정한다(scroll anchoring). 무한스크롤 목록에서는
   이 자동 보정이
     · 맨 위로 버튼을 누른 직후 다시 아래로 끌어내리고
     · 뒤로가기 복원 직후 위치를 흔들며
     · 레이아웃 시프트로 집계된다.
   목록 컨테이너에서만 끈다(문서 전체 동작은 그대로 둔다).
   ------------------------------------------------------------ */
#v2Products {
    overflow-anchor: none;
}
