/* =========================================================
   商品详情页 主流电商（京东）风格 精修覆盖
   在已有 ProductShow v3 布局基础上打磨细节，不改业务逻辑
   ========================================================= */

/* ---- 页面底色与卡片统一 ---- */
body{ background:#f4f4f4; }
.pd-stage,.pd-content,.pd-buy{
  border:1px solid #ececec;
  border-radius:10px;
  box-shadow:0 2px 10px rgba(0,0,0,.04);
}

/* ---- 缩略图列：翻页箭头默认隐藏（无需滚动时），按需由 JS 加 .can-scroll 显示 ---- */
.pd-stage .pic_small .bt_before,
.pd-stage .pic_small .bt_next{
  display:none !important;
  width:90px !important;
  height:20px !important;
  line-height:18px !important;
  color:#999 !important;
  background:#fafafa !important;
  border:1px solid #ececec !important;
  border-radius:4px !important;
  font-size:12px !important;
  text-align:center !important;
  padding:0 !important;
  margin:0 0 4px !important;
  cursor:pointer;
}
.pd-stage .pic_small .bt_next{ margin:4px 0 0 !important; }
.pd-stage .pic_small.can-scroll .bt_before,
.pd-stage .pic_small.can-scroll .bt_next{ display:block !important; }
.pd-stage .pic_small .bt_before:hover,
.pd-stage .pic_small .bt_next:hover{ color:#e4393c !important; border-color:#f0c0c0 !important; background:#fff5f5 !important; }

/* ---- 规格（颜色/包装）选项卡：自适应等宽、文字完整可换行不裁切 ---- */
.pd-buy li.color-zone ul.list_condition{
  display:grid !important;
  grid-template-columns:repeat(auto-fill,minmax(200px,1fr)) !important;
  gap:8px !important;
}
.pd-buy li.color-zone ul.list_condition li{
  flex:none !important;
  width:auto !important;
}
.pd-buy li.color-zone ul.list_condition li a{
  width:100% !important;
  box-sizing:border-box !important;
  min-height:52px !important;
  padding:6px 8px !important;
  align-items:center !important;
  overflow:hidden !important;
}
.pd-buy li.color-zone ul.list_condition li a img{
  width:40px !important; height:40px !important; flex:0 0 40px !important;
}
.pd-buy li.color-zone ul.list_condition li a span,
.pd-buy li.color-zone ul.list_condition li a .span{
  white-space:normal !important;
  text-overflow:clip !important;
  line-height:1.2 !important;
  font-size:12px !important;
  display:-webkit-box !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:2 !important;
  overflow:hidden !important;
  word-break:break-all !important;
}
.pd-buy ul.list_condition li.status_on a,
.pd-buy ul.list_condition li a:hover{
  border-color:#e4393c !important;
  box-shadow:0 0 0 1px #e4393c inset !important;
}

/* 包装规格（纯文字胶囊，若有数据） */
.pd-buy li.pack-zone ul.list_condition{
  display:flex !important; flex-wrap:wrap !important; gap:8px !important;
}
.pd-buy li.pack-zone ul.list_condition li{ flex:0 0 auto !important; width:auto !important; }
.pd-buy li.pack-zone ul.list_condition li a{
  width:auto !important; min-width:0 !important; min-height:34px !important;
  padding:6px 18px !important; justify-content:center !important;
}
.pd-buy li.pack-zone ul.list_condition li a .span{ white-space:nowrap !important; }

/* ---- 价格行右侧（累计评价等）不被裁切 ---- */
.pd-buy .pd-price-tools{ flex:0 0 auto; gap:14px; }
.pd-buy .pd-price-tools a,
.pd-buy .pd-price-tools span{ white-space:nowrap; }
.pd-buy ul#goods_detail_mate li.item_icson .pd-price-tools{ position:static !important; margin-left:12px !important; }

/* ---- 购买按钮：加入购物车红、立即购买红，统一圆角与高度 ---- */
.pd-buy .wrap_btn{ gap:10px; }
.pd-buy .wrap_btn .btn_cart,
.pd-buy .wrap_btn .btn_buynow{
  height:46px; line-height:46px; border-radius:6px; font-size:16px; font-weight:700;
}
.pd-buy .wrap_btn .btn_cart{ background:#e1251b; }
.pd-buy .wrap_btn .btn_cart:hover{ background:#c81e16; }
.pd-buy .wrap_btn .btn_buynow{ background:#ff7e00; }
.pd-buy .wrap_btn .btn_buynow:hover{ background:#f06f00; }

/* ---- 数量框圆角统一 ---- */
.pd-buy .number_box{ border-radius:4px !important; }

/* ---- 外层 Tab 吸顶与卡片衔接 ---- */
.pd-outer-tabs{ border-radius:10px 10px 0 0; }

/* ---- 右侧悬浮工具栏精修 ---- */
.side_bar a, #sider_toolbar a, .jd-side-tool a{ border-radius:6px; }

/* =========================================================
   「推荐」Tab：最近浏览 / 相关分类 / 同类品牌 主流电商重构
   ========================================================= */
#pd-pane-recommend .mod_aider{
  background:#fff; border:1px solid #ececec; border-radius:10px;
  box-shadow:0 2px 10px rgba(0,0,0,.04); padding:16px 18px; margin-bottom:16px;
}
#pd-pane-recommend .mod_aider .hd{ margin-bottom:14px; }
#pd-pane-recommend .mod_aider .hd h3{ font-size:16px; font-weight:700; color:#333; }
#pd-pane-recommend .mod_aider .hd h3::before{
  content:""; display:inline-block; width:4px; height:16px; background:#e4393c;
  border-radius:2px; margin-right:8px; vertical-align:-2px;
}

/* ---- 最近浏览过的：统一商品网格卡 ---- */
#recent ul.list_goods{
  display:grid !important;
  grid-template-columns:repeat(auto-fill,minmax(168px,1fr)) !important;
  gap:12px !important;
}
#recent ul.list_goods li{
  background:#fff; border:1px solid #f0f0f0; border-radius:8px; padding:12px 10px;
  display:flex !important; flex-direction:column !important;
  transition:transform .18s,box-shadow .18s,border-color .18s;
}
#recent ul.list_goods li:hover{
  transform:translateY(-3px); border-color:#f5c6c6; box-shadow:0 8px 20px rgba(228,57,60,.14);
}
#recent ul.list_goods li a.img{
  display:flex !important; align-items:center; justify-content:center;
  width:100% !important; height:132px !important; flex:0 0 132px !important;
  margin-bottom:8px; overflow:hidden;
}
#recent ul.list_goods li a.img img{
  width:auto !important; height:120px !important; max-width:100%; object-fit:contain;
  transition:transform .2s;
}
#recent ul.list_goods li:hover a.img img{ transform:scale(1.05); }
#recent ul.list_goods li .link_info{ display:flex !important; flex-direction:column !important; padding-left:0 !important; }
#recent ul.list_goods li .link_info>a{ display:block; }
#recent ul.list_goods li .name{
  font-size:13px; color:#333; font-weight:400; line-height:1.3;
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden;
  margin-bottom:6px;
}
#recent ul.list_goods li a:hover .name{ color:#e4393c; }
#recent ul.list_goods li .price{ color:#e4393c; font-size:17px; font-weight:700; }

