/*
 * 우편번호 찾기 팝업 — 목업(`page/cart.css` 의 `.page-payment-postcode`) 보정.
 *
 * 20260826 목업이 팝업 3상태(`CH-U-CA-02-02-03p`~`05p`)를 확정하면서, 예전에 우리가 지어냈던
 * 인라인 검색 패널(`.payment-postcode-search-panel`) 스타일은 **전부 걷어냈다.**
 * 이제 모양은 목업 CSS 가 잡고, 여기에는 목업이 <b>정하지 않은 것만</b> 남는다.
 */

/*
 * 1) 팝업 제목의 요소 이름.
 *
 * 목업 팝업은 독립 HTML 이라 제목을 `<h1>` 으로 쓰지만(`.postcode-head h1`), 이 앱에서는
 * 주문서 화면 안에 뜨는 팝업이라 `<h2>` 다({@link UiPopup} 공통 규약) — 화면에 `h1` 이
 * 이미 있고, 문서 개요를 팝업이 가로채면 보조기술 탐색이 어긋난다.
 * **문서 구조를 목업에 맞추는 대신, 목업이 `h1` 에 준 서식을 `h2` 에도 준다.**
 */
.page-payment-postcode .postcode-head h2 {
  overflow: hidden;
  margin: 0;
  color: #111;
  text-align: center;
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
  letter-spacing: -0.5px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* 모바일 크기는 따로 두지 않는다 — 20260904 목업이 `.ui-popup-head :is(h1, h2)` 를 20px 로 통일했다 */

/*
 * 2) 상태 문구 — 검색 중 · 결과 없음 · 오류.
 *
 * 목업은 성공 화면만 그려서 이 세 경우에 보여 줄 것이 없다. 없으면 사용자가 무슨 일이
 * 일어났는지 알 수 없으므로 최소한으로 둔다(`PostcodeSearchPopup`).
 * 오류만 붉게 두고 나머지는 안내색이다 — 셋을 같은 색으로 두면 0건이 실패로 읽힌다.
 */
.page-payment-postcode .postcode-state {
  margin: 16px 0 0;
  color: #767676;
  font-size: 14px;
  font-weight: 400;
  line-height: 145%;
  letter-spacing: -0.025em;
}

.page-payment-postcode .postcode-state.is-error {
  color: #c0392b;
}

/*
 * 3) 페이지 이동 버튼의 비활성·현재 표시.
 *
 * 목업은 화살표를 늘 누를 수 있는 것으로 그리고 현재 쪽만 `span.on` 으로 둔다.
 * 첫 쪽에서 `이전`, 마지막 쪽에서 `다음` 은 갈 곳이 없어 `disabled` 로 두는데,
 * 목업에 그 모양이 없어 여기서 흐리게 만든다(누를 수 없음을 보이게).
 *
 * 쪽 번호는 현재 쪽만 `span` 이고 나머지는 `button` 이다 — 목업이 전부 `span` 인 것과 다르다.
 * 실제로 눌러야 이동하므로 버튼이 맞고, 대신 `span` 에 준 서식을 버튼에도 준다.
 */
.page-payment-postcode .postcode-pagination button:disabled {
  cursor: default;
  opacity: 0.3;
}

.page-payment-postcode .postcode-pagination button.postcode-pagination-count {
  width: auto;
  height: auto;
  cursor: pointer;
}