/*
Theme Name: Yuke Blocksy Child v3
Theme URI: https://yukediy.com
Description: Yuke DIY 站点视觉层。依赖 Blocksy 父主题，只做样式与少量功能增强。
Author: Yuke DIY
Template: blocksy2
Version: 1.0.0
Text Domain: yuke
*/

/* ============================================================
   1. 设计变量
   ============================================================ */
:root{
  --yuke-paper:#FAF7F2;
  --yuke-card:#FFFFFF;
  --yuke-ink:#2A2622;
  --yuke-ink-2:#6B6259;
  --yuke-ink-3:#9A9086;
  --yuke-terracotta:#B65C38;
  --yuke-terracotta-soft:#F6EAE3;
  --yuke-pine:#2C463A;
  --yuke-pine-soft:#EEF3EF;
  --yuke-line:#E8E1D8;
  --yuke-gold:#D98E2B;
  --yuke-radius:12px;
}

body{
  background:var(--yuke-paper);
  color:var(--yuke-ink);
  font-feature-settings:"kern" 1;
  -webkit-font-smoothing:antialiased;
}

h1,h2,h3,h4,.ct-heading{
  letter-spacing:-.01em;
  color:var(--yuke-ink);
}

/* ============================================================
   2. 顶部公告栏
   ============================================================ */
.yuke-announce{
  background:var(--yuke-pine);
  color:#fff;
  text-align:center;
  font-size:12.5px;
  padding:9px 12px;
  letter-spacing:.01em;
}
.yuke-announce b{font-weight:600}

/* ============================================================
   3. 商品页布局
   ============================================================ */
.single-product div.product{
  display:grid;
  gap:22px;
}

/* 图库圆角与底色 */
.single-product .woocommerce-product-gallery{
  border-radius:var(--yuke-radius);
  overflow:hidden;
  background:#ECE5DB;
}
.single-product .woocommerce-product-gallery img{
  border-radius:0;
}

/* 标题 */
.single-product .product_title{
  font-size:26px;
  line-height:1.3;
  font-weight:700;
  margin-bottom:6px;
}

/* 评分行 */
.single-product .woocommerce-product-rating{
  margin-bottom:8px;
  font-size:13px;
}
.single-product .star-rating span::before,
.woocommerce .star-rating span::before{
  color:var(--yuke-gold);
}

/* 价格 */
.single-product .summary .price{
  font-size:29px;
  font-weight:800;
  letter-spacing:-.02em;
  color:var(--yuke-ink);
}
.single-product .summary .price del{
  font-size:15px;
  font-weight:400;
  color:var(--yuke-ink-3);
  opacity:1;
  margin-right:8px;
}
.single-product .summary .price ins{
  text-decoration:none;
  color:var(--yuke-ink);
}

/* 变体按钮：胶囊形，选中赤陶 */
.variations{
  width:100%;
  border:0;
  margin-bottom:14px;
}
.variations th,
.variations td{
  display:block;
  width:100%;
  border:0;
  padding:0;
}
.variations th.label label{
  font-size:12.5px;
  font-weight:600;
  color:var(--yuke-ink-2);
  letter-spacing:.04em;
  text-transform:none;
  margin-bottom:8px;
}
.variations td.value{
  margin-bottom:16px;
}
.variations select{
  display:none !important;
}

