/*
 * 장바구니 보조 스타일 — 목업 원본(`page/cart.css`)은 건드리지 않는다.
 *
 * 목업에 대응 마크업이 없어 새로 만든 것만 남긴다. 예전에 이 파일이 담고 있던
 * 담기 레이어 내부 UI(`.cart-sheet*`·`.cart-option-list/item/title/control`·`.qty-stepper`·`.cart-total`)와
 * 옵션변경 팝업용 `.cart-option-select` 는 **모두 지웠다** —
 * 담기 레이어는 목업 `add_cart_pop` 을, 옵션변경 팝업은 목업 `cart-option-select`·`cart-voucher-list`·
 * `cart-popup-option`(`page/cart.css`)을 그대로 쓰므로 같은 이름의 자체 규칙이 남아 있으면 충돌한다.
 */

.payment-guide strong {
  font-weight: 600;
}

/* 옵션이 없을 때의 안내 문구 — 목업에 대응 요소가 없다(상품상세 구매영역·옵션변경 팝업 공용) */
.cart-option-empty {
  margin-top: 12px;
  color: var(--color-text-light);
}

/* 장바구니 목록 행의 옵션 삭제 버튼 — 목업은 행 전체 삭제만 있고 옵션 단위 삭제 버튼이 없다 */
.cart-option-remove {
  flex: none;
  border: 0;
  background: transparent;
  color: var(--color-text-light);
  font-size: 13px;
  cursor: pointer;
}

/* 장바구니 목록 썸네일 링크 — 목업에는 없던 `<a>` 를 넣었다(누르면 상품상세).
   `.cart-thumb` 는 146px 고정 flex 박스이고 `.cart-thumb img` 가 `max-width/height:100%` 라,
   앵커를 그냥 끼우면 이미지가 앵커 크기(내용만큼)에 맞춰 쪼그라든다.
   앵커가 박스를 꽉 채우고 가운데 정렬을 이어받게 해서 원래 레이아웃을 유지한다. */
.cart-thumb > a {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
}
.order-complete-main .complete-summary h2 {
  padding-bottom: 20px;
  border-bottom: 1px solid var(--color-line);
}

.order-complete-main .complete-total .complete-gross {
  margin-bottom: 8px;
}

.order-complete-main .complete-total .complete-gross dt {
  color: var(--color-text);
  font-weight: 600;
}

.order-complete-main .complete-total .complete-gross dd {
  color: var(--color-primary);
  font-size: 18px;
}

@media (max-width: 768px) {
  .order-complete-main .complete-layout > .complete-actions {
    grid-column: 1 / -1;
    margin: 0;
    padding: 0 20px 28px;
  }
}