/* 商家卡片结构改造 V7-6 注入链（图2 结构）
 *   大海报置顶 + 白色信息卡（名称突出 / 服务类型独立行 / 地区 / 主营 / 服务范围 分层）
 *   + 关注移入名称行（右） + 底部两按钮横排（立即咨询·橙 / 查看详情·蓝描边）。
 * 范围: 只改 service-merchants.html 商家列表卡片 UI。
 * 不动: 编译 bundle / 后端 / DB / 服务分类数据 / 海报映射 / 商家详情跳转 / 咨询逻辑 / 其他页面。
 * 选择器 = html + [data-smrestyled="1"] + !important，压过 card-bg-fit-166.css 与 svc-poster-inject.js 注入样式。
 * 回滚: 删 service-merchants.html 中对 svc-card-restyle-166.css / svc-card-restyle-166.js 的两行引用。
 */

/* 已改造卡片：清旧「整卡海报背景」，白色信息卡 */
html article.m-card[data-smrestyled="1"]{
  background:#fff !important;
  background-image:none !important;
  border:1px solid #eceef2 !important;
  border-radius:16px !important;
  overflow:hidden !important;
  box-shadow:0 2px 12px rgba(18,28,55,.06) !important;
  padding:0 !important;
}
html article.m-card[data-smrestyled="1"]::before{ display:none !important; } /* 旧白色渐变遮罩 */
html article.m-card.demo[data-smrestyled="1"]{ background:#fff !important; border-color:#f4d9b4 !important; }

/* 顶部大海报（真实分类海报由 svc-card-restyle-166.js 设 inline background-image） */
.sm-poster{
  position:relative; width:100%; aspect-ratio:2.35 / 1;
  background-color:#eef1f6;
  background-size:cover !important; background-position:center !important; background-repeat:no-repeat !important;
}
.sm-poster::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:34%;
  background:linear-gradient(180deg, rgba(255,255,255,0), rgba(255,255,255,.16)); pointer-events:none;
}

/* 信息区：所有非海报直接子节点的横向留白（.m-acts 自管 margin，排除） */
html article.m-card[data-smrestyled="1"] > :not(.sm-poster):not(.m-acts){ padding-left:16px !important; padding-right:16px !important; }

/* 名称行：名称突出（深蓝） + 状态徽章 + 关注（右，描边胶囊） */
html article.m-card[data-smrestyled="1"] .m-top{ display:flex !important; align-items:center !important; gap:8px; margin:12px 0 0 !important; }
html article.m-card[data-smrestyled="1"] .m-top .m-name{ font-size:17px !important; font-weight:800 !important; color:#17315e !important; }
html article.m-card[data-smrestyled="1"] .m-top .mf-btn{
  margin-left:auto !important; flex:0 0 auto !important; height:30px !important; padding:0 12px !important;
  font-size:13px !important; font-weight:600 !important;
  border:1px solid #e2e6ec !important; background:#fff !important; color:#17315e !important;
  border-radius:999px !important; display:inline-flex !important; align-items:center !important; gap:5px;
}
html article.m-card[data-smrestyled="1"] .m-top .mf-btn::before{ content:"\2661"; font-size:14px; line-height:1; }
html article.m-card[data-smrestyled="1"] .m-top .mf-btn[data-fstate="followed"]{ background:#fff7ed !important; border-color:#fdba74 !important; color:#c2410c !important; }
html article.m-card[data-smrestyled="1"] .m-top .mf-btn[data-fstate="followed"]::before{ content:"\2665"; color:#ea580c; }

/* 服务类型：独立一行，橙色 */
.sm-catrow{ margin:8px 0 0 !important; }
html article.m-card[data-smrestyled="1"] .sm-catrow .m-cat{ font-size:13px !important; font-weight:700 !important; color:#f97316 !important; display:inline-block; }

/* 地区 / 主营 / 服务范围 分层显示 */
html article.m-card[data-smrestyled="1"] .m-loc{ margin:10px 0 0 !important; display:flex !important; align-items:center !important; }
html article.m-card[data-smrestyled="1"] .m-loc .m-loc-a{ color:#17315e !important; font-size:13px !important; font-weight:600 !important; }
.sm-main{ margin:8px 0 0 !important; color:#3a4a63 !important; font-size:13px !important; line-height:1.5; }
.sm-main b{ color:#17315e !important; font-weight:600 !important; }
html article.m-card[data-smrestyled="1"] .svc-scope{ margin:8px 0 0 !important; }
html article.m-card[data-smrestyled="1"] .svc-scope-line{ color:#5b6b85 !important; font-size:12.5px !important; }

/* 底部两按钮横排（保留原立即咨询/查看详情跳转与事件） */
html article.m-card[data-smrestyled="1"] .m-acts{ display:flex !important; gap:12px !important; margin:14px 16px 16px !important; padding:0 !important; }
html article.m-card[data-smrestyled="1"] .m-acts .m-btn{ flex:1 1 0 !important; min-width:0 !important; height:46px !important; font-size:15px !important; font-weight:700 !important; border-radius:12px !important; }
html article.m-card[data-smrestyled="1"] .m-acts .m-btn.primary{ background:#f97316 !important; color:#fff !important; border:1px solid #f97316 !important; }
html article.m-card[data-smrestyled="1"] .m-acts .m-btn.ghost{ background:#fff !important; color:#17315e !important; border:1px solid #17315e !important; }

/* 响应式：海报随宽降高；窄屏字号/按钮收紧，绝不溢出/横滚 */
@media (max-width:480px){
  .sm-poster{ aspect-ratio:2.1 / 1; }
  html article.m-card[data-smrestyled="1"] .m-top .m-name{ font-size:16px !important; }
}
@media (max-width:360px){
  .sm-poster{ aspect-ratio:1.95 / 1; }
  html article.m-card[data-smrestyled="1"] .m-acts .m-btn{ font-size:14px !important; height:44px !important; }
}