/* 연하장 샘플 신청 — 청첩장 샘플 신청 틀(card/doc/order/sample/sample_order.css) 위에서 연하장 조각(옛 마크업)만 맞춘다 */

/* ── 담은 샘플(sample_order_card_list.php) — 청첩장 선택 샘플 카드와 같은 모양 ── */
.nb-sample-order__cards #sample_card_list { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--bj-space-2); }
.nb-sample-order #sample_card_list > .sample_order_card { position: relative; float: none; width: auto; min-width: 0; margin: 0; overflow: hidden; color: var(--bj-ink); }
/* 빈 자리(1~10 번호 그림)는 감추고 실제로 담은 샘플만 보인다 */
.nb-sample-order #sample_card_list > .sample_order_card[data-code=""] { display: none; }
.nb-sample-order__cards .sample_order_card > a { display: block; }
.nb-sample-order__cards .sample_order_card_img { display: block; width: 100%; height: auto; aspect-ratio: 1 / 1; padding: 12px; box-sizing: border-box; border: 0; background: var(--bj-product-stage); object-fit: contain; }
.nb-sample-order__cards .sample_order_card > div[style] { height: auto !important; padding: var(--bj-space-2) 2px 0; }
.nb-sample-order__cards .sample_order_card_code { padding: 0; color: var(--bj-ink); font-size: var(--bj-type-control); font-weight: var(--bj-type-control-weight); line-height: var(--bj-type-control-line); text-align: left; text-transform: uppercase; }
.nb-sample-order__cards .sample_order_card_price { padding: 2px 0 0; color: var(--bj-muted); font-size: var(--bj-type-caption); line-height: var(--bj-type-caption-line); text-align: left; }
.nb-sample-order__cards .sample_order_card_price b { color: var(--bj-ink); }
/* 빼기(×) — 동작은 product.js.php 그대로, 모양만 청첩장 원형 단추로 */
.nb-sample-order__cards .sample_card_list_del_button { top: 8px; right: 8px; width: 32px; height: 32px; padding: 9px; box-sizing: border-box; border: 1px solid var(--bj-line-strong); border-radius: 50%; background: var(--bj-clean); }
.nb-sample-order__empty { display: none; margin: 0; padding: var(--bj-space-4) 0; color: var(--bj-muted); font-size: var(--bj-type-body); line-height: var(--bj-type-body-line); text-align: center; }
.nb-sample-order__picks:not(:has(.sample_order_card:not([data-code=""]))) .nb-sample-order__empty { display: block; }
.nb-sample-order__notice { margin: var(--bj-space-3) 0 0; padding: var(--bj-space-3); background: var(--bj-stone); color: var(--bj-ink); font-size: var(--bj-type-body); line-height: var(--bj-type-body-line); word-break: keep-all; }

/* ── 휴대폰·전화번호 — 앞자리 고르기 + 두 칸 ── */
.nb-sample-order__phone { display: flex; flex-wrap: wrap; align-items: center; gap: var(--bj-space-1); }
.nb-sample-order__phone select { width: 88px; flex: 0 0 auto; }
.nb-sample-order__phone input.box { width: 88px; min-width: 0; flex: 1 1 72px; }
.nb-sample-order__phone > span { color: var(--bj-muted); }
.nb-sample-order__auth { min-height: 44px; padding: 0 var(--bj-space-3); border: 1px solid var(--bj-charcoal); border-radius: var(--bj-control-radius); background: var(--bj-clean); color: var(--bj-ink); cursor: pointer; font-family: var(--bj-font-family); font-size: var(--bj-type-control); font-weight: var(--bj-type-control-weight); white-space: nowrap; }
.nb-sample-order__check { display: inline-flex; align-items: center; gap: var(--bj-space-1); margin-left: var(--bj-space-1); color: var(--bj-muted); font-size: var(--bj-type-control); white-space: nowrap; }
.nb-sample-order__hand-text { color: var(--bj-success); font-size: var(--bj-type-control); font-weight: 600; line-height: var(--bj-type-control-line); }
.nb-sample-order .sample_order_memo { width: 100%; }

/* ── 신청 요약 ── */
.nb-sample-order__total dt,
.nb-sample-order__total dd { color: var(--bj-ink); font-weight: 600; }
.nb-sample-order__pay { margin-top: var(--bj-space-3); padding-top: var(--bj-space-3); border-top: 1px solid var(--bj-line); }
.nb-sample-order__pay-label { margin: 0 0 var(--bj-space-2); color: var(--bj-muted); font-size: var(--bj-type-caption); line-height: var(--bj-type-caption-line); }
/* 옛 이미지 단추는 동작(payway 지정)만 맡고 화면에서는 새 단추로 고른다 */
.nb-sample-order__pay .pm_btns { display: none !important; }
.nb-sample-order__pay-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--bj-space-2); }
.nb-sample-order__pay-choice { min-height: 48px; padding: 0 var(--bj-space-2); border: 1px solid var(--bj-line-strong); border-radius: var(--bj-control-radius); background: var(--bj-clean); color: var(--bj-ink); cursor: pointer; font-family: var(--bj-font-family); font-size: var(--bj-type-control); font-weight: var(--bj-type-control-weight); line-height: var(--bj-type-control-line); }
.nb-sample-order__pay-choice:hover { border-color: var(--bj-ink); }
.nb-sample-order__pay-choice[aria-checked="true"] { border-color: var(--bj-charcoal); background: var(--bj-charcoal); color: var(--bj-clean); font-weight: 600; }
.nb-sample-order__pay-choice:focus-visible { outline: 2px solid var(--bj-charcoal); outline-offset: 2px; }

/* ── 약관 동의(card/term_checks.php 기본형) — 청첩장 샘플 신청 틀에 이미 있는 «요약 안 약관» 모양을 그대로 쓴다 ── */

.nb-sample-order__closed { margin: var(--bj-space-3) 0 0; color: var(--bj-ink); font-size: var(--bj-type-control); font-weight: 600; line-height: var(--bj-type-control-line); word-break: keep-all; }

/* 카드·휴대폰 결제 창 — 화면 가운데에 띄운다(띄우는 시점은 sample_order_js.php 그대로) */
.nb-sample-order #payif { position: fixed; top: 50%; left: 50%; z-index: 1000; width: min(650px, calc(100vw - 32px)); height: min(650px, calc(100dvh - 32px)); border: 1px solid var(--bj-ink); background: var(--bj-clean); transform: translate(-50%, -50%); }

@media (max-width: 767px) {
    .nb-sample-order__cards #sample_card_list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .nb-sample-order__phone select { width: 76px; }
    .nb-sample-order__phone input.box { width: auto; flex: 1 1 56px; }
    .nb-sample-order__auth { width: 100%; }
}