/* product_bundle.v1.css — 提取自 Design V2 product_bundle.preview.html 内联 <style> */
@import url("_fonts.css");
:root{
  --ink-900:#0B0A08;--ink-800:#171512;--ink-700:#24211C;--ink-600:#3A362F;
  --ink-500:#6B655B;--ink-400:#9A9389;--ink-300:#C5BFB4;--ink-200:#E6E1D8;
  --ink-100:#F3EFE6;--ink-50:#FAF7F0;--paper:#FFFFFF;
  --rose-gold:#B76E5D;--rg-700:#A86B55;--rg-300:#E4C2B5;--rg-100:#F5E4DB;
  --success:#3F6B4E;--warning:#B5853A;--danger:#A84234;
  --font-serif:"Fraunces",Georgia,serif;
  --font-sans:"Noto Sans",-apple-system,Helvetica,Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--ink-100);color:var(--ink-900);font-family:var(--font-sans);font-size:14px;line-height:1.5}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer}
img{max-width:100%;display:block}

.banner{background:var(--ink-900);color:#fff;padding:10px 20px;font-size:10px;letter-spacing:.18em;text-transform:uppercase;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.banner b{color:var(--rg-300)}
.banner .tabs button{padding:5px 12px;border:1px solid var(--ink-700);background:transparent;color:#fff;font-size:10px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;margin-right:6px}
.banner .tabs button.on{background:var(--rose-gold);border-color:var(--rose-gold)}

.page-section{padding:24px 0}
.container{max-width:1280px;margin:0 auto;padding:0 24px}
@media(max-width:767px){.container{padding:0 16px}}
.crumb{font-size:10px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-500);margin-bottom:18px}
.crumb a{color:var(--ink-500)} .crumb a:hover{color:var(--rose-gold)}
.crumb .sep{margin:0 10px;color:var(--rose-gold)} .crumb .now{color:var(--ink-900)}

/* .product-grid 尺寸 + 响应式与首页 .page-layout 完全对齐（侧栏一致）*/
.product-grid{display:grid;grid-template-columns:200px 1fr;gap:40px;position:relative}
@media (max-width:1279px){.product-grid{grid-template-columns:180px minmax(0,1fr);gap:28px}}
@media (max-width:1099px){.product-grid{grid-template-columns:160px minmax(0,1fr);gap:24px}}
@media (max-width:991px){.product-grid{grid-template-columns:160px minmax(0,1fr);gap:24px}}
@media (max-width:767px){.product-grid{grid-template-columns:1fr;gap:20px}}

/* 左侧分类侧栏（.left-sidebar h2 / .cat-item / .cat-link / .cat-chevron 等）
   不在此定义 —— 复用 index.v1.css 的首页侧栏规则，保证与首页完全一致 */

.product-main{min-width:0;background:var(--paper);padding:28px;border:1px solid var(--ink-200)}
.product-details{display:grid;grid-template-columns:5fr 7fr;gap:40px;margin-bottom:24px}
@media(max-width:820px){.product-details{grid-template-columns:1fr}}

.prod-gallery{max-width:480px}
#windowDiv{width:100%;max-width:480px;aspect-ratio:1/1;background:var(--ink-50);border:1px solid var(--ink-200);display:flex;align-items:center;justify-content:center;overflow:hidden}
/* 图片外层 <a id="img"> 撑满方框；图片 object-fit:contain 填入 —— 彻底防溢出 */
#windowDiv #img{display:block;width:100%;height:100%;min-width:0}
#windowDiv img{width:100%;height:100%;object-fit:contain;display:block}
#windowDiv .ph{font-family:var(--font-serif);font-style:italic;font-size:34px;color:var(--ink-400)}
.similar-product{margin-top:12px}
.thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.thumb{aspect-ratio:1/1;border:1px solid var(--ink-200);position:relative;overflow:hidden}
.thumb img{width:100%;height:100%;object-fit:cover;display:block}
.thumb-ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.9);font-size:9px;font-weight:600;letter-spacing:.2em;mix-blend-mode:difference}

