/* ==========================================================================
   Development Partner monitoring profile — print document
   ==========================================================================
   Laid out for A4 at 14mm margins (182mm of content). Sizing is in mm and pt so
   the page is the design surface, not the viewport; the same sheet renders the
   on-screen preview so what a user sees before printing is the artefact itself.
   ========================================================================== */

.rp-doc {
  --rp-dp:    #0F7B9C;
  --rp-peer:  #C4611A;
  /* The Global Partnership's orange (index.html --gpedc-orange), for the
     document's structure: section badges, figure numbers, bullets. */
  --rp-orange: #E5731F;
  --rp-ink:   #1B2A4A;
  --rp-body:  #33404F;
  --rp-muted: #6B7683;
  --rp-rule:  #D8DEE5;
  --rp-band:  #EEF2F5;

  width: 182mm;
  margin: 0 auto;
  background: #fff;
  color: var(--rp-body);
  /* Same face as the portal and as effectivecooperation.org. The fallbacks
     matter more here than on screen: the profile is printed, and a missing
     web font would otherwise drop it to a default serif. */
  font-family: 'Inter', 'Segoe UI', -apple-system, BlinkMacSystemFont, Roboto, Helvetica, Arial, sans-serif;
  font-size: 9.2pt;
  line-height: 1.5;
}

/* ── Cover banner ────────────────────────────────────────────────────────
   Carries the overview hero's gradient so the report reads as the same
   product as the portal a user just came from. */
.rp-cover {
  background: linear-gradient(125deg, #1B2A4A 0%, #2C5870 45%, #3CA8B7 100%);
  color: #fff;
  border-radius: 4mm;
  padding: 13mm 12mm 11mm;
  margin-bottom: 8mm;
  position: relative;
  overflow: hidden;
}
.rp-cover::before {
  content: ''; position: absolute; right: -22mm; top: -22mm;
  width: 76mm; height: 76mm; border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,0.18), transparent 70%);
}
/* Issuer mark, top-right of the cover. Kept clear of the title block, which
   wraps to two lines for the longer organisation names. */
/* The lockup is nearly square (500x515) and carries a two-line strapline, so
   it needs more width than the bare mark did to stay legible at print size. */
.rp-cover-mark {
  position: absolute; z-index: 1;
  top: 9mm; right: 11mm;
  width: 30mm; height: auto;
}
.rp-cover-inner { position: relative; z-index: 1; padding-right: 36mm; }
.rp-cover-eyebrow {
  font-size: 8.4pt; font-weight: 700; letter-spacing: 0.12em;
  text-transform: uppercase; color: #FFD7B5; margin-bottom: 5mm;
}
.rp-cover-name { display: flex; align-items: center; gap: 5mm; }
.rp-flag {
  width: 17mm; height: auto; border-radius: 1mm; flex: 0 0 auto;
  box-shadow: 0 0 0 1px rgba(255,255,255,0.55);
}
.rp-h1 {
  font-size: 25pt; font-weight: 700; line-height: 1.1;
  margin: 0; color: #fff; letter-spacing: -0.01em;
}
.rp-cover-sub {
  margin-top: 4mm; font-size: 11pt; font-weight: 600;
  letter-spacing: 0.06em; text-transform: uppercase;
  color: rgba(255,255,255,0.92);
}

/* ── Sections ───────────────────────────────────────────────────────────── */
.rp-body { padding: 0 1mm; }

/* Sections deliberately DO break across pages. Holding a whole section together
   sounds tidy but a section that will not fit in the space left jumps to a fresh
   page and leaves the remainder of the previous one blank — which is how the
   first draft produced half-empty pages 1, 4, 6 and 7. Only the atomic pieces
   below (figures, stat strips, grade cards) refuse to split; prose flows. */
.rp-sec {
  margin-bottom: 7mm;
  padding-bottom: 1mm;
}
/* Section headings carry the Global Partnership's orange — the badge and a
   short accent under the title — against a neutral rule, so the structure of
   the document is in the brand colour and the teal is left to the data. */
.rp-h2 {
  position: relative;
  display: flex; align-items: center; gap: 3.2mm;
  font-size: 13pt; font-weight: 700; letter-spacing: -0.005em; color: var(--rp-ink);
  margin: 0 0 3.2mm; padding-bottom: 2mm;
  border-bottom: 1px solid var(--rp-rule);
  /* A heading alone at the foot of a page is worse than a slightly shorter
     page, so it always travels with what follows it. */
  break-after: avoid-page; page-break-after: avoid;
  break-inside: avoid; page-break-inside: avoid;
}
/* The accent is exactly the badge's width, so it sits under the number and
   stops where the title begins. */
