/* ==========================================================================
   官网留资表单样式（{yb:form} 内联表单 + 全站留资弹窗）
   - 由静态生成器注入：ContentStaticService::injectLeadForm() 挂 <link>，
     本文件随 skin 目录由 syncSkinAssets() 镜像到 /template/skin/style/form.css
   - 类名统一 yb-lf 前缀，只作用于表单自身，不污染宿主页既有样式
   - 主色取站点主色 #2563eb（与 .pd-btn--primary / 页脚 --footer-bg 同色），
     可用宿主页内联 --yb-lf-theme 覆盖
   - 弹窗 z-index 高于 AI 客服挂件（2147482001），避免被挂件面板压住
   ========================================================================== */
.yb-lf{
  --yb-lf-theme:#2563eb;
  --yb-lf-theme-dark:#1e40af;
  --yb-lf-fg:#1F2937;
  --yb-lf-muted:#6B7280;
  --yb-lf-line:#E5E7EB;
  --yb-lf-bg:#FFFFFF;
  --yb-lf-shadow:0 18px 44px rgba(15,23,42,.18);
  color:var(--yb-lf-fg);
  display:flex;
  flex-wrap:wrap;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  font-size:14px;
  gap:12px 14px;
  line-height:1.7;
}
.yb-lf *{box-sizing:border-box}

/* ---------- 表单主体（内联与弹窗共用） ---------- */
.yb-lf-item{display:flex;flex-direction:column;gap:6px;min-width:0}
.yb-lf-item--half{flex:1 1 46%}
.yb-lf-item--full{flex:1 1 100%}
.yb-lf-item__label{color:var(--yb-lf-fg);font-size:13px;font-weight:500}
.yb-lf-item__req{color:#DC2626;font-style:normal;margin-left:2px}
.yb-lf-item__input{
  background:var(--yb-lf-bg);
  border:1px solid var(--yb-lf-line);
  border-radius:8px;
  color:var(--yb-lf-fg);
  font-family:inherit;
  font-size:14px;
  height:42px;
  padding:0 12px;
  transition:border-color .18s ease,box-shadow .18s ease;
  width:100%;
}
.yb-lf-item__input:focus{border-color:var(--yb-lf-theme);box-shadow:0 0 0 3px rgba(37,99,235,.12);outline:none}
.yb-lf-item__input::placeholder{color:#9CA3AF}
textarea.yb-lf-item__input{height:auto;line-height:1.7;padding:9px 12px;resize:vertical}
select.yb-lf-item__input{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--yb-lf-muted) 50%),linear-gradient(135deg,var(--yb-lf-muted) 50%,transparent 50%);background-position:calc(100% - 18px) 19px,calc(100% - 13px) 19px;background-repeat:no-repeat;background-size:5px 5px,5px 5px;padding-right:34px}
.yb-lf-item__opts{display:flex;flex-wrap:wrap;gap:8px 16px;padding-top:4px}
.yb-lf-item__opt{align-items:center;color:var(--yb-lf-fg);cursor:pointer;display:inline-flex;gap:6px;font-size:14px;font-weight:400}
.yb-lf-item__opt input{accent-color:var(--yb-lf-theme);height:15px;margin:0;width:15px}

