/* 每行 3 个，但第一行只放 2 个（2+3+3+3+…）：用 6 列网格，前两个各占 3 列、
   其余各占 2 列。平台数量由后端 OAUTH_PLATFORMS 决定，这里只管排布，不改数量。 */
.social-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 8px;
  margin-top: 4px;
}

.social-grid .btn-social { grid-column: span 2; }
.social-grid .btn-social:nth-child(-n + 2) { grid-column: span 3; }

.btn-social {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  padding: 10px 4px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface);
  color: var(--text-sub);
  cursor: pointer;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.2;
  transition: border-color .15s, box-shadow .15s, background .15s;
  --icon-size: 22px;
}

.btn-social:hover {
  border-color: var(--blue);
  background: var(--brand-surface-subtle);
  box-shadow: 0 0 0 2px var(--brand-surface);
}

.btn-social:disabled { opacity: .45; cursor: not-allowed; }
.btn-social i { font-size: var(--icon-size); }

.social-loading {
  padding: 8px 0;
  color: var(--text-muted);
  font-size: 13px;
  text-align: center;
}

.weixin-web-login { text-align: center; }

/* 「微信扫码」面板按 UA 分三态（面板 data-env，由 weixin-scan-env.js 写入）：
   desktop       从上到下——小程序码、提示词、示意视频（循环自动播放、无控制条，
                 源按深浅主题切换，见 weixin-scan-guide-video.js）；
   wechat-mobile 从上到下——小程序码、长按文字引导；不显示示意视频（手机里扫不了码）；
   mobile        只显示「请使用微信进入本系统」兜底文案。 */
.weixin-scan {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
}

#weixinWebLoginPanel[data-env="mobile"] .weixin-scan { display: none; }

.weixin-scan-code { width: min(200px, 100%); }

.weixin-scan-code img,
.weixin-web-login-refresh {
  width: 100%;
  aspect-ratio: 1;
}

.weixin-scan-code img { object-fit: contain; }
.weixin-scan-code img[src*="loading.svg"] { max-width: 100px; aspect-ratio: auto; }

/* 示意视频：竖屏手机界面，限宽 260px 防止面板过高；无控制条/自动循环由 HTML 属性保证 */
.weixin-scan-guide-video {
  display: block;
  width: min(260px, 100%);
  height: auto;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
}

/* display:block 会盖过 [hidden] 的 UA 样式，显式补回隐藏规则；
   手机微信环境不显示视频（JS 也会置 hidden，双保险） */
.weixin-scan-guide-video[hidden],
#weixinWebLoginPanel[data-env="wechat-mobile"] .weixin-scan-guide-video { display: none; }

.weixin-scan-blocked {
  margin: 0;
  padding: 28px 0;
  color: var(--text-muted);
  font-size: 14px;
}

html[data-bs-theme="dark"] .weixin-web-login img.is-ready {
  filter: url(#weixinCodeBlackToWhite);
}

.weixin-web-login-refresh {
  border: 1px solid var(--blue);
  border-radius: 10px;
  background: var(--surface);
  color: var(--blue);
}

.weixin-web-login-hint {
  display: block;
  width: 100%;
  margin: 10px 0 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--text-muted);
  cursor: pointer;
  font-size: 12px;
  line-height: 1.6;
}

.weixin-web-login-hint:disabled { cursor: default; }