/* 由 JS 生成的色块按钮 */
.yuke-chips{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.yuke-chip{
  border:1.5px solid var(--yuke-line);
  background:#fff;
  border-radius:9px;
  padding:9px 15px;
  font-size:13.5px;
  line-height:1.25;
  color:var(--yuke-ink);
  cursor:pointer;
  transition:.18s;
  text-align:center;
  min-width:70px;
}
.yuke-chip:hover{border-color:#d3c9bc}
.yuke-chip.is-active{
  border-color:var(--yuke-terracotta);
  color:var(--yuke-terracotta);
  background:var(--yuke-terracotta-soft);
  font-weight:600;
}
.yuke-chip.is-disabled{
  opacity:.42;
  cursor:not-allowed;
  text-decoration:line-through;
}

/* 加入购物车 */
.single-product .single_add_to_cart_button{
  background:var(--yuke-terracotta);
  color:#fff;
  border:none;
  border-radius:var(--yuke-radius);
  padding:15px 28px;
  font-size:15.5px;
  font-weight:700;
  letter-spacing:.02em;
  box-shadow:0 6px 18px rgba(182,92,56,.28);
  transition:.18s;
}
.single-product .single_add_to_cart_button:hover{
  background:#A34F2E;
  transform:translateY(-1px);
}

/* 数量输入 */
.quantity input.qty{
  border:1.5px solid var(--yuke-line);
  border-radius:var(--yuke-radius);
  height:52px;
  font-size:15px;
}

/* ============================================================
   4. 送达卡（由 functions.php 注入）
   ============================================================ */
.yuke-eta{
  margin:16px 0;
  background:var(--yuke-pine-soft);
  border:1px solid #DCE7DF;
  border-radius:var(--yuke-radius);
  padding:12px 14px;
  display:flex;
  gap:10px;
  align-items:flex-start;
}
.yuke-eta__icon{
  flex:0 0 auto;
  width:17px;height:17px;
  margin-top:2px;
}
.yuke-eta__main{
  font-size:13.5px;
  font-weight:600;
  color:var(--yuke-pine);
}
.yuke-eta__sub{
  font-size:11.5px;
  color:#5E7568;
  margin-top:3px;
  line-height:1.5;
}

/* ============================================================
   5. 信任三连（由 functions.php 注入）
   ============================================================ */
.yuke-trust{
  display:flex;
  justify-content:space-between;
  gap:6px;
  margin:14px 0 4px;
  padding-top:13px;
  border-top:1px solid var(--yuke-line);
}
.yuke-trust__item{
  flex:1;
  text-align:center;
  font-size:10.5px;
  line-height:1.45;
  color:var(--yuke-ink-2);
}
.yuke-trust__item svg{display:block;margin:0 auto 4px}

/* ============================================================
   5b. 「适合谁 / 不适合谁」问答段（functions.php 注入）
   ============================================================ */
.yuke-qa{
  margin:18px 0;
  border:1px solid var(--yuke-line);
  border-radius:var(--yuke-radius);
  background:var(--yuke-card);
  padding:14px 16px;
}
.yuke-qa__title{
  font-size:13px;
  font-weight:600;
  letter-spacing:.01em;
  color:var(--yuke-ink);
  margin:0 0 8px;
}
.yuke-qa__item{
  border-top:1px solid var(--yuke-line);
}
.yuke-qa__item:first-of-type{border-top:none}
.yuke-qa__item summary{
  cursor:pointer;
  list-style:none;
  font-size:13px;
  font-weight:600;
  color:var(--yuke-terracotta);
  padding:10px 0 4px;
  position:relative;
  padding-right:22px;
}
.yuke-qa__item summary::-webkit-details-marker{display:none}
.yuke-qa__item summary::after{
  content:"+";
  position:absolute;
  right:2px;
  top:9px;
  font-weight:400;
  color:var(--yuke-ink-3);
  transition:transform .18s ease;
}
.yuke-qa__item[open] summary::after{transform:rotate(45deg)}
.yuke-qa__item p{
  font-size:12.5px;
  line-height:1.65;
  color:var(--yuke-ink-2);
  margin:0 0 10px;
}

/* 索评引导（0 评价时显示） */
.yuke-review-nudge{
  margin:14px 0;
  padding:12px 14px;
  font-size:12.5px;
  line-height:1.6;
  color:var(--yuke-ink-2);
  background:var(--yuke-terracotta-soft);
  border:1px solid #EDD9CD;
  border-radius:var(--yuke-radius);
}
.yuke-review-nudge strong{color:var(--yuke-terracotta)}

/* ============================================================
   6. 商品长描述里的内容块
   ============================================================ */
.woocommerce-Tabs-panel h2{
  font-size:17px;
  margin:24px 0 8px;
}
.woocommerce-Tabs-panel h2:first-child{margin-top:0}
.woocommerce-Tabs-panel p,
.woocommerce-Tabs-panel li{
  font-size:14px;
  line-height:1.7;
  color:#4A4239;
}
.woocommerce-Tabs-panel table{
  width:100%;
  border-collapse:collapse;
  font-size:13.5px;
  margin:10px 0 18px;
}
.woocommerce-Tabs-panel th,
.woocommerce-Tabs-panel td{
  text-align:left;
  padding:9px 0;
  border-bottom:1px solid #F0EBE3;
  vertical-align:top;
}
.woocommerce-Tabs-panel th{
  width:38%;
  font-weight:500;
  color:var(--yuke-ink-2);
}
.woocommerce-Tabs-panel tr:last-child th,
.woocommerce-Tabs-panel tr:last-child td{border-bottom:none}

/* ============================================================
   7. 商品卡片（分类页 / 首页）
   ============================================================ */
.woocommerce ul.products li.product{
  background:transparent;
}
.woocommerce ul.products li.product a img{
  border-radius:10px;
  transition:transform .35s ease;
}
.woocommerce ul.products li.product:hover a img{
  transform:scale(1.02);
}
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-size:14px;
  font-weight:600;
  padding-top:10px;
}
.woocommerce ul.products li.product .price{
  font-size:14px;
  font-weight:700;
  color:var(--yuke-terracotta);
}
.woocommerce ul.products li.product .price del{
  font-size:12px;
  font-weight:400;
  color:var(--yuke-ink-3);
  opacity:1;
}
.woocommerce ul.products li.product .price ins{
  text-decoration:none;
  color:var(--yuke-terracotta);
  font-weight:700;
}
.woocommerce ul.products li.product .button{
  background:var(--yuke-pine);
  color:#fff;
  border-radius:8px;
  font-size:12.5px;
  padding:9px 14px;
  font-weight:600;
}
.woocommerce ul.products li.product .button:hover{
  background:#22382E;
  color:#fff;
}

/* 促销角标 */
.woocommerce span.onsale{
  background:var(--yuke-terracotta);
  color:#fff;
  border-radius:6px;
  font-size:11px;
  font-weight:600;
  padding:3px 9px;
  min-height:auto;
  min-width:auto;
  line-height:1.6;
}

/* ============================================================
   7.5 首页模块
   ============================================================ */
.yuke-slider{
  position:relative;
  margin-bottom:40px;
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 18px 50px rgba(60,45,30,.08);
  background:var(--yuke-card);
}
.yuke-slider__track{
  display:flex;
  transition:transform .55s cubic-bezier(.4,0,.2,1);
  will-change:transform;
}
.yuke-slide{
  flex:0 0 100%;
  min-width:100%;
  position:relative;
  display:grid;
  grid-template-columns:1.05fr .95fr;
  align-items:center;
  min-height:460px;
}
.yuke-slide__media{
  height:100%;
  min-height:460px;
  overflow:hidden;
}
.yuke-slide__media img{
  width:100%;height:100%;object-fit:cover;display:block;
}
.yuke-slide__body{padding:42px 38px}
.yuke-hero__kicker{
  font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--yuke-terracotta);font-weight:600;margin-bottom:10px;
}
.yuke-slide h1{
  font-size:40px;line-height:1.14;letter-spacing:-.02em;
  font-weight:700;margin-bottom:14px;
}
.yuke-slide p{
  font-size:14.5px;color:var(--yuke-ink-2);line-height:1.65;
  max-width:34ch;margin-bottom:22px;
}
.yuke-slider__dots{
  position:absolute;
  left:0;right:0;bottom:16px;
  display:flex;justify-content:center;gap:8px;
  z-index:3;
  pointer-events:none;
}
.yuke-slider__dot{pointer-events:auto}
/* 桌面端：圆点只压在左侧图片上 */
@media (min-width:861px){
  .yuke-slider__dots{right:47%}
}
.yuke-slider__dot{
  width:8px;height:8px;border-radius:50%;
  background:rgba(255,255,255,.55);
  border:1px solid rgba(42,38,34,.18);
  cursor:pointer;padding:0;transition:.2s;
}
.yuke-slider__dot.is-active{
  background:var(--yuke-terracotta);
  border-color:var(--yuke-terracotta);
  width:22px;border-radius:5px;
}
.yuke-slider__arrow{
  position:absolute;top:50%;transform:translateY(-50%);
  width:40px;height:40px;border-radius:50%;
  background:rgba(255,255,255,.85);border:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 4px 14px rgba(60,45,30,.18);
  color:var(--yuke-ink);font-size:18px;z-index:3;transition:.2s;
}
.yuke-slider__arrow:hover{background:#fff}
.yuke-slider__arrow--prev{left:16px}
.yuke-slider__arrow--next{right:16px}
.yuke-btn{
  display:inline-block;background:var(--yuke-terracotta);color:#fff !important;
  border-radius:11px;padding:13px 26px;font-size:14.5px;font-weight:700;
  text-decoration:none !important;box-shadow:0 6px 18px rgba(182,92,56,.26);
  transition:.18s;
}
.yuke-btn:hover{background:#A34F2E;transform:translateY(-1px)}

.yuke-band{
  display:grid;grid-template-columns:repeat(3,1fr);gap:0;
  background:var(--yuke-pine);color:#fff;border-radius:14px;
  margin:52px 0;overflow:hidden;
}
.yuke-band>div{
  padding:24px 20px;text-align:center;
  border-right:1px solid rgba(255,255,255,.12);
}
.yuke-band>div:last-child{border-right:none}
.yuke-band strong{
  display:block;font-size:21px;font-weight:700;letter-spacing:-.01em;
}
.yuke-band span{
  display:block;font-size:11.5px;color:rgba(255,255,255,.72);margin-top:4px;
}

@media (max-width:860px){
  .yuke-slide{grid-template-columns:1fr;min-height:0}
  .yuke-slide__media{min-height:0;aspect-ratio:4/5}
  .yuke-slide__body{padding:28px 22px 32px}
  .yuke-slide h1{font-size:30px}
  .yuke-slide p{max-width:none}
  .yuke-slider__arrow{display:none}
  .yuke-band{grid-template-columns:1fr}
  .yuke-band>div{border-right:none;border-bottom:1px solid rgba(255,255,255,.12)}
  .yuke-band>div:last-child{border-bottom:none}
}
/* 首页：标题容器隐藏后仍占位，去掉主题内容区顶部留白 */
.home .entry-header{display:none}
.home article.type-page{margin-top:0 !important;padding-top:0 !important}
.home main.site-main{margin-top:0 !important;padding-top:0 !important}
.yuke-slider__track p{display:none}
/* 首页顶部主题固有 40px 间隙（实测只能用负 margin + !important 拉平） */
.home main.site-main .ct-container-full{padding-top:0 !important;margin-top:-40px !important}

/* ============================================================
   8. 分类页头部
   ============================================================ */
.woocommerce-products-header{
  padding:8px 0 4px;
}
.woocommerce-products-header__title{
  font-size:24px;
  font-weight:700;
}
.woocommerce-result-count,
.woocommerce-ordering select{
  font-size:12.5px;
  color:var(--yuke-ink-2);
}

/* ============================================================
   9. 购物车 / 结算
   ============================================================ */
.woocommerce-cart .cart_totals h2,
.woocommerce-checkout h3{
  font-size:17px;
  font-weight:700;
}

/* 免运费进度条（functions.php 注入） */
.yuke-shipbar{
  background:#fff;
  border:1px solid var(--yuke-line);
  border-radius:10px;
  padding:11px 13px;
  margin-bottom:16px;
  font-size:12.5px;
  color:var(--yuke-ink-2);
}
.yuke-shipbar__track{
  height:5px;
  background:#EDE7DE;
  border-radius:3px;
  overflow:hidden;
  margin-top:7px;
}
.yuke-shipbar__fill{
  height:100%;
  background:var(--yuke-pine);
  border-radius:3px;
  transition:width .4s ease;
}
.yuke-shipbar strong{color:var(--yuke-pine)}

/* 结算字段：更紧凑 */
.woocommerce-checkout .form-row label{
  font-size:12.5px;
  color:var(--yuke-ink-2);
}
.woocommerce-checkout .form-row input.input-text,
.woocommerce-checkout .form-row select{
  border:1.5px solid var(--yuke-line);
  border-radius:9px;
  height:46px;
  font-size:14px;
}

#place_order{
  background:var(--yuke-terracotta);
  border-radius:var(--yuke-radius);
  font-weight:700;
  font-size:15.5px;
  padding:15px;
  box-shadow:0 6px 18px rgba(182,92,56,.25);
}
#place_order:hover{background:#A34F2E}

/* 结算页去掉干扰 */
.woocommerce-checkout .yuke-hide-on-checkout{
  display:none;
}

/* ============================================================
   10. 页脚
   ============================================================ */
.ct-footer{
  background:var(--yuke-paper);
  border-top:1px solid var(--yuke-line);
}

/* ============================================================
   11. 移动端
   ============================================================ */
@media (max-width: 767px){
  .single-product .product_title{font-size:22px}
  .single-product .summary .price{font-size:26px}
  .single-product div.product{gap:18px}
  /* Blocksy 把产品内容限宽 343px 且偏移，手机端放开为全宽 */
  .single-product .product-entry-wrapper.is-width-constrained{
    width:100% !important;
    max-width:100% !important;
  }
  /* 全宽后负 margin 会让图库冲出屏幕右缘（右箭头被切），归零 */
  .single-product .woocommerce-product-gallery{
    margin-left:0;
    margin-right:0;
    border-radius:0;
  }
  .yuke-chip{padding:8px 12px;font-size:13px;min-width:62px}
  .woocommerce ul.products li.product .woocommerce-loop-product__title{font-size:13px}
}

/* 减少动效偏好 */
@media (prefers-reduced-motion: reduce){
  *{animation:none !important;transition:none !important}
}

/* ============================================================
   12. 移动端商品两列
   ============================================================ */
@media (max-width:767px){
  .woocommerce ul.products,
  ul.products{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:18px 10px !important;
  }
  .woocommerce ul.products::before,
  .woocommerce ul.products::after{display:none !important}
  .woocommerce ul.products li.product{
    width:100% !important;margin:0 !important;float:none !important;
  }
  .woocommerce ul.products li.product .woocommerce-loop-product__title{font-size:12.5px !important}
  .woocommerce ul.products li.product .button{padding:8px 10px !important;font-size:11.5px !important}
}

/* ============================================================
   13. 移动端吸底加购条
   ============================================================ */
.yuke-stickybar{
  position:fixed;bottom:0;left:0;right:0;z-index:990;
  background:rgba(255,255,255,.97);backdrop-filter:blur(12px);
  border-top:1px solid var(--yuke-line);
  padding:9px 14px calc(9px + env(safe-area-inset-bottom));
  display:none;align-items:center;justify-content:space-between;gap:10px;
  box-shadow:0 -8px 24px rgba(60,45,30,.09);
}
.yuke-stickybar.on{display:flex}
.yuke-stickybar__info{min-width:0}
.yuke-stickybar__price{display:block;font-size:16px;font-weight:800;letter-spacing:-.01em}
.yuke-stickybar__price del{font-size:11px;font-weight:400;color:var(--yuke-ink-3);opacity:1}
.yuke-stickybar__price ins{text-decoration:none}
.yuke-stickybar__info span{
  display:block;font-size:10.5px;color:var(--yuke-ink-3);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:46vw;
}
.yuke-stickybar__btn{
  flex:0 0 auto;background:var(--yuke-terracotta);color:#fff !important;
  border-radius:10px;padding:12px 22px;font-size:14px;font-weight:700;
  text-decoration:none !important;box-shadow:0 4px 14px rgba(182,92,56,.3);
}

/* ============================================================
   14. 页脚
   ============================================================ */
.ct-footer-copyright{font-size:12px;color:var(--yuke-ink-3)}
.ct-footer-copyright a{color:var(--yuke-ink-2)}

/* ============================================================
   15. 分类网格（首页）
   ============================================================ */
.woocommerce ul.products.li.product-cat,
ul.products li.product-category a{
  display:block;text-align:center;
}
ul.products li.product-category img{
  border-radius:10px !important;margin-bottom:8px;
}
ul.products li.product-category h2{font-size:13px !important;font-weight:600 !important}
ul.products li.product-category h2 mark{background:none;color:var(--yuke-ink-3);font-size:11px}

/* ============================================================
   16. 修正（2026-10-19 手机端截图验收后）
   ============================================================ */
/* 首页隐藏 "Home" 页面标题（hero 已有 h1，不重复） */
.home .entry-header{display:none}

/* 商品页价格区间强制横排（Blocksy 默认把区间竖排） */
.single-product .summary .price{
  display:flex;
  align-items:baseline;
  gap:6px;
  flex-wrap:wrap;
}
.single-product .summary .price .woocommerce-Price-amount{
  display:inline-block;
}
/* 数量与加购同行 */
.single-product form.cart{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.single-product form.cart .quantity{margin:0}
/* 吸底条价格横排 */
.yuke-stickybar__price{display:flex;align-items:baseline;gap:4px;flex-wrap:wrap}
.yuke-stickybar__price .woocommerce-Price-amount{display:inline-block}
/* 加购按钮统一赤陶色（覆盖 WooCommerce/Blocksy 默认蓝） */
.single-product .single_add_to_cart_button,
.woocommerce #respond input#submit.alt,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.single-product form.cart .single_add_to_cart_button{
  background:var(--yuke-terracotta) !important;
  color:#fff !important;
  border:none !important;
  border-radius:12px !important;
  font-weight:700 !important;
}
.single-product form.cart .single_add_to_cart_button:hover{background:#A34F2E !important}

/* ============================================================
   17. 手机端折叠菜单精修（2026-10-19 用户反馈文字太大太糙）
   ============================================================ */
/* 抽屉面板底色与内边距 */
.ct-drawer-canvas .ct-panel,
.ct-drawer-canvas [data-behaviour="side"] {
  background:#1E2420 !important;
}
/* 菜单链接：字号收小、白色、细字重、行距收紧 */
.ct-drawer-canvas .mobile-menu li a,
.ct-drawer-canvas .menu li a,
.ct-drawer-canvas nav[class*="menu"] li a{
  font-size:15px !important;
  font-weight:500 !important;
  color:#F2EEE8 !important;
  padding:11px 4px !important;
  letter-spacing:.01em;
  border-bottom:1px solid rgba(255,255,255,.07) !important;
}
.ct-drawer-canvas .mobile-menu li:last-child a,
.ct-drawer-canvas .menu li:last-child a{border-bottom:none !important}
/* 当前页赤陶高亮 */
.ct-drawer-canvas .mobile-menu li.current_page_item > a,
.ct-drawer-canvas .mobile-menu li.current-menu-item > a,
.ct-drawer-canvas .menu li.current-menu-item > a{
  color:var(--yuke-terracotta) !important;
  font-weight:600 !important;
}
/* 去掉 Blocksy 默认的下拉箭头背景块与多余缩进 */
.ct-drawer-canvas .mobile-menu li{padding:0 !important}
.ct-drawer-canvas .ct-sub-menu-parent{padding:0 !important}
/* 子菜单缩进 + 更小字号 */
.ct-drawer-canvas .mobile-menu li li a,
.ct-drawer-canvas .menu li li a{
  font-size:13.5px !important;
  color:rgba(242,238,232,.75) !important;
  padding:9px 4px 9px 18px !important;
}

/* 覆盖 Blocksy 折叠菜单的动态变量（这才是真正生效的开关） */
#offcanvas [data-id="mobile-menu"],
[data-header] #offcanvas [data-id="mobile-menu"]{
  --theme-font-size:15px !important;
  --theme-font-weight:500 !important;
  --theme-link-initial-color:#F2EEE8 !important;
  --mobile-menu-divider:1px solid rgba(255,255,255,.07) !important;
}
#offcanvas .ct-panel-inner{background-color:#1E2420 !important}
#offcanvas .mobile-menu > li > a,
#offcanvas li a{
  font-size:var(--theme-font-size,15px) !important;
  color:#F2EEE8 !important;
}
#offcanvas li.current-menu-item > a,
#offcanvas li.current_page_item > a{color:var(--yuke-terracotta) !important}

