/* iOS Safari 专用修复样式 */

/* iOS Safari 视口和安全区域修复 */
@supports (-webkit-touch-callout: none) {
  /* 确保应用容器正确处理iOS视口 */
  .app {
    height: -webkit-fill-available;
    min-height: -webkit-fill-available;
    /* 防止iOS Safari的橡皮筋效果 */
    overscroll-behavior: none;
    -webkit-overflow-scrolling: touch;
  }

  /* 输入容器iOS优化 */
  .input-container {
    /* 强制硬件加速，确保在iOS上正确渲染 */
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    /* 确保在虚拟键盘弹出时保持可见 */
    position: -webkit-sticky;
    position: sticky;
    bottom: 0;
    /* iOS 特殊的z-index处理 */
    z-index: 9999;
    /* 防止iOS上的点击延迟 */
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
  }

  /* 消息列表iOS优化 */
  .message-list {
    /* iOS Safari 滚动优化 */
    -webkit-overflow-scrolling: touch;
    /* 防止过度滚动 */
    overscroll-behavior: contain;
  }

  /* 文本输入框iOS优化 */
  .input-field-container textarea {
    /* 防止iOS上的缩放 */
    -webkit-text-size-adjust: 100%;
    /* 优化iOS上的输入体验 */
    -webkit-appearance: none;
    appearance: none;
  }
}

/* iOS 设备特定修复 - 竖屏模式 */
@media screen and (-webkit-min-device-pixel-ratio: 2) and (orientation: portrait) {
  .app {
    height: calc(var(--vh, 1vh) * 100);
    min-height: calc(var(--vh, 1vh) * 100);
  }

  /* 在小屏幕iOS设备上使用固定定位 */
  @media (max-width: 768px) {
    .input-container {
      position: fixed;
      bottom: var(--safe-area-inset-bottom, 0);
      left: 0;
      right: 0;
      width: 100%;
      max-width: 800px;
      margin: 0 auto;
      /* 确保在iOS上的层级正确 */
      z-index: 10000;
    }

    .message-list {
      /* 为固定的输入框留出空间 */
      padding-bottom: calc(72px + var(--safe-area-inset-bottom, 0));
    }
  }
}

/* iOS 设备特定修复 - 横屏模式 */
@media screen and (-webkit-min-device-pixel-ratio: 2) and (orientation: landscape) {
  .app {
    height: calc(var(--vh, 1vh) * 100);
  }

  .input-container {
    /* 横屏时减少padding */
    padding: 6px 12px;
    min-height: 48px;
  }
}

/* iPhone X 系列及以上设备的安全区域适配 */
@media screen and (device-width: 375px) and (device-height: 812px) and (-webkit-device-pixel-ratio: 3),
  screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 2),
  screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3),
  screen and (device-width: 390px) and (device-height: 844px) and (-webkit-device-pixel-ratio: 3),
  screen and (device-width: 428px) and (device-height: 926px) and (-webkit-device-pixel-ratio: 3) {
  .input-container {
    /* iPhone X 系列的底部安全区域 */
    padding-bottom: calc(8px + 34px);
  }

  .message-list {
    /* 为安全区域留出额外空间 */
    padding-bottom: calc(72px + 34px);
  }
}

/* iOS 虚拟键盘弹出时的样式调整 */
body.keyboard-open {
  /* 防止页面滚动 */
  overflow: hidden;
}

body.keyboard-open .app {
  height: 100vh;
  height: calc(var(--vh, 1vh) * 100);
  /* 防止键盘弹出时的布局跳动 */
  transition: none;
}

body.keyboard-open .input-container {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
  z-index: 10000;
  /* 确保在虚拟键盘上方 */
  transform: translateY(0);
  /* 移除过渡效果，避免键盘弹出时的动画冲突 */
  transition: none;
  /* 键盘弹出时，移除为安全区增加的padding，减小与键盘的距离 */
  padding-bottom: 8px;
}

body.keyboard-open .message-list {
  /* 为固定输入框预留更多空间 */
  padding-bottom: 100px;
  /* 防止滚动到键盘后面 */
  max-height: calc(100vh - 80px);
  overflow-y: auto;
}

/* iOS Safari 特殊的滚动条样式 */
@supports (-webkit-touch-callout: none) {
  .message-list::-webkit-scrollbar {
    width: 0px;
    background: transparent;
  }

  .message-list::-webkit-scrollbar-thumb {
    background: transparent;
  }
}

/* iOS 点击高亮移除 */
@supports (-webkit-touch-callout: none) {
  * {
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
  }

  /* 但保留输入框和消息文本的选择功能 */
  input,
  textarea,
  .text-message,
  .message-content {
    -webkit-touch-callout: default;
    -webkit-user-select: text;
    user-select: text;
  }

  /* 确保消息文本在iOS上可以被选择 */
  .text-message,
  .text-message.markdown-rendered {
    -webkit-touch-callout: default;
    -webkit-user-select: text;
    user-select: text;
  }
}

/* iOS 字体渲染优化 */
@supports (-webkit-touch-callout: none) {
  body {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
  }
}