/* ---- 相关分类：胶囊标签 ---- */
#c3id_same ul.cate-capsules{ display:flex; flex-wrap:wrap; gap:12px; }
#c3id_same ul.cate-capsules li{
  list-style:none; height:auto !important; min-height:0 !important;
  line-height:normal !important; overflow:visible !important;
}
#c3id_same ul.cate-capsules a{
  display:inline-block; padding:7px 22px; background:#f7f7f7;
  border:1px solid #e8e8e8; border-radius:18px; color:#666; font-size:13px; transition:all .15s;
}
#c3id_same ul.cate-capsules a:hover{ background:#fff5f5; border-color:#e4393c; color:#e4393c; }

/* ---- 同类品牌：品牌 logo 墙（图片为主，失败回退文字） ---- */
#cmd_manu ul.brand-grid{
  display:grid !important;
  grid-template-columns:repeat(auto-fill,minmax(172px,1fr)) !important;
  grid-auto-rows:minmax(96px,auto) !important;
  gap:10px !important;
}
#cmd_manu ul.brand-grid li.brand-item{
  list-style:none; height:auto !important; min-height:0 !important;
  line-height:normal !important; overflow:visible !important;
}
#cmd_manu ul.brand-grid .brand-card{
  display:flex !important; flex-direction:column; align-items:center; justify-content:center;
  height:96px; background:#fff; border:1px solid #ececec; border-radius:8px;
  padding:10px; overflow:hidden; transition:all .16s;
}
#cmd_manu ul.brand-grid .brand-card:hover{
  border-color:#e4393c; box-shadow:0 6px 16px rgba(228,57,60,.13); transform:translateY(-2px);
}
#cmd_manu ul.brand-grid .brand-logo{
  display:flex !important; align-items:center; justify-content:center;
  width:100%; flex:1 1 auto; min-height:0;
}
#cmd_manu ul.brand-grid .brand-initial{ display:none !important; }
#cmd_manu ul.brand-grid .brand-img{
  display:block !important; width:auto !important; height:auto !important;
  max-width:92% !important; max-height:66px !important; object-fit:contain; border-radius:0;
}
#cmd_manu ul.brand-grid .brand-name{ display:none; }
/* logo 加载失败（JS 加 .no-logo）回退为文字品牌名 */
#cmd_manu ul.brand-grid .brand-card.no-logo .brand-logo{ display:none !important; }
#cmd_manu ul.brand-grid .brand-card.no-logo .brand-name{
  display:block !important; font-size:14px; color:#333; font-weight:500;
  text-align:center; line-height:1.3; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:100%;
}
#cmd_manu ul.brand-grid .brand-card.no-logo:hover .brand-name{ color:#e4393c; }

