/* ============================================================
   pages/docs/page.css — 문서 — 생성기 iframe

   ⭐ **이 파일은 이 화면 안쪽만 건드린다.** 다른 레일에는 영향이 없다.
   공용(토큰 · 표 · 알약 · 버튼 · 글꼴 · 색)은 styles/ 가 갖는다. 여기서는 그것을 물려받고
   이 화면에만 필요한 것만 덧쓴다. 그래서 이 화면을 고칠 때 다른 화면을 볼 일이 없다.

   @scope .docs-page, #dgFrame, .app.docs-mode
   ⚠️ 위 @scope 는 약속이 아니라 검사 대상이다 — 여기 적힌 것에 걸리지 않는 셀렉터를 쓰면
      tests/test_pages.js 가 실패한다. 공용 규칙을 여기서 덮어쓰지 못하게 막는 장치다.
   ============================================================ */

/* ---------- ④ 문서 생성기 ----------
   본문 자리를 iframe 이 꽉 채우고, 패널에는 생성기가 알려준 화면 목록이 올라온다. */
/* ⚠️ 여기서 문서 화면을 켠 채로 두면(클래스 두 개가 .place-page 한 개를 이긴다)
   접속 직후 OverView 위에 문서 iframe 이 통째로 자리를 차지해 카드가 화면 밖으로 밀려난다.
   기본은 감춘 채로 두고, 화면을 고를 때 js/07-screens.js 가 인라인으로 켠다. */
.place-page.docs-page{
  padding:0 !important; height:100%; display:none; flex-direction:column; overflow:hidden;
}
#dgFrame{ display:block; flex:1 1 auto; width:100%; min-height:0; border:0; background:#fff; }
/* 문서 화면일 때는 본문 여백을 없애 생성기가 화면을 꽉 쓰게 한다.
   :has() 대신 셸에 클래스를 붙인다 — 브라우저 지원과 무관하게 확실하다. */
.app.docs-mode main{ padding:0 !important; overflow:hidden !important; }

/* 문서 레일은 본문 여백이 0 이라(생성기가 화면을 꽉 쓴다) 탭 줄의 음수 여백이 어긋난다.
   본문을 세로 흐름으로 두고 탭은 제 높이만, iframe 이 나머지를 갖게 한다. */
.app.docs-mode main{ display:flex; flex-direction:column; }
.app.docs-mode #mainTabs{
  position:static; margin:0 !important; padding:0 12px !important; flex:none;
}
.app.docs-mode .place-page.docs-page{ flex:1 1 auto; min-height:0; height:auto; }