/* =========================================================
   企业林 · 小程序风格视觉层 (miniapp.css)
   设计基准：企业林小程序源码 app.wxss / custom-tab-bar
   仅在小屏 (<=768px) 生效，桌面端零影响。
   加载顺序：必须放在 mobile.css 之后，以覆盖其头部/页脚样式。
   ========================================================= */

@media (max-width: 768px) {
  /* ---------- 设计令牌（取自 app.wxss） ---------- */
  :root {
    --mp-primary: #05944B;
    --mp-primary-bg: #e6f7ed;
    --mp-bg: #f4f6fb;
    --mp-white: #ffffff;
    --mp-text1: #1a1a1a;
    --mp-text2: #555555;
    --mp-text3: #999999;
    --mp-border: #eef0f3;
    --mp-radius: 12px;
    --mp-radius-sm: 8px;
    --mp-shadow: 0 2px 14px rgba(0, 0, 0, 0.07);
    --mp-nav-h: 48px;
    --mp-tab-h: 56px;
  }

  html, body {
    background: var(--mp-bg) !important;
  }

  /* ---------- 隐藏原 PC 头部/面包屑/页脚/悬浮按钮，由小程序 chrome 接管 ---------- */
  body .pc-header,
  header.pc-header,
  .pc-header { display: none !important; }
  .breadcrumb { display: none !important; }
  .site-footer { display: none !important; }
  /* 原聊天悬浮按钮在小程序风格下隐藏（tabBar 已承担导航） */
  .chat-fab { display: none !important; }

  /* =========================================================
     顶部导航栏 .mp-navbar
     ========================================================= */
  .mp-navbar {
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 10000;
    height: var(--mp-nav-h);
    background: var(--mp-white);
    border-bottom: 1px solid var(--mp-border);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 12px;
    box-sizing: border-box;
  }
  .mp-nav-left { display: flex; align-items: center; min-width: 40px; }
  .mp-nav-back {
    width: 32px; height: 32px;
    display: flex; align-items: center; justify-content: center;
    border-radius: 50%; color: #333; font-size: 20px; line-height: 1;
    cursor: pointer; -webkit-tap-highlight-color: transparent;
  }
  .mp-nav-back:active { background: #f0f0f0; }
  .mp-nav-title {
    flex: 1; text-align: center;
    font-size: 17px; font-weight: 400; color: var(--mp-text1);
    overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    padding: 0 8px;
  }
  .mp-brand { display: flex; align-items: center; gap: 6px; flex: 1; }
  .mp-brand-logo { height: 28px; width: auto; object-fit: contain; }
  .mp-brand-sub { font-size: 12px; color: var(--mp-text3); line-height: 1; }
  .mp-bell {
    width: 34px; height: 34px; border-radius: 50%;
    background: #f5f5f5; display: flex; align-items: center; justify-content: center;
    position: relative; flex-shrink: 0; font-size: 16px;
  }
  .mp-bell-dot {
    position: absolute; top: 3px; right: 3px;
    width: 8px; height: 8px; border-radius: 50%; background: #ff4d4f;
  }

  /* =========================================================
     底部 tabBar .mp-tabbar（5 格，仅 tab 页显示）
     ========================================================= */
  .mp-tabbar {
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 9999;
    height: var(--mp-tab-h);
    background: var(--mp-white);
    border-top: 1px solid #f0f0f0;
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding-bottom: env(safe-area-inset-bottom);
    box-sizing: content-box;
  }
  .mp-tab {
    flex: 1; height: 100%;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    text-decoration: none; color: #b2b2b2;
    transition: color .2s ease;
    -webkit-tap-highlight-color: transparent;
  }
  .mp-tab img { width: 24px; height: 24px; margin-bottom: 2px; display: block; }
  .mp-tab span { font-size: 11px; line-height: 1.2; }
  .mp-tab.on { color: var(--mp-primary); }
  .mp-tab.on img { transform: scale(1.08); }

  /* =========================================================
     通用卡片 / 区块标题（取自 app.wxss）
     ========================================================= */
  .mp-card {
    background: var(--mp-white);
    border-radius: var(--mp-radius);
    box-shadow: var(--mp-shadow);
  }
  .mp-sec-head {
    display: flex; align-items: center; justify-content: space-between;
    padding: 16px 16px 10px;
  }
  .mp-sec-title {
    font-size: 12px; font-weight: 400; color: var(--mp-text1);
    display: flex; align-items: center; gap: 6px;
  }
  .mp-sec-title::before {
    content: ''; width: 4px; height: 16px; border-radius: 2px;
    background: var(--mp-primary); display: inline-block;
  }
  .mp-sec-more { font-size: 12px; color: var(--mp-text3); }

  .mp-btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 6px;
    background: var(--mp-primary); color: #fff;
    border-radius: 28px; padding: 8px 18px;
    font-size: 13px; white-space: nowrap;
    box-shadow: 0 4px 16px rgba(5, 148, 75, .25);
    text-decoration: none; border: none;
  }
  .mp-btn:active { opacity: .9; }

  /* 让主要内容区不被固定栏遮挡（JS 也会补 padding，这里兜底） */
  body.mp-has-nav { padding-top: var(--mp-nav-h); }
  body.mp-has-tab { padding-bottom: var(--mp-tab-h); }

  /* 详情页悬浮拨打条在小程序风格下让出 tabBar 高度（一般不同页出现，做兜底） */
  body.has-call-bar.mp-has-tab { padding-bottom: calc(var(--mp-tab-h) + 52px); }
}

