/* =====================================================================
 * pdfview.css — [PDF뷰어] 이서톡 안에서 PDF 읽기
 * ---------------------------------------------------------------------
 * 🔴 새 디자인 시스템이 아니다. 색·글꼴·모서리·그림자는 전부 index.html 이
 *   이미 정의한 CSS 변수(`--surface`·`--text`·`--acc`·`--line`…)를 그대로 쓴다.
 *   다크모드도 그 변수들이 알아서 따라오므로 이 파일에 다크 규칙이 없다.
 * 🔴 글자 크기는 반드시 `calc(Npx * var(--fz,1))` — [글자크기] `FzSvc` 계약이다
 *   (`tools/sim-2026-07-28-23차-글자크기와PC앱.js` 가 기계로 검사한다).
 * 🔴 층(z-index)은 라이트박스(150)와 같은 자리에 둔다 — 시트(900)·모달(950)보다
 *   아래여야 뷰어 위에서 확인창·⋯메뉴가 정상으로 뜬다.
 * ===================================================================== */

#pdfv{
  position:fixed; inset:0; z-index:150; display:none;
  flex-direction:column; background:var(--bg,#faf7f5); color:var(--text,#2a2226);
  /* 노치·홈바 — 이 앱의 기존 safe-area 문법 그대로 */
  padding-top:env(safe-area-inset-top); padding-bottom:env(safe-area-inset-bottom);
}
#pdfv.on{ display:flex; }
/* 뷰어가 열려 있는 동안 뒤 화면이 같이 스크롤되지 않게 (라이트박스와 같은 처방) */
body.pdfv-open{ overflow:hidden; }

/* ---------- 위 막대 ---------- */
#pdfv-top{
  flex:0 0 auto; display:flex; align-items:center; gap:8px;
  padding:6px 8px; min-height:48px;
  background:var(--surface,#fff); border-bottom:1px solid var(--line,#eee);
}
#pdfv-title{
  flex:1; min-width:0; font-size:calc(15px * var(--fz,1)); font-weight:700;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
#pdfv .pdfv-ic{
  flex:0 0 auto; width:38px; height:38px; border-radius:10px; border:0;
  background:transparent; color:var(--text,#2a2226);
  font-size:calc(17px * var(--fz,1)); line-height:1; cursor:pointer;
}
#pdfv .pdfv-ic:disabled{ opacity:.35; cursor:default; }
#pdfv .pdfv-ic:active{ background:var(--surface2,#f1ecea); }

/* ---------- 검색줄 ---------- */
#pdfv-find{
  flex:0 0 auto; display:none; align-items:center; gap:6px;
  padding:6px 8px; background:var(--surface,#fff); border-bottom:1px solid var(--line,#eee);
}
#pdfv-find.on{ display:flex; }
#pdfv-find-q{
  flex:1; min-width:0; height:36px; padding:0 10px; border-radius:10px;
  border:1px solid var(--line,#eee); background:var(--surface2,#f7f3f1);
  color:inherit; font-family:inherit; font-size:calc(14px * var(--fz,1));
}
#pdfv-find-n{
  flex:0 0 auto; font-size:calc(12px * var(--fz,1)); opacity:.7; min-width:52px; text-align:center;
}

/* ---------- 본문 ---------- */
/* ⚠ PDFViewer 는 container 가 **absolute** 가 아니면 생성자에서 예외를 던진다
   (pdf_viewer.mjs 의 `The container must be absolutely positioned`). 그래서
   바깥에 relative 상자 하나를 두고 그 안에서 절대배치한다. */
#pdfv-body{ flex:1 1 auto; position:relative; min-height:0; overflow:hidden; }
#pdfv-stage{
  position:absolute; inset:0; overflow:auto; background:var(--surface2,#efe9e6);
  -webkit-overflow-scrolling:touch;
}
/* 종이넘김(PageCurl)이 가로를 가져가도 되는 순간에만 세로만 남긴다.
   ⚠ `erp-curl-ready` 는 엔진의 `_syncReady()` 가 붙였다 뗀다 — 우리가 직접 안 만진다.
      (adapter 의 `readyEl()` 이 이 요소를 지목한다) */
