/* ===== PEX 移动端适配（iPhone / 窄屏优先，<=768px 生效）===== */

@media (max-width: 768px) {

    /* ---------- 全局 ---------- */
    body {
        -webkit-text-size-adjust: 100%;
        padding-left: 8px;
        padding-right: 8px;
    }
    /* 顶部导航：小屏收起菜单由 Bootstrap 处理，这里保证内容不留白 */
    .Ea_min { width: 100% !important; }

    /* ---------- 主页布局 ---------- */
    /* 左侧文件树（装饰）在小屏移到最下方并放宽 */
    .con_left {
        width: 100% !important;
        float: none !important;
    }
    .row1 { width: 100% !important; }
    .con_right {
        width: 100% !important;
        float: none !important;
        margin-top: 12px;
    }

    /* ---------- 表格：手机上只保留关键列，其余横向滚动 ---------- */
    .table th, .table td {
        padding: 8px 6px;
        font-size: 13px;
        white-space: nowrap;
    }
    /* 隐藏"描述""上传人""文件路径"三列（手机上价值低，且路径列过高） */
    .table .col-desc,
    .table .col-user,
    .table .col-path { display: none !important; }
    /* 回收站页的次要列 */
    .table .col-type { display: none !important; }
    /* 标题列允许换行显示完整文件名 */
    .td_one {
        white-space: normal !important;
        word-break: normal;
        overflow-wrap: anywhere;
        width: auto !important;
        max-width: 52vw;
    }
    /* 标题列保持"图标 + 名称 + 锁/徽标"同行，长名称在名称内自动换行 */
    #fileTable td:nth-child(2), #trashTable td:nth-child(2) { min-width: 140px; }
    #fileTable td .td_one, #trashTable td .td_one {
        display: inline-flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 4px 7px;
        width: 100% !important;
        max-width: 100% !important;
        overflow: visible;
    }
    #fileTable td .td_one > i, #trashTable td .td_one > i { flex: 0 0 auto; }
    #fileTable td .td-name, #trashTable td .td-name {
        flex: 0 1 auto;
        min-width: 0;
        max-width: 100%;
        overflow-wrap: anywhere;
    }
    #fileTable td .td_one > a, #trashTable td .td_one > a { white-space: normal; }
    .td_one a { white-space: normal !important; }
    .td_one .gesp-badge, .td_one .gesp-lock { flex: 0 0 auto; }
    /* 操作列按钮加大点击区域 */
    .table td a.edit,
    .table td .btn-group > a {
        padding: 8px 10px;
        display: inline-block;
    }
    .table td .dropdown-menu {
        font-size: 15px;
    }
    .table td .dropdown-menu li a,
    .table td .dropdown-menu li span {
        padding: 8px 14px;
        display: block;
    }

    /* ---------- 工具栏（面包屑 + 搜索）---------- */
    .toolbar {
        flex-direction: column;
        align-items: stretch;
        gap: 8px;
    }
    .toolbar-search { width: 100%; }
    .toolbar-search input[type="text"] {
        width: 100%;
        height: 38px;
        font-size: 16px; /* 防 iOS 聚焦自动放大 */
    }
    .toolbar-actions { gap: 6px; }
    .toolbar-actions .btn { flex: 1 1 0; min-width: 0; padding: 6px 8px; }
    .path-preview { max-width: 40vw; }

    /* ---------- 分页 ---------- */
    .pagination {
        float: none !important;
        margin-right: 0 !important;
        text-align: center;
        display: inline-flex;
        flex-wrap: wrap;
        justify-content: center;
        width: 100%;
    }
    .pagination li a { padding: 8px 14px; }

    /* ---------- 表单页（上传/创建/编辑） ---------- */
    .con_right_update {
        width: 100% !important;
        float: none !important;
    }
    .form-horizontal input[type="text"],
    .form-horizontal input[type="password"],
    .form-horizontal input[type="file"] {
        max-width: 100%;
        font-size: 16px; /* 防 iOS 聚焦自动放大 */
        height: 42px;
    }
    .form-horizontal .btn {
        width: 100%;
        padding: 12px;
        font-size: 16px;
    }
    /* 上传页内联的 margin-left 偏移在小屏取消 */
    .form-horizontal .form-group[style] { margin-left: 0 !important; }

    /* ---------- 浮层（文件时间设置等） ---------- */
    #divTop, #divTop_up {
        position: fixed !important;
        left: 5% !important;
        width: 90% !important;
        top: 20% !important;
        min-height: 0 !important;
        padding-bottom: 20px;
    }

    /* ---------- 上传进度条 ---------- */
    .upload-progress-wrap { margin: 14px 0; }
    .upload-progress {
        height: 14px;
        border-radius: 7px;
        background: #e5e5e5;
        overflow: hidden;
    }
    .upload-progress-bar {
        height: 100%;
        width: 0;
        background: #5cb85c;
        transition: width .2s;
    }
    .upload-progress-text { font-size: 13px; color: #666; margin-top: 4px; }

    /* ---------- 通用：防止横向溢出 ---------- */
    .table-responsive { border: none; margin-bottom: 10px; }
    img { max-width: 100%; height: auto; }

    /* ---------- 页头（面包屑 + 标题 + 搜索 + 按钮）---------- */
    .page-head { flex-direction: column; align-items: stretch; gap: 10px; margin-top: 2px; }
    .page-title { font-size: 19px; }
    .page-crumb { margin-bottom: 2px; }
    .page-head-tools { flex-direction: column; align-items: stretch; gap: 8px; }
    .toolbar-search { width: 100%; }
    .toolbar-search input[type="text"] { width: 100%; height: 38px; font-size: 16px; }
    .toolbar-search .btn { height: 38px; }
    .toolbar-actions { gap: 6px; }
    .toolbar-actions .btn { flex: 1 1 auto; }
}

