/* ==========================================================================
   assets/css/page-pin.css — Pin page + Share sheet (Brutal Lite v3.1 strict, builder B3)
   Owner: pin.php, partials/share_sheet.php, and the "pin" parts of lite-place.css.
   Reference: lite5/pin-page-preview.html, lite5/share-sheet-preview.html.
   Loaded AFTER lite-place.css — only small corrections so the live page matches the
   reference exactly; no tokens/colours/radii/shadows changed.
   ========================================================================== */

/* reference place-h1 is 24px (rules §3: "24-26px / 800, copy reference") — lite-place.css
   had 23px from an earlier pass. */
body.lite .pg-h1{ font-size:24px; }

/* reference creator row (pin-page-preview.html .creator-head): avatar + name/sub, then a
   real outline Follow BUTTON at the row's end — not inline coloured text next to the
   handle. pin.php now calls radar_chip(..., asText:false) and places the chip as a
   trailing sibling of .pg-creator-info (which is flex:1, so this sits at the row's end
   automatically); this restyles whatever radar_chip() renders (old .btn--blue/.btn--ghost
   classes) to the v3.1 .btn-sm.btn-line look, keeping the real follow/unfollow form as-is. */
body.lite .pg-creator-head{ align-items:center; }
body.lite .pg-creator-head form{ flex:0 0 auto; }
body.lite .pg-creator-head .btn--blue,
body.lite .pg-creator-head .btn--ghost,
body.lite .pg-creator-head .follow-txt{
  height:32px; padding:0 11px; border-radius:9px; font:700 12.5px/1 var(--font-ui);   /* v222: was 40px / 13.5px */
  background:#fff!important; color:var(--ink)!important; border:1.5px solid var(--ink)!important;
  box-shadow:none!important; display:inline-flex; align-items:center; gap:4px; text-decoration:none;
}
body.lite .pg-creator-head .btn--blue i,
body.lite .pg-creator-head .btn--ghost i{ font-size:14px; }
body.lite .pg-creator-head .btn--ghost.is-on,
body.lite .pg-creator-head .follow-txt.is-on{ background:var(--card-2)!important; }

/* reference .offer-fine: small muted line under the offer title ("Show this screen at the
   counter · till 31 Oct") — the inline card's "Get code" button links to the real ticket
   page (offer-code.php) instead of revealing the code inline. */
body.lite .coupon__fine{font:600 11px/1.2 var(--font-ui);color:var(--muted);margin-top:3px;}

/* map-wrap background: rules §6.8 "mini map bg #f2f3f5" — lite-place.css's .pg-map already
   uses var(--card-2) which equals #f2f3f5, so this just confirms it (no change needed if
   the token already resolves there; kept explicit for clarity/audit). */
body.lite .pg-map{ background:#f2f3f5; }

/* ---------- share sheet: bring the existing share-sheet classes fully in line with the
   reference (lite5/share-sheet-preview.html) — same markup/JS hooks, visual only ---------- */
body.lite .share-sheet{ padding-top:8px; }
body.lite .share-title{ margin-bottom:12px; }
/* reference's circular share targets use real brand colours for the ones Social Mapia can
   actually open (WhatsApp green); Copy link / Download / More stay calm/ink per the existing
   tokens already in lite-place.css. No Instagram/Snapchat icon is added here — see
   brutal-lite-work/LEFT-OUT.md for why. */
body.lite .share-opt-thumb{ max-height:170px; }

/* the grey bar at the photo's bottom (found via elementsFromPoint, coordinator's probe):
   #galHit/.pinA__scrim (z-index:3, brutal.css) spans the FULL hero with inset:0 and fades
   to near-opaque dark at its own bottom — meant to darken a full-bleed photo for white
   overlay text in the old layout. .pg-title (z-index:2) now overlaps the hero's bottom
   20px with a white rounded sheet, so the scrim's dark bottom edge painted OVER that white
   corner. Stop the scrim 20px above the hero's bottom (clear of the overlap) instead of
   raising .pg-title's z-index, so the darkening still fully covers the visible photo and
   #galHit stays exactly as tall as the tappable photo area (no dead strip under the
   sheet). Excluded from the full-screen reel view, which sets its own z-index:8 + a
   different gradient on this same element. Colour corrected from the old warm ink
   (22,19,16) to the current --ink token (20,21,24). */
body.lite:not(.is-reelfs) .pg-hero .pinA__scrim{
  inset:auto 0 20px 0;
  background:linear-gradient(to top, rgba(20,21,24,.94), rgba(20,21,24,.28) 44%, transparent 68%);
}