/* =====================================================================
   mobile-base.css — 全局移动端加固（务必在各页面自身 CSS 之后引入）
   解决历史问题：
     1. iOS Safari 输入框聚焦时整页自动放大（字号 < 16px 触发）
     2. 刘海屏 / 圆角屏（viewport-fit=cover）安全区内边距缺失
     3. 固定定位的 Toast 在窄屏（≤480px）可能超出视口宽度
   本文件只做“移动端体验兜底”，不改变桌面端既有布局。
   ===================================================================== */

/* 禁止 iOS 在横竖屏切换时自动放大/缩小文字 */
html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

/* 搜索框等输入框在移动端强制 ≥16px，避免聚焦缩放 */
@media (max-width: 768px) {
    .search-box input,
    input,
    select,
    textarea {
        font-size: 16px !important;
    }

    /* 刘海 / 圆角屏安全区：水平方向用 max() 兼容不支持 env() 的旧浏览器 */
    .container {
        padding-left: max(16px, env(safe-area-inset-left));
        padding-right: max(16px, env(safe-area-inset-right));
    }

    /* 返回按钮避开顶部刘海与左侧圆角 */
    .back-btn {
        top: max(20px, env(safe-area-inset-top));
        left: max(12px, env(safe-area-inset-left));
    }
}

/* Toast 提示：默认靠右但不溢出安全区与视口 */
.toast-message {
    right: max(20px, env(safe-area-inset-right));
    max-width: calc(100vw - 32px);
}

/* 超窄屏（≤480px）让 Toast 占满宽度，避免贴边或被截断 */
@media (max-width: 480px) {
    .toast-message {
        left: 16px;
        right: 16px;
        min-width: 0;
        max-width: none;
        bottom: max(16px, env(safe-area-inset-bottom));
    }
}