/* trap_hero.css — "Top traps" view: title, lead, controls row, the map + ranked table. */
.ik-hero-title { margin: 0 0 0.1rem; }
.ik-hero-lead { color: var(--bs-secondary-color, #6c757d); font-size: 0.9rem; margin: 0.2rem 0 0.7rem; max-width: 60rem; }
.ik-hero-controls { display: flex; align-items: end; gap: 1.2rem; flex-wrap: wrap; margin: 0.4rem 0 0.6rem; }
.ik-hero-note { color: var(--bs-secondary-color, #6c757d); font-size: 0.85rem; margin: 0.2rem 0 0.5rem; }
.ik-hero .leaflet-container { border: 1px solid var(--bs-border-color, #dee2e6); border-radius: 0.375rem;
  margin-bottom: 0.9rem; }

/* Clickable data rows (Saturation) — see the note in trapping.css; .ik-row-link itself is defined there
   and both pages load it, so only the per-table cursor rule belongs here. */
#trap_hero-sat_table table.dataTable tbody tr { cursor: pointer; }

/* The Saturation tab's own Period chip. It has to ride in selection_ui's chip_extra (the only hook for a
   module-contributed chip), which always renders LAST in the bar — so pull it back to the front, or Period
   would read after the place chip on this one tab and before it on every other. The shared Period chip is
   withdrawn here (period_show_js), so the two never both show; every other chip keeps the default order:0
   and therefore its DOM order.
   ORDER GOES ON THE CHIP, NOT THE conditionalPanel WRAPPER: a SHOWN wrapper computes display:contents
   (Shiny's own rule), so it is transparent to flex and the FLEX ITEM is the chip inside it — `order` on
   the wrapper is silently ignored. Same trick the spatial explorer's pane row relies on. */
.ik-hero .ik-scope-bar .ik-hero-satperiod > .ik-scope-chip { order: -1; }