/* print.css */

/* Trang được thiết kế cố định theo bảng màu sáng (giống bản in). Không khai
   báo sẽ khiến trình duyệt tự "force dark" (đảo màu ảnh/nền) khi hệ điều hành
   bật dark mode, làm sai lệch thiết kế — đặc biệt rõ trong ebook viewer. */
:root {
  color-scheme: light;
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
}

body {
  background: #f3f3f3;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}

@page {
  size: 210mm 297mm;
  margin: 0;
}

/* Preview trên browser */
@media screen {
  body {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    padding: 32px;
  }

  .pdf-page {
    box-shadow:
      0 4px 12px rgba(0, 0, 0, 0.08),
      0 12px 32px rgba(0, 0, 0, 0.12);
  }
}

/* Xuất PDF */
@media print {
  body {
    background: white;
    padding: 0;
    display: block;
  }

  .pdf-page {
    box-shadow: none;
  }
}

.pdf-page {
  width: 210mm;
  height: 297mm;
  position: relative;
  background: #ffffff;
  overflow: hidden;
  page-break-after: always;
}

.figma-page {
  width: 595px;
  height: 842px;
  overflow: hidden;
  transform: scale(1.3333333333);
  transform-origin: top left;
}

.figma-page,
.figma-page * {
  box-sizing: border-box;
}

.pdf-page:last-child {
  page-break-after: auto;
}

.no-break {
  break-inside: avoid;
  page-break-inside: avoid;
}

/* Nội dung rich text (ô soạn có toolbar đậm/nghiêng/gạch chân/danh sách ở
   book-editor.html) render thành <ul>/<ol>/<li> thật trong trang — Tailwind
   CDN reset list-style về "none" theo mặc định (Preflight), nên cần trả lại
   dấu đầu dòng ở bất kỳ đâu nội dung đó xuất hiện: trong chính ô soạn
   (.richtext-editable) lẫn trong trang preview/PDF thật (mọi phần tử có
   data-field, vì chỉ các field rich text mới thực sự chứa <ul>/<ol>). */
.richtext-editable ul,
[data-field] ul {
  list-style: disc;
  padding-left: 1.25rem;
}

.richtext-editable ol,
[data-field] ol {
  list-style: decimal;
  padding-left: 1.25rem;
}

.richtext-editable li,
[data-field] li {
  margin: 0.15em 0;
}
