/* ============================================================
 * common.css - lzbmw 模板公共样式（自动抽取合并生成）
 * 内容：页面模板去重后的公共规则 + header/footer/page 公共片段
 *      + 移动端统一加固
 * 引用顺序：index.css -> pages/<页面>.css -> common.css
 * ============================================================ */

.step-bar{
    display:flex;
    gap:12px;
    margin-bottom:16px;
    padding-bottom:10px;
    border-bottom:1px solid #e5edf8;
}

.step-bar span{
    padding:6px 12px;
    background:#e5edf8;
    border-radius:4px;
}

.step-bar span.current{
    background:#4096ee;
    color:#fff;
}

.tip-red{
    color:#f5222d;
}

.form-title{
    font-size:17px;
    color:#2b78d4;
    border-bottom:1px solid #e5edf8;
    padding-bottom:8px;
    margin-bottom:14px;
    font-weight:bold;
}

.table{
    width:100%;
    border-collapse:collapse;
}

.table tr{
    border-bottom:1px dotted #eee;
}

.table td.tditem{
    padding:12px 8px;
    width:140px;
    font-weight:500;
    vertical-align:middle;
}

.table td.tdcontent{
    padding:12px 8px;
    vertical-align:middle;
}

.table .text{
    height:38px;
    padding:0 10px;
    border:1px solid #bcd6f5;
    border-radius:4px;
    font-size:14px;
    box-sizing:border-box;
    width:100%;
}

.table select.text{
    height:38px;
}

.submit{
    margin-top:16px;
    padding-top:8px;
}

.okbut{
    background:#4096ee;
    color:#fff;
    border:none;
    padding:8px 22px;
    border-radius:4px;
    cursor:pointer;
    font-size:15px;
}

.okbut:hover{
    background:#2b78d4;
}

.cat-group{
    margin-bottom:18px;
}


/* ========= 自定义灯箱CSS【增强版】 ========= */
.lightbox-mask{
    position: fixed;
    left:0;top:0;right:0;bottom:0;
    background:rgba(0,0,0,0.85);
    z-index:9999;
    display:none;
    align-items:center;
    justify-content:center;
}

.lightbox-wrap{
    position:relative;
    max-width:90%;
    max-height:90vh;
    overflow:hidden;
}

/* 图片滑动容器 */
.lightbox-slide-box{
    overflow:hidden;
}

.lightbox-img{
    max-width:100%;
    max-height:85vh;
    border:2px solid #fff;
    cursor:pointer;
    transition: transform 0.32s ease-out;
}

/* 按钮hover高亮 */
.lightbox-close{
    position:absolute;
    right:-40px;top:-40px;
    color:#fff;font-size:32px;
    cursor:pointer;
    width:36px;height:36px;
    text-align:center;line-height:36px;
    border-radius:50%;
    transition: all 0.2s;
}

.lightbox-close:hover{
    background:#ffffff;
    color:#000000;
}

.lightbox-prev,.lightbox-next{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    color:#fff;font-size:40px;
    cursor:pointer;
    padding:0 10px;
    user-select:none;
    width:44px;height:44px;
    text-align:center;line-height:44px;
    border-radius:50%;
    transition: all 0.2s;
}

.lightbox-prev{left:-50px;}

.lightbox-next{right:-50px;}

.lightbox-prev:hover,.lightbox-next:hover{
    background:rgba(255,255,255,0.25);
}

.lightbox-count{
    text-align:center;
    color:#fff;
    margin-top:12px;
    font-size:14px;
}

.tip-notice{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:14px;
}

.tip-notice img{
    flex-shrink:0;
}

.tip-notice span{
    font-size:15px;
    color:#2b78d4;
    font-weight:bold;
}

.tip-notice p{
    margin:4px 0 0;
    font-size:14px;
    color:#666;
}

.clear{
    clear:both;
}


.table{
    width:100%;
}


/*手机适配 */
@media(max-width:768px){
    .table tr{
        display:block;
        margin-bottom:10px;
    }
    .table td.tditem{
        display:block;
        width:auto;
        padding:6px 8px 2px;
    }
    .table td.tdcontent{
        display:block;
        padding:2px 8px 8px;
    }
    .table .text{
        width:100% !important;
    }
}