/* =====================================================================
   大家评 / 售后保障 —— 主流电商风格重构
   ===================================================================== */

/* 售后顶部服务说明条 */
#pd-pane-service .pd-service-note{
  background:#f2f8ff; border:1px solid #dcecff; border-radius:8px;
  padding:12px 16px 12px 42px; color:#4a6a8a; font-size:13px; line-height:1.65; margin:0 0 16px;
  position:relative;
}
#pd-pane-service .pd-service-note::before{
  content:"i"; position:absolute; left:14px; top:13px; width:19px; height:19px; border-radius:50%;
  background:#316ac5; color:#fff; font-size:13px; font-weight:700; font-style:italic;
  text-align:center; line-height:19px;
}

/* 评论 / 咨询卡片统一 */
#review_box.mod_goods_info,
#asking_box.mod_goods_info{
  background:#fff; border:1px solid #ececec; border-radius:10px;
  box-shadow:0 2px 10px rgba(0,0,0,.04); overflow:hidden; margin:0 0 16px;
}
/* 无咨询数据时也展示咨询框架（与主流电商一致） */
#asking_box.asking_box{ display:block !important; }

/* 子标签 header：横向 tab */
#review_header.hd,
#asking_header.hd{
  display:flex !important; align-items:center; gap:2px; list-style:none;
  border-bottom:1px solid #ececec; padding:0 12px; margin:0; background:#fafafa;
}
#review_header.hd li,
#asking_header.hd li{ list-style:none; margin:0; padding:0; border:none; background:none; }
#review_header.hd li h3,
#asking_header.hd li h3{ margin:0; font-size:14px; font-weight:400; background:transparent !important; border:0 !important; }
#review_header.hd li a,
#asking_header.hd li a{
  display:block; padding:13px 18px; color:#666; font-size:14px; position:relative;
  border:none; background:none; transition:color .15s;
}
#review_header.hd li a:hover,
#asking_header.hd li a:hover{ color:#e4393c; }
#review_header.hd li.status_on a,
#asking_header.hd li.status_on a{ color:#e4393c; font-weight:700; }
#review_header.hd li.status_on a::after,
#asking_header.hd li.status_on a::after{
  content:""; position:absolute; left:14px; right:14px; bottom:-1px; height:3px;
  background:#e4393c; border-radius:2px 2px 0 0;
}

