/* ============================================================
   PDF Book Stylesheet — anlatkitap
   Page size: A5 portrait (14.8 × 21 cm)  |  Font: sans fallback stack
   ============================================================ */

/* ---- Page setup ------------------------------------------- */
@page {
  size: 148mm 210mm;
  margin: 20mm 18mm 22mm 18mm; /* top right bottom left */
}

/* ---- Base -------------------------------------------------- */
* {
  box-sizing: border-box;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}

html, body {
  margin: 0;
  padding: 0;
  font-family: "Noto Sans", "DejaVu Sans", "Liberation Sans", Arial, sans-serif;
  font-size: 11pt;
  line-height: 1.65;
  color: #1a1a1a;
  background: #ffffff;
  text-rendering: optimizeLegibility;
}

/* ---- Cover page ------------------------------------------- */
.cover {
  display: table;
  width: 100%;
  /* Content band is 168mm (210mm page − 20mm top − 22mm bottom). Held just under
     it so the vertically-centred cover cannot tip past the page edge and produce
     a blank second cover page — the cover is rendered as its own single-page
     document, so any overflow becomes an extra page. Kept close to 168mm (small
     buffer) because the cover has a coloured background and a large gap would
     show as a white strip. */
  min-height: 165mm;
  background-color: #FAF6F0;
}

.cover__inner {
  display: table-cell;
  vertical-align: middle;
  text-align: center;
  padding: 0 24pt;
}

.cover__title {
  font-size: 34pt;
  font-weight: bold;
  color: #2C1A0E;
  margin: 0 0 18pt 0;
  line-height: 1.25;
}

.cover__narrator {
  font-size: 17pt;
  color: #6B5B45;
  margin: 0;
  font-style: italic;
}

.cover__divider {
  width: 60pt;
  height: 2pt;
  background: #C9A87C;
  margin: 20pt auto;
  border: none;
}

.cover__photo-frame {
  text-align: center;
  margin: 20pt 0 0 0;
}

.cover__photo {
  width: auto;
  height: auto;
  max-width: 60mm;
  max-height: 75mm;
  border: 3pt solid #FFFFFF;
  box-shadow: 0 0 0 1pt #C9A87C;
}

/* ---- HTML TOC page ----------------------------------------- */
.pdf-toc {
  margin: 0 0 20pt 0;
  page-break-after: always;
}

.pdf-toc__title {
  margin: 0 0 14pt 0;
  font-size: 18pt;
  color: #2C1A0E;
}

.pdf-toc__list {
  margin: 0;
  padding-left: 20pt;
}

.pdf-toc__item {
  margin: 0 0 7pt 0;
  line-height: 1.5;
  color: #2C1A0E;
}

.pdf-toc__text {
  color: #2C1A0E;
}

/* ---- Preface / foreword (Önsöz) page ----------------------- */
.preface {
  page-break-after: always;
}

/* Birlikte Anlat honoree photo on the Önsöz page — sits under the heading,
   bounded to a fixed box via max-width/height so it scales down while keeping
   its original aspect ratio (wkhtmltopdf's WebKit ignores object-fit). */
.preface__photo-frame {
  text-align: center;
  margin: 0 0 22pt 0;
}

.preface__photo {
  width: auto;
  height: auto;
  max-width: 60mm;
  max-height: 75mm;
  border: 3pt solid #FFFFFF;
  box-shadow: 0 0 0 1pt #C9A87C;
}

.preface__title {
  margin: 0 0 18pt 0;
  font-size: 22pt;
  color: #2C1A0E;
}

.preface__body {
  font-size: 12pt;
  line-height: 1.7;
  color: #2C1A0E;
}

.preface__body p {
  margin: 0 0 10pt 0;
}

/* ---- Story pages ------------------------------------------ */
.stories {
  padding-top: 0;
}

.story__outline-extra {
  position: absolute;
  left: -10000px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
  font-size: 1px;
  line-height: 1;
  margin: 0;
}

.story-page {
  margin-bottom: 0;
  page-break-inside: auto;
}

.story-page + .story-page {
  page-break-before: always;
}

/* ── Birlikte Anlat: contributor section divider ─────────────────── */
.contributor-section-header {
  page-break-before: always;
  page-break-after: avoid;
  padding: 32pt 0 18pt 0;
  border-bottom: 2pt solid #C9A87C;
  margin-bottom: 24pt;
  text-align: center;
}