/* 超窄屏（iPhone SE 等）再收一档 */
@media (max-width: 380px) {
    .table .col-time { display: none !important; } /* 隐藏上传时间 */
    body { font-size: 14px; }
}

/* ============================================================
 * 2026-11 移动端优化补充（触控目标 / 弹窗 / 安全区 / 输入 / 滚动）
 * 规则统一追加在文件末尾，同名选择器以此处为准。
 * ============================================================ */
@media (max-width: 768px) {

    /* ---------- 触控目标 ≥44×44 ---------- */
    .navbar-toggle {
        padding: 10px;
        min-width: 44px;
        min-height: 44px;
        margin-top: 6px;
        margin-bottom: 6px;
    }
    .nav-login-btn,
    .navbar-nav > li > a.nav-login-btn {
        min-height: 44px;
        padding: 10px 16px !important;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
    /* 折叠菜单内的链接与下拉项 */
    .navbar-collapse .navbar-nav > li > a { min-height: 44px; line-height: 24px; }
    .dropdown-menu > li > a { padding: 12px 14px; }
    .pagination > li > a,
    .pagination > li > span {
        min-width: 44px;
        min-height: 44px;
        padding: 9px 13px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
    .table td a.edit,
    .table td .btn-group > a {
        padding: 11px 12px;
        min-height: 44px;
        display: inline-flex;
        align-items: center;
    }
    .site-footer { padding: 14px 12px calc(14px + env(safe-area-inset-bottom)); }
    .site-footer a { display: inline-block; padding: 8px 4px; }

    /* ---------- 表格：局部滚动更顺手 ---------- */
    .table-responsive,
    .oj-table-wrap { -webkit-overflow-scrolling: touch; }
    /* 收紧单元格，减少横向滚动距离 */
    .table th, .table td { padding: 8px 5px; }
    .td_one { max-width: 46vw !important; }

    /* ---------- 输入控件：16px 防 iOS 聚焦放大，宽度撑满 ---------- */
    input[type='text'],
    input[type='password'],
    input[type='email'],
    input[type='number'],
    input[type='search'],
    input[type='tel'],
    input[type='url'],
    select,
    textarea { font-size: 16px; max-width: 100%; }

    /* ---------- 弹窗：限高 + 内部滚动 + 关闭钮可点 ---------- */
    .modal .modal-dialog { margin: 6vh auto; max-height: 86vh; display: flex; flex-direction: column; }
    .modal .modal-content { max-height: 86vh; overflow-y: auto; }
    #divTop, #divTop_up { max-height: 78vh; overflow-y: auto; }
    .pxe-share-box { max-height: 82vh; overflow-y: auto; }
    .modal-header .close,
    #divTop .close, #divTop_up .close,
    .pxe-share-close {
        min-width: 44px;
        min-height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        margin-top: -6px;
        margin-right: -6px;
    }

    /* ---------- 长内容断行（URL / 连续字符） ---------- */
    body { overflow-wrap: break-word; }

    /* ---------- 折叠菜单展开时锁定背景滚动（渐进增强） ---------- */
    body:has(.navbar-collapse.in) { overflow: hidden; }
}

/* ---------- 窄屏（≤430）：OJ 筛选与列表进一步优化 ---------- */
@media (max-width: 430px) {
    .oj-filter .so-input,
    .oj-filter .oj-select {
        flex: 1 1 100% !important;
        width: 100% !important;
        min-width: 0;
    }
    .oj-filter .so-btn { width: 100%; margin-top: 8px; }
    .td_one { max-width: 44vw !important; }
}

/* ---------- 安全区（刘海屏底部） ---------- */
@supports (padding: env(safe-area-inset-bottom)) {
    @media (max-width: 768px) {
        body { padding-bottom: env(safe-area-inset-bottom); }
    }
}

/* ---------- 按列位置隐藏正文单元格（模板中部分 td 未带 col-* 类） ---------- */
@media (max-width: 768px) {
    #fileTable th:nth-child(3), #fileTable td:nth-child(3),
    #fileTable th:nth-child(6), #fileTable td:nth-child(6),
    #fileTable th:nth-child(7), #fileTable td:nth-child(7) { display: none !important; }
}
@media (max-width: 430px) {
    #fileTable th:nth-child(5), #fileTable td:nth-child(5) { display: none !important; }
    #fileTable td:nth-child(2), #trashTable td:nth-child(2) { min-width: 120px; }
}


/* ============================================================
 * 2026-11 移动端折叠菜单重设计（iOS 风格分组卡片）
 * ============================================================ */

/* ---------- 头像基础样式兜底（.ua 定义在 social.css，导航页未加载） ---------- */
.navbar .ua {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 12px;
    font-weight: 600;
    color: #fff;
    vertical-align: middle;
    flex: 0 0 auto;
    width: 24px !important;
    height: 24px !important;
    overflow: hidden;
    margin-right: 6px;
}
.navbar .ua { background: var(--pxe-primary, #1677FF); }
.navbar .ua.ua-initial { /* 初始字头像保留模板内联配色 */ }
.navbar .ua img { width: 100%; height: 100%; object-fit: cover; }

@media (max-width: 767px) {
    /* ---------- 面板：浮动圆角卡片 ---------- */
    .navbar-collapse {
        margin: 8px 10px 12px;
        border: 1px solid rgba(35, 70, 130, .08);
        border-radius: 18px;
        box-shadow: 0 10px 30px rgba(35, 70, 130, .12);
        padding: 8px;
        background: #fff;
    }
    .navbar-collapse .navbar-nav { margin: 0; }

    /* 展开的菜单改为浮层：不再占文档流高度。
       之前 Bootstrap 默认展开会把 .con 从 83px 一路推到 630px，
       「下拉框一开，整个内容咣当一下」；现在只覆盖在内容之上。 */
    .navbar-collapse.in,
    .navbar > .container-fluid > .navbar-collapse.in {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        /* Bootstrap 用 .container-fluid > .navbar-collapse 加了 -15px
           外边距（原本让菜单贴满屏宽）；浮层下必须改回卡片留白，
           否则左右各溢出 15px 触发横向滚动条。 */
        margin-left: 10px;
        margin-right: 10px;
        z-index: 1035;
        max-height: calc(100vh - 100px);
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }

    /* ---------- 一级菜单项：50px 行高、图标槽、圆角按下态 ---------- */
    .navbar-collapse .navbar-nav > li > a {
        display: flex;
        align-items: center;
        gap: 12px;
        min-height: 50px;
        padding: 12px 16px;
        margin: 1px 0;
        font-size: 16px;
        color: #1D2129;
        border-radius: 12px;
    }
    .navbar-collapse .navbar-nav > li > a i {
        width: 22px;
        text-align: center;
        font-size: 16px;
        color: #86909C;
        flex: 0 0 auto;
    }
    .navbar-collapse .navbar-nav > li > a:hover,
    .navbar-collapse .navbar-nav > li > a:focus,
    .navbar-collapse .navbar-nav > li > a:active,
    .navbar-collapse .navbar-nav > li.open > a {
        background: #F0F6FF;
        color: #1677FF;
    }
    .navbar-collapse .navbar-nav > li > a:hover i,
    .navbar-collapse .navbar-nav > li.open > a i { color: #1677FF; }
    .navbar-collapse .navbar .ua { margin-right: 0; }

    /* caret 推到行尾，展开时旋转 */
    .navbar-collapse .dropdown-toggle .caret {
        margin-left: auto;
        transition: transform .2s ease;
        color: #C0C6D1;
    }
    .navbar-collapse .open > a .caret { transform: rotate(180deg); }

    /* ---------- 二级菜单：静态展开、缩进、无浮层 ---------- */
    .navbar-collapse .dropdown-menu {
        position: static !important;
        float: none;
        width: 100%;
        box-shadow: none;
        border: none;
        background: transparent;
        padding: 2px 0 6px;
        margin: 0;
    }
    .navbar-collapse .dropdown-menu > li > a {
        display: flex;
        align-items: center;
        gap: 10px;
        min-height: 46px;
        padding: 10px 16px 10px 46px;
        margin: 1px 0;
        font-size: 15px;
        color: #4E5969;
        border-radius: 12px;
    }
    .navbar-collapse .dropdown-menu > li > a i {
        width: 20px;
        text-align: center;
        color: #A6ADBB;
        flex: 0 0 auto;
    }
    .navbar-collapse .dropdown-menu > li > a:hover,
    .navbar-collapse .dropdown-menu > li > a:focus {
        background: #F4F8FF;
        color: #1677FF;
    }
    .navbar-collapse .dropdown-menu > li > a:hover i { color: #1677FF; }

    /* ---------- 搜索：整行胶囊，文本可见 ---------- */
    .navbar-collapse .navbar-nav > li > a.gs-nav-btn {
        display: flex;
        width: 100%;
        min-height: 48px;
        margin: 4px 0;
        padding: 10px 14px;
        font-size: 15px;
        background: #F4F6FA;
        border: 1px solid rgba(35, 70, 130, .10);
        color: #86909C;
    }
    .navbar-collapse .navbar-nav > li > a.gs-nav-btn .gs-nav-text {
        display: inline !important;
        font-size: 15px;
    }
    .navbar-collapse .navbar-nav > li > a.gs-nav-btn .gs-kbd { display: none !important; }

    /* ---------- 右侧组（搜索/设置/用户）与主菜单之间加分隔线 ---------- */
    .navbar-collapse .navbar-nav.navbar-right {
        margin: 6px 0 0;
        border-top: 1px solid rgba(35, 70, 130, .08);
        padding-top: 6px;
    }

    /* ---------- 徽标不挤压 ---------- */
    .navbar-collapse .nav-badge { margin-left: auto; }
}


/* ---------- 二级菜单颜色强压制（ace/旧样式把链接压成 #777） ---------- */
@media (max-width: 767px) {
    .navbar-collapse .dropdown-menu > li > a,
    .navbar-collapse .dropdown-menu > li > a:visited {
        color: #4E5969 !important;
        background: transparent !important;
    }
    .navbar-collapse .dropdown-menu > li > a:hover,
    .navbar-collapse .dropdown-menu > li > a:focus,
    .navbar-collapse .dropdown-menu > li > a:active,
    .navbar-collapse .dropdown-menu li.active a,
    .navbar-collapse .dropdown-menu li.active a:hover {
        background: #F4F8FF !important;
        color: #1677FF !important;
    }
    .navbar-collapse .dropdown-menu > li > a:hover i,
    .navbar-collapse .dropdown-menu li.active a i { color: #1677FF !important; }
}

/* ============================================================
 * UI/UX 评审改版（2026-11-07）：手机首屏只保留核心任务
 * ------------------------------------------------------------
 * 目标：进入「首页」后首屏就能看到搜索框与文件列表，
 * 不再先滚过一整屏品牌横幅 + 6 张产品入口卡片。
 * ============================================================ */
@media (max-width: 768px) {
    /* 品牌横幅压缩成一条标题带，保留品牌色但不挤占首屏 */
    .pxe-banner { padding: 12px 14px !important; margin: 0 0 8px !important; border-radius: var(--pxe-radius-md); }
    .pxe-banner-text h2 { font-size: 17px !important; margin: 0 0 2px !important; }
    .pxe-banner-text p { font-size: 12px !important; }
    .pxe-banner-deco, .pxe-banner-folder, .pxe-banner-cloud { display: none !important; }

    /* 快捷入口默认折叠；展开后两列三行，全部工具仍然可达 */
    .pxe-quick-wrap { margin: 0 0 10px; }
    .pxe-quick-toggle { display: flex; }
    .pxe-quick-wrap:not(.is-open) > .pxe-quick { display: none; }
    .pxe-quick-wrap.is-open > .pxe-quick {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
        margin-top: 8px;
    }
    .pxe-quick-card { padding: 8px; min-height: 48px; }
    .pxe-quick-title { font-size: 12.5px; }
    .pxe-quick-icon { flex-basis: 28px; width: 28px; height: 28px; font-size: 14px; }

    /* 列表搜索：范围徽标与输入框不互相挤压 */
    .search-scope { font-size: 11px; padding: 4px 6px; }
    .toolbar-search { flex-wrap: wrap; }
    .toolbar-search input[type="text"] { flex: 1 1 140px; min-width: 0; }

    /* 主要触控目标 >= 44px */
    .toolbar-search .btn, .toolbar-actions .btn,
    .pagination > li > a, .pagination > li > span {
        min-height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
    #fileTable .col-ops a, #trashTable .col-ops a,
    #fileTable .col-ops .btn-group > a, #trashTable .col-ops .btn-group > a {
        min-height: 40px;
        padding: 9px 10px;
        display: inline-flex;
        align-items: center;
    }
    #fileTable .checkbox label, #trashTable .checkbox label {
        min-height: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .pxe-tree-op, .pxe-tree-toggle { min-width: 44px; min-height: 44px; }

    /* 抽屉内操作区不被右上角关闭按钮遮挡 */
    .pxe-tree-actions { padding-right: 44px; }

    /* 表格自身容器保留横向滚动兜底（不撑宽整页）；桌面端已用固定布局消除溢出 */
    .table-responsive { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    /* 未选中记录时不展示占满一行的禁用按钮；勾选后按钮自动出现 */
    .toolbar-actions .btn:disabled { display: none; }
}
@media (max-width: 430px) {
    /* 320px 下让输入框占满，搜索范围由 placeholder 说明 */
    .search-scope { display: none; }
}

/* ---------------------------------------------------------------------------
 * 触控基线：主要交互控件不小于 44×44 CSS px。
 * 页面级样式（auth.css / social.css）在本文件之后加载，故此处用 !important
 * 保证不被各自的组件规则覆盖；只抬高最小尺寸，不改变配色、间距与文案。
 * ------------------------------------------------------------------------- */
@media (max-width: 900px) {
    .so-btn, .pa-btn, .so-tab, .pa-reveal, .pxe-tree-op, .pxe-tree-toggle,
    .pxe-tree-refresh, .toolbar-search .btn, .toolbar-actions .btn,
    .path-copy, #pxeDrawerOpen, .pxe-quick-toggle, .so-friend-name {
        min-height: 44px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    /* 折叠菜单项保持整行宽度，只抬高触控高度并垂直居中 */
    .navbar-collapse .nav > li > a {
        min-height: 44px !important;
        display: flex !important;
        align-items: center !important;
    }
    .so-btn, .pa-btn, .so-tab, .pa-reveal, .pxe-tree-op, .pxe-tree-toggle,
    .pxe-tree-refresh, .path-copy, #pxeDrawerOpen, .pxe-quick-toggle {
        min-width: 44px !important;
    }
    .so-input, .so-textarea, .pa-input, .oj-select,
    .toolbar-search input[type="text"], .auth-card input[type="text"],
    .auth-card input[type="password"], .auth-card input[type="email"],
    .so-search input { min-height: 44px !important; }
    .pxe-tree-list a { min-height: 44px !important; display: inline-flex !important; align-items: center !important; }
    .so-friend-name { justify-content: flex-start !important; }
    .navbar-collapse .nav > li > a { justify-content: flex-start !important; }
    .so-tab { flex: 1 1 auto; }
    /* 未选中记录时禁用按钮仍保持隐藏，不被上面的触控基线重新显示 */
    .toolbar-actions .btn:disabled,
    .toolbar-actions .btn[disabled] { display: none !important; }
}