/* 图形验证（腾讯云验证码）：点击按钮弹窗验证，通过后一次性票据写隐藏域 */
.yb-lf-item--captcha[hidden]{display:none}
.yb-lf-captcha{align-items:center;display:flex;flex-wrap:wrap;gap:10px}
.yb-lf-captcha__btn{
  background:#F3F4F6;
  border:1px solid #E5E7EB;
  border-radius:8px;
  color:var(--yb-lf-fg);
  cursor:pointer;
  font-family:inherit;
  font-size:14px;
  height:42px;
  padding:0 20px;
  transition:background .2s ease,border-color .2s ease,color .2s ease;
}
.yb-lf-captcha__btn:hover:not([disabled]){background:#E5E7EB}
/* 未填写姓名/手机（或手机号不合法）时按钮置灰禁用，填好后自动恢复可点 */
.yb-lf-captcha__btn[disabled]{
  background:#F3F4F6;
  border-color:#E5E7EB;
  color:#9CA3AF;
  cursor:not-allowed;
}
.yb-lf-item--captcha.is-verified .yb-lf-captcha__btn{
  background:rgba(37,99,235,.08);
  border-color:rgba(37,99,235,.35);
  color:var(--yb-lf-theme);
  cursor:default;
  font-weight:600;
}
.yb-lf-captcha__state{color:#DC2626;font-size:13px}

/* 提交按钮与反馈 */
.yb-lf__foot{flex:1 1 100%}
.yb-lf__submit{
  background:linear-gradient(135deg,var(--yb-lf-theme),var(--yb-lf-theme-dark));
  border:0;
  border-radius:8px;
  box-shadow:0 4px 12px rgba(37,99,235,.3);
  color:#fff;
  cursor:pointer;
  font-family:inherit;
  font-size:15px;
  font-weight:500;
  height:44px;
  transition:box-shadow .2s ease,transform .2s ease;
  width:100%;
}
.yb-lf__submit:hover{box-shadow:0 6px 18px rgba(37,99,235,.4);transform:translateY(-2px)}
.yb-lf__submit[disabled]{cursor:not-allowed;opacity:.6;transform:none}
.yb-lf__msg{flex:1 1 100%;font-size:13px;margin:0;min-height:0}
.yb-lf__msg[hidden]{display:none}
.yb-lf__msg--err{color:#DC2626}
.yb-lf__msg--ok{color:var(--yb-lf-theme)}

/* 内联表单：独立卡片，供首页 / 详情页 / 下载页直接嵌入 */
.yb-lf--inline{
  background:var(--yb-lf-bg);
  border:1px solid var(--yb-lf-line);
  border-radius:14px;
  box-shadow:0 6px 22px rgba(15,23,42,.06);
  padding:22px 24px 24px;
}
.yb-lf--inline .yb-lf__title{
  flex:1 1 100%;
  font-size:19px;
  font-weight:600;
  margin:0;
  padding-left:10px;
  position:relative;
}
.yb-lf--inline .yb-lf__title:before{
  background:var(--yb-lf-theme);
  border-radius:2px;
  content:"";
  height:18px;
  left:0;
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:3px;
}
.yb-lf--inline .yb-lf__desc{color:var(--yb-lf-muted);flex:1 1 100%;font-size:13px;margin:-4px 0 2px}

/* ---------- 留资 CTA（模板里的 data-lead-form 触发器：详情页 CTA / 正文末尾引导条） ---------- */
.yb-lf-cta{
  align-items:center;
  background:linear-gradient(135deg,var(--yb-lf-theme,#2563eb),var(--yb-lf-theme-dark,#1e40af));
  border:0;
  border-radius:8px;
  box-shadow:0 4px 12px rgba(37,99,235,.3);
  color:#fff;
  cursor:pointer;
  display:inline-flex;
  font-family:inherit;
  font-size:15px;
  font-weight:600;
  gap:8px;
  height:44px;
  line-height:1;
  padding:0 24px;
  text-decoration:none;
  transition:box-shadow .2s ease,transform .2s ease;
}
.yb-lf-cta:hover{box-shadow:0 6px 18px rgba(37,99,235,.4);transform:translateY(-2px)}
.yb-lf-cta svg{display:block;flex:0 0 auto;height:18px;width:18px}
/* 首页留资入口：内联表单外包一层通栏白底（对齐首页各区块 80px 节奏） */
.yb-lf-sec{background:#fff;padding:80px 0}
.yb-lf-sec .yb-lf--inline{margin:0 auto;max-width:880px}
/* 正文末尾引导条：文章 / 地域详情页（文案 + 按钮同行，窄屏自动换行） */
.yb-lf-box{
  align-items:center;
  background:linear-gradient(135deg,rgba(37,99,235,.06),rgba(37,99,235,.02));
  border:1px solid rgba(37,99,235,.16);
  border-radius:12px;
  display:flex;
  flex-wrap:wrap;
  gap:14px 18px;
  justify-content:space-between;
  margin:28px 0 0;
  padding:20px 24px;
}
.yb-lf-box__text{flex:1 1 260px;min-width:0}
.yb-lf-box__title{color:#0f172a;font-size:17px;font-weight:600;margin:0 0 4px}
.yb-lf-box__desc{color:#6B7280;font-size:13px;margin:0}
@media (max-width:700px){
  .yb-lf-sec{padding:56px 0}
  .yb-lf-box{padding:18px}
}

/* ---------- 留资弹窗 ---------- */
.yb-lf-mask{
  align-items:center;
  background:rgba(15,23,42,.5);
  display:flex;
  inset:0;
  justify-content:center;
  padding:24px;
  position:fixed;
  z-index:2147483000;
}
.yb-lf-mask[hidden]{display:none}
.yb-lf-dialog{
  --yb-lf-theme:#2563eb;
  --yb-lf-theme-dark:#1e40af;
  --yb-lf-fg:#1F2937;
  --yb-lf-muted:#6B7280;
  --yb-lf-line:#E5E7EB;
  background:#fff;
  border-radius:14px;
  box-shadow:var(--yb-lf-shadow);
  color:var(--yb-lf-fg);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  font-size:14px;
  line-height:1.7;
  max-height:calc(100vh - 48px);
  max-width:560px;
  overflow-y:auto;
  padding:26px 28px 28px;
  position:relative;
  width:100%;
}
.yb-lf-dialog *{box-sizing:border-box}
.yb-lf-dialog__close{
  background:none;
  border:0;
  color:#9CA3AF;
  cursor:pointer;
  font-size:24px;
  height:34px;
  line-height:30px;
  padding:0;
  position:absolute;
  right:10px;
  top:10px;
  width:34px;
}
.yb-lf-dialog__close:hover{color:var(--yb-lf-fg)}
.yb-lf-dialog__head{margin-bottom:18px;padding-right:30px}
.yb-lf-dialog__title{font-size:20px;font-weight:600;margin:0 0 6px}
.yb-lf-dialog__desc{color:var(--yb-lf-muted);font-size:13px;margin:0}
body.yb-lf-locked{overflow:hidden}

@media (max-width:700px){
  .yb-lf-mask{align-items:flex-end;padding:0}
  .yb-lf-dialog{border-radius:14px 14px 0 0;max-height:92vh;padding:22px 18px 24px}
  .yb-lf-item--half{flex:1 1 100%}
  .yb-lf--inline{padding:18px 16px 20px}
}

/* ---------- 右侧悬浮触发球（留资弹窗入口） ---------- */
.yb-lf-float{
  --yb-lf-theme:#2563eb;
  --yb-lf-theme-dark:#1e40af;
  align-items:center;
  background:linear-gradient(135deg,var(--yb-lf-theme),var(--yb-lf-theme-dark));
  border:none;
  border-radius:12px 0 0 12px;
  box-shadow:0 6px 18px rgba(37,99,235,.35);
  color:#fff;
  cursor:pointer;
  display:flex;
  flex-direction:column;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
  font-size:15px;
  font-weight:600;
  gap:4px;
  justify-content:center;
  letter-spacing:2px;
  line-height:1.25;
  min-height:88px;
  padding:14px 10px;
  position:fixed;
  right:0;
  text-align:center;
  top:50%;
  transform:translateY(-50%);
  writing-mode:vertical-rl;
  z-index:2147482990;
}
.yb-lf-float:hover{filter:brightness(1.08)}
.yb-lf-float:focus{outline:none}
.yb-lf-float:focus-visible{outline:2px solid var(--yb-lf-theme);outline-offset:-2px}
@media (prefers-reduced-motion:no-preference){
  .yb-lf-float{transition:filter .18s ease}
}
@media (max-width:700px){
  .yb-lf-float{min-height:76px;padding:12px 9px;font-size:14px}
}

/* ---------- 腾讯云验证码弹层置顶 ----------
   验证码 SDK(TJCaptcha.js，验证码2.0) 把弹层容器(TJCaptcha-transform / tcaptcha_transform)
   append 到 <body> 下，默认 z-index 远低于本站留资弹窗(.yb-lf-mask z=2147483000)，
   导致点击「点击完成验证」后验证码弹层被留资半透明遮罩盖住。
   此处用 !important 断言其 z-index 高于留资弹窗与 AI 客服挂件(2147482001)，强制验证码在最顶层。
   选择器同时覆盖 1.0(tcaptcha_transform id) 与 2.0(.tcaptcha-transform class) 两种容器命名。
   若腾讯后续改容器 id/class，需在此同步更新。 */
#tcaptcha_transform,
.tcaptcha-transform{
  z-index:2147484000!important;
}

/* ---------- 验证码弹出期间留资弹窗遮罩让路 ----------
   仅调高腾讯验证码容器 z-index 可能因版本改容器 id/class 而不命中；
   这里在 form.js 弹出验证码前给 .yb-lf-mask 临时加 .yb-lf-mask--captcha
   把遮罩 z-index 降为 auto，保证验证码弹层一定显示在最顶层，
   验证完成 / 关闭后移除该类恢复遮罩原有层级。 */
.yb-lf-mask--captcha{
  z-index:auto!important;
}