/* ============================================================================
   print.css -- the logbook on paper.
   ============================================================================

   Michael asked for a book, and said "book" literally. This is the sheet that
   makes File > Print produce one instead of a screenshot of a website.

   ⚠️ IT IS LOADED WITH media="print", so nothing here can affect the screen.
   Every rule is written as though the screen sheet does not exist, because on
   paper most of it should not: the map, the filters, the play button and the
   theme toggle are all controls, and a control printed on paper is just ink.

   ⚠️ COLOURS ARE FORCED TO BLACK ON WHITE, not left to the theme. The site is
   dark by default and printing it as-is means a solid navy page -- which most
   printers will refuse, ration, or render as grey mud, and which costs a
   cartridge either way. The var(--...) tokens are deliberately NOT used here;
   this is the one context where the theme is wrong.
   ========================================================================== */

@page {
  margin: 18mm 16mm;
}

/* --- the ground ---------------------------------------------------------- */
html, body {
  background: #fff !important;
  color: #000 !important;
  font-size: 11pt;
  line-height: 1.5;
}

/* Belt and braces: the site paints backgrounds on a lot of surfaces, and any
   one of them left dark ruins the page it lands on. */
body *,
body *::before,
body *::after {
  background-image: none !important;
  background-color: transparent !important;
  color: #000 !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

/* --- what paper has no use for ------------------------------------------- */
#map, .map-shell, .leaflet-container, #p-map, #umap,
.filter-bar, .filter-group, .chips, .chip,
.play-controls, .drawer-close, .lightbox, #lightbox,
.back-link, .theme-toggle, #theme-toggle, .basemap-switch,
.map-legend, #map-legend, .stat-strip .stat-hint,
.pl-search, .otd-nav, .otd-jump, .ed-bar, .p-admin,
.nw-t2-nav, nav, .site-nav, footer, .search-box, #search,
video, .media-play, .drawer-play-btn, .sr-only {
  display: none !important;
}

/* --- structure ----------------------------------------------------------- */
.nw-wrap, .j-wrap, .all-wrap, .ed-wrap {
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

h1, h2, h3, h4 {
  color: #000 !important;
  /* A heading alone at the foot of a page is the classic print fault. */
  break-after: avoid-page;
  page-break-after: avoid;
}
/* ⚠️ !important, and only here. The pages set their headings with far more
   specific selectors than a bare `h1` -- .p-head h1 is 38px -- so without this
   the print sheet loses every size it asks for and the paper gets screen
   proportions. Measured on the Nassau page: h1 came out 38px against the 22pt
   requested. This sheet is media="print" and can never affect the screen, so
   raising its weight costs nothing anywhere else. */
h1, .p-head h1, .otd-head h1 { font-size: 22pt !important; margin: 0 0 4pt !important; }
h2, .p-sec, .pl-sec, .j-title { font-size: 15pt !important; margin: 14pt 0 4pt !important; }
h3 { font-size: 12.5pt !important; margin: 10pt 0 3pt !important; }

p, li, blockquote { orphans: 3; widows: 3; }

/* --- the cards, as entries rather than tiles ------------------------------ */
.p-visit, .otd-card, .all-card, .j-card, .pl-card, .p-journal {
  border: 0 !important;
  border-left: 2pt solid #000 !important;
  border-radius: 0 !important;
  padding: 2pt 0 6pt 8pt !important;
  margin: 0 0 8pt !important;
  break-inside: avoid;
  page-break-inside: avoid;
}

/* The places index is a grid on screen; on paper it is a list, because a
   three-column grid of one-line cards wastes most of a sheet. */
.pl-grid, .all-grid, .p-shots {
  display: block !important;
}

/* --- photographs ---------------------------------------------------------- */
img {
  max-width: 100% !important;
  height: auto !important;
  break-inside: avoid;
  page-break-inside: avoid;
}
/* Contact-sheet size: big enough to recognise, small enough that a trip with
   six photographs is not six pages. */
.p-shots img, .ac-thumb, .log-thumb {
  width: 48mm !important;
  height: 32mm !important;
  object-fit: cover !important;
  display: inline-block !important;
  margin: 0 3mm 3mm 0 !important;
  border: 0.5pt solid #999 !important;
}
/* A placeholder is a grey box with an icon: meaningless in ink. */
.log-thumb-none, .ac-thumb-none { display: none !important; }

/* --- the journal, which is the reason any of this exists ------------------ */
.p-journal {
  border-left: 0 !important;
  padding-left: 0 !important;
}
.p-journal p { margin: 0 0 6pt; }
.p-journal img { width: 100mm !important; height: auto !important; display: block; margin: 6pt 0; }
.p-journal blockquote {
  border-left: 1.5pt solid #999 !important;
  padding-left: 6pt !important;
  font-style: italic;
}

/* --- links: say where they go, since paper cannot be clicked -------------- */
a { text-decoration: none !important; }
a[href^="http"]::after {
  content: " (" attr(href) ")";
  font-size: 8.5pt;
  color: #555 !important;
  word-break: break-all;
}
/* Internal links are noise on paper -- the page they point at is either in the
   same stack or is not printed at all. */
a[href^="/"]::after, a[href^="#"]::after, a[href^="."]::after { content: ""; }

/* --- the stat strip reads as a line of facts ------------------------------ */
.p-stats, .stat-strip {
  display: block !important;
  border-top: 0.5pt solid #999 !important;
  border-bottom: 0.5pt solid #999 !important;
  padding: 4pt 0 !important;
  margin: 0 0 10pt !important;
}
.p-stat, .stat { display: inline-block !important; margin: 0 10mm 0 0 !important; }
/* ⚠️ THE SPACE IS LOAD-BEARING. On screen the number is display:block above its
   label, so no separator is needed; collapsing both to inline for print ran
   them together and the strip printed as "12VISITS 2011FIRST 2026MOST RECENT".
   Measured on the Nassau sheet. The margin is what puts the gap back. */
.p-stat b, .stat b {
  font-size: 13pt !important;
  display: inline !important;
  margin-right: 0.4em !important;
}
.p-stat span, .stat span { font-size: 9pt !important; }

/* Provenance needs air, or it crowds the line above and reads as part of it. */
.p-head::after, .otd-head::after { margin-top: 5pt !important; margin-bottom: 4pt !important; }

/* --- provenance ----------------------------------------------------------- */
/* Printed pages get separated from their source. The place page says which
   place it is in its <h1>; this adds where it came from. */
.p-head::after,
.otd-head::after {
  content: "rennhack.net/travels";
  display: block;
  font-size: 8.5pt;
  color: #666 !important;
  margin-top: 2pt;
}