/* Moderation overflow menu + report modal */
.kagn-mod-menu-btn { background:none; border:none; cursor:pointer; padding:6px; font-size:18px; line-height:1; color:#666; border-radius:6px; }
.kagn-mod-menu-btn:hover { background:rgba(0,0,0,0.06); }
/* z-index above the sighting-view modal overlay (z-index:10000) — the menu and
   report dialog attach to document.body, so they must outrank any open modal or
   they render hidden behind it. */
.kagn-mod-menu { position:absolute; z-index:10050; background:#fff; border:1px solid #e2e2e2; border-radius:10px; box-shadow:0 6px 24px rgba(0,0,0,0.12); min-width:180px; padding:6px; }
.kagn-mod-menu button { display:block; width:100%; text-align:left; background:none; border:none; padding:10px 12px; border-radius:6px; cursor:pointer; font-size:14px; color:#1a3a2a; }
.kagn-mod-menu button:hover { background:#f4f2ee; }
.kagn-mod-menu button.danger { color:#b3261e; }
.kagn-mod-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.45); z-index:10100; display:flex; align-items:center; justify-content:center; padding:16px; }
.kagn-mod-dialog { background:#fff; border-radius:16px; max-width:420px; width:100%; padding:20px; }
.kagn-mod-dialog h3 { margin:0 0 12px; font-size:18px; color:#1a3a2a; }
.kagn-mod-dialog label { display:block; margin:8px 0; font-size:14px; }
.kagn-mod-dialog textarea { width:100%; min-height:70px; margin-top:8px; border:1px solid #ddd; border-radius:8px; padding:8px; font-family:inherit; }
.kagn-mod-actions { display:flex; gap:8px; justify-content:flex-end; margin-top:16px; }
.kagn-mod-actions button { padding:10px 16px; border-radius:8px; border:none; cursor:pointer; font-size:14px; }
.kagn-mod-actions .primary { background:#1a3a2a; color:#fff; }
.kagn-mod-actions .secondary { background:#ece9e3; color:#1a3a2a; }

/* --- Per-context placement of the ⋯ trigger ---
   The wrappers below previously had no CSS, so the ⋯ rendered in normal flow
   (tiny, grey, below the card) and was effectively undiscoverable — a problem
   for App Store guideline 1.2 review. Place it as a clear, tappable control. */

/* Community feed tiles: top-right circular overlay, matching .feed-tile-badge.
   Verified tick lives top-LEFT, so no collision. */
.feed-tile-mod { position:absolute; top:6px; right:6px; z-index:3; }
.feed-tile-mod .kagn-mod-menu-btn {
    width:28px; height:28px; padding:0;
    display:inline-flex; align-items:center; justify-content:center;
    background:rgba(0,0,0,0.6); color:#fff; border-radius:50%;
    box-shadow:0 1px 3px rgba(0,0,0,0.35);
}
.feed-tile-mod .kagn-mod-menu-btn:hover { background:rgba(0,0,0,0.78); }
/* When a media-type badge is also present (video/audio tiles), shift it left so
   both stay visible at the top-right. */
.feed-tile:has(.feed-tile-mod) .feed-tile-badge { right:40px; }

/* People rows + sighting-view community cards: push the ⋯ to the row's end,
   vertically centred, with a tap target the reviewer can actually hit. */
.people-row-mod, .sighting-view-cc-mod { margin-left:auto; display:inline-flex; align-items:center; }
.people-row-mod .kagn-mod-menu-btn,
.sighting-view-cc-mod .kagn-mod-menu-btn { min-width:32px; min-height:32px; display:inline-flex; align-items:center; justify-content:center; }
