/* Print fallback for the Current Affairs pages (and anything else printed).
 *
 * This is NOT how the distributed weekly PDF is made — that is drafted in
 * Word/Canva from the published page and human-edited (see the spec, §6). This
 * stylesheet exists so a visitor who hits Ctrl+P gets something decent instead
 * of the dark theme with the nav bar in it. One-time job, allowed to be
 * imperfect.
 *
 * DELIBERATELY TEXT-ONLY IN THE MARGIN BOXES. Measured in Chrome 152: an image
 * inside an @page margin box can silently fail to render (a QR data URI drew,
 * an identically-constructed logo data URI did not, with no error). A fallback
 * must not depend on the part that breaks, so the header uses a text wordmark
 * and a text URL. The real logo and the QR live in the Word/Canva PDF.
 *
 * Also measured: a position:fixed header band is NOT a substitute for margin
 * boxes — it drifts into the content area from page 2 on and overprints the
 * body text. Margin boxes reserve space; fixed elements do not.
 */

@page {
  size: A4;
  margin: 18mm 16mm 16mm;

  /* Georgia has NO Devanagari coverage. Per-character fallback means the Latin
     wordmark still renders in Georgia while a Hindi running title falls through
     to Noto Sans Devanagari — without the fallback listed the Hindi header
     tofus. Same reason it is in the body stack below. */

  @top-left     { content: "Pariksha360"; font: 9pt Georgia, "Noto Sans Devanagari", serif; color: #444; }
  @top-center   { content: string(doctitle); font: 9pt Georgia, "Noto Sans Devanagari", serif; color: #444; }
  @top-right    { content: "pariksha360.com"; font: 9pt Georgia, "Noto Sans Devanagari", serif; color: #444; }
  @bottom-right { content: "Page " counter(page) " of " counter(pages); font: 9pt Georgia, "Noto Sans Devanagari", serif; color: #444; }
}

@media print {
  /* The running title comes from the h1 via a named string, so every week's
     printout carries its own heading in the margin without per-page CSS. */
  .ca-week h1 { string-set: doctitle content(text); }

  /* Force light. The site's base theme is near-black (#06080F) and printing it
     as-is empties a cartridge. print-color-adjust must stay `economy` here —
     the opposite of the watermark rule below — so backgrounds drop out. */
  :root, :root[data-theme="dark"], :root[data-theme="light"] {
    --bg: #fff; --surface: #fff; --card: #fff;
    --text: #111; --text-dim: #333; --text-muted: #555; --border: #bbb;
  }
  html, body { background: #fff !important; color: #111 !important; }

  /* Chrome and screen furniture that means nothing on paper. */
  nav, .nav, footer, .footer, .skip-link, .theme-toggle, .nav-toggle,
  .cta-signup, .ca-filter, .ca-pdf, .ca-week-pdf { display: none !important; }

  main, .container { max-width: none; margin: 0; padding: 0; }

  /* Keep container backgrounds off the page: the light forcing above turns
     every --bg/--surface/--card token white, and stacked white boxes over a
     white page just waste ink and can clip the watermark. */
  main, article, section, .container, .ca-week, .ca-items, .ca-item {
    background: transparent !important;
  }

  body { font: 10.5pt/1.45 Georgia, "Noto Sans Devanagari", "Times New Roman", serif; }
  h1 { font-size: 17pt; margin: 0 0 2mm; }
  h2 { font-size: 12pt; margin: 0 0 1mm; }

  /* A four-line news item must never straddle a page break, and a heading
     must not strand at the foot of one. */
  .ca-item { break-inside: avoid; margin: 0 0 6mm; }
  .ca-item-head, .ca-term-week h2 { break-after: avoid; }
  .ca-items { list-style: none; padding: 0; }

  .ca-badge { font-size: 8.5pt; color: #555; text-decoration: none; }
  .ca-source { font-size: 8.5pt; color: #555; font-style: italic; }
  .ca-item-tags { display: none; }  /* noise on paper; the category is enough */

  /* The icon means nothing on paper — the href is printed instead, below. */
  .ca-src-link svg { display: none; }

  /* Print the URL after SOURCE links only. Doing this for every inline link
     turns the body into a wall of parentheses. */
  .ca-source a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 8pt; }

  /* Watermark. A position:fixed element DOES repeat on every printed page
     (measured) — unlike the margin boxes it is not subject to the image bug,
     because it is ordinary flow content in a fixed box.
     Three things measured the hard way, all silent failures:

       1. It must be a REAL ELEMENT. The identical rules on a
          `.ca-week::before` pseudo-element render NOTHING, at any opacity.
       2. NO `z-index: -1`. In isolation that correctly puts the watermark
          behind the text, but on this site an ancestor establishes a stacking
          context, so -1 drops it behind that ancestor's background and it
          vanishes entirely. It therefore draws OVER the body text — which is
          fine at 5% and is how most watermarks work anyway.
       3. `print-color-adjust: exact`, or the browser drops it.

     Opacity stays very low on purpose, and now doubly so since it overprints:
     these get photocopied at coaching centres, and a heavy watermark survives
     photocopying better than the body text does. Do not raise it. */
  .ca-watermark {
    display: block;
    position: fixed;
    top: 42%; left: 0; right: 0;
    text-align: center;
    font: 700 54pt Georgia, serif;
    color: #000;
    opacity: 0.05;
    transform: rotate(-28deg);
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
  }
}

/* The watermark element is print-only. Scoped to @media SCREEN deliberately:
   an unscoped `.ca-watermark { display:none }` here sits after the @media print
   block at equal specificity, so it wins there too and the watermark silently
   never prints. Cost an hour once. */
@media screen { .ca-watermark { display: none; } }
