/* 2026-10-16 아이폰·아이패드: 합계를 맨 아래로 밀지 않고 표 바로 아래 (맨 아래 @supports) */
/* ================================================================
   print.css  |  인쇄 전용 — iframe 내부 주입용
   ================================================================
   purchase.js / rental.js 의 _printViaIframe() 헬퍼가
   이 파일을 fetch → <style> 태그로 iframe에 직접 주입함.
   앱 DOM(style.css)과 완전히 독립.
   ================================================================ */

/* ── @page ── */
@page { size: A4; margin: 15mm 14mm 15mm 14mm; } /* 2026-10-09: size: A4 명시 */

/* ── 기본 리셋 ── */
*, *::before, *::after { box-sizing: border-box; }
html, body {
  margin: 0; padding: 0;
  height: 100%;
  font-family: 'Apple SD Gothic Neo', 'Malgun Gothic', '맑은 고딕', sans-serif;
  font-size: 12px; color: #1e293b; background: #fff;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
  -webkit-text-size-adjust: 100%; /* 2026-10-09: 모바일 글자 자동 확대 방지 */
  text-size-adjust: 100%;
}

/* ── .qdoc ──
   flex column: 헤더~테이블은 stretch, 합계+푸터는 항상 하단 고정
   min-height: A4 인쇄 기준 (100vh ≈ 페이지 높이 - margin)
*/
.qdoc {
  width: 100%; padding: 0; margin: 0;
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: calc(297mm - 30mm - 8mm); /* 2026-10-09: 모바일 PDF 여유 8mm */
}

/* ── 테이블 래퍼 — 남은 공간을 모두 차지해 합계를 하단으로 밀어냄 ── */
.q-table-wrap {
  flex: 1;
  min-height: 0;        /* flex child가 넘치지 않도록 */
  display: flex;
  flex-direction: column;
}
/* q-table 자체는 auto height, wrap이 flex:1로 공간 확보 */
.q-table {
  width: 100%; border-collapse: collapse;
  table-layout: fixed; font-size: 12px;
}

/* ────────────────────────────────────────────────
   헤더
──────────────────────────────────────────────── */
.q-header {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 14px;
  padding-bottom: 10px;
  border-bottom: 2px solid #1B3A6B;
}