/* ============================================================
   18. 装裱版式选择器（Choose your mounting）
   ============================================================ */
.yuke-mounting{
  margin:18px 0 6px;
  background:#fff;
  border:1px solid var(--yuke-line);
  border-radius:var(--yuke-radius);
  overflow:hidden;
}
.yuke-mounting__title{
  font-size:14px;
  font-weight:700;
  padding:11px 14px 9px;
  color:var(--yuke-ink);
}
.yuke-mounting__imgwrap img{
  width:100%;
  height:auto;
  display:block;
}
.yuke-mounting__opts{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:0;
  border-top:1px solid var(--yuke-line);
}
.yuke-mounting__opt{
  background:#fff;
  border:none;
  border-right:1px solid var(--yuke-line);
  padding:10px 8px 12px;
  text-align:center;
  cursor:pointer;
  transition:.18s;
  font-family:inherit;
}
.yuke-mounting__opt:last-child{border-right:none}
.yuke-mounting__opt b{
  display:block;
  font-size:13.5px;
  color:var(--yuke-ink);
  margin-bottom:3px;
}
.yuke-mounting__opt span{
  display:block;
  font-size:10.5px;
  line-height:1.45;
  color:var(--yuke-ink-3);
}
.yuke-mounting__opt:hover{background:#FBF7F2}
.yuke-mounting__opt.is-active{
  background:var(--yuke-terracotta-soft);
}
.yuke-mounting__opt.is-active b{color:var(--yuke-terracotta)}

/* ============================================================
   19. 首页 Before/After 模块 + 商品卡角标增强
   ============================================================ */
.yuke-how{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:32px;
  align-items:center;
  margin:56px 0 8px;
}
.yuke-how__media img{
  width:100%;height:auto;display:block;
  border-radius:14px;
  box-shadow:0 18px 50px rgba(60,45,30,.10);
}
.yuke-how__body h2{
  font-size:28px;line-height:1.2;letter-spacing:-.02em;
  margin:10px 0 14px;color:var(--yuke-ink);
}
.yuke-how__body p{
  font-size:14.5px;line-height:1.7;color:var(--yuke-ink-2);margin-bottom:18px;
}
@media (max-width:860px){
  .yuke-how{grid-template-columns:1fr;gap:18px}
  .yuke-how__body h2{font-size:23px}
}
/* 商品卡 SALE 角标：更醒目、圆角 */
.woocommerce ul.products li.product span.onsale{
  top:10px !important;left:10px !important;
  background:var(--yuke-terracotta) !important;
  color:#fff !important;
  border-radius:7px !important;
  font-size:11px !important;
  font-weight:700 !important;
  padding:4px 10px !important;
  letter-spacing:.03em;
}

/* ============================================================
   定制商品图片上传字段
   ============================================================ */
.yuke-custom-upload{
  margin:18px 0 14px;
  padding:16px 18px;
  background:var(--yuke-pine-soft);
  border:1px dashed var(--yuke-pine);
  border-radius:var(--yuke-radius);
}
.yuke-custom-upload__label{
  display:flex;flex-direction:column;gap:3px;cursor:pointer;margin:0;
}
.yuke-custom-upload__label strong{
  font-size:15px;color:var(--yuke-ink);
}
.yuke-custom-upload__label span{
  font-size:12px;color:var(--yuke-ink-2);
}
.yuke-custom-upload input[type="file"]{
  margin-top:10px;font-size:13px;color:var(--yuke-ink);
  width:100%;
}
.yuke-custom-upload__hint{
  margin:8px 0 0;font-size:13px;
}

/* ============================================================
   手机端选规格体验：
   1) 颜色数预览条吸顶——顾客滚动/选择 24/36/48 时，
      小预览图始终可见并即时切换，主图联动照常
   2) 装裱选择器收窄、间距收紧，选项尽量靠近图库
   ============================================================ */
.yuke-color-preview{
  display:flex;align-items:center;gap:12px;
  margin:14px 0 0;
  padding:10px 14px;
  border:1px solid var(--yuke-line);
  border-radius:var(--yuke-radius);
  background:var(--yuke-pine-soft);
}
.yuke-color-preview img{
  width:56px;height:56px;border-radius:8px;object-fit:cover;flex:0 0 auto;
  border:1px solid var(--yuke-line);
}
.yuke-color-preview__caption{
  font-size:13px;color:var(--yuke-ink-2);line-height:1.5;
}
.yuke-color-preview__caption b{color:var(--yuke-terracotta)}
@media (max-width:860px){
  .woocommerce-product-gallery .flexy-pills ol{
    margin-top:8px;
  }
  /* 装裱选择器在手机端收窄：隐藏大对比图，只留三个按钮 */
  .yuke-mounting__imgwrap{display:none}
}

/* 定制页：三步卡 / 颜色三宫格 / 照片建议 */
.yuke-custom-hero{text-align:center;padding:8px 0 4px}
.yuke-custom-hero h1{font-size:34px;line-height:1.15;margin-bottom:12px}
.yuke-custom-hero p{max-width:52ch;margin:0 auto;color:var(--yuke-ink-2);font-size:15px;line-height:1.65}
.yuke-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:0 0 8px}
.yuke-steps>div{
  background:var(--yuke-card);border:1px solid var(--yuke-line);
  border-radius:var(--yuke-radius);padding:22px 18px;text-align:center;
}
.yuke-steps__num{
  display:inline-flex;width:34px;height:34px;border-radius:50%;
  background:var(--yuke-terracotta);color:#fff;font-weight:700;
  align-items:center;justify-content:center;margin-bottom:10px;
}
.yuke-steps strong{display:block;font-size:15px;margin-bottom:6px}
.yuke-steps p{font-size:13px;color:var(--yuke-ink-2);line-height:1.6;margin:0}
.yuke-color-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.yuke-color-grid figure{
  margin:0;background:var(--yuke-card);border:1px solid var(--yuke-line);
  border-radius:var(--yuke-radius);overflow:hidden;
}
.yuke-color-grid img{width:100%;aspect-ratio:1/1;object-fit:cover;display:block}
.yuke-color-grid figcaption{padding:10px 12px}
.yuke-color-grid figcaption b{display:block;color:var(--yuke-terracotta);font-size:14px}
.yuke-color-grid figcaption span{font-size:12px;color:var(--yuke-ink-2);line-height:1.5;display:block;margin-top:3px}
.yuke-photo-tips{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:760px;margin:0 auto}
.yuke-photo-tips>div{background:var(--yuke-card);border:1px solid var(--yuke-line);border-radius:var(--yuke-radius);padding:20px 22px}
.yuke-photo-tips h3{font-size:15px;margin:0 0 10px}
.yuke-photo-tips ul{margin:0;padding-left:18px;font-size:13.5px;color:var(--yuke-ink-2);line-height:1.8}
@media (max-width:860px){
  .yuke-steps{grid-template-columns:1fr}
  .yuke-color-grid{grid-template-columns:1fr}
  .yuke-photo-tips{grid-template-columns:1fr}
  .yuke-custom-hero h1{font-size:28px}
}