/* 极小屏微调 */
@media (max-width: 480px) {
  .mp-tab img { width: 22px; height: 22px; }
  .mp-tab span { font-size: 10px; }
}

/* =========================================================
   内容区小程序化（覆盖各页原有 PC 卡片样式，仅手机端生效）
   只改圆角/阴影/间距/药丸标签，不动布局，桌面零影响。
   ========================================================= */
@media (max-width: 768px) {
  /* 容器边距收敛 */
  .container { padding-left: 12px !important; padding-right: 12px !important; max-width: 100% !important; }

  /* —— 列表页卡片 —— */
  .prop-list, .park-list { gap: 12px !important; padding: 12px 0 !important; margin-bottom: 16px !important; }
  .prop-card, .park-card {
    border: none !important;
    border-radius: 12px !important;
    box-shadow: var(--mp-shadow) !important;
    background: #fff !important;
    overflow: hidden !important;
  }
  .prop-card .prop-main, .park-main { padding: 12px 14px 14px !important; }
  /* 角标/标签 圆角药丸化 + 浅底 */
  .type-tag, .park-level, .lease-tag, .badge-type, .badge-rent,
  .park-lease-tag, .park-split-tag {
    border-radius: 6px !important;
  }
  .prop-tag, .park-tag, .park-ind, .park-stat {
    background: #f4f6fb !important; color: #555 !important; border-radius: 6px !important;
  }
  .prop-footer, .park-area-row, .card-stats-row, .card-actions {
    margin-top: 10px !important; padding-top: 10px !important; border-top: 1px solid #f0f2f5 !important;
  }

  /* —— 详情页版块 —— */
  .sec, .section-inner {
    border-radius: 12px !important;
    box-shadow: var(--mp-shadow) !important;
    background: #fff !important;
  }
  .sec { margin-bottom: 12px !important; }
  .section { margin-bottom: 12px !important; }
  .section-inner { padding: 16px !important; border: none !important; }
  /* 标题绿条（统一尺寸/主色） */
  .sec-t, .sec-title, .section-title { font-size: 15px !important; margin-bottom: 12px !important; }
  .sec-t::before, .sec-title::before, .section-title::before {
    width: 4px !important; height: 15px !important; border-radius: 2px !important;
    background: var(--mp-primary) !important;
  }
  /* 参数 chip 浅灰底 */
  .kpi-card, .spec-item, .spec-card {
    background: #f6f8fa !important; border: none !important; border-radius: 10px !important; box-shadow: none !important;
  }
  .kpi-grid, .spec-grid { gap: 8px !important; }

  /* hero / banner 圆角收敛 */
  .banner { border-radius: 0 0 16px 16px !important; height: 200px !important; }
  .banner .name { font-size: 24px !important; letter-spacing: 2px !important; padding: 0 16px !important; }
  .gallery-wrap, .gallery, .hero, .map-box { border-radius: 12px !important; overflow: hidden !important; }
  .g-card, .gallery-card { border-radius: 12px !important; }

  /* 筛选区卡片化 + 手机端横向滑动药丸（小程序模式） */
  .filter-bar { border-radius: 12px !important; border: none !important; box-shadow: var(--mp-shadow) !important; margin-top: 8px !important; padding: 8px 12px !important; }
  .filter-row { flex-direction: row !important; align-items: center !important; padding: 7px 0 !important; border-bottom: 1px solid #f0f2f5 !important; }
  .filter-row:last-child { border-bottom: none !important; }
  .filter-row-label { width: auto !important; min-width: 38px !important; padding-top: 0 !important; font-size: 12px !important; flex-shrink: 0 !important; }
  .filter-row-tags { flex-wrap: nowrap !important; overflow-x: auto !important; flex: 1 !important; -webkit-overflow-scrolling: touch; gap: 8px !important; }
  .filter-row-tags::-webkit-scrollbar { display: none !important; }
  .filter-tag { flex-shrink: 0 !important; padding: 5px 13px !important; border-radius: 16px !important; font-size: 13px !important; }
  .filter-tag-more { flex-shrink: 0 !important; border-radius: 16px !important; }
  .result-bar { padding: 10px 0 4px !important; margin-top: 4px !important; }
  .result-sort { flex-wrap: wrap !important; }

  /* 信息条/标题块留出间距 */
  .name-bar, .title-block, .hero-row, .addr-bar { margin-bottom: 12px !important; }
  .name-bar .container, .title-block { background: #fff !important; border-radius: 12px !important; box-shadow: var(--mp-shadow) !important; padding: 14px !important; }
}

/* =========================================================
   全量内容小程序化（重做视觉，仅手机端，桌面零影响）
   设计语言：白卡 + 12px圆角 + 柔阴影 + 绿主题 + 药丸标签 + 统一间距
   ========================================================= */
@media (max-width: 768px) {

  /* ---------- 通用：药丸标签 ---------- */
  .prop-tag, .park-tag, .park-ind, .park-stat, .tag-chip, .div-chip, .am-tag,
  .badge-type, .badge-rent, .type-tag, .park-level, .lease-tag,
  .park-lease-tag, .park-split-tag, .rec-price, .sort-tag {
    border-radius: 6px !important;
  }
  .prop-tag, .park-tag, .park-ind, .park-stat, .tag-chip, .div-chip, .am-tag {
    background: #f4f6fb !important; color: #555 !important; border: none !important;
    font-size: 11px !important; padding: 3px 9px !important;
  }

  /* =========================================================
     列表页：房源 (pc-list)
     ========================================================= */
  .prop-list { gap: 12px !important; padding: 12px 0 !important; }
  .prop-card { flex-direction: column !important; border: none !important; border-radius: 12px !important;
    box-shadow: var(--mp-shadow) !important; background: #fff !important; overflow: hidden !important; }
  .prop-img { width: 100% !important; height: 172px !important; border-radius: 0 !important; }
  .prop-img img { width: 100% !important; height: 100% !important; object-fit: cover !important; }
  .prop-card .prop-main { padding: 12px 14px 14px !important; }
  .prop-title-row { margin-bottom: 8px !important; gap: 8px !important; }
  .prop-title { font-size: 16px !important; font-weight: 600 !important; color: #1a1a1a !important; }
  .lease-tag { background: var(--mp-primary) !important; border-radius: 4px !important; font-size: 11px !important; padding: 2px 8px !important; }
  .prop-info-row { font-size: 12px !important; color: #888 !important; margin-bottom: 4px !important; line-height: 1.5 !important; }
  .prop-tags-row { margin: 8px 0 2px !important; }
  .prop-footer { display: flex !important; justify-content: space-between !important; align-items: baseline !important;
    margin-top: 10px !important; padding-top: 10px !important; border-top: 1px solid #f0f2f5 !important; font-size: 12px !important; color: #999 !important; }
  .prop-footer b { color: #ff4d4f !important; font-size: 15px !important; }

  /* =========================================================
     列表页：园区 / 产业园区 (pc-park-list / pc-industry-list)
     ========================================================= */
  .park-list { gap: 12px !important; padding: 12px 0 !important; }
  .park-card { border: none !important; border-radius: 12px !important; box-shadow: var(--mp-shadow) !important;
    background: #fff !important; overflow: hidden !important; }
  .park-img { width: 100% !important; height: 168px !important; border-radius: 0 !important; }
  .park-img img { width: 100% !important; height: 100% !important; object-fit: cover !important; }
  .park-level { background: rgba(5,148,75,.92) !important; border-radius: 4px !important; font-size: 11px !important; padding: 2px 8px !important; }
  .park-fav { background: rgba(0,0,0,.35) !important; border-radius: 14px !important; font-size: 12px !important; padding: 3px 10px !important; color: #fff !important; }
  .park-main { padding: 12px 14px 14px !important; }
  .park-title, .card-title { font-size: 16px !important; font-weight: 600 !important; color: #1a1a1a !important; }
  .park-addr { font-size: 12px !important; color: #888 !important; margin: 6px 0 !important; }
  .park-inds { margin: 6px 0 !important; gap: 6px !important; }
  .park-tags { margin-top: 6px !important; }
  .park-area-row, .card-stats-row { display: flex !important; flex-wrap: wrap !important; gap: 6px 14px !important; margin-top: 10px !important;
    padding-top: 10px !important; border-top: 1px solid #f0f2f5 !important; font-size: 12px !important; color: #666 !important; }
  .area-item b, .park-stat b { color: #1a1a1a !important; font-size: 13px !important; }
  .card-header { margin-bottom: 8px !important; }
  .card-header-right { font-size: 11px !important; color: #999 !important; }
  .card-actions { display: flex !important; align-items: center !important; justify-content: space-between !important;
    margin-top: 10px !important; padding-top: 10px !important; border-top: 1px solid #f0f2f5 !important; }
  .park-lease-tag { background: var(--mp-primary) !important; color: #fff !important; border-radius: 4px !important; font-size: 12px !important; padding: 3px 10px !important; }
  .park-split-tag { background: #fff3e0 !important; color: #d4860b !important; border-radius: 4px !important; font-size: 12px !important; padding: 3px 8px !important; }
  .card-price { color: #ff4d4f !important; font-size: 16px !important; font-weight: 700 !important; }
  .card-price .u { font-size: 11px !important; font-weight: 400; }

  /* =========================================================
     详情页：通用区块
     ========================================================= */
  .sec, .section-inner { border-radius: 12px !important; box-shadow: var(--mp-shadow) !important; background: #fff !important;
    margin-bottom: 12px !important; }
  .sec { padding: 16px !important; }
  .section-inner { padding: 16px !important; border: none !important; }
  .sec-t, .sec-title, .section-title { font-size: 15px !important; font-weight: 600 !important; color: #1a1a1a !important; margin-bottom: 12px !important; }
  .sec-t::before, .sec-title::before, .section-title::before {
    width: 4px !important; height: 15px !important; border-radius: 2px !important; background: var(--mp-primary) !important; }
  .intro { font-size: 14px !important; color: #555 !important; line-height: 1.7 !important; }

  /* 参数 chip 浅灰底 */
  .kpi-card, .spec-item, .spec-card { background: #f6f8fa !important; border: none !important; border-radius: 10px !important; box-shadow: none !important; padding: 12px 10px !important; }
  .kpi-val, .spec-val { font-size: 18px !important; font-weight: 700 !important; color: #1a1a1a !important; }
  .kpi-lbl, .spec-lbl { font-size: 12px !important; color: #888 !important; margin-top: 4px !important; }
  .kpi-grid, .spec-grid { gap: 8px !important; }

  /* 园区详情：名称条/地址/产业 */
  .banner { border-radius: 0 0 16px 16px !important; height: 200px !important; }
  .banner .name { font-size: 24px !important; letter-spacing: 2px !important; padding: 0 16px !important; font-weight: 800 !important; }
  .addr-bar { display: flex !important; align-items: center !important; justify-content: space-between !important; padding: 12px 4px !important; font-size: 13px !important; color: #666 !important; background: transparent !important; }
  .fav { color: #999 !important; font-size: 13px !important; margin-left: 12px !important; }
  .inds { display: flex !important; gap: 8px !important; flex-wrap: wrap !important; margin: 10px 0 !important; }
  .ind { background: #e6f7ed !important; color: var(--mp-primary) !important; border-radius: 6px !important; font-size: 12px !important; padding: 4px 10px !important; }
  .stats-grid { display: grid !important; grid-template-columns: repeat(4, 1fr) !important; gap: 8px !important; margin-top: 8px !important; }
  .stat-item { background: #f6f8fa !important; border-radius: 10px !important; padding: 12px 8px !important; text-align: center !important; }
  .stat-item .value { font-size: 17px !important; font-weight: 700 !important; color: #1a1a1a !important; }
  .stat-item .value.highlight { color: var(--mp-primary) !important; }
  .stat-item .label { font-size: 11px !important; color: #888 !important; margin-top: 4px !important; }

  /* 园区详情：租售资源筛选 */
  .res-filter { display: flex !important; gap: 8px !important; overflow-x: auto !important; padding-bottom: 4px !important; margin-bottom: 12px !important; }
  .res-filter::-webkit-scrollbar { display: none !important; }
  .res-fitem { flex-shrink: 0 !important; padding: 6px 14px !important; border-radius: 16px !important; background: #f4f6fb !important; color: #555 !important; font-size: 13px !important; }
  .res-fitem.on { background: var(--mp-primary) !important; color: #fff !important; }

  /* 园区详情：配套/企业/交通 */
  .amenities { display: flex !important; flex-wrap: wrap !important; gap: 8px !important; }
  .amenity { background: #f6f8fa !important; border-radius: 8px !important; padding: 8px 12px !important; font-size: 13px !important; color: #555 !important; }
  .corp-grid { display: grid !important; grid-template-columns: repeat(3, 1fr) !important; gap: 10px !important; }
  .corp-item { background: #f6f8fa !important; border-radius: 10px !important; padding: 12px !important; text-align: center !important; font-size: 13px !important; color: #444 !important; }
  .traffic-item { display: flex !important; align-items: center !important; gap: 10px !important; padding: 10px 0 !important; border-bottom: 1px solid #f5f5f5 !important; font-size: 13px !important; }
  .traffic-icon { width: 32px !important; height: 32px !important; border-radius: 8px !important; background: #e6f7ed !important; display: flex !important; align-items: center !important; justify-content: center !important; flex-shrink: 0 !important; }
  .traffic-name { font-weight: 600 !important; color: #1a1a1a !important; }
  .traffic-desc { color: #999 !important; font-size: 12px !important; }

  /* 产业园详情：名称条/参数行/厂房表 */
  .name-bar .container { background: #fff !important; border-radius: 12px !important; box-shadow: var(--mp-shadow) !important; padding: 14px !important; }
  .location-bar { display: flex !important; align-items: center !important; justify-content: space-between !important; font-size: 13px !important; color: #888 !important; margin-bottom: 8px !important; }
  .act-btn { color: #999 !important; font-size: 13px !important; margin-left: 10px !important; }
  .title { font-size: 18px !important; font-weight: 700 !important; color: #1a1a1a !important; }
  .addr-line { font-size: 12px !important; color: #888 !important; margin: 6px 0 !important; }
  .title-row { display: flex !important; align-items: flex-start !important; justify-content: space-between !important; gap: 12px !important; }
  .qr-col { flex-shrink: 0 !important; }
  .qr-wrap { width: 64px !important; height: 64px !important; border-radius: 8px !important; background: #f4f6fb !important; display: flex !important; align-items: center !important; justify-content: center !important; font-size: 11px !important; color: #999 !important; }
  .info-row { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 12px !important; margin-top: 12px !important; padding-top: 12px !important; border-top: 1px solid #f0f2f5 !important; }
  .info-left { display: flex !important; flex-wrap: wrap !important; gap: 10px 18px !important; }
  .info-item { display: flex !important; flex-direction: column !important; }
  .info-item .val { font-size: 15px !important; font-weight: 600 !important; color: #1a1a1a !important; }
  .info-item .val.hl { color: var(--mp-primary) !important; }
  .info-item .lbl { font-size: 11px !important; color: #999 !important; margin-top: 2px !important; }
  .info-phone { flex-shrink: 0 !important; }
  .factory-table { width: 100% !important; border-collapse: collapse !important; font-size: 13px !important; }
  .factory-table th, .factory-table td { padding: 10px 8px !important; border-bottom: 1px solid #f0f2f5 !important; text-align: left !important; }
  .factory-table th { background: #f6f8fa !important; color: #666 !important; font-weight: 600 !important; }
  .factory-table .num-g { color: #ff4d4f !important; font-weight: 700 !important; }

  /* 房源详情 v1/v2：标题区/画廊/侧栏 */
  .gallery-wrap, .gallery, .hero, .map-box { border-radius: 12px !important; overflow: hidden !important; margin-bottom: 12px !important; }
  .g-card, .gallery-card { border-radius: 12px !important; }
  .title-hotline-row, .title-block { background: #fff !important; border-radius: 12px !important; box-shadow: var(--mp-shadow) !important; padding: 14px !important; margin-bottom: 12px !important; }
  .prop-title { font-size: 18px !important; font-weight: 700 !important; color: #1a1a1a !important; }
  .meta-row { display: flex !important; gap: 8px !important; margin: 8px 0 !important; }
  .badge-type, .badge-rent { background: var(--mp-primary) !important; color: #fff !important; border-radius: 4px !important; font-size: 12px !important; padding: 3px 10px !important; }
  .addr-line { font-size: 13px !important; color: #888 !important; }
  .park-chips { display: flex !important; gap: 6px !important; flex-wrap: wrap !important; margin-top: 8px !important; }
  .park-chip { background: #f4f6fb !important; color: #555 !important; border-radius: 6px !important; font-size: 12px !important; padding: 3px 9px !important; }
  .hotline-card { background: #fff !important; border-radius: 12px !important; box-shadow: var(--mp-shadow) !important; padding: 12px !important; margin-top: 12px !important; }
  .hotline-phone { color: var(--mp-primary) !important; font-size: 18px !important; font-weight: 700 !important; }

  /* 详情页画廊/轮播圆角 */
  .gallery-track { border-radius: 12px !important; overflow: hidden !important; }
}