/* ────────────────────────────────────────────────
   수신 / 공급 박스
──────────────────────────────────────────────── */
.q-party-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 10px;
}
/* 박스 내부 공통 table */
.q-party-grid table {
  width: 100%; border-collapse: collapse;
  font-size: 11.5px; line-height: 1.55;
}
.q-party-grid td { padding: 2px 0; vertical-align: top; border: none; }
.q-party-grid td:first-child { color: #64748b; width: 30%; white-space: nowrap; }
.q-party-grid td:last-child  { color: #1e293b; }

/* 공급 박스 — 도장 오버레이를 위해 overflow:visible + position:relative 필수 */
.q-party-supply {
  position: relative;
  overflow: visible !important;
}

/* ────────────────────────────────────────────────
   메타 영역 (납기·유효기간·메모)
──────────────────────────────────────────────── */
.q-info-meta {
  display: flex; flex-wrap: wrap;
  gap: 6px 24px;
  margin: 8px 0 14px;
  font-size: 11.5px;
}
.q-info-meta b { color: #1e293b; font-weight: 700; }

/* ────────────────────────────────────────────────
   섹션 제목
──────────────────────────────────────────────── */
.q-section-title, .r-q-section-title {
  font-size: 10.5px; font-weight: 700;
  color: #1B3A6B; margin-bottom: 5px;
}

/* ────────────────────────────────────────────────
   견적 내용 테이블
   — zebra 없음, 행 구분선만, 마지막 행 navy 2px
──────────────────────────────────────────────── */
.q-table th {
  background: #1B3A6B; color: #fff;
  padding: 7px 10px; font-size: 12px; font-weight: 600;
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
}
.q-table td {
  padding: 7px 10px; vertical-align: middle;
}
/* zebra striping — 홀수 행 흰배경, 짝수 행 연한 하늘 */
.q-table tbody tr:nth-child(odd) td {
  background: #ffffff;
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
}
.q-table tbody tr:nth-child(even) td {
  background: #f0f5fb;
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
}
.q-table tbody tr { break-inside: avoid; page-break-inside: avoid; }

/* 빈 행(filler) — 높이 고정, 배경 없음 */
.q-filler-row td {
  border-bottom: 1px solid #e8edf5;
  background: #fff !important;
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
}

/* ────────────────────────────────────────────────
   합계 박스 — 테이블 바로 아래, 푸터 바로 위
   margin-top:auto → flex column 안에서 하단으로 밀림
   page-break-inside:avoid → 페이지 경계에서 잘리지 않음
──────────────────────────────────────────────── */
.q-bottom-fixed {
  margin-top: auto !important;
  padding-top: 24px;
  flex-shrink: 0;
  page-break-inside: avoid;
  break-inside: avoid;
}

.q-summary-box {
  width: 100%; margin: 0;
  border: none; border-radius: 0; background: #fff;
}
.q-summary-row {
  display: flex; justify-content: flex-end; align-items: center;
  padding: 4px 8px; font-size: 12px; color: #4b5563;
  border-bottom: 1px solid #e8edf5;
}
.q-summary-row span:first-child {
  width: 80px; text-align: right;
  color: #64748b; padding-right: 14px; flex-shrink: 0; white-space: nowrap;
}
.q-summary-row span:last-child {
  width: 110px; text-align: right;
  font-variant-numeric: tabular-nums;
}
.q-summary-row:last-child { border-bottom: none; }

.q-summary-disc {
  background: #fff5f5;
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
}
.q-summary-disc span { color: #dc2626; }

.q-summary-sub {
  font-size: 12px; font-weight: 700; background: #f0f5fb;
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
}
.q-summary-sub span { color: #1e293b; }

.q-summary-total {
  display: flex; justify-content: flex-end; align-items: center;
  padding: 5px 8px;
  background: #1B3A6B; color: #fff;
  font-size: 14px; font-weight: 800; letter-spacing: 0.02em;
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
}
.q-summary-total span:first-child {
  width: 80px; text-align: right;
  padding-right: 14px; color: #fff; flex-shrink: 0;
}
.q-summary-total span:last-child {
  width: 110px; text-align: right;
  color: #fff; font-variant-numeric: tabular-nums;
}

/* 렌탈 합계 색상 */
.r-summary-box { border-top: none; }
.r-summary-total {
  background: #1565c0 !important;
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
}

/* ────────────────────────────────────────────────
   푸터 — margin-top:auto 로 페이지 하단 고정
──────────────────────────────────────────────── */
.q-footer-bar {
  margin-top: auto;
  text-align: center;
  line-height: 1.7; padding: 6px 0 0;
  background: #fff;
  flex-shrink: 0;
  border-top: 1px solid #e2e8f0;
  padding-top: 8px;
}
.q-footer-main { font-size: 9.5px; color: #475569; font-weight: 500; }
.q-footer-sub { font-size: 9px; color: #94a3b8; letter-spacing: 0.04em; margin-top: 2px; }
.q-footer-sub a { color: #94a3b8; text-decoration: none; font-weight: 600; }

/* ────────────────────────────────────────────────
   워터마크
──────────────────────────────────────────────── */
.q-watermark {
  position: absolute; top: 40%; left: 50%;
  transform: translate(-50%, -50%) rotate(-35deg);
  font-size: 72px; font-weight: 900;
  color: rgba(180,180,180,0.18);
  white-space: nowrap; pointer-events: none;
  z-index: 9; letter-spacing: 0.1em;
  -webkit-print-color-adjust: exact; print-color-adjust: exact;
}

/* ────────────────────────────────────────────────
   승인 도장 — 공급 박스 우측 하단 오버레이
   .q-party-supply(position:relative) 기준
──────────────────────────────────────────────── */
.q-stamp {
  position: absolute;
  right: -14px;
  bottom: -14px;
  width: 72px;
  height: 72px;
  opacity: 0.88;
  pointer-events: none;
  z-index: 10;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
  /* 레이아웃에 영향 없음: absolute이므로 부모 높이 변화 없음 */
}

/* ────────────────────────────────────────────────
   내부 정보 숨김
──────────────────────────────────────────────── */
.qi-internal { display: none; }

/* ────────────────────────────────────────────────
   링크
──────────────────────────────────────────────── */
a { text-decoration: none; color: inherit; }
a svg { display: none; }
.product-link .product-link-icon { display: inline !important; }
a.product-link {
  color: #1B3A6B;
  text-decoration: underline;
  text-decoration-style: dotted;
  text-underline-offset: 3px;
}

/* 2026-10-16 아이폰·아이패드(사파리 계열)만: @page 여백을 무시하고 자체 여백·머리글·바닥글을 넣어
   쓸 수 있는 높이가 .qdoc min-height(259mm)보다 작음 → 잘리지 않게 묶인 합계 덩어리가 통째로 2쪽으로 밀리던 문제.
   맨 아래 붙이기를 끄고 품목 표 바로 아래에 둠. -webkit-touch-callout 은 iOS·iPadOS 에만 있음 (PC·안드로이드는 그대로) */
@supports (-webkit-touch-callout: none) {
  .qdoc { min-height: 0; }
  .q-bottom-fixed { margin-top: 0 !important; }
}