.table .text{
    height:38px;
    padding:0 10px;
    border:1px solid #bcd6f5;
    border-radius:4px;
    font-size:14px;
    box-sizing:border-box;
}


.tablelist{
    width:100%;
    border-collapse:collapse;
}

.tablelist .tabletitle td{
    background:#4096ee;
    color:#fff;
    padding:12px 6px;
    text-align:center;
}

.tablelist tr.tditem td{
    padding:12px 6px;
    text-align:center;
    border-bottom:1px dotted #eee;
    font-size:14px;
}

.tablelist tr.table_over td{
    padding:12px 6px;
    text-align:center;
    border-bottom:1px dotted #eee;
    background:#e5edf8;
    font-size:14px;
}

.tablelist td a{
    color:#4096ee;
    text-decoration:none;
}

.tablelist td a:hover{
    color:#2b78d4;
}

.manu{
    margin-top:16px;
    text-align:center;
}

.red{
    color:#f5222d;
}


/*手机端适配 */
@media(max-width:768px){
    .tablelist{
        font-size:12px;
    }
    .tablelist .tabletitle td,
    .tablelist tr.tditem td,
    .tablelist tr.table_over td{
        padding:8px 3px;
    }
}


/*手机适配 */
@media(max-width:768px){
    .table tr{
        display:block;
        margin-bottom:10px;
    }
    .table td.tditem{
        display:block;
        width:auto;
        padding:6px 8px 2px;
    }
    .table td.tdcontent{
        display:block;
        padding:2px 8px 8px;
    }
}

/* 发布步骤栏 和选择分类页面完全统一 */
.step-bar{
    background:#fff;
    padding:15px 20px;
    border-radius:6px;
    margin-bottom:15px;
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:10px;
}

.step-bar b{
    color:#2b78d4;
    font-weight:bold;
}

.step-bar span{
    padding:6px 18px;
    background:#e5edf8;
    border-radius:4px;
    color:#666;
    white-space:nowrap;
}


/* ===== 全局防横向撑破，PC无影响 =====
   注意：必须用 overflow-x:clip 而不是 hidden，
   hidden 会让根元素成为滚动容器，导致导航条 position:sticky 固顶失效 ===== */
html,body{max-width:100%;overflow-x:clip;}

img{max-width:100%;height:auto;}

iframe{max-width:100%;}


#top_bar{background:#2b78d4;color:#fff;font-size:13px;}

#top_bar .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;padding:7px 10px;gap:6px;}

#top_bar a{color:#fff;text-decoration:none;}

#top_bar .site_service a{color:#ffdd44;}

.top-notice{flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}


