/* L2 페이지 위저드 틀 — 한 페이지 · 폼 하나 · 단계 패널(u-wizard-*) · L2 셸(header_user.jsp)이 싣는다 · 부르는 화면 = 발주 위저드 order_form.jsp · 대상찾기 finder_form.jsp
   폼 = .wzp[data-step][data-steps] — data-step = 지금 단계(user_wizard_page.js 가 바꾼다) · data-steps = 단계 수(JSP 고정값 · 진행 막대 폭·마지막 단계 제출 버튼이 읽는다)
   색·크기 = user_variables.css 토큰만 · 화면 고유 모양(서류 카드·체크 행)은 그 화면의 pages/*.css */

/* ── 화면 나눔 ── */
/* 화면 높이 전체(100dvh)를 세로로 나눈다: 상단 바 → 단계 머리 .wzp-head → 본문 .wzp-scroll(남은 높이) → 버튼 줄 .wzp-foot · 바닥글은 숨긴다
   본문 안 = 활성 패널이 세로 flex — 질문 .wzp-q·보조 .wzp-sub 고정 · 내용 래퍼 .wz-scroll-area 만 스크롤 · 바탕 흰색 · 머리 아래·버튼 줄 위 얇은 선 하나씩 */
body:has(.wzp) { height: 100vh; height: 100dvh; min-height: 0; overflow: hidden; }   /* 흰 바탕 = 폼의 .sdo-page(user_components.css «흰 바탕 화면») */
body:has(.wzp) .sdo-topbar { position: relative; flex: none; }
body:has(.wzp) .sdo-main { min-height: 0; display: flex; flex-direction: column; padding: 0; }
body:has(.wzp) .sdo-footer { display: none; }
.wzp { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.wzp-head { flex: none; }
.wzp-scroll { flex: 1; min-height: 0; display: flex; flex-direction: column; padding: var(--sdo-sp-32) 0 var(--sdo-sp-20); overflow-y: auto; }
/* 아주 낮은 창 — 내용 칸이 바닥(160px) 아래로 줄면 그때만 본문 전체(.wzp-scroll)가 스크롤한다 */
.wzp-scroll > .sdo-container { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.wzp .u-wizard-body { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.wzp .u-wizard-panel.active { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.wzp .u-wizard-panel.active > .wzp-q,
.wzp .u-wizard-panel.active > .wzp-sub { flex-shrink: 0; }
/* 내용 래퍼 = 스크롤 칸 하나 · 안쪽 여백을 음수 바깥 여백으로 상쇄 — 고른 상자 고리·입력 초점 고리(바깥 3px)가 칸 가장자리에서 잘리지 않게 */
.wzp .wz-scroll-area { flex: 1; min-height: 160px; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; padding: var(--sdo-sp-4); margin: -4px; }
.wzp-foot { flex: none; background: var(--sdo-surface); border-top: 1px solid var(--sdo-line-soft); padding: var(--sdo-sp-12) 0 calc(var(--sdo-sp-12) + env(safe-area-inset-bottom, 0px)); }
.wzp-foot .sdo-cta-bar { margin-top: 0; }
.wzp-head .sdo-page-title { margin-bottom: var(--sdo-sp-24); }
/* 처음 열 단계가 ① 이 아니거나(data-wzp-open) 거부로 되돌아온 화면(data-wzp-restore)이면 RN.wizardPage 가 그 단계를 열고 data-wzp-ready 를 달 때까지 단계 표시·본문·버튼 줄을 그리지 않는다 — 서버가 그린 ① 이 한 번 비쳤다 넘어가는 깜빡임을 막는다(order CONTRACT.md §2-D-15) */
.wzp[data-wzp-open]:not([data-wzp-open=""]):not([data-wzp-open="1"]):not([data-wzp-ready]) :is(.sdo-steps, .wzp-bar, .wzp-count, .wzp-scroll, .wzp-foot),
.wzp[data-wzp-restore="Y"]:not([data-wzp-ready]) :is(.sdo-steps, .wzp-bar, .wzp-count, .wzp-scroll, .wzp-foot) { visibility: hidden; }
.wzp-bar, .wzp-count { display: none; }

/* ── 위저드 글씨 등급 ── */
/* 위저드 안 내용은 두 등급만 쓴다 — 항목 = --sdo-fs-wz-item · 글 = --sdo-fs-wz-text · 모바일 절은 같은 이름 -mo 토큰(값 = user_variables.css) · 화면 pages/*.css 도 이 토큰만 읽는다 · 입력칸·칸 이름 크기 = 공용 sdo-input·sdo-label(같은 등급) */

/* ── 단계 질문 ── */
.wzp-q { font-size: var(--sdo-fs-q); font-weight: var(--sdo-fw-heavy); letter-spacing: -0.6px; line-height: 1.35; color: var(--sdo-ink); }
.wzp-sub { margin: var(--sdo-sp-12) 0 var(--sdo-sp-32); font-size: var(--sdo-fs-wz-text); line-height: 1.6; color: var(--sdo-ink-muted); white-space: pre-line; }   /* 번들 값의 \n = 문장마다 줄바꿈 */

/* ── 위저드 폭 ── */
/* 머리(제목·단계 표시)·모든 단계·버튼 줄 = 셸 내용 폭 하나(.sdo-container · 홈과 같은 넓은 판) — 좌우 끝이 단계마다 같다 · 패널은 상자 없이 흰 바탕에 바로(창이 그릇) · 단계별 폭 규칙을 두지 않는다 */

/* ── 단계 수 «N / M» ── */
/* 모바일 — 지금 단계 것만 */
.wzp-step-title { display: none; }
.wzp[data-step="1"] .wzp-step-title[data-title="1"],
.wzp[data-step="2"] .wzp-step-title[data-title="2"],
.wzp[data-step="3"] .wzp-step-title[data-title="3"],
.wzp[data-step="4"] .wzp-step-title[data-title="4"],
.wzp[data-step="5"] .wzp-step-title[data-title="5"] { display: inline; }

/* ── 단계 버튼 ── */
/* 이전·다음 보이기 = 엔진 RN.wizardTabs(첫 단계 이전 숨김 · 마지막 단계 다음 숨김) · 여기는 다음 버튼 글자 둘(첫 단계 전용 글자가 있으면 그것)과 마지막 단계의 제출 버튼 */
.wzp .wzp-actions-submit { display: none; }
.wzp .wzp-next-rest { display: inline-flex; align-items: center; gap: 6px; }
.wzp:not([data-step="1"]) .wzp-next-first,
.wzp[data-step="1"] .wzp-next-first + .wzp-next-rest { display: none; }
.wzp[data-steps="4"][data-step="4"] .wzp-actions-submit,
.wzp[data-steps="5"][data-step="5"] .wzp-actions-submit { display: inline-flex; }

/* ── PC 위저드 입력칸 ── */
/* 여러 줄 칸 높이를 PC 위저드에서만 넓게 · 칸 간격·글씨·칸 높이 = 공용 sdo-field·sdo-input */
@media (min-width: 981px) {
    .wzp textarea.sdo-input { min-height: 180px; }
}

/* ── 낮은 PC 창 ── */
/* 머리·버튼 줄을 줄여 질문 고정 + 내용 칸 스크롤을 지킨다(상단 바 그대로 · 모바일 규칙 밖) */
@media (min-width: 981px) and (max-height: 720px) {
    .wzp-head { padding: var(--sdo-sp-12) 0; }
    .wzp-head .sdo-page-title { display: none; }
    .wzp .sdo-steps .step-num { width: 26px; height: 26px; }
    .wzp-scroll { padding: var(--sdo-sp-12) 0 var(--sdo-sp-8); }
    .wzp-q { font-size: var(--sdo-fs-lg); }
    .wzp-sub { margin-bottom: var(--sdo-sp-12); }
    .wzp-foot { padding: var(--sdo-sp-8) 0; }
    .wzp-foot .sdo-btn-lg { height: var(--sdo-btn-h); }
}

/* ── 모바일 위저드 ── */
/* 한 단계가 화면 전체 · 진행 막대 + «N / M» · 모바일도 같은 세로 나눔(제목줄·버튼 줄을 position:fixed 로 띄우지 않는다) */
@media (max-width: 980.98px) {
    .wzp-scroll { padding: var(--sdo-sp-20) 0 var(--sdo-sp-12); }
    .wzp-head { padding: var(--sdo-sp-8) 0 var(--sdo-sp-12); }
    .wzp .u-wizard-progress { display: none; }
    .wzp-bar { display: block; height: 4px; margin: var(--sdo-sp-4) 0 var(--sdo-sp-8); background: var(--sdo-line-soft); border-radius: 2px; overflow: hidden; }
    .wzp-bar-fill { height: 100%; width: 0; background: var(--sdo-accent); transition: width .25s ease; }
    .wzp[data-steps="4"][data-step="1"] .wzp-bar-fill { width: 25%; }
    .wzp[data-steps="4"][data-step="2"] .wzp-bar-fill { width: 50%; }
    .wzp[data-steps="4"][data-step="3"] .wzp-bar-fill { width: 75%; }
    .wzp[data-steps="4"][data-step="4"] .wzp-bar-fill { width: 100%; }
    .wzp[data-steps="5"][data-step="1"] .wzp-bar-fill { width: 20%; }
    .wzp[data-steps="5"][data-step="2"] .wzp-bar-fill { width: 40%; }
    .wzp[data-steps="5"][data-step="3"] .wzp-bar-fill { width: 60%; }
    .wzp[data-steps="5"][data-step="4"] .wzp-bar-fill { width: 80%; }
    .wzp[data-steps="5"][data-step="5"] .wzp-bar-fill { width: 100%; }
    .wzp-count { display: block; text-align: right; font-size: var(--sdo-fs-sm); color: var(--sdo-ink-muted); }
    .wzp-count b { color: var(--sdo-ink); }
    .wzp-q { font-size: var(--sdo-fs-2xl); letter-spacing: -0.4px; }
    .wzp-sub { margin: 6px 0 var(--sdo-sp-20); font-size: var(--sdo-fs-wz-text-mo); }
    .wzp[data-steps="4"][data-step="4"] .wzp-actions-submit,
    .wzp[data-steps="5"][data-step="5"] .wzp-actions-submit { display: flex; }
    /* 키보드가 열린 동안 버튼 줄을 숨긴다(표지 = user_modal.js body[data-rn-kb]) — 다음 = 키보드 «다음/이동» 키 · 닫으면 다시 보인다 */
    body[data-rn-kb="Y"] .wzp-foot { display: none; }
}
