/* Browse kit — the pieces last13's /auctions, /buybacks and /tournaments
 * cards share (the "how it works" steps under the page head went 2026-10-09):
 * the seller-chip placement, the copy-link button and the follow heart. Every class is
 * sf-brw-*. The chip, shop popup and TEST stamp are the shared partials
 * (partials/{shop-chip,shop-popup,test-stamp}, pkg-cards.*). Markup:
 * storefront/auctions/{_shop-chip,_stamp} + the three index pages.
 * Behaviour: js/pkg-browse.js. Area-specific cards live in
 * pkg-auctions.css / pkg-buybacks.css / pkg-tournaments.css. */

/* ---------- Seller (the chip + popup themselves are the shared
 * partials/shop-chip + shop-popup, styled in pkg-cards.css — so is its spot on
 * a card's art, top-left like every tile's, and the tournaments' "จัดโดย" pill) ---------- */
.sf-tag.sf-brw-ok { border-color: #3ee8a088; color: #3ee8a0; font-family: 'Noto Sans Thai', sans-serif; letter-spacing: 0; }

/* ---------- Copy-link button (next to a detail title) ---------- */
.sf-brw-copy { display: inline-grid; place-items: center; width: 34px; height: 34px; margin-left: 6px; vertical-align: middle; border: 1px solid #ffffff24; color: var(--v2-muted); transition: color .2s, border-color .2s; }
.sf-brw-copy .icon { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.sf-brw-copy:hover, .sf-brw-copy.is-copied { color: var(--v2-accent); border-color: #00f0ff66; }

/* ---------- Follow heart ---------- */
.sf-brw-fav { flex: 0 0 44px; width: 44px; min-height: 44px; display: grid; place-items: center; color: var(--v2-muted); border: 1px solid #ffffff2e; background: transparent; transition: color .2s, border-color .2s, background .2s; }
.sf-brw-fav .icon { width: 18px; height: 18px; }
.sf-brw-fav:hover { color: #ff5c9d; border-color: #ff006e88; }
.sf-brw-fav.is-on { color: #fff; background: var(--v2-pink); border-color: var(--v2-pink); }
.sf-brw-fav.is-on .icon { fill: currentColor; }
.sf-brw-fav[disabled] { opacity: .6; }

/* ---------- Phone ---------- */
@media (max-width: 680px) {
  .sf-brw-fav { flex-basis: 38px; width: 38px; min-height: 38px; }
}