.rp-h2::after {
  content: ''; position: absolute; left: 0; bottom: -1px;
  width: 7.6mm; height: 2.5px; background: var(--rp-orange);
}
.rp-h2-num {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 7.6mm; height: 7.6mm; border-radius: 50%;
  background: var(--rp-orange); color: #fff;
  font-size: 9pt; font-weight: 700; line-height: 1; flex: 0 0 auto;
}
.rp-p {
  margin: 0 0 3mm; text-align: justify; hyphens: auto;
  /* Never strand one or two lines of a paragraph across a page boundary. */
  orphans: 3; widows: 3;
}
.rp-p strong { color: var(--rp-ink); font-weight: 600; }
.rp-note { color: var(--rp-muted); font-style: italic; text-align: left; }

.rp-list { margin: 0 0 3.5mm; padding-left: 6mm; orphans: 2; widows: 2; }
.rp-list li { margin-bottom: 1.6mm; break-inside: avoid; page-break-inside: avoid; }
.rp-list li::marker { color: var(--rp-orange); }

/* ── Figures ────────────────────────────────────────────────────────────── */
.rp-fig {
  margin: 0 0 5mm; padding: 3.5mm 4mm 3mm;
  background: #FCFCFB; border: 1px solid var(--rp-rule); border-radius: 2mm;
  break-inside: avoid-page; page-break-inside: avoid;
}
.rp-fig-narrow { max-width: 108mm; }
.rp-fig-title {
  font-size: 8.6pt; font-weight: 700; color: var(--rp-ink);
  margin-bottom: 2.5mm; letter-spacing: 0.01em;
}
.rp-fig-note {
  margin-top: 2mm; font-size: 7.4pt; line-height: 1.45; color: var(--rp-muted);
}
.rp-svg { width: 100%; height: auto; display: block; overflow: visible; }
.rp-svg text { font-family: inherit; }
.rp-bar-lab { font-size: 10.5px; fill: #33404F; dominant-baseline: middle; }
.rp-bar-val { font-size: 10.5px; font-weight: 700; fill: #1B2A4A; dominant-baseline: middle; }
.rp-bar-na  { font-size: 10px; font-style: italic; fill: #6B7683; dominant-baseline: middle; }

.rp-legend {
  display: flex; flex-wrap: wrap; gap: 5mm;
  margin-top: 2mm; font-size: 7.6pt; color: var(--rp-muted);
}
.rp-legend i {
  display: inline-block; width: 3.2mm; height: 2.2mm;
  border-radius: 0.6mm; margin-right: 1.4mm; vertical-align: middle;
}

/* ── Stat strip (reporting to IMS) ──────────────────────────────────────── */
.rp-stats {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 4mm;
  margin-bottom: 4mm; break-inside: avoid-page;
}
.rp-stat {
  background: var(--rp-band); border-radius: 2mm; padding: 3.5mm 3mm;
  text-align: center;
}
.rp-stat-val { font-size: 17pt; font-weight: 700; color: var(--rp-ink); line-height: 1; }
.rp-stat-meter {
  height: 1.6mm; background: #fff; border-radius: 1mm;
  margin: 2.5mm 0 2mm; overflow: hidden;
}
.rp-stat-meter span { display: block; height: 100%; border-radius: 1mm; }
.rp-stat-lab { font-size: 7.4pt; color: var(--rp-muted); line-height: 1.35; }

/* ── Transparency grade cards ───────────────────────────────────────────── */
.rp-grades {
  display: grid; grid-template-columns: 1fr 1fr; gap: 4mm;
  margin-bottom: 3mm; break-inside: avoid-page;
}
.rp-grade {
  border: 1px solid var(--rp-rule); border-radius: 2mm; padding: 3mm 3.5mm;
  background: #FCFCFB;
}
.rp-grade-std {
  font-size: 8.4pt; font-weight: 700; color: var(--rp-ink);
  letter-spacing: 0.05em; text-transform: uppercase; margin-bottom: 2mm;
}
.rp-grade-row {
  display: flex; justify-content: space-between; align-items: baseline;
  padding: 1.2mm 0; border-top: 1px solid var(--rp-rule);
}
.rp-grade-yr { font-size: 7.8pt; color: var(--rp-muted); }
.rp-grade-val { font-size: 9.4pt; font-weight: 600; color: var(--rp-body); }
.rp-grade-now .rp-grade-val { color: var(--rp-dp); font-weight: 700; }

/* ── Delivery donut ───────────────────────────────────────────────────────
   The layout of the previous round's profiles: shares written on the ring,
   the legend beneath naming the channels. */
.rp-fig-donut { text-align: center; }
.rp-donut { width: 66mm; margin: 1mm auto 0; }
.rp-donut-in {
  font-size: 11.5px; font-weight: 700; fill: #fff;
  text-anchor: middle; dominant-baseline: middle;
}
.rp-donut-out { font-size: 10.5px; font-weight: 700; fill: #1B2A4A; dominant-baseline: middle; }
.rp-donut-lead { fill: none; stroke: #6B7683; stroke-width: 1; }
.rp-donut-legend {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 1.2mm 4.5mm;
  margin-top: 2.5mm; font-size: 7.8pt; color: var(--rp-body); text-align: left;
}
.rp-donut-key { white-space: nowrap; }
.rp-donut-key i {
  display: inline-block; width: 2.8mm; height: 2.8mm; border-radius: 50%;
  margin-right: 1.3mm; vertical-align: -0.4mm;
}
.rp-fig-donut .rp-fig-note { text-align: center; }

/* ── Footer ─────────────────────────────────────────────────────────────── */
.rp-footer {
  margin-top: 6mm; padding-top: 2.5mm;
  border-top: 1px solid var(--rp-rule);
  font-size: 7.2pt; color: var(--rp-muted); text-align: center;
}

/* ── On-screen preview shell ────────────────────────────────────────────── */
#dp-report-stage {
  position: fixed; inset: 0; z-index: 900;
  background: rgba(27, 42, 74, 0.72);
  overflow: auto; padding: 0 0 16mm;
}
#dp-report-stage[hidden] { display: none; }
#dp-report-stage .rp-sheet {
  /* The document is authored at 210mm because that is the print surface. On
     screen it is scaled up so the preview uses the window rather than sitting
     as a small slip in a large grey field. `zoom` scales layout, unlike a
     transform, which would leave the scroll height wrong; print resets it. */
  zoom: 1.25;
  width: 210mm; min-height: 297mm; margin: 0 auto;
  background: #fff; padding: 14mm;
  box-shadow: 0 10px 40px rgba(0,0,0,0.35);
}
/* Below this width the scaled sheet would overflow horizontally. */
@media (max-width: 1240px) { #dp-report-stage .rp-sheet { zoom: 1; } }

/* The bar is sticky over a white page, so it carries its own backdrop. Without
   one the controls sit on whatever scrolls beneath them, and the low-contrast
   Close button vanishes against the sheet. */
.rp-stage-bar {
  position: sticky; top: 0; z-index: 2;
  display: flex; justify-content: center; align-items: center; gap: 3mm;
  padding: 3.5mm 0; margin-bottom: 6mm;
  background: rgba(19, 30, 54, 0.94);
  backdrop-filter: blur(3px);
  box-shadow: 0 2px 14px rgba(0, 0, 0, 0.32);
}
.rp-stage-bar button {
  font: inherit; font-size: 0.82rem; font-weight: 600;
  padding: 0.5rem 1.1rem; border-radius: 6px; cursor: pointer;
  border: 1px solid rgba(255,255,255,0.35);
}
.rp-stage-print { background: #3CA8B7; color: #fff; border-color: #3CA8B7 !important; }
.rp-stage-print:hover { background: #2C8E9C; border-color: #2C8E9C !important; }
.rp-stage-close {
  background: rgba(255,255,255,0.16); color: #fff;
  border-color: rgba(255,255,255,0.55) !important;
}
.rp-stage-close:hover { background: rgba(255,255,255,0.3); }

/* ── Print ──────────────────────────────────────────────────────────────── */
@media print {
  body.rp-printing > *:not(#dp-report-stage) { display: none !important; }
  body.rp-printing #dp-report-stage {
    position: static; background: none; padding: 0; overflow: visible;
  }
  body.rp-printing #dp-report-stage .rp-sheet {
    zoom: 1;
    width: auto; min-height: 0; margin: 0; padding: 0; box-shadow: none;
  }
  body.rp-printing .rp-stage-bar { display: none !important; }
  .rp-doc { width: auto; }
  /* No break-after rule on the cover: the intro and the start of section 1
     should flow onto page one behind it rather than leaving it half empty. */
  /* Colour is load-bearing here: the bars ARE the comparison. */
  .rp-doc, .rp-doc * {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}

/* ── Additions for the 2026 profile revisions ─────────────────────────── */

/* Figure numbers, so running text can point at a figure. */
.rp-fig-num {
  font-weight: 700; color: var(--rp-orange); margin-right: 0.35em;
}

/* Footnotes requested by partners on specific claims. */
.rp-fn-ref { font-size: 0.72em; font-weight: 700; }
.rp-fn-hidden { display: none; }
.rp-fnotes {
  margin-top: 6pt; padding-top: 5pt; border-top: 0.5pt solid #D8DEE4;
}
.rp-fnote {
  margin: 0 0 2pt; font-size: 6.6pt; line-height: 1.35; color: #55606D;
}

/* Direction of travel on a transparency grade. */
.rp-grade-move {
  float: right; font-size: 6.2pt; font-weight: 700;
  padding: 0.5pt 3pt; border-radius: 6pt;
}
.rp-grade-move.up   { background: #D4EDDA; color: #1B7A3D; }
.rp-grade-move.down { background: #FDECEC; color: #C0392B; }
.rp-grade-move.flat { background: #EDF0F3; color: #55606D; }

/* Sub-heading inside a section. */
.rp-subhead {
  margin: 8pt 0 3pt; font-size: 9pt; font-weight: 700; color: var(--rp-navy, #1B2A4A);
}

/* ── Kampala bullets: a bar pair under each sentence, one legend after ──── */
.rp-kpa-list li { margin-bottom: 2.6mm; }
.rp-kpa-bar { margin: 1.2mm 0 0; }
.rp-mini { width: 62%; max-width: 100mm; display: block; }
.rp-kpa-legend { margin: -1mm 0 3.5mm 6mm; }

/* ── Country programmable aid box ──────────────────────────────────────────
   A component of its own at the end of the profile, outside the numbered
   sections: the framing text sits beside the channels-of-delivery chart, the
   source note runs beneath both. Tinted and ruled so it reads as a distinct
   piece rather than a ninth section.
   Set on the warm cream of the previous round's profiles rather than the
   portal's blue, with a neutral rule under the title; the text sits level
   with the chart caption instead of floating in the middle of the column. */
.rp-box {
  margin: 2mm 0 6mm; padding: 4.5mm 5mm 4mm;
  border: 1px solid #E2DDD3; border-radius: 2.5mm;
  background: linear-gradient(135deg, #F9F7F2 0%, #F1EEE6 100%);
  break-inside: avoid-page; page-break-inside: avoid;
}
.rp-box-title {
  margin: 0 0 4mm; padding-bottom: 2.2mm; border-bottom: 1px solid #E2DDD3;
  font-size: 11pt; font-weight: 700; line-height: 1.25; color: var(--rp-ink);
}
.rp-box-grid {
  display: grid; grid-template-columns: 1fr 1.1fr; gap: 7mm; align-items: start;
}
.rp-box-text { padding-top: 0.6mm; }
.rp-box-text .rp-p { margin-bottom: 0; text-align: left; hyphens: manual; line-height: 1.6; }
.rp-box .rp-fig { margin: 0; padding: 0; background: transparent; border: 0; }
.rp-box .rp-fig-title { text-align: left; margin-bottom: 1.5mm; }
.rp-box .rp-donut { width: 60mm; margin: 0 auto; }
.rp-box-caveat {
  padding: 3mm 3.5mm; background: #fff; border: 1px solid var(--rp-rule); border-radius: 2mm;
  font-size: 8.2pt; font-style: italic; color: var(--rp-muted); line-height: 1.45;
}
.rp-box-note {
  margin: 3mm 0 0; font-size: 7.4pt; line-height: 1.45; color: var(--rp-muted); text-align: left;
}

/* ── Endnotes: every footnote, once, at the end of the document ─────────── */
.rp-endnotes {
  margin-top: 5mm; padding-top: 3mm; border-top: 1px solid var(--rp-rule);
}
.rp-endnotes-title {
  font-size: 7.6pt; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--rp-muted); margin-bottom: 1.5mm;
}