/* /company/contact-us/ 表单接后端之后补的样式。
   contact.css 是 extract_v2.py 从设计稿生成的，重跑会覆盖，所以手写的放这里。

   设计稿的 .preview-status 是 12px 灰色小字 —— 它原本只用来显示一句
   "Preview only …" 的开发备注，当提交结果的确认太弱，所以给结果态单独做成面板。
   调色板里没有成功/失败的语义色，下面的颜色取自设计稿已有的蓝灰色值
   （#017BFF / #0A3766 / #EDF5FD / #B9CFE0），红色是另配的。 */

/* 中间态（"Sending…"）保持设计稿原来的小字样式，不打扰 */

.preview-status.is-ok,
.preview-status.is-error {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  width: 100%;
  margin-top: 4px;
  padding: 13px 15px;
  border-radius: 9px;
  border: 1px solid;
  font-size: 14px;
  line-height: 1.5;
  font-weight: 600;
}

.preview-status.is-ok {
  background: #EDF5FD;
  border-color: #B9CFE0;
  color: #0A3766;
}

.preview-status.is-error {
  background: #FDF2F1;
  border-color: #E8BDB8;
  color: #9E2A20;
}

/* 左侧的小标记，用 ::before 生成，不动设计稿的 DOM */
.preview-status.is-ok::before,
.preview-status.is-error::before {
  flex: none;
  width: 18px;
  height: 18px;
  margin-top: 1px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  font-size: 12px;
  font-weight: 700;
  color: #fff;
}

.preview-status.is-ok::before { content: '\2713'; background: #017BFF; }
.preview-status.is-error::before { content: '\0021'; background: #C5342A; }

/* 蜜罐字段。刻意不用 display:none / type=hidden —— 那两种机器人会跳过，
   挪出视口才会被它们当成正常输入框填上。对读屏软件用 aria-hidden + tabindex=-1 屏蔽。 */
.jg-hp {
  position: absolute;
  left: -9999px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

/* 提交中按钮置灰，避免重复点击时看不出状态 */
#contact-form[aria-busy="true"] button[type="submit"] {
  opacity: .6;
  cursor: progress;
}