/* =============================================================================
   정기안전보건교육 공식 서식(교육일지 · 교육 출석부) — 2026-10-08
   화면의 Apple 테마와 분리된 '공식문서' 영역(.ef-doc). 전역 글꼴·테마의 영향을 받지 않도록 .ef-doc 안에서만 규칙을 둔다.
   값(글꼴 크기·열폭·행높이·테두리)은 js/edu-form-spec.js(첨부 엑셀 원본)에서 오고, 여기에는 공통 규칙·쪽 설정만 둔다.
   ========================================================================== */
/* 쪽 여백은 @page 가 아니라 각 쪽(.ef-page)의 padding 으로 — 여백 0 이면 크롬이 머리글·바닥글(주소·날짜)을 찍지 않는다. 화면 미리보기와 인쇄가 같은 모양이 되는 이점도 있다. */
@page eduForm { size: A4 portrait; margin: 0; }   /* 이름 있는 쪽 설정 — 다른 업무(작업허가서·JSA 등)의 인쇄 여백에는 영향 없음 */
.ef-doc .ef-page { position: relative; width: 210mm; height: 297mm; background: #fff; overflow: hidden; }
.ef-doc .ef-p-log { padding: 10mm; }
.ef-doc .ef-p-annex { padding: 12mm 10mm; }
.ef-doc .ef-p-attA { padding: 14mm 3mm 9mm 13mm; }
.ef-doc .ef-p-attB { padding: 19mm 18mm 14mm 18mm; }

.ef-doc { font-family: Pretendard, 'Malgun Gothic', '맑은 고딕', 'Apple SD Gothic Neo', sans-serif; color: #000; background: #fff; -webkit-print-color-adjust: exact; print-color-adjust: exact; text-align: left; letter-spacing: 0; }
.ef-doc, .ef-doc * { box-sizing: border-box; }
.ef-doc .ef-t { border-collapse: collapse; table-layout: fixed; margin: 0; background: #fff; }
.ef-doc .ef-t td { padding: 0 3px; overflow: hidden; line-height: 1.25; word-break: normal; overflow-wrap: anywhere; }
.ef-doc .ef-sheet { position: relative; }
.ef-doc .ef-slot { position: absolute; display: flex; align-items: center; justify-content: center; overflow: hidden; padding: 2px; }
.ef-doc .ef-slot img { display: block; width: 100%; height: 100%; object-fit: contain; }
/* 교육·훈련 사진 별지(5장째부터, 2026-10-16) — 한 쪽 6장(2단 × 3줄), 비율 유지 */
.ef-doc .ef-annex { display: flex; flex-direction: column; height: 100%; }
.ef-doc .ef-annex-h { font-size: 15pt; font-weight: 700; padding-bottom: 3mm; border-bottom: 2px solid #000; }
.ef-doc .ef-annex-sub { font-size: 10pt; color: #333; padding-top: 1.5mm; }
.ef-doc .ef-annex-grid { flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: repeat(3, 1fr); gap: 4mm; padding-top: 4mm; }
.ef-doc .ef-ax { margin: 0; display: flex; flex-direction: column; min-height: 0; border: 1px solid #000; }
.ef-doc .ef-ax-img { flex: 1 1 auto; min-height: 0; position: relative; overflow: hidden; }
.ef-doc .ef-ax-img img { position: absolute; left: 2px; top: 2px; width: calc(100% - 4px); height: calc(100% - 4px); object-fit: contain; }
.ef-doc .ef-ax figcaption { flex: 0 0 auto; font-size: 9.5pt; text-align: center; padding: 1mm 0; border-top: 1px solid #000; }
.ef-doc .ef-chk { display: block; text-align: center; font-size: 10pt; line-height: 1.15; color: #000; white-space: nowrap; font-variant-numeric: tabular-nums; }   /* 출석확인 칸(2026-10-14) — 날짜 / 시각 · 방식 두 줄. 행 높이(31.8pt≈42px) 안에 들어가는 크기(2줄 ≈ 31px)이고 칸 폭(132px)보다 좁다 */
.ef-doc .ef-chk > span { display: block; }

/* 종료확인·서명 칸(2026-10-14) — 날짜/시각 두 줄(왼쪽) + 그때 제출한 실제 서명 이미지(오른쪽). 행 높이(31.8pt≈42px) 안: 이미지 높이 34px */
.ef-doc .ef-out { display: flex; align-items: center; justify-content: center; gap: 3px; height: 38px; overflow: hidden; }
.ef-doc .ef-out .ef-ot { flex: 0 0 auto; font-size: 9.5pt; line-height: 1.15; text-align: center; white-space: nowrap; font-variant-numeric: tabular-nums; color: #000; }
.ef-doc .ef-out .ef-ot > span { display: block; }
.ef-doc .ef-out img { display: block; flex: 1 1 0; min-width: 0; height: 34px; width: auto; max-width: 84px; object-fit: contain; }   /* 남는 폭 안에서만 — 칸을 넘지 않는다(비율 유지) */

/* ---- 화면: 쪽을 흰 종이처럼 ---- */
@media screen {
  .ef-doc .ef-page { margin: 14px auto; box-shadow: 0 1px 8px rgba(0, 0, 0, .28); }
}
/* ---- 인쇄: 쪽 여백은 @page 가 담당 ---- */
@media print {
  .ef-doc .ef-page { margin: 0; height: 296.4mm; box-shadow: none; break-after: page; page-break-after: always; }
  .ef-doc .ef-page:last-child { break-after: auto; page-break-after: auto; }
  .ef-doc .ef-t tr { break-inside: avoid; }
}

/* ---- 인쇄 전용 보기(전체 화면 덮개) ---- */
body.edu-print-on { background: #e9e9ed !important; overflow: auto !important; }
body.edu-print-on > *:not(#eduPrintHost) { display: none !important; }
#eduPrintHost { display: block; }
/* 2026-10-16: 교육일지 보기 안에서 사진 추가·삭제·확대 창과 안내(toast)를 쓸 수 있게 이 둘만 다시 보이게 — 인쇄에는 나가지 않는다 */
body.edu-print-on > #overlayRoot, body.edu-print-on > #toast { display: block !important; }
#eduPrintHost .ef-bar { position: sticky; top: 0; z-index: 5; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px 14px; background: #fff; border-bottom: 1px solid #d2d2d7; font-family: Pretendard, 'Malgun Gothic', sans-serif; }
#eduPrintHost .ef-bar .ef-t-title { flex: 1 1 200px; font-size: 15px; font-weight: 600; min-width: 0; }
#eduPrintHost .ef-bar .ef-note { flex: 1 1 100%; font-size: 13px; color: #6e6e73; }
#eduPrintHost .ef-bar label { font-size: 13px; display: inline-flex; align-items: center; gap: 6px; }
/* 교육·훈련 사진 상자(2026-10-16) — 교육일지 보기 위쪽, 인쇄에는 나가지 않는다. 휴대폰에서는 사진 2열 */
#eduPrintHost .ef-photobox { margin: 8px 14px 0; padding: 12px 14px; background: #fff; border: 1px solid #d2d2d7; border-radius: 10px; font-family: Pretendard, 'Malgun Gothic', sans-serif; }
.ef-pn-h { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin-bottom: 6px; }
.ef-pn-h label { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; }
.ef-pn-h select { max-width: 100%; }
.ef-pn-hint { margin-bottom: 8px; }
.ef-pn-empty { padding: 14px 0; text-align: center; }
.ef-pn-act { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 4px; }
@media (max-width: 560px) { .ef-pn .sft-photos { grid-template-columns: repeat(2, 1fr); } }
#eduPrintHost .ef-pages { padding: 4px 0 40px; zoom: var(--ef-z, 1); }
@media print {
  body.edu-print-on { background: #fff !important; }
  body.edu-print-on { page: eduForm; }   /* 인쇄 전용 보기에서만 여백 0 쪽 설정(이름 있는 쪽) */
  #eduPrintHost .ef-bar, #eduPrintHost .ef-photobox, body.edu-print-on > #overlayRoot, body.edu-print-on > #toast { display: none !important; }
  #eduPrintHost .ef-pages { padding: 0; zoom: 1; }
}