/* ============================================================================
   COMPONENT: THEME TOGGLE SCROLL SYNC
   描述：在移动端，当用户上滑时，让 theme-toggle 物理跟手上滑并藏入汉堡菜单下方
   仅在特定页面引入，防止污染不需要此特性的页面（如 portfolio.html）
   ============================================================================ */

/* --- 状态 3：全屏菜单被打开时 (接管控制权) --- */
@media (max-width: 768px) {
  /* 移除基础状态下的 transform 过渡，实现 0 延迟的 1:1 物理跟手滑动！ */
  .theme-toggle {
    transition: opacity 0.2s ease;
  }

  body.menu-is-open .theme-toggle {
    /* 强制重置为原位，无视 JS 计算的 scroll 偏移 */
    transform: translateY(0) !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    /* 加入带有 Q 弹效果的过渡动画，延迟一小点等背景先出来 */
    transition: transform 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) 0.1s, opacity 0.4s ease 0.1s !important;
  }

  body.menu-is-closing .theme-toggle {
    /* 菜单关闭时，保持 transition 动画存在，让按钮平滑地倒退回 JS 计算的位置 */
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.4s ease !important;
  }
}