/* ─────────────────────────────────────
   FIX: Bible / Podium / Plan 탭에서 유저 드롭다운이 보드 뒤로 숨는 문제 해결
───────────────────────────────────── */

/* lab 내부 네비게이션을 모든 보드/뷰보다 위로 고정 */
#view-lab > nav {
  position: fixed;
  z-index: 2147483000 !important;
  overflow: visible !important;
}

/* nav 오른쪽 유저 영역도 드롭다운이 잘리지 않도록 처리 */
#view-lab .nav-right,
#view-lab .nav-chip {
  position: relative;
  z-index: 2147483001 !important;
  overflow: visible !important;
}

/* 실제 드롭다운 메뉴를 최상단 레이어로 올림 */
#view-lab .nav-dropdown,
#navDrop {
  z-index: 2147483002 !important;
  position: absolute;
}

/* 각 보드/뷰는 nav보다 낮은 레이어에 위치 */
#board-lab,
#view-bible,
#view-plan,
#view-podium {
  z-index: 10 !important;
}

/* 혹시 각 화면 안쪽 보드가 별도 stacking context를 만들더라도 nav보다 낮게 고정 */
#view-bible .outer-board,
#view-plan .outer-board,
#view-podium .outer-board,
#view-bible .inner-board,
#view-plan .inner-board,
#view-podium .inner-board {
  z-index: 1 !important;
}


/* ─────────────────────────────────────
   FIX v2: Lab nav를 Bible/Podium/Plan 보드보다 위에 띄우되,
   투명 오버레이가 아래 보드 클릭을 막지 않도록 처리
───────────────────────────────────── */
#view-lab {
  z-index: 2147482500 !important;
  pointer-events: none !important;
  background: transparent !important;
}

#view-lab > nav,
#view-lab > nav * {
  pointer-events: auto !important;
}

#board-lab {
  pointer-events: auto !important;
}

#view-lab .nav-dropdown,
#navDrop {
  z-index: 2147483000 !important;
}

#view-bible,
#view-plan,
#view-podium {
  z-index: 100 !important;
}



/* ─────────────────────────────────────
   FIX: Podium HTML 뷰어를 모든 네비게이션/보드보다 최상단에 표시
───────────────────────────────────── */
#pdmViewer {
  z-index: 2147483600 !important;
  position: fixed !important;
  inset: 0 !important;
}
#pdmViewerBar {
  z-index: 2147483601 !important;
  position: relative !important;
}
#pdmViewerFrame {
  position: relative !important;
  z-index: 2147483600 !important;
}
body.pdm-viewer-open #view-lab > nav,
body.pdm-viewer-open nav {
  display: none !important;
}
body.pdm-viewer-open #pdmViewer {
  display: flex !important;
}

/* STEP 36: 포디움 뷰어는 상단 바를 고정하고 iframe 영역만 스크롤/표시 */
#pdmViewer{overflow:hidden!important;height:100dvh!important;max-height:100dvh!important;background:#fff!important;}
#pdmViewerBar{flex:0 0 60px!important;position:relative!important;touch-action:none!important;}
#pdmViewerFrame{flex:1 1 auto!important;min-height:0!important;height:calc(100dvh - 60px)!important;display:block!important;background:#E8E8EC!important;touch-action:pan-x pan-y!important;}

/* ─────────────────────────────────────
   Step37: global popup/toast layer fix
   Keep all transient UI above app boards and podium viewer.
───────────────────────────────────── */
#toast,
.toast {
  position: fixed !important;
  left: 50% !important;
  bottom: 32px !important;
  transform: translateX(-50%) !important;
  z-index: 2147483647 !important;
  pointer-events: none !important;
  isolation: isolate !important;
}
.modal-overlay,
#modalOverlay,
.sermon-type-modal,
#pdmCreateFolderModal {
  z-index: 2147483640 !important;
}
#pdmCreateFolderModal.open,
.sermon-type-modal.open,
.modal-overlay.open,
#modalOverlay.open {
  display: flex !important;
}
.hl-popup,
.pdm-folder-dropdown,
.pdm-recent-dropdown,
.pdm-floating-menu,
#pdmGlobalMenu {
  z-index: 2147483642 !important;
}
#view-lab .nav-dropdown,
#navDrop {
  z-index: 2147483643 !important;
}
#pdmViewer {
  z-index: 2147483600 !important;
}
#pdmViewerBar {
  z-index: 2147483601 !important;
}
body.pdm-viewer-open #toast,
body.pdm-viewer-open .toast {
  z-index: 2147483647 !important;
}


/* Step138: iPad/Safari PDF viewer isolation.
   Use a dedicated PDF mode so only the PDF iframe area scrolls/pans; the Bible Lab header stays fixed. */