/* ============================================================
   定制商品图库缩略图条修复（手机端 flexy-pills 异常竖排）
   ============================================================ */
.woocommerce-product-gallery .flexy-pills ol{
  display:flex;
  flex-direction:row;
  flex-wrap:nowrap;
  gap:8px;
  overflow-x:auto;
  margin:12px 0 0;
  padding:0 2px;
  list-style:none;
  -webkit-overflow-scrolling:touch;
}
.woocommerce-product-gallery .flexy-pills ol li{
  flex:0 0 auto;
  width:56px;height:56px;
  margin:0;padding:0;
  border:2px solid transparent;
  border-radius:8px;
  overflow:hidden;
  cursor:pointer;
  transition:border-color .2s;
}
.woocommerce-product-gallery .flexy-pills ol li.active{
  border-color:var(--yuke-terracotta);
}
.woocommerce-product-gallery .flexy-pills .ct-media-container{
  width:100%;height:100%;display:block;
}
.woocommerce-product-gallery .flexy-pills .ct-media-container img{
  width:100%;height:100%;object-fit:cover;display:block;
}

/* ============================================================
   手机端选规格体验：图库吸顶，选项滚动时主图始终可见
   （顾客切换 24/36/48 色时能直接看到主图联动效果）
   ============================================================ */
