/*
 * 手机端增强样式
 *
 * 只在窄屏（≤430px，即主流手机）生效，桌面端与平板完全不受影响
 * —— 桌面端依旧与原站逐像素一致。
 *
 * 修的都是实测出来的真问题：
 *  1. 聊天输入框原来 14px，iOS Safari 聚焦时会自动放大整个页面（16px 是阈值）
 *  2. 推荐问题按钮只有 30px 高，低于主流 44px 触控目标标准，容易点错
 *  3. 首页底部没有给 iPhone 的横条（安全区）留白
 *  4. 横屏时 iOS 会自动放大正文字号，导致排版跳动
 *  5. 老浏览器不支持 dvh 时，聊天页高度会失效（补一个 vh 兜底）
 */

@media (max-width: 430px) {
  /* 4. 禁止 iOS 横屏自动放大文字 */
  html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
  }

  /* 1. 输入框至少 16px，避免 iOS 聚焦时页面被放大 */
  #chat-root input[type="text"] {
    font-size: 16px;
  }

  /* 2. 推荐问题按钮抬到 40px，文字垂直居中 */
  #chat-root [data-suggestion] {
    display: inline-flex;
    align-items: center;
    min-height: 40px;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
  }

  /* 2. 返回按钮同样加大到 40px */
  #chat-root a[aria-label="返回首页"] {
    min-width: 40px;
    min-height: 40px;
  }

  /* 3. 首页底部给 iPhone 横条留出安全区 */
  main {
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }

}

/* 5. 不支持 dvh 的老浏览器（iOS < 15.4 等）兜底 */
@supports not (height: 100dvh) {
  #chat-root {
    height: 100vh;
  }
}
