/* ============================================================
 * hao2026 移动端补丁（skin/hao2026/mobile.css）
 *
 * 说明：PC / 手机共用同一套页面与数据（响应式），基础适配来自
 * 原站的 /hao2026/css/wwww_com-app.css（max-width:1024px 生效）。
 * 本文件只修原站 CSS 在窄屏下的遗漏，全部规则都在媒体查询里，
 * 桌面端（>1024px）完全不受影响。加载顺序在本文件于
 * wwww_com-app.css 之后引入，可安全覆盖。
 * ============================================================ */

@media (max-width: 1024px) {

    /* ---- 1) 顶部日期行溢出：dir_date.js 输出的长文字截断显示 ---- */
    .wwww_com-top .top-l {
        display: block;
        width: 100%;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        text-align: center;
    }

    /* ---- 1b) 顶部用户区（VIP快审 / 免费注册 / 会员登录）----
       app.css 在窄屏把 .top-r 整块 display:none，导致手机上没有任何
       登录/注册入口，这里补回来，改成日期行下面的第二行居中显示。 */
    .wwww_com-top {
        height: auto;
        padding-bottom: 4px;
    }
    .wwww_com-top .top-r {
        display: block;
        width: 100%;
        height: auto;
        border-top: 0;
        padding: 2px 0 0;
        text-align: center;
        font-size: 13px;
        line-height: 22px;
    }
    .wwww_com-top .top-r a {
        float: none;
        display: inline-block;
        width: auto;
        margin: 0;
        padding: 0 10px;
        border: 0;
        border-radius: 0;
        background: none;
        font-size: 13px;
        line-height: 22px;
        color: #036cbb;
    }
    .wwww_com-top .top-r a + a { border-left: 1px solid #e2e2e2; }
    .wwww_com-top .top-r a:hover { background: none; color: #3cb135; }
    .wwww_com-top .top-r span { display: inline; }

    /* ---- 1c) 数据统计条：PC 一行，手机允许换行（内容与 PC 一致）---- */
    .statistics { display: block; }
    .statistics ul {
        padding: 4px 8px;
        text-align: left;
    }
    .statistics ul li {
        display: inline;
        font-size: 12px;
        line-height: 20px;
    }
    .statistics ul li em { font-size: 12px; }

    /* ---- 2) 搜索行：输入框 + 按钮一行放下，按钮不再被裁 ----
       原因：app.css 只改了 input 65% / 按钮 34%，但外层
       .wwww-com-keyboard（PC 上按内容撑宽、带 margin-top:8px）
       没有归零，导致整行超出屏幕右缘。 */
    .wwww-com-keyboard {
        float: none;
        width: 100%;
        margin-top: 0;
        border-right: 0;
        border-radius: 0;
    }
    .search-input {
        width: 65%;
        box-sizing: border-box;
        float: left;
    }
    .wwww-com-search-btn {
        width: 35%;
        box-sizing: border-box;
        float: left;
    }

    /* ---- 3) 防溢出兜底：图片不撑破容器，长词/长 URL 可断行 ---- */
    .layui-main img { max-width: 100%; }
    .layui-main, .wwww_com-header { overflow-wrap: break-word; word-break: break-word; }

    /* ---- 4) 面包屑过窄时允许换行，不横向顶破 ---- */
    .layui-breadcrumb, .location, .dht {
        white-space: normal;
        word-break: break-all;
    }

    /* ---- 5) 首页底部「友情链接」外框：PC 上是 1238px 定宽 + 1px 边框，
       窄屏下 width:100% 会把左右边框算在 100% 之外，撑出 2px 横向滚动 ---- */
    .yq {
        width: auto;
        margin-left: 0;
        margin-right: 0;
        box-sizing: border-box;
    }
    .yq .youqing {
        width: 100%;
        box-sizing: border-box;
    }

    /* ---- 6) 手机导航：与 PC 同一组入口，横向滑动查看 ----
       注意 layui 给 .layui-main 加了左右 15px 外边距，而 app.css 又把
       .appnav 设成 width:100%，两者相加会顶出 15px 横向滚动，这里一起归零。 */
    .appnav {
        width: auto;
        margin-left: 0;
        margin-right: 0;
        overflow-x: auto;
        scrollbar-width: none;
        padding: 0 4px;
        box-sizing: border-box;
    }
    .appnav::-webkit-scrollbar { height: 0; display: none; }
    .appnav .layui-nav-item { margin: 0 2px; }
    .appnav .layui-nav-item a { padding: 0 12px; }

    /* ============================================================
     * 7) 会员中心（/user/ 网站管理 / 网站列表 / 网站提交）
     *    member.css 里 #memberwrap 是 1200px 定宽（左 200 + 右 980），
     *    手机上必须改成竖排全宽，否则整页横向滚动、右侧表单看不到。
     * ============================================================ */
    #memberwrap {
        width: 100%;
        padding: 0 8px;
        box-sizing: border-box;
    }
    #memberwrap .left,
    #memberwrap .right {
        float: none;
        width: 100%;
        box-sizing: border-box;
    }
    #memberwrap .left {
        margin-top: 10px;
        box-shadow: none;
        border: 1px solid #eee;
    }
    /* 左侧菜单在手机上摊平：layui-nav-tree 的二级菜单默认绝对定位，
       竖排后会浮到右侧内容上方，这里改成文档流内展开 */
    #memberwrap .left ul.layui-nav { width: 100%; }
    #memberwrap .left .layui-nav-child {
        position: static;
        display: block;
        left: auto;
        top: auto;
        box-shadow: none;
    }
    #memberwrap .left .layui-nav-child dd a { padding-left: 30px; }
    #memberwrap .left .layui-nav-more { display: none; }
    /* li 在 PC 上被固定成 40px 高，二级菜单改文档流后要让它按内容撑开 */
    #memberwrap .left .layui-nav-item,
    #memberwrap .left ul.layui-nav {
        height: auto;
    }
    #memberwrap .left .layui-nav-tree { height: auto; }

    /* 统计卡片：手机上两列 */
    .count-info ul li {
        width: calc(50% - 20px);
        box-sizing: border-box;
    }
    .count-info ul li p { font-size: 22px; }

    /* 会员信息卡：头像小一号，文字不挤 */
    .hao2026-user-head { padding: 14px; }
    .hao2026-user-head .hao2026-avatar { width: 56px; height: 56px; }
    .hao2026-user-head .hao2026-user-info { margin-left: 12px; padding-top: 0; max-width: calc(100% - 72px); }
    .hao2026-user-head .hao2026-user-info h2 { font-size: 16px; margin-bottom: 6px; }

    /* 会员页页脚在 PC 上是 1200px 定宽，容器 overflow:hidden 会直接裁掉 */
    .foot-w1240 {
        width: 100%;
        padding: 0 12px;
        box-sizing: border-box;
    }
    .foot .bottom-logo { float: none; width: auto; text-align: center; padding-top: 0; }
    .foot .foot-r { float: none; width: auto; text-align: center; }
    /* PC 上友链行是单行 40px 高，手机上会换行，高度必须自适应，否则被裁切；
       app.css 还给 span 加了 float:left，不解除的话父容器高度会塌成 0 */
    .foot .bottom-gy { height: auto; line-height: 24px; padding: 2px 0 6px; overflow: hidden; }
    .foot .bottom-gy span { float: none; display: inline-block; width: auto; margin: 4px 6px; }
    .foot .bottom-gy span a { padding: 0 4px; }
    .foot .bottom-b { line-height: 22px; padding-bottom: 4px; }
    #memberwrap .right {
        margin-top: 8px;
        padding: 12px;
        min-height: 0;
    }

    /* 列表表格：容器内横向滑动，页面本身不再溢出 */
    #listbox {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        padding: 0;
    }
    #listbox table { min-width: 640px; }

    /* 表单：标签独占一行，输入框拉满宽度 */
    #formbox li strong {
        float: none;
        display: block;
        width: auto;
        text-align: left;
        padding-top: 0;
        margin-bottom: 6px;
    }
    #formbox li p { padding-left: 0; }
    #formbox li .btn,
    #formbox li input[type=submit] { margin-left: 0; }
    #formbox li img { max-width: 100%; }
    #formbox li select,
    #formbox li input[type=text],
    #formbox li textarea,
    #memberwrap .ipt {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }
    #formbox li select { margin-bottom: 6px; }
    /* 域名行：http:// 选项 + 输入框 + 获取信息按钮，允许换行 */
    #formbox li label { display: inline-block; margin-bottom: 4px; }
    /* 行内说明文字（「请选择到最末级子栏目」「点获取信息自动填充」等）在
       输入框拉满后会被挤成竖排，改成单独一行 */
    #formbox li > span {
        display: block;
        margin: 4px 0 0 0 !important;
        line-height: 18px;
    }

    /* 提示条 / 成功框内的按钮换行不挤 */
    #memberwrap .title { font-size: 13px; line-height: 22px; }
}

@media (max-width: 480px) {
    /* 小屏再收紧：搜索按钮文字不换行 */
    .wwww-com-search-btn { font-size: 14px; letter-spacing: 0; }
}