.header{padding:25px;background:#fff;}

.header-inner{display:flex;align-items:center;justify-content:space-between;gap:12px;}

.logo{flex:0 0 auto;font-size:28px;font-weight:bold;color:#2b78d4;text-decoration:none;white-space:nowrap;line-height:1;}

.publish-btn{flex:0 0 auto;background:#ff7822;color:#fff;line-height:42px;padding:0 18px;border-radius:4px;text-decoration:none;font-size:15px;white-space:nowrap;}

.city-select{flex:0 0 auto;height:42px;padding:0 8px;border:1px solid #bcd6f5;border-radius:4px;font-size:14px;background:#fff;min-width:110px;}


.search-box{flex:1;min-width:0;display:flex;align-items:center;}

.search-box form{display:flex;width:80%;min-width:0;}

.search-box input{flex:1;min-width:0;height:42px;padding:0 12px;border:1px solid #bcd6f5;border-radius:4px 0 0 4px;font-size:14px;outline:none;box-sizing:border-box;}

.search-box button{flex:0 0 auto;height:42px;padding:0 14px;background:#4096ee;color:#fff;border:none;border-radius:0 4px 4px 0;cursor:pointer;font-size:14px;white-space:nowrap;}


.nav-wrap{position:sticky;top:0;z-index:99;background:#4096ee;}

.nav-wrap .wrap.nav{display:flex;align-items:center;flex-wrap:wrap;}

.nav-wrap .nav-left{display:flex;align-items:center;flex-wrap:wrap;}

.nav-wrap .nav-right{display:flex;align-items:center;margin-left:auto;}

.nav-wrap a{display:block;padding:12px 14px;color:#fff;text-decoration:none;font-size:15px;white-space:nowrap;}

.nav-wrap a.news-btn{background:none;font-weight:bold;}


.publish-fixed{display:none;position:fixed;right:16px;bottom:70px;z-index:999;background:#ff7822;color:#fff;padding:10px 14px;border-radius:99px;text-decoration:none;font-size:14px;box-shadow:0 2px 8px rgba(0,0,0,0.2);}

.backtop-fixed{display:none;position:fixed;right:16px;bottom:20px;z-index:999;background:#4096ee;color:#fff;padding:10px 14px;border-radius:99px;text-decoration:none;font-size:14px;box-shadow:0 2px 8px rgba(0,0,0,0.2);opacity:0;visibility:hidden;transition:opacity .25s ease;}

.backtop-pc{display:block;position:fixed;right:16px;bottom:20px;z-index:999;background:#4096ee;color:#fff;padding:10px 14px;border-radius:99px;text-decoration:none;font-size:14px;box-shadow:0 2px 8px rgba(0,0,0,0.2);opacity:0;visibility:hidden;transition:opacity .25s ease;}

.backtop-fixed.show,.backtop-pc.show{opacity:1;visibility:visible;}


/* 移动端头部组件：桌面端隐藏 */
.m-menu-btn,.m-search-btn,.m-badge,.m-drawer{display:none;}

/* ============ 只对移动端生效，全部 !important 覆盖 index.css ============ */
@media(max-width:768px){
    html,body{width:100% !important;overflow-x:clip !important;}
    #top_bar{display:none !important;}

    .wrap{width:100% !important;max-width:100% !important;margin:0 auto !important;padding:0 10px !important;box-sizing:border-box !important;}

    .header{padding:0 !important;background:#fff !important;border-bottom:1px solid #e5e5e5 !important;}
    .header-inner{
        display:flex !important;
        flex-direction:row !important;
        flex-wrap:wrap !important;
        align-items:center !important;
        gap:0 !important;
        width:100% !important;
        min-height:44px !important;
        padding:0 10px !important;
        box-sizing:border-box !important;
    }
    .m-menu-btn{
        display:flex !important;
        flex-direction:column !important;
        justify-content:center !important;
        gap:4px !important;
        flex:0 0 auto !important;
        width:34px !important;height:34px !important;
        padding:6px 7px !important;box-sizing:border-box !important;
    }
    .m-menu-btn span{display:block;width:100%;height:2px;background:#4096ee;border-radius:2px;}
    .logo{
        flex:1 1 auto !important;
        display:flex !important;
        align-items:center !important;
        justify-content:center !important;
        font-size:20px !important;
        line-height:44px !important;
        white-space:nowrap !important;
        color:#2b78d4 !important;
    }
    .m-badge{
        display:inline-block !important;
        margin-left:6px !important;
        padding:1px 5px !important;
        background:#4096ee !important;color:#fff !important;
        font-size:11px !important;font-weight:normal !important;
        border-radius:3px !important;line-height:16px !important;
    }
    .city-select,.header-inner > .publish-btn{display:none !important;}
    .m-search-btn{
        display:flex !important;align-items:center !important;justify-content:flex-end !important;
        flex:0 0 auto !important;width:34px !important;height:34px !important;
    }
    .m-search-btn i{
        display:block;position:relative;width:15px;height:15px;
        border:2px solid #4096ee;border-radius:50%;
    }
    .m-search-btn i:after{
        content:'';position:absolute;right:-6px;bottom:-4px;width:7px;height:2px;
        background:#4096ee;border-radius:1px;transform:rotate(45deg);
    }
    .search-box{
        display:none !important;
        flex:0 0 100% !important;
        padding:0 0 8px !important;
    }
    .search-open .search-box{display:flex !important;}
    .search-box form{display:flex !important;width:100% !important;min-width:0 !important;}
    .search-box input{
        flex:1 1 auto !important;min-width:0 !important;width:auto !important;
        height:34px !important;font-size:14px !important;padding:0 8px !important;
        border:1px solid #bcd6f5 !important;border-radius:4px 0 0 4px !important;
        background:#fff !important;
    }
    .search-box button{flex:0 0 auto !important;height:34px !important;padding:0 12px !important;font-size:14px !important;}
    /* 抽屉菜单 */
    .m-drawer{display:block !important;position:fixed;left:0;top:0;right:0;bottom:0;z-index:9999;pointer-events:none;}
    .m-drawer-mask{position:absolute;left:0;top:0;right:0;bottom:0;background:rgba(0,0,0,.4);opacity:0;visibility:hidden;transition:opacity .25s;}
    .m-drawer-panel{
        position:absolute;left:0;top:0;bottom:0;width:76%;max-width:300px;background:#fff;
        transform:translateX(-100%);transition:transform .25s ease;
        overflow-y:auto;-webkit-overflow-scrolling:touch;box-shadow:2px 0 10px rgba(0,0,0,.15);
        pointer-events:auto;
    }
    .m-drawer.open{pointer-events:auto;}
    .m-drawer.open .m-drawer-mask{opacity:1;visibility:visible;}
    .m-drawer.open .m-drawer-panel{transform:translateX(0);}
    .m-drawer-head{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;background:#4096ee;color:#fff;font-size:16px;}
    .m-drawer-head a{color:#fff;font-size:13px;text-decoration:none;}
    .m-drawer-user{padding:12px 14px;font-size:13px;color:#666;border-bottom:1px solid #eee;}
    .m-drawer-user a{color:#4096ee;text-decoration:none;}
    .m-drawer-post{display:block;margin:12px 14px;padding:10px 0;text-align:center;background:#ff7822;color:#fff;border-radius:6px;font-size:15px;text-decoration:none;}
    .m-drawer-sec{padding:8px 14px 4px;font-size:13px;color:#999;}
    .m-drawer-links{display:flex;flex-wrap:wrap;padding:0 8px;}
    .m-drawer-links a{display:block;width:33.33%;box-sizing:border-box;padding:10px 6px;font-size:14px;color:#333;text-decoration:none;text-align:center;}

    .publish-fixed{display:block;}
    .backtop-fixed{display:block;}
    .backtop-pc{display:none !important;}

    .nav-wrap .wrap.nav{display:flex !important;flex-wrap:nowrap !important;overflow-x:auto !important;-webkit-overflow-scrolling:touch;}
    .nav-wrap .nav-left{flex-wrap:nowrap !important;}
    .nav-wrap .nav-right{margin-left:0 !important;flex-wrap:nowrap !important;}
    .nav-wrap a{padding:10px 10px !important;font-size:14px;}
    .nav-wrap .nav-left a:first-child{background:#2b78d4 !important;}
}

.pagination-wrap{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    align-items:center;
    justify-content:space-between;
    margin-top:15px;
    padding:12px;
    background:#fff;
    border-radius:6px;
}

.pagination-info{
    font-size:14px;
    color:#666;
}

.pagination-btns{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    align-items:center;
}

.pagination-btns a{
    display:block;
    border:1px solid #bcd6f5;
    border-radius:4px;
    padding:4px 12px;
    color:#2b78d4;
    text-decoration:none;
    transition:all 0.2s;
}

.pagination-btns a:hover{
    background:#4096ee;
    color:#fff;
    border-color:#4096ee;
}

.pagination-btns .curt{
    display:block;
    border:1px solid #4096ee;
    background:#4096ee;
    color:#fff;
    border-radius:4px;
    padding:4px 12px;
}

.pagination-btns .nolk{
    display:block;
    border:1px solid #eee;
    border-radius:4px;
    padding:4px 12px;
    color:#bbb;
    background:#fafafa;
}

/*跳转页码区域*/
.pagination-jump{
    display:flex;
    gap:6px;
    align-items:center;
}

.pagination-jump input{
    width:60px;
    height:30px;
    border:1px solid #bcd6f5;
    border-radius:4px;
    padding:0 6px;
    text-align:center;
}

.pagination-jump button{
    height:30px;
    border:none;
    background:#4096ee;
    color:#fff;
    border-radius:4px;
    padding:0 10px;
    cursor:pointer;
}

/*手机端适配*/
@media(max-width:768px){
    /* 整行不换行，超出横向滚动，避免分成三行 */
    .pagination-wrap{
        flex-direction:row;
        flex-wrap:nowrap;
        align-items:center;
        justify-content:flex-start;
        gap:10px;
        padding:10px 8px;
        overflow-x:auto;
        -webkit-overflow-scrolling:touch;
        scrollbar-width:none;
    }
    .pagination-wrap::-webkit-scrollbar{display:none;}
    /* 只保留「当前 X/Y 页」，隐藏「共N条记录」「N/页」，缩短横向距离 */
    .pagination-info{
        flex:0 0 auto;
        white-space:nowrap;
        font-size:12px;
    }
    .pagination-info span:nth-child(1),
    .pagination-info span:nth-child(3){display:none;}
    .pagination-btns{
        flex:0 0 auto;
        flex-wrap:nowrap;
        gap:5px;
    }
    .pagination-btns a,.pagination-btns .curt,.pagination-btns .nolk{
        white-space:nowrap;
        padding:4px 9px;
        font-size:13px;
    }
    .pagination-jump{
        flex:0 0 auto;
        white-space:nowrap;
    }
    .pagination-jump input{width:52px;height:28px;}
    .pagination-jump button{height:28px;padding:0 8px;}
}

#footer{width:100%;background:#2b7cd3;color:#fff;margin-top:20px;padding:30px 0;}

.foot_info{width:1200px;margin:0 auto;padding:0 10px;box-sizing:border-box;}

.foot_nav a{color:#ffffff;text-decoration:none;margin:0 4px;}

.foot_nav a:hover{color:#e8f2ff;text-decoration:underline;}

.foot_info div{color:#ffffff;font-size:14px;line-height:180%;}

.foot_info a{color:#ffffff;text-decoration:none;}

.foot_info a:hover{color:#e8f2ff;text-decoration:underline;}

/* 移动端适配 和首页统一 */
@media (max-width:1200px){
    .foot_info{width:100%;}
}

@media (max-width:768px){
    #footer{padding:20px 0;}
    .foot_info{padding:0 12px;font-size:13px;}
    .foot_nav{line-height:160%;}
}

/* ===== 移动端统一加固（导航通栏、单列布局） ===== */
@media (max-width:768px){
    .nav-wrap .wrap{padding-left:0 !important;padding-right:0 !important;}
    .nav-wrap .wrap.nav{padding-left:0 !important;padding-right:0 !important;}
    .main{flex-direction:column !important;}
    .left-main,.right-side{width:100% !important;min-height:auto;}
    .top_table table,.report-form table{max-width:100%;}
}

/* ===== 悬浮按钮（发布信息/返回顶部）移动端强制竖排 ===== */
@media (max-width:768px){
    .publish-fixed,.backtop-fixed{
        position:fixed !important;
        left:auto !important;
        right:14px !important;
        display:block !important;
        white-space:nowrap;
    }
    .publish-fixed{bottom:76px !important;}
    .backtop-fixed{bottom:24px !important;}
    /* 发布页(post)/分类选择页(select)隐藏悬浮发布按钮，body 上加 no-float-publish 类 */
    .no-float-publish .publish-fixed{display:none !important;}
}

/* ===== v3.63 页脚吸底：内容不足一屏时，页脚留在视口底部，不再跟着内容上浮 ===== */
html{height:100%;}
body{display:flex;flex-direction:column;min-height:100vh;}
/* 原来内容与页脚之间的 20px 间距靠 #footer 的 margin-top，现在 margin-top 让给 auto 推底，
   间距改由 footer.htm 里那个空的 .dibtbg 占位（本来就是占位块，之前没给高度） */
.dibtbg{height:20px;}
#footer{margin-top:auto;}
/* 手机浏览器地址栏会吃掉一部分 100vh，支持的浏览器用动态视口高度兜一下 */
@supports (min-height:100dvh){
    body{min-height:100dvh;}
}