@charset "UTF-8";
/* ===== 现货列表「在线咨询」按钮 + 弹层 ===== */
:root{
  --cm-blue:#1d5488;--cm-blue-2:#2a74b8;--cm-ink:#183a63;--cm-line:#e2eaf4;
  --cm-text:#27384b;--cm-muted:#8191a4;--cm-bg:#f4f8fc;
}

/* --- 表格行内按钮（电话号码下方，跟随号码右对齐） --- */
.mh-consult-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:4px;height:22px;margin:0 0 3px 8px;padding:0 9px;
  vertical-align:middle;
  border:1px solid #cfe0f2;border-radius:999px;background:#eef6ff;color:var(--cm-blue);
  font-size:12px;line-height:1;cursor:pointer;white-space:nowrap;
  transition:background .18s,color .18s,border-color .18s,box-shadow .18s;
}
.mh-consult-btn:hover{background:var(--cm-blue);border-color:var(--cm-blue);color:#fff;box-shadow:0 4px 12px rgba(29,84,136,.25)}
.mh-consult-btn:active{transform:translateY(1px)}
.mh-consult-btn .cm-ico-chat{
  position:relative;display:inline-block;width:12px;height:10px;border:1.5px solid currentColor;border-radius:4px;
}
.mh-consult-btn .cm-ico-chat:after{
  content:"";position:absolute;left:2px;bottom:-4px;width:0;height:0;
  border-left:0;border-top:4px solid currentColor;border-right:4px solid transparent;
}
/* 移动端卡片按钮 */
.mh-mobile-consult{
  display:flex;align-items:center;justify-content:center;gap:6px;width:100%;height:40px;margin-top:10px;
  border:1px solid #cfe0f2;border-radius:10px;background:#eef6ff;color:var(--cm-blue);font-size:14px;font-weight:600;
}
.mh-mobile-consult .cm-ico-chat{position:relative;display:inline-block;width:13px;height:11px;border:1.5px solid currentColor;border-radius:4px}
.mh-mobile-consult .cm-ico-chat:after{content:"";position:absolute;left:2px;bottom:-4px;border-top:4px solid currentColor;border-right:4px solid transparent}

/* --- 遮罩 & 卡片 --- */
.cm-mask{
  position:fixed;inset:0;z-index:10000;display:none;align-items:center;justify-content:center;padding:20px;
  background:rgba(12,30,51,.52);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);
}
.cm-mask.is-open{display:flex;animation:cmFade .18s ease-out}
@keyframes cmFade{from{opacity:0}to{opacity:1}}
.cm-dialog{
  position:relative;width:min(430px,100%);max-height:calc(100vh - 40px);overflow-y:auto;overflow-x:hidden;
  background:#fff;border-radius:22px;box-shadow:0 30px 80px rgba(9,28,52,.38);
  animation:cmUp .28s cubic-bezier(.2,.9,.28,1);
}
@keyframes cmUp{from{opacity:0;transform:translateY(26px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}

/* 头部 */
.cm-head{
  position:relative;display:flex;align-items:flex-start;justify-content:space-between;gap:14px;
  padding:24px 24px 22px;color:#fff;
  background:linear-gradient(135deg,#205f9c 0%,#173c6a 100%);
}
.cm-head:after{
  content:"";position:absolute;right:-30px;top:-40px;width:150px;height:150px;border-radius:50%;
  background:rgba(255,255,255,.08);pointer-events:none;
}
.cm-head__text h3{margin:0;font-size:19px;font-weight:700;letter-spacing:.3px}
.cm-head__text p{margin:6px 0 0;font-size:12px;color:rgba(255,255,255,.72)}
.cm-close{
  position:relative;z-index:1;flex:0 0 auto;width:30px;height:30px;padding:0;border:0;border-radius:50%;
  background:rgba(255,255,255,.16);color:#fff;font-size:20px;line-height:30px;text-align:center;cursor:pointer;
  transition:background .18s,transform .18s;
}
.cm-close:hover{background:rgba(255,255,255,.3);transform:rotate(90deg)}

/* 内容 */
.cm-body{padding:22px 24px 26px}
.cm-pane[hidden]{display:none}

/* 商品信息条 */
.cm-goods{
  padding:14px 16px;border:1px solid var(--cm-line);border-radius:14px;background:var(--cm-bg);
}
.cm-goods__row{display:flex;align-items:center;flex-wrap:wrap;gap:6px 8px;font-size:13px;color:var(--cm-text)}
.cm-goods__row + .cm-goods__row{margin-top:8px}
.cm-goods__k{color:var(--cm-muted);font-size:12px}
.cm-goods__row b{font-weight:600;color:var(--cm-ink);margin-right:10px;max-width:42%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cm-goods__comp{
  display:flex;align-items:center;gap:6px;margin-top:10px;padding-top:10px;border-top:1px dashed #d6e2f0;
  font-size:13px;font-weight:600;color:var(--cm-blue);
}
.cm-ico-store{
  position:relative;display:inline-block;width:13px;height:11px;border:1.5px solid currentColor;border-radius:2px;
}
.cm-ico-store:before{content:"";position:absolute;left:2px;top:-4px;width:7px;height:4px;border:1.5px solid currentColor;border-bottom:0;border-radius:2px 2px 0 0}

/* 表单 */
.cm-field{display:block;margin-top:18px}
.cm-field__label{display:block;margin-bottom:8px;font-size:13px;font-weight:600;color:var(--cm-ink)}
.cm-field__label em{color:#e0574b;font-style:normal}
.cm-field__label .cm-opt{margin-left:4px;padding:1px 6px;border-radius:4px;background:#eef2f7;color:#8b98a9;font-size:11px;font-style:normal;font-weight:400}
/* 已自动填入微信授权手机号 */
.cm-field__label .cm-opt.is-filled{background:#e8f7ee;color:#2a9d63}
.cm-field input,.cm-field textarea{
  width:100%;padding:12px 14px;border:1px solid var(--cm-line);border-radius:12px;background:#fff;
  font-family:inherit;font-size:14px;color:var(--cm-text);outline:none;transition:border-color .18s,box-shadow .18s;
}
.cm-field textarea{line-height:1.6;resize:vertical;min-height:84px}
.cm-field input::placeholder,.cm-field textarea::placeholder{color:#aab6c6}
.cm-field input:focus,.cm-field textarea:focus{border-color:var(--cm-blue-2);box-shadow:0 0 0 3px rgba(42,116,184,.14)}
.cm-field input.is-error{border-color:#e0574b;box-shadow:0 0 0 3px rgba(224,87,75,.12)}
.cm-field__err{display:none;margin-top:6px;font-size:12px;color:#e0574b}
.cm-field__err.is-show{display:block}

/* 提交 */
.cm-submit{
  display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:48px;margin-top:22px;
  border:0;border-radius:12px;cursor:pointer;color:#fff;font-size:15px;font-weight:600;letter-spacing:.5px;
  background:linear-gradient(135deg,#2a74b8,#1a4c7d);box-shadow:0 10px 24px rgba(26,76,125,.3);
  transition:transform .16s,box-shadow .16s,filter .16s;
}
.cm-submit:hover{filter:brightness(1.06);box-shadow:0 14px 28px rgba(26,76,125,.36)}
.cm-submit:active{transform:translateY(1px)}
.cm-submit.is-loading{pointer-events:none;filter:saturate(.7);opacity:.85}
.cm-submit__arrow{font-style:normal;transition:transform .18s}
.cm-submit:hover .cm-submit__arrow{transform:translateX(4px)}
.cm-note{
  display:flex;align-items:center;justify-content:center;gap:5px;margin:14px 0 0;
  font-size:11.5px;color:#9aa7b8;
}
.cm-ico-shield{
  position:relative;display:inline-block;width:11px;height:12px;border:1.4px solid currentColor;border-radius:6px 6px 7px 7px;
}

/* 成功态 */
.cm-pane--ok{text-align:center;padding-top:6px}
.cm-ok{
  width:64px;height:64px;margin:6px auto 16px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#eaf7ef,#d6efe1);animation:cmPop .36s cubic-bezier(.2,1.4,.4,1);
}
@keyframes cmPop{from{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}
.cm-ok__tick{
  display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;
  background:#2f9e6a;color:#fff;font-size:22px;font-weight:700;
}
.cm-ok__title{margin:0;font-size:18px;font-weight:700;color:var(--cm-ink)}
.cm-ok__sub{margin:8px 0 0;font-size:13px;color:var(--cm-muted)}
.cm-qr{
  position:relative;width:172px;height:172px;margin:20px auto 0;padding:10px;
  border-radius:16px;background:#fff;box-shadow:0 8px 26px rgba(22,56,92,.12);border:1px solid var(--cm-line);
}
.cm-qr img{position:relative;z-index:1;width:100%;height:100%;object-fit:contain;background:#fff;border-radius:8px}
.cm-qr__ph{
  position:absolute;inset:10px;z-index:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  border:1px dashed #cfdcea;border-radius:8px;background:#f7fafd;color:#9aa7b8;font-size:12px;
}
.cm-qr__ph i{font-style:normal;font-size:10px;color:#b9c4d1}
.cm-qr__corner{position:absolute;width:14px;height:14px;border:2px solid var(--cm-blue-2);border-radius:2px}
.cm-qr__corner--tl{left:-1px;top:-1px;border-right:0;border-bottom:0;border-radius:6px 0 0 0}
.cm-qr__corner--tr{right:-1px;top:-1px;border-left:0;border-bottom:0;border-radius:0 6px 0 0}
.cm-qr__corner--bl{left:-1px;bottom:-1px;border-right:0;border-top:0;border-radius:0 0 0 6px}
.cm-qr__corner--br{right:-1px;bottom:-1px;border-left:0;border-top:0;border-radius:0 0 6px 0}
.cm-ok__tip{margin:16px 0 0;font-size:12.5px;color:var(--cm-muted);line-height:1.7}
.cm-done{
  width:100%;height:44px;margin-top:20px;border:1px solid var(--cm-line);border-radius:12px;
  background:#f5f8fc;color:var(--cm-blue);font-size:14px;font-weight:600;cursor:pointer;
  transition:background .18s,border-color .18s;
}
.cm-done:hover{background:#eaf2fa;border-color:#cfdff0}

/* 未登录引导 */
.cm-need{padding:14px 0 4px;text-align:center}
.cm-need__icon{
  width:56px;height:56px;margin:0 auto 16px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#fff2e2,#ffe3c4);color:#d98324;font-size:26px;font-weight:700;
}
.cm-submit--link{
  display:flex;align-items:center;justify-content:center;margin-top:22px;
  text-decoration:none;
}

/* 减少动态效果偏好：关闭入场动画 */
@media (prefers-reduced-motion: reduce){
  .cm-mask,.cm-dialog,.cm-ok{animation:none !important}
}

/* 移动端 */
@media (max-width:640px){
  .cm-mask{padding:0;align-items:flex-end}
  .cm-dialog{width:100%;max-height:92vh;border-radius:20px 20px 0 0;animation:cmSheet .3s cubic-bezier(.2,.9,.28,1)}
  @keyframes cmSheet{from{transform:translateY(100%)}to{transform:translateY(0)}}
  .cm-head{padding:20px 20px 18px}
  .cm-body{padding:18px 20px 24px}
  .cm-goods__row b{max-width:38%}
}