.prod-kicker{margin:0 0 12px;font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-500)}
.prod-name{font-family:var(--font-serif);font-weight:500;font-size:30px;line-height:1.08;letter-spacing:-.015em;margin:0 0 10px;color:var(--ink-900);display:flex;align-items:flex-start;gap:10px;flex-wrap:wrap}
.bundle-badge{display:inline-flex;align-items:center;font-family:var(--font-sans);font-size:9px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:#fff;background:var(--rose-gold);padding:4px 10px;line-height:1;align-self:center}
.sn-row{margin:0 0 8px;font-size:11px;color:var(--ink-500);letter-spacing:.08em}
.view-more{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--rose-gold);margin-bottom:14px}

/* unit-price card (top right) */
.unit-price-card{margin-top:8px;padding:14px 18px;background:var(--rg-100);border:1px solid var(--rg-300);border-left:3px solid var(--rose-gold)}
.unit-price-card .label{font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-700);margin-bottom:6px;display:flex;align-items:baseline;gap:8px}
.unit-price-card .auth-tag{font-size:9px;font-weight:600;letter-spacing:.18em;color:var(--rose-gold);border:1px solid var(--rose-gold);padding:2px 6px}
.unit-price-card .row{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.unit-price-card .now{font-family:var(--font-serif);font-weight:500;font-size:32px;color:var(--rose-gold);line-height:1;font-variant-numeric:tabular-nums}
.unit-price-card .now .sign{font-family:var(--font-sans);font-size:.42em;font-weight:600;letter-spacing:.1em;color:var(--rose-gold);margin-right:5px;vertical-align:baseline}
.unit-price-card .was{font-size:14px;color:var(--ink-500);text-decoration:line-through;font-variant-numeric:tabular-nums}
/* 2026-06-13 未登录市场价：对齐普通商品市场价表现（灰色 + 删除线），保留组合卡片背景；不影响登录态 unit-price-card */
.unit-price-card--guest .guest-title{font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-700);margin-bottom:6px;display:flex;align-items:baseline;gap:8px}
.unit-price-card--guest .label{font-size:10px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-500);margin-bottom:6px}
.unit-price-card.unit-price-card--guest .now{font-family:var(--font-serif);font-weight:500;font-size:18px;color:var(--ink-500);text-decoration:line-through;text-decoration-thickness:1px;text-decoration-color:var(--ink-400);font-variant-numeric:tabular-nums;line-height:1.2}
.unit-price-card.unit-price-card--guest .now .sign{font-family:var(--font-sans);color:var(--ink-500);font-size:.55em;font-weight:600;margin-right:4px;text-decoration:none;display:inline-block}
.bundle-sub-price .guest-market{color:var(--ink-500);text-decoration:line-through;text-decoration-color:var(--ink-400)}
.bundle-sub-price .guest-market .sign{color:var(--ink-500);text-decoration:none;display:inline-block}
.intro-text{margin:14px 0 0;font-size:13px;color:var(--ink-600);line-height:1.6;font-style:italic}

