/* =========================================================================
 * 移动端 / iOS / 安卓 兼容性增强（最后加载，仅做增强不破坏现有桌面表现）
 * ========================================================================= */

/* ---- P0-1 iOS 输入框聚焦自动放大：表单控件在移动端强制 ≥16px ---- */
@media (max-width: 1024px) {
    input,
    textarea,
    select,
    .search input,
    .member-search input {
        font-size: 16px !important;
    }
}

/* ---- P0-2 iOS Safari 100vh 失真：关键全屏/弹窗容器用 dvh 兜底 ----
 * 不支持 dvh 的浏览器会忽略该声明、回退到原有 vh 值（渐进增强）。 */
@media (max-width: 1024px) {
    .z_tanchuang .tbox,
    .z_tanchuang .modal { min-height: 100dvh; }
    .z_tanchuang .tbox .modal .img video { max-height: 67dvh; }
    .mh_nav { height: 100dvh; }
}
/* 活动详情模态框（members/activities 用 vh 的容器）*/
.act-modal-container { height: 90dvh; }

/* ---- P1 iPhone 全面屏：固定头部 / 底部 / 抽屉导航避开刘海与底部横条 ---- */
@supports (padding: env(safe-area-inset-top)) {
    .header { padding-top: env(safe-area-inset-top); }
    .m_header {
        padding-top: calc(10px + env(safe-area-inset-top));
        padding-left: calc(15px + env(safe-area-inset-left));
        padding-right: calc(15px + env(safe-area-inset-right));
    }
    .mh_nav {
        padding-top: calc(50px + env(safe-area-inset-top));
        padding-bottom: calc(25px + env(safe-area-inset-bottom));
    }
    .footers .footer .bottom { padding-bottom: calc(20px + env(safe-area-inset-bottom)); }
}

/* ---- P2-1 触屏 hover 粘连：hover 效果只在真正支持悬停的设备生效 ----
 * 触屏设备 (hover: none) 上跳过这些，点完即恢复，避免样式"卡住"。 */
@media (hover: none) {
    .banner .txt>div .more:hover { background-color: transparent; transform: none; border-color: #fff; }
    .banner .txt>div .more:hover span { background-image: url('https://shindev.oss-cn-hongkong.aliyuncs.com/assets/static/img/more2.png'); color: #fff; }
    .nav>li>a:hover { color: inherit; }
}

/* ---- P2-2 点击反馈：全局去了 tap-highlight，给可点元素补 :active 视觉反馈 ---- */
@media (hover: none) {
    a:active,
    button:active,
    .more:active,
    .tab-button:active,
    .m_header .btn:active,
    .mh_nav .nav>li:active { opacity: 0.6; transition: opacity 0.1s; }
}

/* ---- P2-3 iOS 滚动惯性：弹窗 / 抽屉 / 模态内可滚动区域跟手 ---- */
.mh_nav,
.z_tanchuang .tbox,
.act-modal-container,
.members-list {
    -webkit-overflow-scrolling: touch;
}

/* ---- 通用：移动端图片/视频禁止溢出，统一 box-sizing ---- */
@media (max-width: 1024px) {
    img, video { max-width: 100%; }
}

/* ===== 移动端：恢复首屏"观看视频"按钮，使其可点开弹窗播放（带声音）=====
 * commonc16a.css 在 ≤1024 把它 display:none 了，这里覆盖回来（本文件后加载，优先级更高）。*/
@media (max-width: 1024px) {
    /* 关键：播放中的背景视频在移动端会截走触摸 → 让视频和透明覆盖层都不接收点击，
       只让"观看视频"按钮接收，保证按钮可点、其余区域不挡滑动。 */
    .banner video { pointer-events: none !important; }
    .banner .txt { pointer-events: none !important; }
    .banner .txt > div { pointer-events: none !important; }

    .banner .txt > div .more {
        display: table !important;
        margin: 0.6rem auto 0 !important;
        padding: 0 0.28rem;
        min-width: 1.8rem;
        line-height: 0.7rem;
        font-size: 0.24rem;
        border: 1px solid #fff;
        border-radius: 0.4rem;
        color: #fff;
        background: rgba(0, 0, 0, 0.35);
        -webkit-backdrop-filter: blur(2px);
        backdrop-filter: blur(2px);
        cursor: pointer;
        position: relative;
        z-index: 10;
        pointer-events: auto !important;   /* 仅按钮可点 */
        -webkit-tap-highlight-color: rgba(255,255,255,0.2);
    }
    .banner .txt > div .more span {
        background: none !important;   /* 去掉桌面那个右侧小箭头背景图 */
        padding: 0 !important;
        pointer-events: none;          /* 点 span 也算点按钮 */
    }
    .banner .txt > div .more:active { opacity: 0.7; transform: scale(0.97); }

    /* 弹窗：移动端关闭按钮移到模态框内（原 right:-50px 会跑到屏外点不到）*/
    .z_tanchuang .tbox .modal { width: 92% !important; padding: 14px !important; }
    .z_tanchuang .tbox .modal .out {
        right: 6px !important;
        top: 6px !important;
        width: 34px !important;
        height: 34px !important;
        line-height: 34px !important;
        z-index: 10;
    }
    .z_tanchuang .tbox .modal .img { max-width: 100% !important; }
    .z_tanchuang .tbox .modal .img video { max-height: 78dvh !important; }
}