/* report_shared.css — the SHARED report grammar: tiles, species tables, strips and headings, used by BOTH
   the Place report (R/modules/place_report.R) and the Protected-area report (R/modules/ep_report.R), and
   inlined by path into the PDF builder (report_pdf.R).
   It was zone_report.css with an `ik-zr-*` prefix until Aug 2026 — named for the Place report back when
   that page was the Zone report, and kept through the module rename because ep_report.R had come to link
   it too. So the name was wrong twice over: the axis it was named for is now `reporting_group`, and the
   file was never one page's stylesheet to begin with. `report_shared` says what it is; `ik-rpt-` is the
   prefix. Anything belonging to ONE report lives in that report's own stylesheet. */
.ik-rpt-title { margin: 0 0 0.1rem; }
.ik-rpt-lead { color: var(--bs-secondary-color, #6c757d); font-size: 0.9rem; margin: 0.2rem 0 0.7rem; max-width: 62rem; }
/* (controls moved in-plot) */
.ik-rpt-note { color: var(--bs-secondary-color, #6c757d); font-size: 0.8rem; font-style: italic; margin: 0.1rem 0 0.4rem; }
/* ── .ik-area-note, MIRRORED from base.css because the PDF does not get base.css ───────────────────
   base.css is the app-wide screen stylesheet and defines this rule (search "Reserve-area caveat"). The
   report PDFs inline their stylesheets by path (report_pdf.R `css_files`) and inline only THIS file plus
   the report's own — deliberately, because base.css is 700 lines of navbar, sidebar and plot-toolbar
   chrome written against a live bslib page, and inlining it into a print document would drag all of that
   in to fight .ik_report_base_css's own body and typography rules.
   The consequence, until Aug 2026, was that .ik-area-note printed UNSTYLED on paper: the Place report
   uses it twice inside PDF-reachable sections (the coverage footprint caveat and the Overview's
   "declare no <place>" remainder note), so two paragraphs written to be small grey asides printed at full
   body size in body ink, reading as findings rather than caveats.
   DUPLICATED, not moved: base.css must keep it for the pages that use it and never link this file
   (modelled_coverage.R, ui_helpers.R). Same declarations, so the two agree by inspection — if you change
   one, change the other. This is the same trade .ik_report_base_css() already makes for the Bootstrap
   --bs-* variables, and for the same reason: the PDF has no access to the stylesheet that defines them. */
.ik-area-note { color: var(--bs-secondary-color, #6c757d); font-size: 0.8rem; margin: 0.5rem 0 0; }
.ik-area-note svg, .ik-area-note .fa { margin-right: 0.3rem; opacity: 0.85; }

/* ── A section that is NOT here, and says so (report_pdf.R: ik_report_sections) ────────────────────
   Quiet but not hidden — it is a statement about the report's completeness, not content, so it takes the
   muted ink and a rule down its left edge rather than a section heading. It must read the same on screen
   and on paper: `ik_report_html` inlines this file, and both report modules <link> it, so this one rule is
   the whole of the styling on both media.
   `--bs-secondary-color` is defined by .ik_report_base_css()'s :root fallbacks as well as by bslib, so it
   resolves in the PDF (where bslib is not loaded) — the literal is the belt-and-braces the rest of this
   file uses for the same reason. */
.ik-rpt-withheld { color: var(--bs-secondary-color, #6c757d); font-size: 0.85rem; line-height: 1.4;
  border-left: 2px solid var(--bs-border-color, #dee2e6); padding: 0.15rem 0 0.15rem 0.6rem;
  margin: 0.5rem 0 0.9rem; break-inside: avoid; }
.ik-rpt-withheld-h { font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; font-size: 0.78rem; }
.ik-rpt-withheld-list { font-style: italic; }
/* A section that could not be BUILT is a fault, not a property of the data — the accent separates it from
   the grey of "there was nothing to measure" (the same distinction, and the same colour, that ep_report.css
   draws between its effort caveat and its muted "nothing here" states). */
.ik-rpt-withheld[data-withheld="failed"] { border-left-color: var(--ik-accent, #cf6819); }
.ik-rpt-withheld[data-withheld="failed"] .ik-rpt-withheld-h { color: var(--ik-accent, #cf6819); }

/* Which reserve (or All reserves) the report is for — prominent so a single reserve is never read as the whole project. */
.ik-rpt-for { display: flex; align-items: baseline; gap: 0.5rem; margin: 0.2rem 0 0.6rem; }
.ik-rpt-for-k { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--bs-secondary-color, #6c757d); }
.ik-rpt-for-v { font-size: 1.35rem; font-weight: 700; line-height: 1.1; }

/* ── Overview tab — current-state + coverage tiles ─────────────────────────────────────────────── */
.ik-rpt-ov { padding-top: 0.6rem; }
.ik-rpt-ov-h { font-size: 0.95rem; font-weight: 700; margin: 0.9rem 0 0.5rem; display: flex; align-items: baseline; gap: 0.5rem; }
/* The exception exists so the FIRST heading on a page does not open with a hole above it. It stopped
   meaning that when both reports moved to a section registry (Aug 2026): every block is now its own
   `<section>`, so every heading is a `:first-child` of one and ALL of them lost the 0.9rem. That is why
   "Protected areas in this group" and "How this area compares" sat hard against the block above them.
   Scoped to the first section, it means what it always meant. */
.ik-report-section:first-child > .ik-rpt-ov-h:first-child,
.ik-rpt-ov > .ik-rpt-ov-h:first-child,
.ik-epr-ov > .ik-rpt-ov-h:first-child { margin-top: 0.2rem; }

/* ── Section rhythm on SCREEN ──────────────────────────────────────────────────────────────────────
   Scoped to the two on-screen wrappers, not to `.ik-report-section` itself: the PDF has its own spacing
   for these (`.ik-report-section { margin: 0 0 14px }` in report_pdf.R) and its trend runs are packed by
   MEASURED height, so an extra inch of margin there is space the packer never budgeted for.

   A section whose first block is NOT a heading (the Place report's Area/Traps/Cameras tiles, which lost
   their heading deliberately) has nothing to carry the gap for it — hence the rule on the section rather
   than on the heading. And the MAP is not a section at all: it is static UI between two server-rendered
   outputs, so it carries its own bottom gap or the tiles below it butt onto its border. */
.ik-rpt-ov .ik-report-section + .ik-report-section,
.ik-epr-ov .ik-report-section + .ik-report-section { margin-top: 1.05rem; }
.ik-rpt-ov .ik-rpt-map, .ik-epr-ov .ik-epr-map { margin-bottom: 1.05rem; }
.ik-rpt-ov-sub { font-size: 0.75rem; font-weight: 400; text-transform: uppercase; letter-spacing: 0.03em; color: var(--bs-secondary-color, #6c757d); }
.ik-rpt-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(9.5rem, 1fr)); gap: 0.6rem; }
.ik-rpt-tile { border: 1px solid var(--bs-border-color, #dee2e6); border-radius: 0.5rem; padding: 0.6rem 0.7rem; background: var(--bs-body-bg, #fff); }
.ik-rpt-tile-k { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--bs-secondary-color, #6c757d); }
/* Subtle scanning-anchor glyph on the key row — quieter than the value, never colour-filled. */
.ik-rpt-tile-icon { font-size: 0.68rem; margin-right: 0.32rem; opacity: 0.55; }
.ik-rpt-tile-v { font-size: 1.5rem; font-weight: 700; line-height: 1.15; margin-top: 0.1rem; display: flex; align-items: baseline; gap: 0.3rem; }
/* "of N" — the DENOMINATOR riding on the value row (e.g. traps in service of the whole register). Muted
   and much smaller than the headline so it reads as the base the figure is a share of, not as a second
   number of equal weight; it sits on the same baseline as the value (the row is flex/baseline above). */
.ik-rpt-tile-of { font-size: 0.8rem; font-weight: 500; color: var(--bs-secondary-color, #6c757d); }
.ik-rpt-tile-sub { font-size: 0.72rem; color: var(--bs-secondary-color, #6c757d); margin-top: 0.15rem; line-height: 1.3; }
.ik-rpt-tile-dir { font-size: 0.9rem; font-weight: 700; }
.ik-rpt-tile-dir.good { color: var(--ik-good, #2e7d32); }
.ik-rpt-tile-dir.bad { color: var(--ik-bad, #c62828); }
.ik-rpt-tile-dir.neutral { color: var(--bs-secondary-color, #6c757d); }
/* Clickable tiles drill into their records. */
.ik-rpt-tile-click { cursor: pointer; transition: border-color 0.12s, box-shadow 0.12s, transform 0.12s; }
.ik-rpt-tile-click:hover { border-color: var(--ik-accent, #cf6819); box-shadow: 0 1px 6px rgba(0, 0, 0, 0.09); transform: translateY(-1px); }
/* A By-species group: a fixed left label (Predators / Protected) beside the table. */
.ik-rpt-ov-role { display: flex; align-items: flex-start; gap: 0.6rem; margin-bottom: 0.5rem; }
.ik-rpt-ov-rolek { flex: 0 0 5rem; padding-top: 0.5rem; font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--bs-secondary-color, #6c757d); }
/* Secondary figure (RAI's SE, the catch rate) — small muted text after a value; shared by the tiles + the species table. */
.ik-rpt-se { font-size: 0.68rem; font-weight: 400; color: var(--bs-secondary-color, #6c757d); }
/* Footnotes run the FULL line width. They are two or three lines of small print, and capping the measure
   turned them into a narrow column with a half-page of white beside it — which reads as though the page
   ended early. A cap earns its place on a long-form paragraph, not on a caption. */
.ik-rpt-ov-foot { font-size: 0.78rem; color: var(--bs-secondary-color, #6c757d); margin: 0.9rem 0 0.2rem; }

/* ── THE METHOD APPENDIX, shared by both reports ───────────────────────────────────────────────────
   The Place report and the Protected area report each end on a "Method" tab that also prints as the
   document's last section. They are the same object and a reader moves between them, so the grammar is
   defined once here rather than twice in two page stylesheets that drift.

   READS AS REFERENCE, NOT AS A FINDING. Everywhere else on these pages this size and colour is a small
   grey aside beneath a number; in the appendix it IS the content, so it takes body ink and stops looking
   like a footnote to the heading above it.

   NO MAX-WIDTH, deliberately, and it had one. A reading measure is the right instinct on a page of prose
   and the wrong one here: every other block on these reports — tiles, tables, the class key — runs the
   full column, so a text block stopping short of the right edge does not read as a considered measure. It
   reads as an artificial page width inside the page. A measure only works where the whole surface keeps
   it (see .ik-rpt-lead, which is one line and can). */
.ik-rpt-method-p,
.ik-rpt-method .ik-epr-recon { font-size: 0.86rem; color: var(--bs-body-color, #333); margin: 0.45rem 0 0.75rem; line-height: 1.45; }
/* Sub-headings sit UNDER the appendix's own title, so they take a rule rather than more weight — four bold
   headings of equal size read as four separate sections rather than as one piece of reference. */
.ik-rpt-method-h {
  margin-top: 1.5rem; padding-top: 0.5rem;
  border-top: 1px solid var(--bs-border-color, #dee2e6);
  color: var(--bs-secondary-color, #6c757d); text-transform: uppercase;
  letter-spacing: 0.04em; font-size: 0.74rem;
}
.ik-rpt-method-list { font-size: 0.86rem; margin: 0.3rem 0 0.7rem 1.1rem; line-height: 1.45; }
.ik-rpt-method-list li { margin-bottom: 0.35rem; }
.ik-rpt-method .ik-trap-key { margin: 0.5rem 0 0.7rem; }
/* A pointer FROM a note TO the appendix. Quiet by design: a cross-reference that competes with the
   sentence carrying the finding is the noise this whole split was undoing. */
.ik-rpt-method-ref { opacity: 0.8; font-style: italic; }

/* ── By-species TABLE (replaces the per-species cards) ─────────────────────────────────────────────
   The printable, scannable rendering of the place overview: one row per animal, the three device lenses
   (Detected · Caught · Tracked) across the top, each metric cell drilling to its own records. Sits inside
   the shared .ik-rpt-ov-role (5rem group label at left, table filling the rest). Each metric cell is
   STACKED — headline count on top, the RAI/TN/RTI detail on its own line beneath — so the headline
   numbers align down the column and the sub-text never shoves them out of line. RIGHT-aligned so the
   counts line up by place value (the conventional numeric-table read); the Species column stays left. */
.ik-rpt-ov-role .ik-rpt-sptable-wrap { flex: 1 1 auto; min-width: 0; overflow-x: auto; }   /* min-width:0 lets a flex child shrink so the wrapper (not the page) scrolls */
.ik-rpt-sptable { width: 100%; border-collapse: collapse; font-size: 0.86rem; }
.ik-rpt-th { text-align: right; padding: 0.2rem 0.55rem 0.35rem; font-size: 0.68rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.04em; color: var(--bs-secondary-color, #6c757d);
  border-bottom: 1px solid var(--bs-border-color, #dee2e6); white-space: nowrap; }
.ik-rpt-th-sp { text-align: left; }   /* Species header stays left, over the left-aligned name column */
.ik-rpt-trow { border-bottom: 1px solid var(--bs-border-color, #e9ecef); }
.ik-rpt-trow:hover { background: color-mix(in srgb, var(--bs-secondary-color, #6c757d) 7%, transparent); }
/* Role accent — a coloured left edge on the species cell (predator red / protected green), matching the retired cards. */
.ik-rpt-trow-predator .ik-rpt-tsp { box-shadow: inset 3px 0 0 -1px #c62828; }
.ik-rpt-trow-protected .ik-rpt-tsp { box-shadow: inset 3px 0 0 -1px #2e7d32; }
.ik-rpt-tsp { text-align: left; font-weight: 600; padding: 0.45rem 0.55rem 0.45rem 0.7rem;
  display: flex; align-items: flex-start; gap: 0.4rem; }   /* top-align so the name sits level with the headline numbers, not centred in the 2-line row */
.ik-rpt-tsp-icon { width: 1.05rem; height: 1.05rem; flex: 0 0 auto; opacity: 0.85; }
.ik-rpt-tsp-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ik-rpt-tsp-click { cursor: pointer; }
.ik-rpt-tsp-click:hover .ik-rpt-tsp-name { text-decoration: underline;
  text-decoration-color: var(--ik-accent, #cf6819); text-underline-offset: 2px; }
.ik-rpt-tc { text-align: right; padding: 0.45rem 0.55rem; vertical-align: top; white-space: nowrap; }
.ik-rpt-tc-v { display: flex; align-items: baseline; justify-content: flex-end; gap: 0.3rem; font-size: 1.05rem; font-weight: 700; line-height: 1.2; }
.ik-rpt-tc .ik-rpt-se { display: block; margin-top: 0.05rem; }   /* the RAI/TN/RTI detail on its OWN line under the headline number */
.ik-rpt-tc-na { color: var(--bs-secondary-color, #adb5bd); font-weight: 400; }
/* A drillable cell carries a persistent "›" and tints on hover — "prove this number". */
.ik-rpt-tc-click { cursor: pointer; }
.ik-rpt-tc-click .ik-rpt-tc-v::after { content: "›"; margin-left: 0.15rem; opacity: 0.35; font-weight: 700; }
.ik-rpt-tc-click:hover { background: color-mix(in srgb, var(--ik-accent, #cf6819) 10%, transparent); }
.ik-rpt-tc-click:hover .ik-rpt-tc-v::after { opacity: 0.8; }
/* Mobile: the 5rem group label steals width from an already-tight 4-column table, so stack it ABOVE the
   table (full width for the table), and tighten the type + padding. The wrapper still scrolls if needed. */
@media (max-width: 640px) {
  .ik-rpt-ov-role { flex-direction: column; gap: 0.15rem; margin-bottom: 0.8rem; }
  .ik-rpt-ov-rolek { flex: none; padding-top: 0; }
  .ik-rpt-sptable { font-size: 0.8rem; }
  .ik-rpt-th, .ik-rpt-tc { padding: 0.4rem 0.35rem; }
  .ik-rpt-tsp { padding-left: 0.5rem; }
  .ik-rpt-tc-v { font-size: 0.95rem; }
}
/* Locality caveat — a group that shares a name with a locality omits devices on that ground assigned to
   other groups (see zr_locality_note). An info banner, amber accent, sits just under the header. */
.ik-rpt-locality-note { display: flex; align-items: baseline; gap: 0.5rem; margin: -2px 0 12px;
  padding: 0.5rem 0.7rem; font-size: 0.86rem; line-height: 1.4;
  border: 1px solid color-mix(in srgb, #cf6819 35%, transparent); border-left-width: 3px;
  border-radius: 0.4rem; background: color-mix(in srgb, #cf6819 8%, transparent); }
.ik-rpt-locality-note .fa, .ik-rpt-locality-note svg { color: var(--ik-accent, #cf6819); flex: 0 0 auto; }

/* Map section — a device + boundary locator for the place, spotlighting the selected one. */
.ik-rpt-map { border: 1px solid var(--bs-border-color, #dee2e6); border-radius: 0.5rem; overflow: hidden; }

/* Pick-a-reserve empty state — mirrors the "All data" period note (selection.css). */
.ik-rpt-ov-empty { border: 1px dashed var(--bs-border-color, #dee2e6); border-radius: 0.5rem; padding: 1rem 1.1rem; max-width: 46rem; margin-top: 0.4rem; }
.ik-rpt-ov-empty-h { font-size: 1.05rem; font-weight: 700; margin-bottom: 0.3rem; }
.ik-rpt-ov-empty p { color: var(--bs-secondary-color, #6c757d); font-size: 0.9rem; margin: 0.3rem 0; }
.ik-rpt-ov-empty-hint { font-size: 0.82rem !important; }

/* ── Clickable table rows (the cross-report "strip" pattern) ────────────────────────────────────
   Shared by the EP report's "How this EP compares" and the Place report's "Protected areas" strip:
   both are a short table where a row is a doorway to another report. Defined HERE rather than in
   ep_report.css because both pages link this file, so the two strips cannot drift apart. */
.ik-rpt-rowlink { cursor: pointer; }
.ik-rpt-rowlink:hover { background: color-mix(in srgb, var(--ik-accent, #cf6819) 12%, transparent); }
.ik-rpt-rowlink .ik-rpt-tsp-name { text-decoration: underline; text-decoration-style: dotted;
  text-decoration-color: var(--ik-accent, #cf6819); text-underline-offset: 2px; }
.ik-rpt-rowself { background: color-mix(in srgb, var(--ik-accent, #cf6819) 9%, transparent); font-weight: 700; }
.ik-rpt-strip-wrap { overflow-x: auto; }
