/* ===========================================================
   BOYAN 交互层 —— 滚动入场 / 首屏逐词 / 悬停 / 反馈
   设计原则：JS 未加载时内容完全可见（渐进增强）
   =========================================================== */

/* ---------- 1. 滚动入场 ---------- */
.pap-js .pap-reveal{
  opacity:0;
  transform:translateY(26px);
  transition:opacity .7s cubic-bezier(.22,.61,.36,1), transform .7s cubic-bezier(.22,.61,.36,1);
  will-change:opacity, transform;
}
.pap-js .pap-reveal.is-in{
  opacity:1;
  transform:none;
}

/* ---------- 2. 首屏标题逐词 ---------- */
.pap-hero-word{
  display:inline-block;
  opacity:0;
  transform:translateY(18px) rotate(-1.2deg);
  filter:blur(4px);
  transition:opacity .65s cubic-bezier(.22,.61,.36,1),
             transform .65s cubic-bezier(.22,.61,.36,1),
             filter .65s cubic-bezier(.22,.61,.36,1);
}
.pap-hero-word.is-in{
  opacity:1;
  transform:none;
  filter:blur(0);
}

/* ---------- 3. 页头滚动阴影 ---------- */
.ct-header{ transition:box-shadow .3s ease, background-color .3s ease; }
.ct-header.pap-scrolled{
  box-shadow:0 6px 26px rgba(35,32,28,.11);
  background:rgba(255,255,255,.96);
  backdrop-filter:saturate(1.4) blur(8px);
}

/* ---------- 4. 产品卡 / 分类卡悬停增强 ---------- */
ul.products li.product .woocommerce-LoopProduct-link{ overflow:hidden; }
ul.products li.product img{
  transition:transform .55s cubic-bezier(.22,.61,.36,1);
}
ul.products li.product:hover img{ transform:scale(1.06); }

.bs-why-card, .bs-step, .bs-trust-item{
  transition:transform .3s cubic-bezier(.22,.61,.36,1), box-shadow .3s ease, border-color .3s ease;
}
.bs-trust-item:hover .ic{ background:#2E5E4E; }
.bs-trust-item .ic{ transition:background .3s ease; }
.bs-trust-item:hover .ic svg{ fill:#fff; }
.bs-trust-item .ic svg{ transition:fill .3s ease; }

.bs-why-card:hover{ border-color:#DCCFB8; }

/* ---------- 5. 按钮按压回弹 ---------- */
.bs-btn, .bs-btn-ghost, .bs-btn-light, .bs-btn-out,
.wp-block-button__link, .woocommerce a.button, .woocommerce button.button,
button.single_add_to_cart_button, .wc-block-components-button{
  transition:background-color .25s ease, transform .18s cubic-bezier(.22,.61,.36,1), box-shadow .25s ease;
}
.bs-btn:active, .bs-btn-ghost:active, .bs-btn-light:active, .bs-btn-out:active,
.woocommerce a.button:active, .woocommerce button.button:active,
button.single_add_to_cart_button:active{
  transform:translateY(1px) scale(.985);
}

/* 加购中状态 */
button.single_add_to_cart_button.pap-loading{
  opacity:.75;
  pointer-events:none;
  position:relative;
}
button.single_add_to_cart_button.pap-loading::after{
  content:'';
  display:inline-block;
  width:12px; height:12px;
  margin-left:9px;
  border:2px solid rgba(255,255,255,.45);
  border-top-color:#fff;
  border-radius:50%;
  vertical-align:-1px;
  animation:pap-spin .7s linear infinite;
}
@keyframes pap-spin{ to{ transform:rotate(360deg); } }

/* ---------- 6. 加购提示 toast ---------- */
.pap-toast{
  position:fixed;
  right:22px; bottom:22px;
  z-index:99999;
  display:flex; align-items:center; gap:10px;
  background:#23201C; color:#FAF7F1;
  padding:14px 20px;
  border-radius:12px;
  box-shadow:0 16px 40px rgba(35,32,28,.28);
  font-size:.92rem; font-weight:500;
  opacity:0; transform:translateY(14px) scale(.97);
  transition:opacity .32s cubic-bezier(.22,.61,.36,1), transform .32s cubic-bezier(.22,.61,.36,1);
  pointer-events:none;
}
.pap-toast.is-on{ opacity:1; transform:none; }
.pap-toast .tick{
  width:20px; height:20px; flex:none; border-radius:50%;
  background:#2E5E4E; display:flex; align-items:center; justify-content:center;
}
.pap-toast .tick svg{ width:12px; height:12px; fill:#fff; }
.pap-toast a{ color:#B08D57; text-decoration:underline; margin-left:4px; }

/* ---------- 7. 回到顶部 ---------- */
.pap-top{
  position:fixed;
  right:22px; bottom:22px;
  width:44px; height:44px;
  border-radius:50%;
  background:#fff;
  border:1px solid #EFE9DF;
  box-shadow:0 10px 26px rgba(35,32,28,.14);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
  opacity:0; transform:translateY(12px); pointer-events:none;
  transition:opacity .3s ease, transform .3s cubic-bezier(.22,.61,.36,1), background .3s ease;
  z-index:9998;
}
.pap-top.is-on{ opacity:1; transform:none; pointer-events:auto; }
.pap-top:hover{ background:#2E5E4E; }
.pap-top:hover svg{ fill:#fff; }
.pap-top svg{ width:16px; height:16px; fill:#2E5E4E; transition:fill .25s ease; }
.pap-toast.is-on ~ .pap-top{ bottom:84px; }

/* ---------- 8. 图片加载淡入 ---------- */
.pap-js img.pap-imgfade{ opacity:0; transition:opacity .5s ease; }
.pap-js img.pap-imgfade.is-in{ opacity:1; }

/* ---------- 9. 购物车 / 结算表单聚焦 ---------- */
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.wc-block-components-text-input input:focus{
  border-color:#2E5E4E !important;
  box-shadow:0 0 0 3px rgba(46,94,78,.13) !important;
}

/* ---------- 10. 无障碍：尊重减少动效 ---------- */
@media (prefers-reduced-motion: reduce){
  .pap-js .pap-reveal,
  .pap-hero-word{
    opacity:1 !important; transform:none !important; filter:none !important;
    transition:none !important;
  }
  ul.products li.product img,
  .bs-btn, .bs-btn-ghost, .bs-btn-light, .bs-btn-out{ transition:none !important; }
  ul.products li.product:hover img{ transform:none; }
  .pap-toast, .pap-top{ transition:none !important; }
}

/* 触屏设备：悬停效果常显一点，避免"点了没反应" */
@media (hover: none){
  ul.products li.product:hover{ transform:none; }
}
