/* ================= 咨询弹窗（全站） =================
   点击页面上的咨询类按钮（[data-consult]）打开，内容由系统表单定义动态渲染。
   视觉与导航搜索弹窗（.smodal）保持同一套语言：深色中性遮罩 + 模糊、纯白卡片、
   唯一阴影尺寸 var(--sh-size)、品牌橙只用于主按钮与聚焦描边。
   文案（标题/按钮/提示/验证码）由 consult.js 按 <html lang> 写入中英文。 */

.cmodal{position:fixed;inset:0;z-index:210;visibility:hidden;pointer-events:none}
.cmodal.on{visibility:visible;pointer-events:auto}

/* 遮罩：深色中性（不加色相）+ 背景模糊，与搜索弹窗同款 */
.cmodal-mask{
  position:absolute;inset:0;
  background:rgba(13,15,18,.52);
  -webkit-backdrop-filter:blur(14px) saturate(120%);
  backdrop-filter:blur(14px) saturate(120%);
  opacity:0;transition:opacity .3s var(--ease);
}
.cmodal.on .cmodal-mask{opacity:1}

/* 卡片：水平居中、垂直留出上下呼吸；内容高于视口时卡片内部滚动 */
.cmodal-box{
  position:relative;
  width:min(560px,calc(100% - 2 * var(--nav-x)));
  max-height:calc(100vh - 2 * var(--nav-x));
  margin:7vh auto 0;
  display:flex;flex-direction:column;
  background:var(--panel);
  border-radius:var(--r-sm);
  box-shadow:var(--sh-size) rgba(13,15,18,.24);
  opacity:0;transform:translateY(-10px);
  transition:opacity .32s var(--ease),transform .32s var(--ease);
}
.cmodal.on .cmodal-box{opacity:1;transform:translateY(0)}
body.cmodal-locked{overflow:hidden}

.cmodal-x{
  position:absolute;top:14px;right:14px;z-index:2;
  width:34px;height:34px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:20px;line-height:1;color:var(--ink-4);
  transition:background .2s var(--ease),color .2s var(--ease);
}
.cmodal-x:hover{background:var(--panel-2);color:var(--ink)}

.cmodal-head{padding:26px 30px 0}
.cmodal-head h3{
  margin:0;font-size:22px;font-weight:700;letter-spacing:-.01em;
  color:var(--ink);line-height:1.35;
}
.cmodal-head p{
  margin:8px 0 0;font-size:14px;line-height:1.68;color:var(--ink-3);
}

.cmodal-body{
  padding:20px 30px 26px;overflow-y:auto;
  -webkit-overflow-scrolling:touch;
}

/* ---- 字段 ---- */
.cm-field{margin-bottom:16px}
.cm-field:last-child{margin-bottom:0}
.cm-label{
  display:block;margin-bottom:7px;
  font-size:14px;font-weight:500;color:var(--ink-2);line-height:1.4;
}
.cm-star{color:var(--orange-d);margin-left:3px}
.cm-input,.cm-textarea{
  width:100%;padding:11px 13px;
  font:inherit;font-size:14px;line-height:1.5;color:var(--ink);
  background:var(--panel);
  border:1px solid var(--line-2);border-radius:10px;
  outline:none;
  transition:border-color .2s var(--ease),box-shadow .2s var(--ease);
}
.cm-input::placeholder,.cm-textarea::placeholder{color:var(--ink-4)}
.cm-input:focus,.cm-textarea:focus{
  border-color:var(--orange);
  box-shadow:0 0 0 3px rgba(255,153,0,.14);
}
.cm-textarea{min-height:104px;resize:vertical}
.cm-input[aria-invalid="true"],.cm-textarea[aria-invalid="true"]{border-color:var(--orange-d)}
.cm-help{margin-top:5px;font-size:12px;color:var(--ink-4);line-height:1.5}

/* 文件上传：极简——原生 input 收窄，下方列出进度/结果 */
.cm-file{margin-top:7px;font-size:13px;color:var(--ink-3)}
.cm-file-list{margin-top:6px;display:grid;gap:4px;font-size:12.5px;color:var(--ink-4)}
.cm-file-list .ok{color:var(--ink-3)}
.cm-file-list .err{color:var(--orange-d)}

/* ---- 验证码 ---- */
.cm-cap{margin-top:2px}
.cm-cap-row{display:flex;gap:10px;align-items:stretch}
.cm-cap-row .cm-input{flex:1;min-width:0}
.cm-cap-img{
  flex:none;width:112px;height:44px;
  display:flex;align-items:center;justify-content:center;
  background:var(--panel-2);
  border:1px solid var(--line-2);border-radius:10px;
  overflow:hidden;
  transition:border-color .2s var(--ease);
}
.cm-cap-img:hover{border-color:var(--line-2);background:#F7F7F9}
.cm-cap-img svg{display:block;width:100%;height:100%}
.cm-cap-hint{margin-top:5px;font-size:12px;color:var(--ink-4)}

/* 蜜罐：正常用户看不见、也不会填（系统侧同样有这道校验） */
.cm-hp{
  position:absolute!important;left:-9999px!important;
  width:1px;height:1px;opacity:0;pointer-events:none;
}

/* ---- 提示与提交 ---- */
.cm-msg{
  margin:14px 0 0;font-size:13.5px;line-height:1.6;
  color:var(--ink-3);min-height:0;
}
.cm-msg.err{color:var(--orange-d)}
.cm-actions{margin-top:18px}
.cm-actions .btn{width:100%;justify-content:center}
.cm-actions .btn[disabled]{opacity:.5;cursor:not-allowed}

/* 加载骨架：拉表单定义期间 */
.cm-loading{display:grid;gap:14px;padding:4px 0}
.cm-skel{height:44px;border-radius:10px;background:var(--panel-2)}
.cm-skel.sm{width:38%;height:14px}

/* 成功态 */
.cm-done{padding:8px 0 4px;text-align:center}
.cm-done .ic-ok{
  width:52px;height:52px;margin:0 auto 14px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:var(--orange-050);color:var(--orange-d);
}
.cm-done h3{margin:0;font-size:19px;font-weight:700;color:var(--ink)}
.cm-done p{margin:8px 0 0;font-size:14px;line-height:1.7;color:var(--ink-3)}

/* 表单关闭/加载失败时的兜底提示 */
.cm-fail{font-size:14px;line-height:1.7;color:var(--ink-3)}
.cm-fail a{color:var(--orange-d);text-decoration:underline;text-underline-offset:3px}

@media (max-width:680px){
  .cmodal-box{
    width:calc(100% - 2 * var(--nav-x));
    margin:4vh auto 0;
    max-height:calc(100vh - 8vh);
  }
  .cmodal-head{padding:22px 20px 0}
  .cmodal-head h3{font-size:19px}
  .cmodal-body{padding:16px 20px 22px}
  .cm-cap-row{flex-direction:row}
  .cm-cap-img{width:96px;height:42px}
}

/* 「减少动态效果」下不做位移与淡入 */
@media (prefers-reduced-motion:reduce){
  .cmodal-mask,.cmodal-box{transition:none}
  .cmodal-box{transform:none}
}