#pdmViewer.pdm-pdf-mode{background:#52565f!important;overscroll-behavior:contain!important;}
#pdmViewer.pdm-pdf-mode #pdmViewerBar{flex:0 0 60px!important;height:60px!important;min-height:60px!important;max-height:60px!important;transform:none!important;will-change:auto!important;}
#pdmViewer.pdm-pdf-mode #pdmViewerFrame{background:#52565f!important;overflow:hidden!important;-webkit-overflow-scrolling:auto!important;touch-action:none!important;transform:none!important;will-change:auto!important;}
@supports(height:100dvh){#pdmViewer.pdm-pdf-mode #pdmViewerFrame{height:calc(100dvh - 60px)!important;}}

/* Step139: HTML viewer isolation.
   Keep the Bible Lab viewer header outside of zoom/pan; only the iframe manuscript area scrolls and scales. */
/* Step161-7: HTML 뷰어 - 사용자 요청에 따라 transition 없이 즉시 전환.
   상단바는 viewer.classList의 'pdm-bar-hidden' 기준으로 보임/숨김 결정.
   :has, ~ 인접 선택자는 구형 Safari에서 지원 안 될 수 있어 단순 클래스 기반으로 변경. */
#pdmViewer.pdm-html-mode{background:#eef0f4!important;overscroll-behavior:contain!important;overflow:hidden!important;}
#pdmViewer.pdm-html-mode #pdmViewerBar{flex:0 0 60px!important;height:60px!important;min-height:60px!important;max-height:60px!important;transform:none!important;will-change:auto!important;position:relative!important;z-index:2!important;}
/* HTML 뷰어 frame은 touch-action을 auto로 풀어서 iframe 내부 핀치줌 허용 */
#pdmViewer.pdm-html-mode #pdmViewerFrame{flex:1 1 auto!important;width:100%!important;background:#eef0f4!important;overflow:hidden!important;-webkit-overflow-scrolling:auto!important;touch-action:auto!important;transform:none!important;will-change:auto!important;height:calc(100dvh - 60px)!important;}
/* 상단바 숨김 모드: viewer에 .pdm-bar-hidden 클래스가 붙으면 즉시 전환 (transition 없음) */
#pdmViewer.pdm-html-mode.pdm-bar-hidden #pdmViewerBar{
  display:none!important;
  flex:0 0 0!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
}
#pdmViewer.pdm-html-mode.pdm-bar-hidden #pdmViewerFrame{
  height:100dvh!important;
}
@supports(height:100dvh){#pdmViewer.pdm-html-mode #pdmViewerFrame{height:calc(100dvh - 60px)!important;}}


/* Step146: PDF viewer keeps the single black inner toolbar.
   HTML viewer uses the external white Bible Lab viewer bar again, so users can close/back normally
   and saved manuscript HTML is shown in its original size instead of being forced into a tiny inner pager. */
#pdmViewer.pdm-pdf-mode #pdmViewerBar{
  display:none!important;
  height:0!important;
  min-height:0!important;
  max-height:0!important;
  flex:0 0 0!important;
  padding:0!important;
  border:0!important;
  overflow:hidden!important;
}
#pdmViewer.pdm-pdf-mode #pdmViewerFrame{
  height:100dvh!important;
  min-height:100dvh!important;
  flex:1 1 auto!important;
}
/* Step161-7: HTML 모드는 위에서 이미 정의 (transition 없이 즉시 전환).
   여기는 PDF 모드만 추가 정의 + iPad의 100dvh fallback. */
@supports(height:100dvh){
  #pdmViewer.pdm-pdf-mode #pdmViewerFrame{height:100dvh!important;}
  #pdmViewer.pdm-html-mode #pdmViewerFrame{height:calc(100dvh - 60px)!important;}
  #pdmViewer.pdm-html-mode.pdm-bar-hidden #pdmViewerFrame{height:100dvh!important;}
}


/* Step158: HTML 뷰어 하단 안전 여백. 원고 크기는 유지하고 iframe/본문 끝부분만 더 내려볼 수 있게 한다. */
#pdmViewer.pdm-html-mode #pdmViewerFrame{
  padding-bottom:env(safe-area-inset-bottom) !important;
  box-sizing:border-box !important;
}

/* alpha_v02_hymn_modal_front_20260818:
   Lab 초안/원고의 오른쪽 찬송가 추천에서 '보기'를 눌렀을 때
   새찬송가 뷰어가 Lab stacking context 뒤로 숨지 않도록 최상위 UI 레이어로 올린다.
   prefs/toast(2147483647)는 계속 이 모달보다 위에 유지한다. */
#bsHymnViewerModal.bs-hymn-modal {
  position: fixed !important;
  inset: 0 !important;
  z-index: 2147483646 !important;
  isolation: isolate !important;
  pointer-events: auto !important;
}
#bsHymnViewerModal .bs-hymn-modal-backdrop {
  z-index: 0 !important;
}
#bsHymnViewerModal .bs-hymn-modal-box {
  z-index: 1 !important;
}