/* subproduct list */
.bundle-section-title{font-family:var(--font-sans);font-size:14px;font-weight:700;color:var(--ink-900);margin:18px 0 12px;padding-bottom:10px;border-bottom:2px solid var(--rose-gold)}
.bundle-sub-list{border:1px solid var(--ink-200);background:var(--paper)}
.bundle-sub{display:flex;align-items:flex-start;gap:14px;padding:14px 16px;border-bottom:1px solid var(--ink-200)}
.bundle-sub:last-child{border-bottom:0}
.bundle-sub-thumb{width:64px;height:64px;flex:0 0 64px;border:1px solid var(--ink-200);background:linear-gradient(135deg,#2a1f1c,#B76E5D);overflow:hidden}
.bundle-sub-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.bundle-sub-main{flex:1;min-width:0}
.bundle-sub-name{font-size:14px;color:var(--ink-900);font-weight:500;display:flex;align-items:center;flex-wrap:wrap;gap:6px}
.bundle-sub-name .arrow{color:var(--ink-500);font-weight:700;margin-right:8px}
.bundle-sub-name a{color:var(--ink-900)}
.bundle-sub-name a:hover{color:var(--rose-gold)}
.gift-tag{background:var(--success);color:#fff;font-size:9px;padding:2px 7px;letter-spacing:.16em;text-transform:uppercase;font-weight:600}
.unpriced-tag{background:var(--ink-300);color:var(--ink-700);font-size:9px;padding:2px 7px;letter-spacing:.16em;text-transform:uppercase;font-weight:600}
.option-label{margin-left:auto;color:var(--ink-500);font-size:12px}
.bundle-sub-sn{color:var(--ink-500);font-size:12px;font-style:italic;margin-top:3px;padding-left:22px;letter-spacing:.04em}
.bundle-sub-side{flex:0 0 auto;min-width:180px;text-align:right}
.bundle-sub-price{color:var(--rose-gold);font-weight:600;white-space:nowrap;font-variant-numeric:tabular-nums;font-size:14px}
.bundle-sub-price .sign{font-size:.7em;font-weight:600;margin-right:3px}
.bundle-qty-group{display:inline-flex;align-items:center;margin-top:6px}
.bundle-qty-btn{width:28px;height:30px;border:1px solid var(--ink-300);background:var(--paper);font-size:14px;color:var(--ink-900);padding:0}
.bundle-qty-btn:hover{background:var(--ink-900);color:#fff;border-color:var(--ink-900)}
.bundle-qty-input{width:54px;height:30px;border:1px solid var(--ink-300);text-align:center;font-weight:600;font-variant-numeric:tabular-nums;border-left:0;border-right:0}
.bundle-qty-locked{font-family:var(--font-serif);font-size:24px;font-weight:500;color:var(--ink-700);font-variant-numeric:tabular-nums;font-style:italic}
/* 锁定注释单独保持小号，不随数量字号变化 */
.bundle-qty-locked .locked-note{font-size:15.3px}
.bundle-sub-subtotal{font-size:12px;color:var(--ink-600);margin-top:5px;font-variant-numeric:tabular-nums}

/* summary box */
.bundle-summary{margin-top:20px;padding:18px 22px;background:var(--rg-100);border:1px solid var(--rg-300);border-left:3px solid var(--rose-gold)}
.bundle-summary-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;font-size:14px}
.bundle-summary-row .label{font-weight:600;color:var(--ink-800)}
.bundle-summary-row .val{font-family:var(--font-serif);font-weight:500;font-variant-numeric:tabular-nums;color:var(--ink-900);font-size:18px}
.bundle-summary-row .val .sign{font-family:var(--font-sans);font-size:.55em;color:var(--ink-500);margin-right:3px;font-weight:600}
.bundle-saved-row .saved{color:var(--danger);font-weight:600}
.bundle-final-row{border-top:2px solid var(--rose-gold);padding-top:12px;margin-top:6px}
.bundle-final-row .label{font-size:14px}
.bundle-final-row .val{font-family:var(--font-serif);font-weight:500;font-size:30px;color:var(--rose-gold);line-height:1}
.bundle-final-row .val .sign{font-size:.42em;color:var(--rose-gold);margin-right:5px}
.bundle-final-row .auth-tag{font-size:9px;font-weight:600;letter-spacing:.18em;color:var(--rose-gold);border:1px solid var(--rose-gold);padding:2px 6px;margin-left:8px}
.bundle-units-group{display:inline-flex;align-items:center}
.bundle-units-input{width:60px;height:32px;border:1px solid var(--ink-300);text-align:center;font-weight:600;font-variant-numeric:tabular-nums;border-left:0;border-right:0}
/* 最低起订量占位符 —— 字号缩小 */
.bundle-units-input::placeholder{font-size:10px;font-weight:400;letter-spacing:.02em;color:var(--ink-400)}
.add-to-cart-bundle{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:var(--ink-900);color:#fff;height:48px;padding:0 28px;font-family:var(--font-sans);font-size:11px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;border:1px solid var(--ink-900);width:100%;margin-top:14px}
.add-to-cart-bundle:hover{background:var(--ink-700);letter-spacing:.3em;color:#fff}

.category-tab{margin-top:32px;padding-top:20px;border-top:1px solid var(--ink-200)}
.nav-tabs{list-style:none;padding:0;margin:0 0 16px;display:flex;border-bottom:1px solid var(--ink-900)}
.nav-tabs li a{display:block;padding:14px 22px;font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-500);background:transparent}
.nav-tabs li.active a{color:var(--ink-900);background:var(--ink-50)}
.tab-content{padding:16px 4px;font-size:14px;line-height:1.75;color:var(--ink-800)}

.mode-view{display:none}
.mode-view.on{display:block}

/* 追加销售区 —— 补自 Design V2 product.v1.css（bundle preview 未含此段）*/
.upsell-section{margin-top:40px;clear:both}
.upsell-title{font-family:var(--font-sans);font-size:11px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-900);border-bottom:1px solid var(--rose-gold);padding-bottom:10px;margin:0 0 18px}
.linked-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.linked-card{border:1px solid var(--ink-200);background:var(--paper);padding:12px;text-align:center;display:flex;flex-direction:column;gap:10px}
.linked-card-img{width:100%;aspect-ratio:1;display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--ink-50)}
.linked-card-img .img-ph{width:100%;height:100%;background:linear-gradient(135deg,#2a1f1c,#B76E5D);display:block}
.linked-card-name{font-size:13px;color:var(--ink-800);line-height:1.4;min-height:36px}
.linked-card-price{font-size:14px}
.linked-card-price .upsell-auth{font-family:var(--font-serif);font-size:18px;font-weight:500;color:var(--rose-gold);font-variant-numeric:tabular-nums}
.linked-card-price .upsell-market{font-family:var(--font-serif);font-size:16px;font-weight:500;color:var(--ink-700);font-variant-numeric:tabular-nums}
.linked-card-price .sign{font-family:var(--font-sans);font-size:.55em;color:var(--ink-500);margin-right:3px;font-weight:600}
.linked-card-price .upsell-noprice{color:var(--ink-400);font-size:11px;font-style:italic}
@media (max-width:700px){.linked-grid{grid-template-columns:repeat(2,1fr)}.prod-name{font-size:22px}}

/* ===== mobile (2026-05-21) — bundle 页防溢出综合修复 ===== */
@media (max-width:767px){
  /* 关键：grid 子项 min-width:0，否则内部内容会把 1fr 轨道撑得比视口宽，
     导致整页（含主图）横向溢出 */
  .product-grid > *{min-width:0}
  .product-details{gap:24px}
  .product-details > *{min-width:0;max-width:100%}
  .prod-gallery{max-width:none;width:100%}
  .product-information{min-width:0}
  /* 移动端白卡内边距收窄，给内容更多空间 */
  .product-main{padding:16px}
  /* 主图方框不超过可用宽度 */
  #windowDiv{max-width:none}
  /* sub-row: side(price/qty) 换到下一行，避免 min-width:180px 溢出 */
  .bundle-sub{flex-wrap:wrap}
  .bundle-sub-side{flex-basis:100%;min-width:0;text-align:left;padding-left:78px;margin-top:8px}
  /* 子产品名长词允许断行 */
  .bundle-sub-name a{overflow-wrap:anywhere;word-break:break-word}
  /* unit-price-card label 改块级 → 长文案按容器宽度换行 */
  .unit-price-card .label{display:block}
  .unit-price-card .auth-tag{display:inline-block;margin-left:6px}
  .unit-price-card .now,.unit-price-card .was{white-space:normal;overflow-wrap:anywhere}
  /* summary 行允许换行，长 label + 大数字不再横向溢出 */
  .bundle-summary-row{flex-wrap:wrap;gap:2px 10px}
  /* tab 导航与升级网格不溢出 */
  .nav-tabs{flex-wrap:wrap}
}

/* 缺货角标（详情页商品名旁）—— 详见 PROJECT_CONTEXT.md §11.14 */
.prod-stockout{display:inline-block;vertical-align:middle;margin-left:10px;padding:3px 9px;background:#A84234;color:#fff;font-size:13px;font-weight:600;letter-spacing:.1em;border-radius:3px;white-space:nowrap}
@media (max-width:768px){.prod-stockout{font-size:12px;padding:2px 7px;margin-left:6px}}

/* 缺货禁用态（加购按钮/链接）—— 详见 PROJECT_CONTEXT.md §11.14 */
.is-stockout{pointer-events:none !important;cursor:not-allowed !important;opacity:.55 !important;filter:grayscale(.5)}
button.add-to-cart.is-stockout,button.add-to-cart-bundle.is-stockout{background:#888 !important;border-color:#888 !important;color:#eee !important;opacity:.85 !important;filter:none !important}
button.add-to-cart.is-stockout:hover,button.add-to-cart-bundle.is-stockout:hover{background:#888 !important;letter-spacing:.18em !important}