@charset "utf-8";
/* ==========================================================================
 * 房飞布 H5 · 移动端（iOS / Android / App WebView）展示与交互优化增强层
 * ---------------------------------------------------------------------------
 * 作用范围：仅呈现层（排版 / 布局 / 触摸反馈 / 安全区 / 表单可用性）
 * 边界声明：不改动任何接口返回数据与业务逻辑
 * 加载位置：所有原有样式之后，作为覆盖层生效
 * ========================================================================== */

/* ---------- 1. 安全区变量（iPhone X 及以上刘海屏、底部手势条） ---------- */
:root {
    --safe-top: env(safe-area-inset-top, 0px);
    --safe-bottom: env(safe-area-inset-bottom, 0px);
    --safe-left: env(safe-area-inset-left, 0px);
    --safe-right: env(safe-area-inset-right, 0px);
}

/* ---------- 2. 基础文本渲染 ----------
 * -webkit-text-size-adjust:100% 用于阻止 iOS 横屏 / 旋转时自动放大字号导致的排版错乱 */
html, body {
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ---------- 3. 消除横向抖动与横向滚动条 ----------
 * 老版 px 布局在窄屏（iPhone SE / 320px）上常出现 1~2px 横向溢出 */
html, body {
    overflow-x: hidden;
}
@supports (overflow: clip) {
    html, body {
        overflow-x: clip;
    }
}

/* ---------- 4. 长文本兜底：超长数字串 / URL / 英文不再撑破容器 ---------- */
body {
    word-break: break-word;
    overflow-wrap: break-word;
}

/* ---------- 5. 图片与媒体自适应 ----------
 * 仅约束上限，具体尺寸仍由业务 class 决定（class 优先级更高，不会被覆盖） */
img {
    max-width: 100%;
    height: auto;
    border: 0;
    -webkit-user-drag: none;
}
video, iframe, embed, table {
    max-width: 100%;
}

/* ---------- 6. 触摸反馈：去掉系统灰块，补上按压态 ---------- */
a, button, input, select, textarea, label, [onclick] {
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
a, button, input[type="button"], input[type="submit"], [onclick] {
    /* manipulation 关闭双击缩放，同时消除 300ms 点击延迟 */
    touch-action: manipulation;
    transition: opacity .12s linear;
}
a:active, button:active,
input[type="button"]:active, input[type="submit"]:active,
[onclick]:active {
    opacity: .72;
}

/* ---------- 7. 表单控件：修复 iOS 聚焦时页面自动放大 ----------
 * iOS 只在字号 >= 16px 时不触发自动缩放，这是移动端最常见的体验问题之一 */
input[type="text"], input[type="tel"], input[type="number"], input[type="password"],
input[type="search"], input[type="email"], input[type="url"], input[type="date"],
input[type="datetime-local"], input[type="month"], input[type="time"],
textarea, select {
    font-size: 16px;
}
input[type="text"], input[type="tel"], input[type="number"], input[type="password"],
input[type="search"], input[type="email"], input[type="url"], input[type="date"],
input[type="datetime-local"], input[type="month"], input[type="time"],
textarea {
    /* 去掉 iOS 默认圆角与内阴影，视觉与安卓保持一致 */
    -webkit-appearance: none;
    appearance: none;
    border-radius: 0;
    background-color: #fff;
}
/* 输入框内文字垂直居中，避免安卓机型文字贴顶 */
input, textarea {
    line-height: normal;
}

/* ---------- 8. 按钮最小点击热区 ----------
 * 业务 class 中若已定义 height 则以其为准，此处仅兜底无样式的裸按钮 */
button, input[type="button"], input[type="submit"] {
    min-height: 40px;
    cursor: pointer;
}

/* ---------- 9. 内部滚动容器惯性（由 JS 探测后挂 class） ---------- */
.wb-scroll-touch {
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
}

/* ---------- 10. 安全区兜底 ----------
 * 主逻辑在 mobile-enhance.js（运行时识别所有贴底 / 贴顶的固定元素）。
 * 这里只对主底部导航做纯 CSS 兜底，避免脚本未执行时被手势条遮挡。
 * JS 侧做了幂等判断（padding 已 >= 安全值时不再叠加），不会重复留白。 */
@supports (padding-bottom: env(safe-area-inset-bottom)) {
    .new_foot {
        padding-bottom: env(safe-area-inset-bottom, 0px);
    }
}