/* ============================================================
   Cookie 同意横幅样式（配合 assets/js/analytics.js）
   ============================================================ */
.cookie-bar {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 900;
  padding: 0 var(--gutter, 24px) var(--sa-b, 0px);
  pointer-events: none;
  animation: cookieBarIn .32s ease both;
}
.cookie-bar__box {
  pointer-events: auto;
  max-width: 880px;
  margin: 0 auto var(--sp-5);
  display: flex;
  align-items: center;
  gap: var(--sp-5);
  padding: var(--sp-4) var(--sp-5);
  background: #fff;
  border: 1px solid rgba(15, 23, 42, .10);
  border-radius: 14px;
  box-shadow: 0 12px 36px rgba(15, 23, 42, .16);
}
.cookie-bar__txt { flex: 1 1 auto; min-width: 0; }
.cookie-bar__txt strong { display: block; font-size: var(--fs-15, 15px); margin-bottom: 4px; }
.cookie-bar__txt p {
  margin: 0;
  font-size: var(--fs-13, 13px);
  line-height: 1.65;
  color: #475569;
}
.cookie-bar__btns {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: var(--sp-3);
}
.cookie-bar__link {
  font-size: var(--fs-13, 13px);
  color: #64748b;
  text-decoration: underline;
  white-space: nowrap;
}
.cookie-bar__btn {
  min-height: 44px;
  padding: 0 20px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: var(--c-accent, #ff6a00);
  color: #fff;
  font-size: var(--fs-14, 14px);
  font-family: inherit;
  cursor: pointer;
  white-space: nowrap;
}
.cookie-bar__btn--ghost {
  background: transparent;
  border-color: rgba(15, 23, 42, .16);
  color: #334155;
}
@keyframes cookieBarIn {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* 窄屏：竖排堆叠，按钮整行 */
@media (max-width: 760px) {
  .cookie-bar__box {
    flex-direction: column;
    align-items: stretch;
    gap: var(--sp-4);
    margin-bottom: calc(var(--m-tab-h, 58px) + var(--sa-b, 0px) + 10px);
    padding: var(--sp-4);
  }
  .cookie-bar__btns { justify-content: flex-end; flex-wrap: wrap; }
  .cookie-bar__link { margin-right: auto; align-self: center; }
  .cookie-bar__btn { flex: 0 1 auto; padding: 0 18px; }
}
/* ============================================================
   遮挡补偿：横幅是 position:fixed 悬浮层，会压住页脚底部内容。
   analytics.js 在打开横幅时给 <html>/<body> 加 .has-cookie-bar。

   ⚠️ 设计取舍（重要，别再过拟合）：横幅是**必须交互才能关闭**的对话框，
   被它压住的页脚内容在用户点「同意/拒绝」后立刻可见 —— 这是所有主流网站
   的标准做法，不构成可用性缺陷。本段只做一件事：**在横幅打开期间，
   给页面底部额外留出与横幅等高的空间**，让「滚到底」时尽可能少遮挡，
   并在关闭后**完全回收**（不留残余留白）。

   反面教训：曾试图用 scroll-padding-bottom 做到「滚动到底页脚完全不被压」，
   但 scroll-padding 只作用于 scrollIntoView / 锚点跳转，
   对 scrollTo(scrollHeight) 这类程序化滚动无效 —— 做不到，且会引入
   与 mobile.css:53 既有 tabbar 留白的层叠冲突，故放弃。
   ============================================================ */
body.has-cookie-bar {
  /* 与 mobile.css:53 的 tabbar 留白取 max，避免叠加成双倍空白。
     mobile.css 的 tabbar 留白 = var(--m-tab-h) + var(--m-safe-b) + 12px。 */
  padding-bottom: max(
    calc(var(--m-tab-h, 58px) + var(--m-safe-b, 0px) + 12px),
    calc(var(--m-tab-h, 58px) + var(--m-safe-b, 0px) + var(--cookie-h-sm, 200px))
  );
}
@media (min-width: 761px) {
  body.has-cookie-bar {
    padding-bottom: var(--cookie-h, 220px);
  }
}