/* 内容区 */
#review_content.bd,
#asking_content.bd{ padding:0; background:#fff; }

/* 发表按钮（右侧胶囊） */
#review_content .more,
#asking_content .more{ display:flex; justify-content:flex-end; padding:14px 16px 2px; }
#review_content .more a,
#asking_content .more a{
  display:inline-flex; align-items:center; padding:7px 18px; border-radius:18px;
  border:1px solid #e4393c; color:#e4393c; background:#fff; font-size:13px; transition:all .15s;
}
#review_content .more a:hover,
#asking_content .more a:hover{ background:#e4393c; color:#fff; box-shadow:0 3px 10px rgba(228,57,60,.25); }

/* 咨询提示条 */
#asking_content .comment_tips{
  margin:12px 16px 2px; padding:10px 14px; background:#fffbe6; border:1px solid #ffe9a8;
  border-radius:8px; color:#8a6d3b; font-size:12.5px; line-height:1.65;
}
#asking_content .comment_tips .tit{ color:#b8860b; font-weight:700; margin-right:4px; }

/* 评论 / 咨询列表 */
.comment_all{ padding:8px 16px 16px; }
.comment_all .content{ min-height:56px; }
ul.list_comment, ul.list_refer{ list-style:none; margin:0; padding:0; }
/* 原始空态 .tips_cont 主流化：居中、灰字、图标 */
.comment_all .tips_cont{
  display:flex !important; flex-direction:column; align-items:center; justify-content:center;
  padding:46px 0 38px; text-align:center;
}
.comment_all .tips_cont p{ margin:0; }
.comment_all .tips_cont strong.strong{
  color:#999 !important; font-size:13px !important; font-weight:400 !important;
}
ul.list_comment .tips_cont::before,
ul.list_refer .tips_cont::before{
  content:""; width:56px; height:56px; flex:0 0 56px; margin-bottom:14px;
  background-position:center; background-size:contain; background-repeat:no-repeat;
}
ul.list_comment .tips_cont::before{
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 48 48'><path d='M40 4H8C5.8 4 4 5.8 4 8v36l8-8h28c2.2 0 4-1.8 4-4V8c0-2.2-1.8-4-4-4z' fill='%23e0e0e0'/><circle cx='16' cy='24' r='3' fill='%23bdbdbd'/><circle cx='24' cy='24' r='3' fill='%23bdbdbd'/><circle cx='32' cy='24' r='3' fill='%23bdbdbd'/></svg>");
}
ul.list_refer .tips_cont::before{
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 48 48'><circle cx='24' cy='24' r='20' fill='%23e0e0e0'/><path d='M24 13c3.3 0 6 2.2 6 5.3 0 2.2-1.4 3.6-2.8 4.5-1.1.7-1.5 1.2-1.5 2.4v.6h-3.4v-.9c0-1.9.9-2.9 2.2-3.8 1.1-.7 2-1.3 2-2.6 0-1.3-1-2.1-2.5-2.1-1.5 0-2.5.8-2.7 2.2h-3.4C18.2 15 20.7 13 24 13z' fill='%23ffffff'/><circle cx='24' cy='33' r='2' fill='%23ffffff'/></svg>");
}
.page_wrap{ padding:10px 0 2px; }

/* 特别声明卡片 */
#pd-pane-service .id_state{
  background:#fffdf5; border:1px solid #f3e6c0; border-radius:10px; padding:16px 18px;
}
#pd-pane-service .id_state .hd{
  background:transparent !important; border:0 !important; padding:0 0 8px;
}
#pd-pane-service .id_state .hd h3{
  font-size:15px; color:#8a6d3b; font-weight:700; margin:0;
}
#pd-pane-service .id_state .hd h3::before{
  content:"!"; display:inline-flex; width:19px; height:19px; border-radius:50%; background:#e6a23c;
  color:#fff; font-size:13px; font-weight:700; align-items:center; justify-content:center; margin-right:8px; vertical-align:-3px;
}
#pd-pane-service .id_state .state_cont{
  color:#7a5c2e; font-size:13px; line-height:1.85; margin:10px 0 0; background:none;
}

