/* 分享层（活动详情 / 机构详情共用）
   —— 底部动作面板 + 微信内右上角引导 + 海报 + 轻提示
   设计参考 qa/styles.css 的分享层，独立成文件是为了让活动/机构模块不依赖 qa 的样式表。
   所有颜色写死（不依赖宿主页的 CSS 变量），换页面接入零改色。 */

.sc-mask {
  position: fixed; inset: 0; z-index: 100001; background: rgba(20, 24, 33, .46);
  display: flex; align-items: flex-end; justify-content: center;
  opacity: 0; transition: opacity .2s; backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
}
.sc-mask.show { opacity: 1; }
.sc-panel {
  width: 100%; max-width: 460px; background: #fff;
  border-radius: 18px 18px 0 0; padding: 20px 18px calc(18px + env(safe-area-inset-bottom));
  transform: translateY(14px); transition: transform .22s;
}
.sc-mask.show .sc-panel { transform: translateY(0); }
.sc-title { font-size: 15px; font-weight: 600; text-align: center; color: #1f2329; }
.sc-note { font-size: 12px; color: #8a94a6; text-align: center; margin: 6px 0 16px; line-height: 1.6; }
.sc-acts { display: flex; flex-direction: column; gap: 8px; }
.sc-act {
  display: flex; align-items: center; gap: 12px; width: 100%; font-family: inherit;
  padding: 12px 14px; border: 1px solid #eceef1; border-radius: 12px;
  background: #fff; cursor: pointer; text-align: left; transition: .15s;
}
.sc-act:hover { border-color: #e8a33d; background: #fffaf0; }
.sc-act .sc-ic { font-size: 20px; line-height: 1; }
.sc-act .sc-tx { display: flex; flex-direction: column; gap: 2px; }
.sc-act .sc-tx b { font-size: 14px; font-weight: 600; color: #1f2329; }
.sc-act .sc-tx i { font-style: normal; font-size: 12px; color: #8a94a6; }
.sc-cancel {
  width: 100%; margin-top: 12px; padding: 12px; font-family: inherit; font-size: 14px;
  border: none; border-radius: 12px; background: #f5f6f8; color: #4a4f5a; cursor: pointer;
}
.sc-panel.busy { pointer-events: none; opacity: .7; }

/* 微信内置浏览器引导：普通网页唤不起微信分享菜单，只能指向右上角 */
.sc-wxguide {
  position: fixed; inset: 0; z-index: 100004; background: rgba(0, 0, 0, .74);
  color: #fff; opacity: 0; transition: opacity .2s;
}
.sc-wxguide.show { opacity: 1; }
.sc-wxarrow { position: absolute; top: 6px; right: 20px; font-size: 48px; line-height: 1; }
.sc-wxtip { position: absolute; top: 76px; right: 14px; text-align: right; max-width: 78%; }
.sc-wxtip b { display: block; font-size: 17px; }
.sc-wxtip span { display: block; font-size: 13.5px; opacity: .85; margin-top: 8px; line-height: 1.7; }

/* 海报 */
.sc-poster-mask {
  position: fixed; inset: 0; z-index: 100002; background: rgba(12, 16, 26, .88);
  display: flex; align-items: center; justify-content: center; padding: 18px;
  opacity: 0; transition: opacity .2s;
}
.sc-poster-mask.show { opacity: 1; }
.sc-poster-wrap { display: flex; flex-direction: column; align-items: center; gap: 12px; max-height: 100%; }
.sc-poster-tip { color: rgba(255, 255, 255, .82); font-size: 12.5px; }
.sc-poster-holder { max-height: 74vh; overflow: auto; border-radius: 14px; }
.sc-poster-loading {
  color: rgba(255, 255, 255, .72); font-size: 13px; padding: 60px 40px;
  background: rgba(255, 255, 255, .06); border-radius: 14px;
}
.sc-poster-img { display: block; width: 100%; max-width: 332px; border-radius: 14px; }
.sc-poster-close {
  padding: 8px 26px; border: 1px solid rgba(255, 255, 255, .32); border-radius: 999px;
  background: transparent; color: #fff; font-size: 13px; font-family: inherit; cursor: pointer;
}

/* 轻提示 */
.sc-toast {
  position: fixed; left: 50%; bottom: 96px; transform: translate(-50%, 8px);
  z-index: 100005; max-width: 76vw; padding: 10px 18px; border-radius: 999px;
  background: rgba(20, 24, 33, .92); color: #fff; font-size: 13px; line-height: 1.5;
  opacity: 0; pointer-events: none; transition: opacity .2s, transform .2s;
}
.sc-toast.show { opacity: 1; transform: translate(-50%, 0); }

/* 头部右上角分享按钮 */
.sharebtn {
  margin-left: auto; flex-shrink: 0; display: inline-flex; align-items: center; gap: 5px;
  padding: 6px 13px; border-radius: 999px; cursor: pointer; font-family: inherit;
  font-size: 13px; font-weight: 600; color: #b8791b;
  background: #fff7e8; border: 1px solid #f0dcb4;
  -webkit-tap-highlight-color: transparent; transition: .15s;
}
.sharebtn:hover { background: #fff1d8; border-color: #e8a33d; }
.sharebtn:active { transform: translateY(1px); }
.sharebtn svg { display: block; }