/* 서비스매뉴얼 탭 전용 스타일 (부품-#198 · #206). 클래스는 svc- 로 시작.
   나무·올리기 상자·실행 리스트·갈래·뷰어 상자·머리 줄·표지 상자는 부품조회의 etc- 클래스를 그대로 쓴다 (같은 구조·같은 조작).
   여기엔 서비스 매뉴얼만의 몸통([목차 | 이어 붙인 쪽])과 본문 검색만 있다. */
#svcView.hidden { display: none; }

/* 뷰어 몸통: 이어 붙인 쪽 (장·절 탐색은 왼쪽 나무 — 부품조회와 같게). 높이는 부품조회 .etc-figure 와 같은 규칙 (부품-#200) */
.svc-vbody { display: flex; height: calc(100vh - 168px); min-height: 420px; border: 1px solid var(--border); }
.svc-scroll { flex: 1; overflow: auto; background: #e9ecef; padding: 8px; }        /* 부품조회 .etc-figure 와 같은 바탕 */
.svc-scroll.hidden { display: none; }
/* 쪽 묶음. **flex 가운데맞춤을 쓰면 안 된다** — 쪽이 상자보다 넓어지면 넘치는 절반이 왼쪽으로 밀려
   `scrollLeft` 로 닿을 수 없다(실측: 7,548px 쪽에서 왼쪽 3,089px 이 영영 안 보였다).
   엔지니어 접수 2026-09-28 "확대한상태에서 왼쪽으로 이동이 안되노" 의 진짜 까닭 (부품-#404).
   블록 + `margin: 0 auto` 는 넘칠 때 auto 가 0 이 되어 왼쪽부터 붙는다 — 부품 뷰어가 쓰는 꼴. */
.svc-pages { display: block; }
.svc-pg { margin: 0 auto 8px; }
.svc-pg { position: relative; background: #fff; box-shadow: 0 1px 4px rgba(0,0,0,.25); overflow: hidden; }
.svc-pg-no { position: absolute; right: 4px; top: 2px; font-size: 10px; color: var(--text-muted, #6b7280); }
.svc-pg-img { display: block; width: 100%; height: 100%; user-select: none; object-fit: contain; }   /* 화면-01: 쪽 그림은 늘이지 않는다 (Service · Operator 공용) */
.svc-pdf { flex: 1; border: 0; }
.svc-pdf.hidden { display: none; }

/* 나무 안 목차 줄(장 ▸ 절): 단계별 들여쓰기 (부품-#206) */
#svc___tree .etc-tree-sec.svc-toc-l3 { padding-left: 18px; }
#svc___tree .etc-tree-sec.svc-toc-l4 { padding-left: 30px; }
#svc___tree summary .svc-chapter { display: inline; padding: 0; }
#svc___tree summary .svc-chapter.etc-on { background: transparent; color: var(--link, #1a5fb4); }
/* 강조 줄 — 회로도·매니폴드 (부품-#249): 파랑 굵게 + 왼쪽 띠. 이모지·아이콘 없음 */
#svc___tree .etc-tree-sec.svc-toc-hot { color: var(--link, #1a5fb4); font-weight: 600; border-left: 3px solid var(--link, #1a5fb4); padding-left: 6px; }
#svc___tree .etc-tree-sec.svc-toc-l3.svc-toc-hot { padding-left: 15px; }
#svc___tree summary .svc-chapter.svc-toc-hot { border-left: 3px solid var(--link, #1a5fb4); padding-left: 6px; }

/* 본문 검색 */
/* 목록 찾는 줄(`.etc-toolbar`)과 같은 치수 — 규약 4·8 (2026-09-30) */
.svc-search-bar { display: flex; gap: 12px; align-items: center; margin-bottom: 10px; }
.svc-search-bar select { font: inherit; font-size: 13px; border: 1px solid var(--border); border-radius: 0; padding: 4px 6px; }
.svc-hits { border-top: 1px solid var(--border); }
.svc-hit { padding: 6px 8px; border-bottom: 1px solid var(--border); cursor: pointer; font-size: 12.5px; }
.svc-hit:hover { background: var(--header-bg); }
.svc-hit-head { display: flex; gap: 8px; align-items: baseline; }
.svc-hit-book { font-weight: 600; }
.svc-hit-page { margin-left: auto; color: var(--text-muted, #6b7280); }
.svc-hit-snip { color: var(--text); margin-top: 2px; }
.svc-hit-snip mark { background: transparent; font-weight: 700; text-decoration: underline; }

/* 전체화면 (부품-#201): 뷰어 상자 규칙은 parts.css 의 .etc-split-right.etc-full — 몸통이 남는 높이를 다 씀 */
.etc-split-right.etc-full .svc-vbody, .etc-split-right:fullscreen .svc-vbody { height: auto; flex: 1; min-height: 0; }

/* 한글 번역 (부품-#213): 문단 상자(투명, 올리면 파랗게) · 반대 언어 팝업 · [영문][한글] 켜짐 */
.svc-blk { position: absolute; border: 0; background: transparent; padding: 0; cursor: pointer; border-radius: 0; }
.svc-blk:hover { background: rgba(26,95,180,.12); outline: 1px solid rgba(26,95,180,.5); }
.svc-scroll { position: relative; }
#svc___blockPop { max-width: 520px; font-size: 13px; line-height: 1.5; }
#svc___blockPop .svc-blk-text { white-space: pre-wrap; }
#svc___blockPop .svc-blk-model { margin-top: 4px; font-size: 11px; }   /* 번역 모델 (부품-#258) */
#svc___blockPop .svc-blk-src { margin-top: 6px; padding-top: 6px; border-top: 1px dashed var(--border); font-size: 11.5px; white-space: pre-wrap; }
.etc-viewer-tools button.etc-on { background: var(--link, #1a5fb4); border-color: var(--link, #1a5fb4); color: #fff; }
.etc-viewer-tools button:disabled { opacity: .55; cursor: default; }
/* 끌어올림 바로가기 (부품-#253): 접힌 장 바로 아래, 2단계 들여쓰기 자리에 점선 띠. 장을 펼치면 숨긴다 */
#svc___tree .svc-toc-peeks { margin-left: 18px; }
#svc___tree .etc-tree-sec.svc-toc-peek { border-left-style: dashed; opacity: .85; }
#svc___tree details.etc-tree-d5[open] + .svc-toc-peeks { display: none; }

/* 큰 회로도를 크게 볼 때 그 자리만 잘게 다시 그려 덮는 조각 (부품-#399) */
.svc-pg-tile { position: absolute; display: block; pointer-events: none; }
.svc-pg-svg { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; object-fit: contain; }   /* 화면-01 */   /* 가벼운 쪽은 벡터 한 장 (부품-#400) */