/* ========== 商品详情 Tab 内层重构 ========== */
#introduction{ background:#fff; border:1px solid #f0f0f0; border-radius:10px; padding:18px 20px; }
/* 内层子标签：简洁文字 tab */
#introduction ul.hd{
  display:flex; flex-wrap:wrap; gap:0; list-style:none; margin:0 0 18px; padding:0;
  background:transparent !important; border:0 !important; border-bottom:1px solid #eee;
}
#introduction ul.hd li{
  background:transparent !important; border:0 !important; margin:0; padding:0; float:none; position:relative;
}
#introduction ul.hd li h3{
  margin:0; font-size:14px; font-weight:400; background:transparent !important; border:0 !important;
}
#introduction ul.hd li h3 a{
  display:inline-block; padding:10px 18px; color:#666; font-size:14px; line-height:1.4;
  background:transparent !important; border:0 !important; border-radius:0;
}
#introduction ul.hd li h3 a:hover{ color:#e4393c; }
#introduction ul.hd li.status_on h3 a{ color:#e4393c; font-weight:700; }
#introduction ul.hd li.status_on::after{
  content:""; position:absolute; left:14px; right:14px; bottom:-1px; height:2px; background:#e4393c; border-radius:1px;
}
/* 内容面板 */
#introduction .intro-main{ border:0; padding:0; background:transparent; }
#introduction .intro-main p{ margin:0 0 12px; color:#555; font-size:13px; line-height:1.8; }
#introduction .intro-main p img, #introduction .intro-main img{ max-width:100%; height:auto; border-radius:6px; }
/* 参数网格 */
#introduction .bd .intro-main ul.detail-list{
  list-style:none; margin:0 0 16px; padding:14px 18px !important; background:#fafafa !important;
  border:1px solid #f0f0f0 !important; border-radius:8px; display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 24px; overflow:visible !important; zoom:1;
}
#introduction .bd .intro-main ul.detail-list li{
  margin:0 !important; padding:0 !important; font-size:13px; line-height:1.6; background:transparent;
  border:0 !important; display:flex !important; align-items:baseline; gap:4px; float:none !important;
  width:auto !important; white-space:normal !important; height:auto !important;
  overflow:visible !important; text-overflow:clip !important;
}
#introduction .bd #c_introduce > ul.detail-list li:first-child{ grid-column:1 / -1; }
#introduction .bd .intro-main ul.detail-list li .dl-key{ color:#999; flex:0 0 auto; }
#introduction .bd .intro-main ul.detail-list li .dl-val{ color:#333; font-weight:500; word-break:break-all; }
/* 商品简介 / 商品特性 标题 */
#introduction .mod_detail_info{ margin:20px 0 0; }
#introduction .mod_detail_info .mod_hd{
  display:flex; align-items:center; margin:0 0 12px; padding:0; background:transparent; border:0;
}
#introduction .mod_detail_info .mod_hd h3{
  margin:0; font-size:12px; font-weight:400; color:#999; display:flex; align-items:center; flex-wrap:wrap;
}
#introduction .mod_detail_info .mod_hd h3 .tit{
  font-size:15px; font-weight:700; color:#333; margin-right:10px; position:relative; padding-left:11px;
}
#introduction .mod_detail_info .mod_hd h3 .tit::before{
  content:""; position:absolute; left:0; top:50%; transform:translateY(-50%);
  width:4px; height:15px; border-radius:2px; background:#e4393c;
}
#introduction .mod_detail_info .mod_hd i.line{ display:none; }
#introduction .mod_detail_info .mod_bd{ color:#555; font-size:13px; line-height:1.8; }
#introduction .mod_detail_info .mod_bd p{ margin:0 0 10px; }
#introduction .mod_detail_info .mod_bd img{ max-width:100%; height:auto; border-radius:6px; }
