/* contact-form —— T7。这份是手写的，不是从参考站抽取——jcrapid.com 原始表单
   是 Contact Form 7 生成的 markup/class 名（wpcf7-form-control 等），我们没有
   照抄那套（见 widgets/contact-form.php 顶部注释：D 类元素，字段/提交目标都
   是自己的），class 名跟着换成自己的，自然没有可抽取的参考站规则可用，
   跟 global/footer.css 手写的理由是同一类情况。 */

/* 🐛 2026-09-04 修复：之前固定 max-width:480px，跟外层容器 60% 分栏（约
   840px 宽，见 wire-contact.php 同批修复）叠加，表单实际只占自己那栏的一半
   多，右边空出一大块——这是用户反馈"表单这块跟参考站差距很大"的另一半原因
   （另一半是分栏比例本身没对齐参考站的 40:60，也一起改了）。参考站表单栏
   （elementor-element-39b39e2）没有额外的宽度限制，字段是撑满整栏的，改成
   width:100% 跟着撑满。 */
.jiesheng-contact-form {
	width: 100%;
}

.jiesheng-contact-form__notice {
	padding: 12px 16px;
	border-radius: 4px;
	margin: 0 0 20px;
	font-size: 14px;
}

.jiesheng-contact-form__notice--success {
	background: #e6f4ea;
	color: #1e4620;
	border: 1px solid #b7dfc0;
}

.jiesheng-contact-form__notice--error {
	background: #fbe9e7;
	color: #611a15;
	border: 1px solid #f3b3ab;
}

.jiesheng-contact-form__form p {
	margin: 0 0 16px;
}

.jiesheng-contact-form__form label {
	display: block;
	margin: 0 0 6px;
	font-size: 14px;
	font-weight: 600;
}

/* 🐛 2026-09-04 用 --map 详细对比才挖出来的第二批差异（之前只测了容器宽度，
   没测到字段本身的颜色/圆角/字号）——inline-block 表单控件不像普通块级元素
   会自动继承 body 的 font/line-height，`font-family:inherit` 只接了字体，
   字号/字重/行高全是浏览器 UA 默认值，这也是之前量出来的 43px 高度比参考站
   50px 矮一截的真正原因（不是 padding 本身差多少，是 line-height:normal 在
   起作用）。颜色/圆角是参考站 elementor-element-441aabb 表单字段（Contact
   Form 7 生成的 `.wpcf7-form-control`）实测值：background:#f9fafb（浅灰蓝，
   不是纯白）、color:#666（字灰，不是纯黑）、border-radius:2px（不是 4px）。 */
.jiesheng-contact-form__form input[type="text"],
.jiesheng-contact-form__form input[type="email"],
.jiesheng-contact-form__form textarea {
	width: 100%;
	box-sizing: border-box;
	padding: 11px 12px;
	border: 1px solid #ccd0d5;
	border-radius: 2px;
	/* 不用 `font:inherit` 简写——跟提交按钮同一个坑（简写会把 line-height
	   也重置成相对自己 font-size 的 normal 关键字，接不到父级真正的数字），
	   这里字号刚好和 body 一样是 15px，"重置成 normal" 算出来的行高
	   （27.8571px）跟参考站实测值（25.5px）凑巧差得不大才没被这份报告标红，
	   但机制上是同一个问题，一起改成分别写 family + 明确 line-height。 */
	font-family: inherit;
	line-height: 1.7;
	background: #f9fafb;
	color: #666;
}

.jiesheng-contact-form__form textarea {
	resize: vertical;
}

/* 提交按钮同一批修复：参考站 wpcf7-submit 实测 border-radius:50px（药丸形，
   不是我们之前的 4px 直角矩形）、padding:16px 36px、font-size:16px、
   border:2px solid（跟背景同色，视觉上是一圈不太看得出来但确实存在的描边）。
   之前没写 font-family，<button> 元素在 Chrome 下不继承 body 字体、默认
   Arial，跟站内其余 Manrope 正文明显不一致。背景色 var(--brand) 实测就是
   #e7823a（全站统一的品牌色，见 themes/jiesheng-elementor/style.css），
   跟参考站按钮颜色数值上一致，不用改。
   🐛 2026-09-04 用 --map 加 x/y 坐标详细测才挖出来的问题：这里最早用
   `font:inherit` 图省事想一次性把 family/size/weight/line-height 全部接上
   父级，结果只解决了 font-family（原来的问题），却带来一个新问题——`font`
   简写会把 line-height 也设成"继承值"，但父级的 line-height 是通过独立的
   `line-height` 属性设的（不是通过 font 简写设的），`font:inherit` 接不到
   这个数字，line-height 分量退回 `normal` 关键字，`normal` 是相对**这个
   按钮自己的 font-size** 重新算的——font-size 从 15px 改成 16px 后，
   `normal`(约 1.857 倍) 算出来变成约 29.7px，比参考站实测的 line-height:16px
   （等于字号本身，没有多余行距）整整多出一倍，按钮因此比参考站高了近 10px。
   改成分别写 `font-family:inherit` + `line-height:1`，不用 `font` 简写，
   就不会带这个副作用。 */
.jiesheng-contact-form__submit {
	display: inline-block;
	padding: 16px 36px;
	border: 2px solid var(--brand, #1a4fa3);
	border-radius: 50px;
	background: var(--brand, #1a4fa3);
	color: #fff;
	font-family: inherit;
	font-size: 16px;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
}

.jiesheng-contact-form__submit:hover {
	opacity: 0.9;
}

/* 蜜罐字段：正常访客看不见（对应处理逻辑见 inc/contact-form-handler.php），
   用 clip 而不是 display:none —— 部分抓取脚本会跳过 display:none 的字段，
   但 clip 隐藏配合 tabindex="-1" 骗不了简单表单机器人。 */
.jiesheng-contact-form__hp {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
