/*
 * inquiry-form.css —— 全站共用的「询盘表单卡」（第四轮，客户《网站修改》）。
 *
 * 原来只有联系页有这张卡（contact.css 里的 .astra-ct-card），套装详情页现在也要放一张表单
 * （客户：Let's Shape Your Next Energy Solution 直接改成表单、放页面最下方），
 * 表单长相必须同源，所以把卡片 + 字段 + 提交钮的规则抽到这里，挂 .astra-inq-card 的容器都能用。
 *
 * 变量名沿用联系页的 --ct-*：联系页组件的控制项照旧往 .astra-ct 上写这些变量，这里都给了兜底值，
 * 不在联系页时按设计稿默认值走。表单本身必须是 Elementor Form 组件（提交才会落 wp_e_submissions）。
 * 这份样式每页都进（functions.php 全局入队），体积很小。
 */

/* body 前缀（0,1,1）：这张卡通常是 Elementor 容器，它的内边距 / 间距走 .e-con 的变量，同权重时谁后加载谁赢；
   这份文件全局入队在前面，所以要多一级压过去。 */
body .astra-inq-card {
  max-width: 100%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--ct-card-gap, 32px);
  padding: var(--ct-card-pad-y, 48px) var(--ct-card-pad-x, 64px);
  background: #ffffff;
  border: 1px solid var(--ct-line, #dedfe0);
  box-shadow: 0 0 50px rgba(0, 0, 0, 0.1);
}

/* 卡内标题用的是 Elementor 的标题组件，字体不在它的控制项里设，交给这里 */
/* 三级选择器是必要的：全局 kit 里 `.elementor-widget-heading .elementor-heading-title`
   也是两个 class，同权重时谁后加载谁赢，不加一级标题会变成主色红 */