.contributor-name {
  font-size: 18pt;
  font-weight: bold;
  color: #2C1A0E;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin: 0;
}

.story__question {
  background: #FFF8F0;
  border-left: 4pt solid #C9A87C;
  padding: 10pt 14pt;
  font-size: 12.5pt;
  font-weight: bold;
  color: #2C1A0E;
  margin: 0 0 18pt 0;
  line-height: 1.4;
  page-break-after: avoid;
}

.story__contributor {
  font-size: 8pt;
  font-weight: 700;
  color: #000000;
  text-align: right;
  margin: -12pt 0 0 0;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  page-break-after: avoid;
}

/* Birlikte Anlat: the contributor name is the only heading on the answer page
   (the prompt is shown once, book-level). No question box sits above it, so it
   stands on its own at the top of the answer instead of tucking under one. */
.story__contributor--standalone {
  margin: 0 0 14pt 0;
}

/* ── Birlikte Anlat: shared prompt, shown once before the contributor answers ──
   Flows inline (no forced page break) so it does not leave a blank page; the
   first contributor's answer follows right after it. */
.book-prompt {
  page-break-inside: avoid;
  margin: 0 0 24pt 0;
  padding: 16pt 18pt;
  background: #FFF8F0;
  border-left: 4pt solid #C9A87C;
}

.book-prompt__label {
  margin: 0 0 8pt 0;
  font-size: 11pt;
  font-weight: bold;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #6B5B45;
}

.book-prompt__text {
  margin: 0;
  font-size: 15pt;
  font-weight: bold;
  line-height: 1.4;
  color: #2C1A0E;
}

.story__body {
  font-size: 11pt;
  line-height: 1.7;
  color: #222222;
}

.story__body:after,
.story__body p:after {
  content: "";
  display: block;
  clear: both;
}

.story__body p {
  margin: 0 0 10pt 0;
}

.story__body p:last-child {
  margin-bottom: 0;
}

.story__photos {
  margin-top: 16pt;
  text-align: center;
}

.story__photo-row {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  margin: 0 auto 12pt auto;
  page-break-inside: avoid;
}

.story__photo-row:last-child {
  margin-bottom: 0;
}

.story__photo-row--single {
  width: 54%;
  margin-left: auto;
  margin-right: auto;
  page-break-inside: avoid;
}

.story__figure {
  width: 50%;
  margin: 0;
  padding: 0 5pt;
  text-align: center;
  vertical-align: middle;
  page-break-inside: avoid;
}

.story__photo-row--single .story__figure {
  width: 100%;
}

.story__photo-frame {
  width: 100%;
  height: 54mm;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  border-radius: 2pt;
}

.story__photos--layout-1 .story__photo-row {
  width: 72%;
}

.story__photos--layout-1 .story__photo-frame {
  height: 88mm;
}

.story__photos--layout-2 .story__photo-frame {
  height: 58mm;
}

.story__photos--layout-4 .story__photo-frame {
  height: 42mm;
}

.story__photo-caption {
  font-size: 9pt;
  color: #888888;
  text-align: center;
  margin-top: 4pt;
  font-style: italic;
}

.story__qr-inline,
.story__qr-standalone {
  text-align: center;
  page-break-inside: avoid;
}

.story__qr-inline {
  float: right;
  width: 2.8cm;
  margin: 0 0 4pt 10pt;
}

.story__qr-standalone {
  width: 2.8cm;
  margin: 16pt 0 0 auto;
}

.story__qr-image {
  display: block;
  width: 2cm;
  height: 2cm;
  margin: 0 auto;
}

.story__qr-label {
  display: block;
  width: 2.8cm;
  margin: 5pt auto 0 auto;
  font-size: 8pt;
  line-height: 1.25;
  color: #6B5B45;
}

/* ---- List formatting (for Trix rich text) -------------------- */
.preface__body ul, .story__body ul {
  margin: 0 0 10pt 0;
  padding-left: 20pt;
  list-style-type: disc;
}

.preface__body ol, .story__body ol {
  margin: 0 0 10pt 0;
  padding-left: 20pt;
  list-style-type: decimal;
}

.preface__body li, .story__body li {
  margin: 0 0 4pt 0;
}
