/* HWPX 열기·인쇄 페이지 (hwpx.html) */

/* ---------- 파일 고르기 ---------- */
.hx-drop { display: grid; gap: 10px; max-width: 820px; margin-top: 6px; }
.hx-input { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.hx-drop-box {
  display: grid; place-items: center; gap: 4px; text-align: center; cursor: pointer;
  min-height: 132px; padding: 18px 16px; border: 2px dashed var(--line-strong); border-radius: 14px;
  background: var(--surface); color: var(--fg);
}
.hx-drop-box b { font-size: 17px; color: var(--accent); }
.hx-drop-box > span { font-size: 13.5px; color: var(--muted); }
.hx-drop-box:hover, .hx-input:focus-visible + .hx-drop-box, body.hx-dragging .hx-drop-box { border-color: var(--accent); background: var(--accent-weak); }
.hx-input:focus-visible + .hx-drop-box { outline: 2px solid var(--focus); outline-offset: 2px; }
body.hx-loaded .hx-drop-box { min-height: 0; padding: 10px 14px; grid-auto-flow: column; justify-content: start; gap: 10px; border-width: 1px; border-style: solid; }
body.hx-loaded .hx-drop-box b { font-size: 14.5px; }
.hx-drop-box .hx-again { display: none; }
body.hx-loaded .hx-drop-box .hx-first { display: none; }
body.hx-loaded .hx-drop-box .hx-again { display: inline; }

.hx-filebar { display: none; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; font-size: 14px; }
body.hx-loaded .hx-filebar { display: flex; }
.hx-filebar #hx-name { font-weight: 600; overflow-wrap: anywhere; }
.hx-filebar #hx-pages { color: var(--muted); }

.hx-status { margin: 0; font-size: 14px; line-height: 1.55; padding: 10px 12px; border-radius: 10px; background: var(--surface); border: 1px solid var(--line); }
.hx-status.is-ok { color: var(--ok); background: var(--ok-weak); border-color: transparent; }
.hx-status.is-warn { color: var(--warn); background: var(--warn-weak); border-color: transparent; }
.hx-status.is-err { color: #b3261e; background: #fbe9e7; border-color: transparent; }
.hx-status.is-busy { color: var(--muted); }
.hx-status-sub { color: var(--fg); font-size: 13.5px; }
.hx-status[hidden] { display: none; }

/* ---------- 미리보기 ---------- */
.hx-pane { display: none; margin-top: 14px; }
body.hx-loaded .hx-pane { display: block; }
.hx-page .preview-pane { position: static; height: auto; overflow: visible; }
.hx-page .viewport { overflow: hidden; }
.hx-page .sheets { width: max-content; }
.mobile-bar .btn[disabled] { opacity: 0.45; cursor: default; }
.hx-page .mobile-bar [data-hx="open"] { display: inline-flex; }

/* ---------- 문서 쪽 ---------- */
.sheet.hx-sheet {
  padding: 0; position: relative; overflow: hidden; box-sizing: border-box;
  font-family: 'Nanum Gothic', 'Malgun Gothic', 'Apple SD Gothic Neo', sans-serif;
  font-size: 10pt; line-height: normal; letter-spacing: 0; word-break: normal; overflow-wrap: normal; color: #000;
}
.hx-sheet .hx-body, .hx-sheet .hx-hf, .hx-sheet .hx-ln, .hx-sheet .hx-td, .hx-sheet .hx-tdc, .hx-sheet .hx-cap,
.hx-sheet .hx-notes, .hx-sheet .hx-pgno, .hx-sheet .hx-tbl, .hx-sheet .hx-pic, .hx-sheet .hx-grp, .hx-sheet .hx-shape,
.hx-sheet .hx-eq, .hx-sheet .hx-float, .hx-sheet .hx-pic img { position: absolute; }
.hx-sheet .hx-body { z-index: 1; }
.hx-ln { white-space: pre; z-index: 1; }
.hx-ln[data-a="C"] { text-align: center; }
.hx-ln[data-a="R"] { text-align: right; }
.hx-ln.hx-over { text-align: left; }
.hx-in { display: inline-block; white-space: pre; transform-origin: 0 50%; }
.hx-in.hx-j { display: block; width: 100%; white-space: pre-wrap; text-align: justify; text-align-last: justify; }
.hx-ln[data-a="D"] .hx-in.hx-j { text-justify: inter-character; }
.hx-tab { display: inline-block; height: 1px; }
.hx-obj { display: inline-block; position: relative; vertical-align: baseline; white-space: normal; text-align: left; line-height: normal; text-indent: 0; }
.hx-tbl, .hx-pic, .hx-grp, .hx-shape, .hx-eq { box-sizing: border-box; }
.hx-td { box-sizing: border-box; }
.hx-pic { overflow: hidden; }
.hx-pic img { max-width: none; max-height: none; }
.hx-pic.hx-missing { background: repeating-linear-gradient(45deg, #f1f1f1 0 6px, #e4e4e4 6px 12px); }
.hx-shape .hx-svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.hx-eq { display: flex; align-items: center; justify-content: center; font-family: 'Courier New', monospace; font-size: 9pt; color: #333; border: 0.5pt dotted #999; overflow: hidden; }
.hx-sheet .hx-float { z-index: 2; }
.hx-sheet .hx-float.hx-behind { z-index: 0; }
.hx-fnref { font-size: 0.62em; vertical-align: super; line-height: 0; }
.hx-notes { z-index: 1; }
.hx-note-sep { height: 6pt; width: 30%; border-top: 0.5pt solid #000; margin-top: 3pt; }
.hx-note { position: relative; }
.hx-pgno { font-size: 10pt; white-space: nowrap; z-index: 1; }
.hx-hf { z-index: 1; box-sizing: border-box; }

@media print {
  .hx-page .viewport { height: auto !important; }
  .hx-page .sheets { transform: none !important; margin: 0 !important; width: auto !important; }
  .hx-pane { margin: 0 !important; }
  .hx-drop, .hx-pane > :not(.viewport) { display: none !important; }
  body:not(.hx-loaded) .hx-pane { display: none !important; }
}
.hx-sheet .hx-syn { position: absolute; white-space: pre-wrap; word-break: keep-all; overflow-wrap: anywhere; z-index: 1; }
.sheet.hx-measure { position: absolute; left: -12000px; top: 0; visibility: hidden; height: auto; box-shadow: none; }