.astra-inq-card .elementor-widget-heading .elementor-heading-title {
  margin: 0;
  padding: var(--ct-card-title-pad, 12px) 0;
  font-size: var(--ct-card-title-size, 48px);
  line-height: var(--ct-card-title-line, 53px);
  font-weight: 700;
  letter-spacing: -1.92px;
  color: var(--ct-dark, #141414);
}

.astra-inq-card .elementor-widget-form {
  flex: 1 1 auto;
  min-height: 0;
}

.astra-inq-card .elementor-widget-form > .elementor-widget-container,
.astra-inq-card .elementor-form {
  height: auto;
}

/* 这个版本的 Form 组件没有行/列间距控制项（查过控件表，一条带 gap 的都没有），
   它自带的是 margin -10 / padding 10 那套，所以间距只能在这里接管。
   align-content: space-between 是为了让字段在卡片高度里摊开，
   跟设计稿里两栏都是 h-full 两端对齐的做法一致 */
/* 第四轮：字段不再在卡片高度里摊开（原来 align-content: space-between + height:100%，
   卡跟左栏等高时每行之间空出 55px，客户说「采集表单适配有问题」），改成从上往下正常排。 */
.astra-inq-card .elementor-form-fields-wrapper {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  align-items: flex-start;
  gap: var(--ct-field-gap, 20px);
  height: auto;
  margin: 0;
}

.astra-inq-card .elementor-field-group {
  flex-direction: column;
  align-items: flex-start;
  margin: 0;
  padding: 0;
}

.astra-inq-card .elementor-field-group.elementor-col-50 {
  width: calc(50% - var(--ct-field-gap, 20px) / 2);
}

.astra-inq-card .elementor-field-group.elementor-col-100 {
  width: 100%;
}

/* 标签 */
.astra-inq-card .elementor-field-group > label.elementor-field-label {
  margin: 0 0 var(--ct-label-gap, 12px);
  padding: 0;
  font-size: var(--ct-label-size, 24px);
  line-height: var(--ct-label-line, 32px);
  font-weight: 600;
  letter-spacing: -0.24px;
  color: var(--ct-strong, #000000);
}

.astra-inq-card .elementor-mark-required .elementor-field-label:after {
  margin-left: 0.3em;
  color: var(--ct-primary, #e60012);
}

/* 输入框 */
.astra-inq-card .elementor-field-group > label.elementor-field-label,
.astra-inq-card .elementor-field-group .elementor-field-textual {
  /* 字段组是列向 flex，不钉住的话输入框会被压矮（实测 62 压成 55） */
  flex: 0 0 auto;
}

.astra-inq-card .elementor-field-group .elementor-field-textual {
  box-sizing: border-box;
  width: 100%;
  /* Elementor 另有一条 flex-basis:100%，列向时会把输入框的高度交回给内容，
     所以除了 height 还得拿 min-height 钉住 */
  flex-basis: auto;
  min-height: var(--ct-field-height, 62px);
  height: var(--ct-field-height, 62px);
  padding: var(--ct-field-pad, 16px);
  border: 1px solid var(--ct-field-line, #d9d9d9);
  border-radius: 0;
  background: #ffffff;
  font-size: var(--ct-field-size, 18px);
  line-height: var(--ct-field-line-height, 25px);
  font-weight: 700;
  letter-spacing: -0.36px;
  color: var(--ct-strong, #000000);
  box-shadow: none;
  transition: border-color 0.25s ease;
}

.astra-inq-card .elementor-field-group .elementor-field-textual:focus {
  border-color: var(--ct-primary, #e60012);
  outline: none;
  box-shadow: none;
}

.astra-inq-card .elementor-field-group .elementor-field-textual::placeholder {
  font-weight: 700;
  color: var(--ct-subtle, #999999);
  opacity: 1;
}

/* 多行那格要吃掉剩下的高度（设计稿 123 高，靠 flex 撑） */
.astra-inq-card .elementor-field-type-textarea {
  flex: 1 1 auto;
  min-height: 0;
}

.astra-inq-card .elementor-field-type-textarea .elementor-field-textual {
  flex: 1 1 auto;
  height: var(--ct-textarea-min, 123px);
  min-height: var(--ct-textarea-min, 123px);
  resize: vertical;
}

/* 隐藏字段（IP 国家）不要占一行位置 */
.astra-inq-card .elementor-field-type-hidden {
  display: none;
}

/* 提交按钮 */
.astra-inq-card .elementor-field-type-submit {
  padding-top: var(--ct-submit-gap, 12px);
}

.astra-inq-card .elementor-field-type-submit .elementor-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  width: 100%;
  min-height: var(--ct-submit-height, 56px);
  padding: 16px 44px;
  border: 0;
  border-radius: 0;
  background: var(--ct-primary, #e60012);
  font-size: var(--ct-submit-size, 18px);
  line-height: 25px;
  font-weight: 700;
  letter-spacing: -0.36px;
  color: #ffffff;
  transition: filter 0.25s ease;
}

.astra-inq-card .elementor-field-type-submit .elementor-button:hover {
  filter: brightness(0.92);
}

.astra-inq-card .elementor-message {
  font-size: 16px;
  line-height: 24px;
}

.astra-inq-card .elementor-message.elementor-message-danger {
  color: var(--ct-primary, #e60012);
}

/* 业主 2026-09-30「表单能做自动伸缩吗」：卡片在 1768 以下跟着版心收窄（联系页版心两侧留白 160，1440 宽时卡只有 533），
   内边距也收一档（64 → 40），给字段留够宽度，Phone or WhatsApp 的标签才不折行 */
@media (max-width: 1768px) {
  body .astra-inq-card {
    padding: var(--ct-card-pad-y, 48px) 40px;
  }
}

@media (max-width: 768px) {
  body .astra-inq-card {
    padding-left: 20px;
    padding-right: 20px;
  }

  /* 窄屏两栏字段挤不下，让 Elementor 的分栏退成整行 */
  .astra-inq-card .elementor-field-group.elementor-col-50 {
    width: 100%;
  }
}

/* 套装详情页的表单卡：单独一张、居中、封顶 960（联系页那张的宽度由 contact.css 的行布局管） */
.e-con.astra-inq-card--center,
body .astra-inq-card--center {
  --width: min(100%, var(--inq-card-max, 960px));
  width: min(100%, var(--inq-card-max, 960px));
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ==================================================== 套装详情页的询盘表单（Figma Astra-6s / 1457:4281）
   不是卡片：浅底上四个满宽字段直接排，字段之间 40；字段白底 1px #D9D9D9、内边 24/32、占位字 24/32 Semi Bold #999，
   没有标签（必填项在占位字前面带 *）；多行框 295 高；Submit 居中，红底白字 24/32、内边 12/48（56 高）。
   这块挂在 Elementor 容器上（class astra-syf），表单是 Elementor Form 组件，提交照样落询盘列表。 */
.astra-syf .elementor-widget-form > .elementor-widget-container,
.astra-syf .elementor-form {
  height: auto;
}

.astra-syf .elementor-form-fields-wrapper {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: var(--syf-gap, 40px);
  margin: 0;
}

.astra-syf .elementor-field-group {
  width: 100%;
  margin: 0;
  padding: 0;
}

/* body 前缀：Elementor 给表单字段输出的全局字体规则（post-884.css 里 .elementor-widget-form .elementor-field-group .elementor-field-textual）
   和这条同权重且后加载，字重会被压回 400 */
body .astra-syf .elementor-field-group .elementor-field-textual {
  box-sizing: border-box;
  width: 100%;
  min-height: 80px;
  padding: var(--syf-field-pad-y, 24px) var(--syf-field-pad-x, 32px);
  border: 1px solid #d9d9d9;
  border-radius: 0;
  background: #ffffff;
  font-size: var(--syf-field-size, 24px);
  line-height: 32px;
  font-weight: 600;
  letter-spacing: -0.24px;
  color: #141414;
  box-shadow: none;
  transition: border-color 0.25s ease;
}

.astra-syf .elementor-field-group .elementor-field-textual:focus {
  border-color: #e60012;
  outline: none;
  box-shadow: none;
}

.astra-syf .elementor-field-group .elementor-field-textual::placeholder {
  font-weight: 600;
  color: #999999;
  opacity: 1;
}

.astra-syf .elementor-field-type-textarea .elementor-field-textual {
  min-height: var(--syf-textarea-min, 295px);
  resize: vertical;
}

.astra-syf .elementor-field-type-hidden {
  display: none;
}

.astra-syf .elementor-field-type-submit {
  justify-content: center;
  padding-top: var(--syf-submit-gap, 24px);
}

/* 这颗按钮按 Figma 是 24/32、56 高，比全站按钮规格（14/600、48）大一档，照稿走 */
body .astra-syf .elementor-field-type-submit .elementor-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-height: 56px;
  height: auto;
  padding: 12px 48px;
  border: 0;
  border-radius: 0;
  background: #e60012;
  font-size: var(--syf-submit-size, 24px);
  line-height: 32px;
  font-weight: 600;
  letter-spacing: -0.24px;
  color: #ffffff;
  transition: filter 0.25s ease;
}

body .astra-syf .elementor-field-type-submit .elementor-button:hover {
  filter: brightness(0.92);
}

.astra-syf .elementor-message {
  margin-top: 16px;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
}

.astra-syf .elementor-message.elementor-message-danger {
  color: #e60012;
}

@media (max-width: 768px) {
  .astra-syf .elementor-form-fields-wrapper {
    gap: 16px;
  }

  /* 业主 2026-09-30：这两条原来没带 body 前缀，被上面带 body 的桌面规则（权重多 1）压住，手机上输入框还是 80 高 24 号 */
  body .astra-syf .elementor-field-group .elementor-field-textual {
    min-height: 52px;
    padding: 12px 16px;
    font-size: 16px;
    line-height: 24px;
    letter-spacing: 0;
  }

  body .astra-syf .elementor-field-type-textarea .elementor-field-textual {
    min-height: 160px;
  }

  .astra-syf .elementor-field-type-submit {
    padding-top: 8px;
  }
}
