/* BookingForm —— 免费预约表单（Figma 1868:11682）。
   白卡 343×340（底图来自设计稿 1868:11683，圆角 16）+ 6 行输入。

   每行 40 高、1px #F1F3F5 描边、圆角 8；行内左侧 24 图标 + 14px 文本。
   文本行是真 <input>（可输入），带下拉箭头的行是按钮（真机上开选择器）。
   6×40 + 5×12 = 300 = 卡内高（卡片 340 − 上下各 20）。 */

.mzh-booking-form {
  position: absolute;
  left: var(--booking-card-x);
  right: var(--booking-card-x);
  top: var(--booking-card-y);
  background: var(--booking-card-bg);
  border-radius: var(--booking-card-radius);
  display: flex;
  flex-direction: column;
  gap: var(--booking-row-gap);
  padding: var(--booking-card-pad);
}

.mzh-booking-form__row {
  height: var(--booking-row-h);
  flex: none;
  display: flex;
  align-items: center;
  gap: var(--booking-row-inner-gap);
  padding: 0 var(--booking-row-pad-x);
  border: var(--border-width-default) solid var(--booking-row-border);
  border-radius: var(--booking-row-radius);
  background: transparent;
  font-family: inherit;
  text-align: left;
  width: 100%;
  cursor: pointer;
}

.mzh-booking-form__row--chevron {
  justify-content: space-between;
  gap: 0;
}

.mzh-booking-form__field {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: var(--booking-row-inner-gap);
}

.mzh-booking-form__icon {
  flex: none;
  width: var(--booking-row-icon);
  height: var(--booking-row-icon);
  display: block;
}

.mzh-booking-form__input {
  flex: 1 1 auto;
  min-width: 0;
  border: 0;
  outline: none;
  background: transparent;
  padding: 0;
  font-family: inherit;
  font-size: var(--typography-body-font-size);
  line-height: var(--typography-body-line-height);
  color: var(--booking-row-text-fill);
}

.mzh-booking-form__input::placeholder {
  color: var(--booking-row-text-ph);
}

.mzh-booking-form__value {
  font-size: var(--typography-body-font-size);
  line-height: var(--typography-body-line-height);
  color: var(--booking-row-text-fill);
  white-space: nowrap;
}

.mzh-booking-form__value--ph {
  color: var(--booking-row-text-ph);
}

.mzh-booking-form__chevron {
  flex: none;
  width: var(--booking-row-chevron-w);
  height: var(--booking-row-icon);
  display: block;
}

/* ---- 校验错误态（原型行为：必填项未填时标红）----
   设计稿没有这一态，用规范既有的 --color-feedback-error（#E60012，token 注释即「必填标记/错误」）。
   做法：行变成两行（第二行放提示），不遮挡原内容。 */
.mzh-booking-form__row--error {
  flex-direction: column;
  align-items: stretch;
  height: auto;
  gap: 0;
  border-color: var(--color-feedback-error);
  position: relative;
}

.mzh-booking-form__row--error .mzh-booking-form__field {
  height: var(--booking-row-h);
}

.mzh-booking-form__row--error .mzh-booking-form__error {
  display: block;
  font-size: var(--typography-caption-font-size);
  line-height: var(--typography-caption-line-height);
  color: var(--color-feedback-error);
  padding: 0 var(--booking-row-pad-x) var(--spacing-xs);
}