@media (max-width:860px){
  /* 装裱选择器在手机端收窄（补充兜底） */
  .yuke-mounting__imgwrap{display:none}
}

/* ============================================================
   20. 手机端购买流程重排（配合 functions.php 第 14 节）
   顺序：标题 → 主图 → 尺寸 → 装裱 → 颜色 → 价格 → 上传 → 加购
   间距整体压缩，让核心购买流程尽量在一屏内展示完整
   ============================================================ */
@media (max-width:860px){
  /* 标题保持在缩略图之后：收字号 */
  .single-product .product_title{
    font-size:20px;
    line-height:1.28;
    margin:0 0 8px;
  }
  /* 手机端隐藏面包屑整行（商品名与底部标题重复，且省出近40px）；桌面端保留利于导航 */
  .single-product .hero-section{display:none !important}
  .single-product main.site-main{margin-top:0 !important;padding-top:0 !important}
  .single-product .ct-container-full{padding-top:0 !important;margin-top:0 !important}
  .single-product article.product{padding-top:0 !important;margin-top:0 !important}
  .single-product .product-entry-wrapper{margin-top:0 !important;padding-top:0 !important}
  /* 面包屑容器（hero-section）的 40px 下边距是主图上方最大留白，压掉 */
  .single-product .hero-section{margin-bottom:0 !important}
  .single-product .entry-header{margin-bottom:0 !important}
  /* 图库紧贴面包屑，主图更靠上 */
  .single-product div.product{gap:0}
  .single-product .woocommerce-product-gallery{margin-top:0;margin-bottom:10px}

  /* summary 内所有块间距统一收紧 */
  .summary.entry-summary > *{margin-top:10px !important;margin-bottom:0 !important}

  /* 装裱选择器：塞进 form 里，压缩高度，去掉白卡片感 */
  .yuke-mounting{
    margin:10px 0 0;
    padding:0 0 4px;
    background:transparent;
    border:none;
  }
  .yuke-mounting__title{
    font-size:12.5px;
    padding:0 0 8px;
  }
  .yuke-mounting__opts{gap:0;border:none}
  .yuke-mounting__opt{padding:8px 6px 9px}
  .yuke-mounting__opt b{font-size:12.5px;margin-bottom:2px}
  .yuke-mounting__opt span{font-size:9.5px}

  /* 价格：移到加购前，字号适中 */
  .single-product .summary .price,
  .single_product .price{
    font-size:24px;
    margin:12px 0 4px;
  }

  /* 变体三行间距收紧 */
  .variations td.value{margin-bottom:10px}
  .variations th.label label{margin-bottom:5px;font-size:12px}

  /* 颜色预览条：不再吸顶（已并入流程，避免挡住选项），保持小图+文案 */
  .yuke-color-preview{
    position:static !important;
    top:auto !important;
    margin:8px 0 4px;
    padding:8px 12px;
    box-shadow:none;
  }
  .yuke-color-preview img{width:44px;height:44px}
  .yuke-color-preview__caption{font-size:12px}

  /* 上传字段压缩 */
  .yuke-custom-upload{margin:10px 0 8px;padding:12px 14px}
  .yuke-custom-upload__label strong{font-size:14px}
  .yuke-custom-upload__label span{font-size:11px}

  /* 加购按钮与数量：更紧凑，占满一行 */
  .single-product form.cart{gap:8px}
  .single-product .single_add_to_cart_button{padding:14px 20px;font-size:15px}

  /* 被挪到加购之后的辅助元素：弱化、紧凑 */
  .summary .yuke-eta{margin:12px 0 0}
  .summary .yuke-trust{margin:10px 0 0;padding-top:10px}
  .woocommerce-product-details__short-description{font-size:13px;line-height:1.6;color:var(--yuke-ink-2)}

  /* 图库缩略图更紧凑 */
  .woocommerce-product-gallery .flexy-pills ol{margin:8px 0 0;gap:6px}
  .woocommerce-product-gallery .flexy-pills ol li{width:48px;height:48px}
}

