/* 양식 변환(forms) 1단계: 한글 파일 미리보기 화면 */
/* 한글 양식에 자주 쓰이는 서울한강체: PC에 없어도 같게 보이도록 약품청구서의 글꼴 파일을 함께 씀(form-render.js 가 받은 뒤 줄을 다시 맞춤) */
@font-face{font-family:'서울한강체 L';src:url('../../medicine/assets/fonts/SeoulHangangL.ttf') format('truetype');font-display:block}
@font-face{font-family:'서울한강체 M';src:url('../../medicine/assets/fonts/SeoulHangangM.ttf') format('truetype');font-display:block}
@font-face{font-family:'서울한강체 B';src:url('../../medicine/assets/fonts/SeoulHangangB.ttf') format('truetype');font-display:block}
@font-face{font-family:'서울한강체 EB';src:url('../../medicine/assets/fonts/SeoulHangangEB.ttf') format('truetype');font-display:block}
/* 진하게(bold)인 글: 브라우저가 글자를 억지로 두껍게 그리면 한글보다 훨씬 굵어 보였음(파일철 제목) → 한 단계 굵은 실제 글꼴 파일로 그림 */
@font-face{font-family:'서울한강체 L';font-weight:700;src:url('../../medicine/assets/fonts/SeoulHangangM.ttf') format('truetype');font-display:block}
@font-face{font-family:'서울한강체 M';font-weight:700;src:url('../../medicine/assets/fonts/SeoulHangangB.ttf') format('truetype');font-display:block}
@font-face{font-family:'서울한강체 B';font-weight:700;src:url('../../medicine/assets/fonts/SeoulHangangEB.ttf') format('truetype');font-display:block}
@font-face{font-family:'서울한강체 EB';font-weight:700;src:url('../../medicine/assets/fonts/SeoulHangangEB.ttf') format('truetype');font-display:block}
/* 다른 메뉴 화면과 같은 바탕: 페이지 바깥 여백 0, 공통 메뉴는 테두리 포함 크기(border-box) — 없으면 메뉴 타일이 이 화면에서만 커졌음 */
body{margin:0}
.gnav,.gnav *,.gnav *::before,.gnav *::after{box-sizing:border-box}
.fm-wrap{max-width:1500px;margin:0 auto;padding:16px}
.fm-bar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:14px}
.fm-bar h1{font-size:20px;margin:0 8px 0 0}
.fm-drop{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border:2px dashed #b8c4d6;border-radius:12px;background:#fff;cursor:pointer;font-weight:700}
.fm-drop.is-over{border-color:#0071e3;background:#eef5ff}
.fm-drop input{display:none}
.fm-status{font-size:13px;color:#555}
.fm-status.is-err{color:#c62828;font-weight:700}
.fm-view{display:flex;gap:20px;justify-content:center;align-items:flex-start;overflow-x:auto;padding-bottom:20px}
.fm-view[hidden],.fm-col[hidden]{display:none}
.fm-col h2{font-size:13px;color:#666;margin:0 0 6px;font-weight:700}
.fm-pages{display:flex;flex-direction:column;gap:16px}
.fm-preview img{display:block;width:210mm;max-width:none;background:#fff;box-shadow:0 2px 12px rgba(0,0,0,.12)}
.fm-info{font-size:12px;color:#666;margin-top:6px}
/* 한글 쪽(A4): 안의 모든 위치는 mm 절대 배치(form-render.js) */
.hp-page{position:relative;background:#fff;box-shadow:0 2px 12px rgba(0,0,0,.12);overflow:hidden;flex:none;color:#000}
.hp-para-abs{position:absolute;white-space:pre;overflow:visible}
.hp-line{white-space:pre}
/* 줄 내용(form-render.js paraBox): 너비를 재서 한글 줄 폭에 맞춤(fitLines). 양쪽 정렬 줄은 끝까지 벌림 */
.hp-lc{display:inline-block;white-space:pre;vertical-align:top;position:relative}
/* 기준선 재기용 점(fitLines 가 잠깐 넣었다 뺌) */
.hp-probe{display:inline-block;width:0;height:0;vertical-align:baseline}
.hp-lc.is-justify{display:block;white-space:pre-wrap;text-align:justify;text-align-last:justify}
/* 글자처럼 취급한 개체(표·그림)는 줄 안 글자 자리에 */
.hp-inl{display:inline-block;vertical-align:top;position:relative}
.hp-inl.hp-table{display:inline-grid}
.hp-inl.hp-textbox{display:inline-flex}
.hp-run{white-space:pre;outline:none;cursor:text}
/* 양식 글도 눌러서 고침(form-render.js appendRun): 화면에서만 올리면 연한 파랑, 고치는 중 파란 밑줄. 다 지운 조각도 다시 누를 수 있게 최소 너비 */
.hp-run:hover{background:rgba(0,113,227,.08)}
.hp-run:focus{background:rgba(0,113,227,.12);box-shadow:inset 0 -2px 0 #0071e3}
.hp-run:empty{display:inline-block;min-width:.6em;min-height:1em;vertical-align:baseline}
/* 한컴 전용 기호 동그라미·네모 '인'(form-render.js fillRunText): 글자 한 칸 크기 테두리 안에 작은 '인' */
.hp-sym{display:inline-block;box-sizing:border-box;width:1em;height:1em;line-height:.92em;border:.07em solid currentColor;text-align:center;font-size:1em;vertical-align:-.12em;text-indent:0}
.hp-sym::first-letter{font-size:.7em}
.hp-sym-c{border-radius:50%}
/* 생년월일·연락처·주민등록번호·주소 칸(forms-app.js lockPrivate): 적지 못함 — 화면에서만 회색 빗금, 인쇄는 빈칸 그대로 */
.hp-input.fm-locked,.hp-input.fm-locked:hover{background:repeating-linear-gradient(-45deg,rgba(0,0,0,.05) 0 4px,transparent 4px 8px);cursor:not-allowed}
.hp-run.fm-locked,.hp-run.fm-locked:hover{background:none;cursor:not-allowed}
/* 엑셀 양식(xlsx-render.js): 쪽 안 인쇄 영역(.xl-area, px·배율 transform) 위에 바탕·칸 글·테두리 선을 절대 배치 */
.xl-area{position:absolute;transform-origin:0 0;overflow:hidden}
.xl-fill,.xl-c,.xl-b{position:absolute;box-sizing:border-box}
.xl-c{display:flex;overflow:hidden;line-height:1.2}
.xl-c .xl-t{white-space:pre;flex:none}
.xl-c.is-wrap .xl-t{white-space:pre-wrap;overflow-wrap:anywhere;flex:1 1 auto;min-width:0}
.xl-c.is-vert .xl-t{writing-mode:vertical-rl;text-orientation:upright}
.xl-c .hp-input{flex:1 1 auto;min-height:100%;width:100%;max-height:none}
.xl-b{pointer-events:none;width:0;height:0}
/* 표·글상자 안은 바깥 문단의 양쪽 정렬(text-align-last:justify)을 물려받지 않음 — 물려받으면 가운데 정렬 칸 글이 왼쪽에 붙었음(큰파일철) */
.hp-table,.hp-textbox{text-align-last:auto}
.hp-table{display:grid;box-sizing:border-box}
.hp-cell{display:flex;flex-direction:column;box-sizing:border-box;overflow:hidden;margin:0 -0.06mm -0.06mm 0}
.hp-cell .hp-para{flex:none}
.hp-textbox{display:flex;flex-direction:column;box-sizing:border-box;overflow:visible}
.hp-pic{object-fit:fill}
/* 빈칸 입력(form-render.js inputEl): 칸을 꽉 채우고, 화면에서만 연한 노랑 바탕·누르면 파란 테두리. 인쇄에는 글만 */
.hp-input{flex:1;min-height:100%;width:100%;outline:none;white-space:pre-wrap;word-break:break-all;cursor:text;
  display:flex;flex-direction:column;justify-content:center;background:rgba(255,236,150,.22);transition:background .15s}
.hp-input:hover{background:rgba(255,236,150,.4)}
.hp-input:focus{background:#fffbe6;box-shadow:inset 0 0 0 1.5px #0071e3}
.fm-hide-hint .hp-input{background:transparent}
.fm-btn{height:38px;padding:0 14px;border:1px solid #cfd6e0;border-radius:10px;background:#fff;font-weight:700;cursor:pointer}
.fm-btn:hover{background:#f2f5f9}
.fm-check{display:inline-flex;align-items:center;gap:6px}
.fm-btn[hidden]{display:none}
/* 📑 PDF 편집기(pdf.php) 바로가기: 버튼 모양의 링크 */
a.fm-pdfbtn{display:inline-flex;align-items:center;gap:6px;color:#1d1d1f;text-decoration:none;font-size:14px}
/* 목록 검색(forms-app.js renderLists) */
/* 검색창은 위 줄 「끌어다 놓기」 오른쪽(2026-11-02) — 남는 폭만큼 넓어짐 */
.fm-search{display:flex;align-items:center;gap:10px;flex:1 1 320px;min-width:240px}
.fm-search input{flex:1;max-width:560px;height:40px;padding:0 14px;border:1px solid #cfd6e0;border-radius:10px;font-size:14px;background:#fff}
.fm-search input:focus{outline:2px solid #0071e3;outline-offset:1px}
.fm-search-count{font-size:13px;color:#555}
/* 2단계: 목록·저장 */
.fm-lists{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:14px;margin-bottom:16px}
.fm-list{background:#fff;border:1px solid #e3e6eb;border-radius:14px;padding:12px 14px}
.fm-list h2{font-size:15px;margin:0 0 8px}
.fm-count{font-size:12px;color:#888;font-weight:600}
.fm-list ul{list-style:none;margin:0;padding:0;max-height:220px;overflow-y:auto;display:flex;flex-direction:column;gap:4px}
.fm-list li{display:flex;align-items:center;gap:6px;border-radius:10px}
.fm-list li.is-cur{background:#eef5ff}
/* 저장된 양식 맨 위 고정(후원물품 수입자료): 목록을 내려도 위에 붙어 있음 */
.fm-list li.fm-pinned{position:sticky;top:0;z-index:1;background:#f4f8ff;border:1px solid #d6e4fb;margin-bottom:2px}
.fm-list li.fm-empty{font-size:13px;color:#888;padding:6px 4px}
/* 2026-11-05 양식 목록만(작성한 문서·웹 양식 뺌): 한 칸 전체 너비, 목록은 창 높이만큼 */
.fm-lists-one{grid-template-columns:minmax(0,1fr)}   /* 1fr 은 내용 최소 폭(433px)만큼 넓어져 휴대폰에서 목록이 화면 밖으로 나갔음 → 0 부터(2026-11-09) */
.fm-lists-one .fm-list ul{max-height:calc(100vh - 260px);min-height:120px}
.fm-list-note{font-size:13px;color:#666;margin:0 0 8px}
/* 이 화면의 프린터 버튼은 숨김(인쇄는 한글 편집기에서) — 사용법 버튼이 붙는 자리로만 둠. 공통 메뉴 스타일의 display 를 이김 */
.print-fab.fm-print-hidden{display:none!important}
.fm-open{flex:1;min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:1px;padding:7px 10px;border:0;background:none;text-align:left;cursor:pointer;border-radius:10px}
.fm-open:hover{background:#f2f5f9}
.fm-open b{font-size:14px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fm-open span{font-size:12px;color:#777}
.fm-del{flex:none;height:30px;padding:0 10px;border:1px solid #f0c8c8;border-radius:8px;background:#fff;color:#c62828;font-size:12px;cursor:pointer}
.fm-del:hover{background:#fdecec}
.fm-edit[hidden]{display:none}
.fm-tools{position:sticky;top:0;z-index:20;background:#f7f7f5;padding:8px 0}
.fm-tplname{font-weight:800;font-size:15px}
.fm-primary{background:#0071e3;border-color:#0071e3;color:#fff}
.fm-primary:hover{background:#0062c4}
.fm-titlewrap{display:inline-flex;align-items:center;gap:6px;font-weight:700;font-size:14px}
.fm-titlewrap[hidden]{display:none}
.fm-titlewrap input{height:36px;width:260px;max-width:60vw;padding:0 10px;border:1px solid #cfd6e0;border-radius:8px;font-size:14px}
.fm-saved{font-size:12px;color:#666}
/* 편집 도구 줄은 한 줄(2026-11-02): 버튼·체크 칸 글씨·높이를 같게(체크 칸만 16px 이라 줄이 넘쳤음), 제목 칸이 남는 폭만큼 줄어듦,
   그래도 좁으면 줄을 옆으로 밀어 봄 */
.fm-tools{flex-wrap:nowrap;gap:5px;overflow-x:auto;scrollbar-width:thin}
.fm-tools .fm-btn{flex:none;height:34px;padding:0 10px;font-size:13px;white-space:nowrap}
.fm-tools .fm-tplname,.fm-tools .fm-saved{flex:0 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fm-tools .fm-tplname{min-width:80px}
.fm-tools .fm-titlewrap{flex:1 1 160px;min-width:120px;white-space:nowrap}
.fm-tools .fm-titlewrap input{width:100%;min-width:0;height:34px}
/* 끌어다 놓는 글·도장(forms-app.js): 쪽 맨 위 겹, 항목만 누를 수 있음. 손잡이·✕·◢ 는 고를 때(마우스 올림)만 보임 */
.fm-layer{position:absolute;inset:0;z-index:60;pointer-events:none}
.fm-item{position:absolute;pointer-events:auto;box-sizing:border-box;outline:1px dashed transparent;touch-action:none}
.fm-item:hover,.fm-item.is-sel{outline-color:#0071e3}
.fm-item.is-drag{opacity:.85}
.fm-item-text{width:100%;height:100%;white-space:pre-wrap;word-break:break-all;line-height:1.3;outline:none;cursor:text;overflow:hidden;font-family:'Malgun Gothic',sans-serif}
.fm-it-img img{width:100%;height:100%;display:block;cursor:move;user-select:none}
.fm-item-bar{position:absolute;left:0;bottom:100%;display:none;gap:2px;padding-bottom:2px}
.fm-item:hover .fm-item-bar,.fm-item.is-sel .fm-item-bar{display:flex}
.fm-grip,.fm-ibtn{height:22px;min-width:22px;padding:0 5px;border:1px solid #0071e3;border-radius:6px;background:#fff;color:#0071e3;font:700 12px sans-serif;cursor:pointer}
.fm-grip{cursor:move}
.fm-del-item{position:absolute;right:-10px;top:-10px;width:20px;height:20px;border:0;border-radius:50%;background:#e5484d;color:#fff;font:700 11px sans-serif;cursor:pointer;display:none;padding:0}
.fm-resize{position:absolute;right:-5px;bottom:-5px;width:12px;height:12px;border-radius:3px;background:#0071e3;cursor:nwse-resize;display:none}
.fm-item:hover .fm-del-item,.fm-item.is-sel .fm-del-item,.fm-item:hover .fm-resize,.fm-item.is-sel .fm-resize{display:block}
/* 증빙사진(assets/evidence.js — 후원물품 수입자료와 같은 배치): 한 장 = 제목 + 2열×3줄(칸 82mm), 세로로 긴 사진은 2줄 */
.fm-evid-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;margin:6px 0 -6px}
.fm-evid-tip{color:#777;font-size:12px}
.fm-evid-clear{color:#c62828;border-color:#f0c8c8}
.fm-evid{padding:15mm 15mm 0;box-sizing:border-box}
.fm-evid-title{font-family:'바탕',Batang,serif;font-size:15px;font-weight:700;letter-spacing:.12em;text-align:center;padding:8px 0 6px;border-bottom:1px solid #000;margin:0 0 6px}
.fm-evid-grid{display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:82mm;gap:3mm}
.fm-evid-cell{position:relative;border:1px solid #bbb;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden;cursor:pointer}
.fm-evid-cell img{max-width:100%;max-height:100%;object-fit:contain;display:block}
.fm-evid-cell.is-drag{opacity:.4}
.fm-evid-cell.is-over{outline:3px dashed #0071e3;outline-offset:-3px}
.fm-evid-no{position:absolute;left:4px;top:4px;min-width:20px;height:20px;padding:0 5px;border-radius:10px;background:#000;color:#fff;font:700 11px sans-serif;display:flex;align-items:center;justify-content:center}
.fm-evid-info{position:absolute;left:0;right:0;bottom:0;padding:2px 6px;background:rgba(255,255,255,.85);font-size:10px;color:#555;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:0;transition:opacity .15s}
.fm-evid-del{position:absolute;right:4px;top:4px;width:22px;height:22px;border:0;border-radius:50%;background:#e5484d;color:#fff;font:700 11px sans-serif;cursor:pointer;opacity:0;transition:opacity .15s;padding:0}
.fm-evid-cell:hover .fm-evid-info,.fm-evid-cell:hover .fm-evid-del,.fm-evid-cell:focus-visible .fm-evid-del{opacity:1}
.fm-evid-add{border:2px dashed #b8c4d6;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:#567;cursor:pointer;font-size:13px;text-align:center;background:#fafcff}
.fm-evid-add span{font-size:11px;color:#889}
.fm-evid-add:hover{border-color:#0071e3;background:#eef5ff}
/* 인쇄: 양식 쪽만, 한 쪽 = 종이 한 장. 쪽 사이 간격·화면 여백·페이지 기본 여백이 쪽 높이에 더해지면 넘친 몇 mm가
   빈 쪽으로 따로 인쇄되고, 마지막 쪽 뒤 '다음 쪽으로 넘김'도 빈 쪽을 만들었음(2026-11-02) → 여백 0, 간격 0, 마지막 쪽은 넘기지 않음,
   쪽 높이는 반올림 오차로 넘치지 않게 0.3mm 줄임 */
@media print{
  html,body{margin:0!important;padding:0!important;background:#fff!important;height:auto!important}
  body > :not(.fm-wrap){display:none!important}
  .fm-wrap{padding:0!important;margin:0!important;max-width:none!important}
  .fm-wrap > :not(.fm-edit),.fm-tools,.fm-col h2,.fm-preview{display:none!important}
  .fm-view{display:block!important;padding:0!important;margin:0!important;overflow:visible!important}
  .fm-pages{display:block!important;gap:0!important;zoom:1!important}
  .hp-page{box-shadow:none!important;margin:0!important;height:calc(var(--page-h, 297mm) - .3mm)!important}
  /* 둘째 장부터 그 장 앞에서 넘김(숨긴 빈 증빙사진 장은 넘김을 만들지 않음 — 뒤 장 '뒤'에서 넘기면 빈 종이가 생김) */
  .hp-page ~ .hp-page{break-before:page;page-break-before:always}
  .hp-input{background:transparent!important;box-shadow:none!important}
  .hp-run{background:transparent!important;box-shadow:none!important}
  .fm-evid-bar,.fm-evid-add,.fm-evid-del,.fm-evid-info,.fm-evid.is-empty{display:none!important}
  .fm-evid-cell{border:0}
  .fm-item{outline:none!important}
  .fm-item-bar,.fm-del-item,.fm-resize{display:none!important}
  @page{size:A4;margin:0}
  /* 가로 방향 엑셀 시트 쪽은 가로 용지로(이름 붙인 쪽) */
  .hp-page.is-land{page:land}
  @page land{size:A4 landscape;margin:0}
}