#pdfv-stage.erp-curl-ready{ touch-action:pan-y; }
#pdfv-doc{ position:absolute; }

/* ---------- 상태판 (로딩·오류·비밀번호) ---------- */
#pdfv-panel{
  position:absolute; inset:0; display:none; z-index:5;
  flex-direction:column; align-items:center; justify-content:center; gap:12px;
  padding:24px; text-align:center; background:var(--bg,#faf7f5);
}
#pdfv-panel.on{ display:flex; }
#pdfv-panel .pdfv-msg{ font-size:calc(14px * var(--fz,1)); line-height:1.6; max-width:30em; white-space:pre-line; }
#pdfv-panel .pdfv-sub{ font-size:calc(12px * var(--fz,1)); opacity:.65; }
#pdfv-pw{
  width:min(280px,80vw); height:40px; padding:0 12px; border-radius:10px;
  border:1px solid var(--line,#ddd); background:var(--surface,#fff);
  color:inherit; font-family:inherit; font-size:calc(14px * var(--fz,1)); text-align:center;
}
#pdfv-panel .pdfv-row{ display:flex; gap:8px; flex-wrap:wrap; justify-content:center; }
#pdfv-panel .pdfv-btn{
  height:38px; padding:0 16px; border-radius:10px; border:1px solid var(--line,#ddd);
  background:var(--surface,#fff); color:inherit;
  font-family:inherit; font-size:calc(13px * var(--fz,1)); font-weight:700; cursor:pointer;
}
#pdfv-panel .pdfv-btn.pri{ background:var(--acc,#c98b7a); border-color:transparent; color:#fff; }

/* 얇은 진행줄 — 새 스피너 자산을 만들지 않는다(CSS 만) */
#pdfv-bar{
  position:absolute; left:0; top:0; height:2px; width:0%;
  background:var(--acc,#c98b7a); transition:width .18s linear; z-index:6;
}

/* ---------- 아래 막대 ---------- */
#pdfv-bot{
  flex:0 0 auto; display:flex; align-items:center; justify-content:center; gap:4px;
  padding:5px 6px; background:var(--surface,#fff); border-top:1px solid var(--line,#eee);
  font-size:calc(13px * var(--fz,1));
}
#pdfv-zl,#pdfv-pg{ min-width:56px; text-align:center; opacity:.85; font-variant-numeric:tabular-nums; }
#pdfv-sep{ width:1px; height:20px; background:var(--line,#eee); margin:0 4px; }

#pdfv-act{
  flex:0 0 auto; display:flex; gap:6px; padding:6px 8px 8px;
  background:var(--surface,#fff);
}
#pdfv-act .pdfv-btn{
  flex:1; height:40px; border-radius:12px; border:1px solid var(--line,#ddd);
  background:var(--surface2,#f7f3f1); color:inherit;
  font-family:inherit; font-size:calc(13px * var(--fz,1)); font-weight:700; cursor:pointer;
}
#pdfv-act .pdfv-btn:disabled{ opacity:.45; cursor:default; }
/* 좁은 폰에서는 액션 줄을 접고 위 ⋯ 메뉴 하나로 몰아 준다 (요청서 §6) */
@media (max-width:419px){ #pdfv-act{ display:none; } }

/* ---------- PDF.js 종이 ---------- */
/* pdf_viewer.css 가 이미 `.pdfViewer .page` 를 그린다. 우리는 배경과 여백만 맞춘다. */
#pdfv .pdfViewer .page{
  margin:8px auto; border:0; box-shadow:0 1px 6px rgba(0,0,0,.16); background:#fff;
}
#pdfv .pdfViewer{ padding:4px 0 12px; }
/* 종이넘김 중에는 글자층·주석층이 손가락을 가져가면 안 된다(요청서 §14) */
#pdfv.pdfv-curling .textLayer,
#pdfv.pdfv-curling .annotationLayer{ pointer-events:none !important; }
#pdfv.pdfv-curling .pdfViewer{ user-select:none; -webkit-user-select:none; }
