/*
  결제 진행 중 전체 화면 입력 차단 — 목업에 대응 요소가 없어 새로 추가한다.

  버튼의 `disabled` 만으로는 화면을 지킬 수 없다. 승인이 조각별로 도는 동안에도 헤더 링크·
  모바일 하단 고정 UI·장바구니 배지처럼 **버튼이 아닌 것들**은 그대로 눌려, 승인 중에 화면을
  떠나 버릴 수 있다. 그래서 진행 중에는 화면 전체를 덮어 포인터를 삼킨다.

  상태 원천은 `OrderSheetView` 의 `createOrder.isPending` 하나다 — 이 규칙은 그 상태에서만
  렌더되는 요소에 걸린다(요소를 감추는 규칙이 아니다).

  층 순서: 목업에서 가장 높은 층은 팝업(`z-index:10`, `common/_components.css`)이고 헤더·모바일
  고정 바는 7~9 다. 그 위를 덮어야 클릭이 새어나가지 않는다. 토스트(`app/toast.css`, 1000)보다는
  낮게 둬서 실패 안내가 백드롭에 갇히지 않게 한다.
*/
.payment-blocker {
  position: fixed;
  inset: 0;
  z-index: 900;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  /* 터치 스크롤·핀치까지 이 층에서 멈춘다. 포인터 수신은 기본값(auto)을 그대로 둔다 */
  touch-action: none;
  background: rgb(0 0 0 / 45%);
}

/* 인디케이터는 이 층이 이미 중앙을 잡는다 — 자체 최소 높이·여백만 되돌린다 */
.payment-blocker .loading-area {
  width: auto;
  min-height: 0;
  padding: 0;
}

.payment-blocker-text {
  margin: 0;
  color: #fff;
}