/* ==========================================================================
   前台移动端自适应样式 (frontend mobile/responsive overrides)
   --------------------------------------------------------------------------
   用途：让资产管理采购与共享平台前台各页面在主流手机上（320px ~ 767px，
   平板 768px ~ 991px）正常浏览，避免固定宽度导致的横向溢出与错位。
   桌面端（≥992px）完全不受影响。

   说明：
   - 本文件作为“最后加载的覆盖层”，大量使用 !important 以覆盖模板内联样式
     与主题样式（index.css / layout-n.css / user.css）。
   - 请保持本文件位于页面样式加载顺序的最末尾。
   ========================================================================== */

html {
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

/* --------------------------------------------------------------------------
   平板及以下（≤991px）：双栏→单栏、表格横向滚动、侧栏抽屉修正
   -------------------------------------------------------------------------- */
@media (max-width: 991px) {

    /* 会员中心内容区：覆盖模板内联 margin-left:262px / 主题 180px */
    .base_right {
        margin-left: 20px !important;
        margin-right: 20px !important;
        width: auto !important;
    }

    .base-slide {
        margin-left: 0 !important;
    }

    /* 页头 Logo + 搜索框：平板宽度下允许换行，避免横向溢出 */
    .logo-info {
        flex-wrap: wrap !important;
        gap: 10px !important;
    }
    .logo-info img {
        max-width: 100% !important;
        height: auto !important;
    }
    .search-box {
        width: 100% !important;
        max-width: 100% !important;
    }

    /* 仪器详情：图片与信息上下堆叠 */
    .ins-detail-top {
        flex-direction: column !important;
        padding: 15px !important;
    }
    .ins-detail-top .img,
    .ins-detail-top .img img {
        width: 100% !important;
        height: auto !important;
        max-width: 100% !important;
    }
    .ins-detail-tr {
        margin: 15px 0 0 0 !important;
    }
    .ins-detail-tr2 ul li {
        width: 100% !important;
    }

    /* 竞价 / 预约表单：固定宽度控件自适应 */
    .bidding-txt,
    .form-select {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }
    .bidding-row {
        width: 100% !important;
        float: none !important;
        margin: 20px 0 0 0 !important;
    }

    /* 供应商资料：share-info 800px 固定宽度容器 */
    .share-info {
        width: 100% !important;
    }
    .share-info .form-group {
        float: none !important;
        width: 100% !important;
        margin: 0 0 12px 0 !important;
    }
    .share-info .form-group .form-control,
    .share-info .form-group .form-select {
        width: 100% !important;
    }
    .share-row {
        flex-wrap: wrap !important;
    }

    /* 采购项目 box：两列变单列 */
    .pro-box .pro-item {
        width: 100% !important;
        float: none !important;
    }

    /* 各类宽表格：容器内横向滚动，避免撑破页面 */
    .bidding-table,
    .instrument-table,
    .layui-table,
    .document-box table,
    .tech-response-table {
        display: block !important;
        width: 100% !important;
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
        white-space: nowrap;
    }

    /* 正文/详情内容里的图片与表格自适应，防止横向溢出 */
    .detail-con img,
    .detail-con table,
    .yy-detail img,
    .yy-detail table,
    .contact-con img,
    .contact-con table,
    .layer-detail img,
    .bidding-box img,
    .ins-detail-b img {
        max-width: 100% !important;
        height: auto !important;
    }

    /* 报价单页：两列表单上下堆叠 */
    .form-row {
        flex-direction: column !important;
        gap: 12px !important;
    }
    .form-item {
        flex-direction: column !important;
        align-items: stretch !important;
    }
    .form-item label {
        text-align: left !important;
        margin-right: 0 !important;
    }
    .tip-box {
        position: static !important;
        width: 100% !important;
        right: auto !important;
        margin-top: 10px !important;
    }
}

/* --------------------------------------------------------------------------
   手机（≤767px）：主战场
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {

    /* ---------- 顶部信息栏 ---------- */
    .top-info {
        flex-direction: column !important;
        padding: 6px 0;
    }
    .left-info,
    .right-info {
        width: 100% !important;
        text-align: center !important;
    }
    .right-info a {
        padding: 4px 8px !important;
        font-size: 12px !important;
    }

    /* ---------- 页头 Logo 与搜索框 ---------- */
    .logo-info {
        flex-wrap: wrap !important;
    }
    .logo-info img {
        max-width: 100% !important;
        height: auto !important;
    }
    .search-box {
        width: 100% !important;
        max-width: 100% !important;
    }

    /* ---------- 首页 / 采购首页：双栏盒子堆叠 ---------- */
    .home-flex,
    .proc-flex {
        flex-wrap: wrap !important;
    }
    .home-col,
    .proc-col {
        width: 100% !important;
        margin-top: 10px !important;
    }

    .news-box {
        padding: 8px !important;
    }
    .new-list li a {
        flex-wrap: wrap !important;
    }
    /* 标题后的虚线分隔线在手机上隐藏，避免横向溢出 */
    .new-list li .line {
        display: none !important;
    }
    .new-list li .title {
        white-space: normal !important;
        line-height: 22px !important;
    }

    /* ---------- 仪器列表项：图片+标题，联系人/按钮换行 ---------- */
    .share-sec-list li {
        flex-wrap: wrap !important;
        align-items: flex-start !important;
        padding: 12px 0 !important;
    }
    .share-sec-list li .img,
    .share-sec-list li .img img {
        width: 80px !important;
        height: 80px !important;
    }
    .share-sec-list li .pro-r {
        flex: 1 !important;
        min-width: calc(100% - 100px) !important;
        margin-left: 10px !important;
    }
    .share-sec-list li .contacts {
        width: 100% !important;
        order: 2;
        margin: 6px 0 0 90px !important;
        line-height: 20px !important;
        font-size: 13px;
    }
    .share-sec-list li .make {
        order: 3;
        margin: 8px 0 0 90px !important;
    }
    .share-sec-list li .make a {
        padding: 0 20px !important;
    }
    .share-sec-list li .collection {
        order: 4;
        margin: 8px 0 0 12px !important;
    }

    /* 仪器类型筛选条 */
    .instrument-type {
        padding: 12px 14px !important;
    }
    .instrument-type a {
        margin: 0 8px 0 0 !important;
        display: inline-block;
        line-height: 26px;
    }

    /* ---------- 详情页留白收缩 ---------- */
    .detail {
        padding: 10px 12px !important;
    }
    .detail-title {
        font-size: 20px !important;
        line-height: 1.4 !important;
    }
    .detail-con {
        min-height: 0 !important;
        padding: 0 !important;
    }
    .bidding-box,
    .bidding-box2 {
        padding: 15px !important;
        margin: 15px 0 !important;
    }
    .document-box,
    .contact-con,
    .add-box {
        padding: 15px !important;
    }
    .document-box h2,
    .contact-con h2 {
        font-size: 20px !important;
    }
    .ins-detail-b {
        padding: 15px !important;
    }
    .yy-btn {
        margin: 10px !important;
    }
    .yy-btn a {
        width: 80% !important;
        max-width: 300px;
        line-height: 44px !important;
    }
    .bidding-box2 h2 {
        font-size: 20px !important;
    }

    /* 竞价按钮 */
    .offer {
        width: 100% !important;
        max-width: 320px;
        padding: 0 !important;
        line-height: 42px !important;
    }

    /* 附件下载区域 */
    .attachment .input-group {
        flex-wrap: wrap !important;
    }
    .attachment .mb-load {
        display: inline-block !important;
        margin: 4px 0 !important;
    }

    /* ---------- 表格：关键单元格不再强制换行 ---------- */
    .bidding-table td {
        word-break: break-all;
        white-space: normal !important;
    }

    /* ---------- 登录页 ---------- */
    .login-wrapper {
        width: 100% !important;
        max-width: 92% !important;
        height: auto !important;
        min-height: 0 !important;
        flex-direction: column !important;
        padding: 24px 18px !important;
        border-radius: 16px !important;
        margin: 0 auto;
    }
    .login-l {
        display: none !important;
    }
    .login-section {
        width: 100% !important;
        flex: none !important;
    }

    /* 验证码输入框（内联 width:240px）自适应 */
    input[style*="width: 240px"],
    input[style*="width:240px"] {
        width: 100% !important;
        max-width: 100% !important;
        margin-right: 0 !important;
    }

    /* ---------- 分页 ---------- */
    .notice-page {
        text-align: center !important;
        padding: 10px 0;
    }

    /* ---------- 弹窗（layer）自适应 ---------- */
    .layui-layer,
    .layui-layer-page {
        width: calc(100vw - 16px) !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        left: 50% !important;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
    }
    .layui-layer-content {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
    }

    /* ---------- “我的采购/我的预约”状态页签：横向滚动 ---------- */
    .layui-tab-list {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch;
        flex-wrap: nowrap !important;
    }
    .layui-tab-list li {
        flex: 0 0 auto !important;
    }
}

/* --------------------------------------------------------------------------
   超小屏（≤480px）：进一步收紧
   -------------------------------------------------------------------------- */
@media (max-width: 480px) {
    .right-info a {
        padding: 4px 5px !important;
        font-size: 11px !important;
    }
    .navbar-default .nav > li > a {
        padding: 0 10px !important;
        font-size: 13px !important;
    }
    .big-title {
        font-size: 15px !important;
    }
}