/* ============================================================
   21. 分类页底部 SEO 段落 + FAQ（functions.php 注入）
   ============================================================ */
.yuke-cat-seo{
  margin:36px 0 8px;
  padding-top:28px;
  border-top:1px solid var(--yuke-line);
}
.yuke-cat-seo h2{
  font-size:20px;
  font-weight:700;
  margin:0 0 14px;
  letter-spacing:-.01em;
}
.yuke-cat-seo p{
  font-size:14px;
  line-height:1.75;
  color:#4A4239;
  margin:0 0 12px;
  max-width:760px;
}

.yuke-cat-faq{
  margin:24px 0 40px;
  border:1px solid var(--yuke-line);
  border-radius:var(--yuke-radius);
  background:var(--yuke-card);
  padding:18px 20px;
}
.yuke-cat-faq h3{
  font-size:16px;
  font-weight:700;
  margin:0 0 8px;
}
.yuke-cat-faq__item{
  border-top:1px solid var(--yuke-line);
}
.yuke-cat-faq__item:first-of-type{border-top:none}
.yuke-cat-faq__item summary{
  cursor:pointer;
  list-style:none;
  font-size:14px;
  font-weight:600;
  color:var(--yuke-terracotta);
  padding:12px 0 4px;
  position:relative;
  padding-right:24px;
}
.yuke-cat-faq__item summary::-webkit-details-marker{display:none}
.yuke-cat-faq__item summary::after{
  content:"+";
  position:absolute;
  right:2px;
  top:11px;
  font-weight:400;
  color:var(--yuke-ink-3);
  transition:transform .18s ease;
}
.yuke-cat-faq__item[open] summary::after{transform:rotate(45deg)}
.yuke-cat-faq__item p{
  font-size:13.5px;
  line-height:1.7;
  color:var(--yuke-ink-2);
  margin:0 0 12px;
  max-width:760px;
}

@media (max-width:860px){
  .yuke-cat-seo{margin:24px 0 4px;padding-top:22px}
  .yuke-cat-seo h2{font-size:18px}
  .yuke-cat-seo p{font-size:13.5px}
  .yuke-cat-faq{margin:18px 0 28px;padding:14px 16px}
}