/* =========================================================
   ZIPBORO Mobile Home Patch
   적용 파일:
   /volume2/nvme/web/zipboro/assets/css/zipboro.mobile.patch.css

   index.html head에 아래 1줄 추가:
   <link rel="stylesheet" href="./assets/css/zipboro.mobile.patch.css" />

   기존 CSS는 건드리지 않고 모바일 화면만 보정합니다.
========================================================= */

@media(max-width:640px){

  /* 전체 좌우 여백 */
  .zb-section{
    padding-left:18px !important;
    padding-right:18px !important;
  }

  /* 추천매물은 모바일에서 큰 카드 1개씩 유지 */
  .zb-property-grid.featured{
    grid-template-columns:1fr !important;
    gap:18px !important;
  }

  .zb-property-grid.featured .zb-card{
    width:100% !important;
    min-width:0 !important;
  }

  .zb-property-grid.featured .zb-thumb{
    height:260px !important;
  }

  .zb-property-grid.featured .zb-card h3{
    font-size:22px !important;
    line-height:1.35 !important;
    word-break:keep-all !important;
  }

  .zb-property-grid.featured .zb-price{
    font-size:30px !important;
  }

  /* 전체매물 상단 제목/필터 정리 */
  .zb-section-head.compact{
    display:block !important;
    margin-bottom:16px !important;
  }

  .zb-section-head.compact h2{
    display:block !important;
    margin:0 0 12px !important;
    font-size:24px !important;
    line-height:1.2 !important;
    letter-spacing:-.04em !important;
    word-break:keep-all !important;
    white-space:nowrap !important;
  }

  .zb-sort-chips{
    display:flex !important;
    flex-wrap:nowrap !important;
    gap:8px !important;
    overflow-x:auto !important;
    padding:2px 0 8px !important;
    -webkit-overflow-scrolling:touch !important;
  }

  .zb-sort-chips::-webkit-scrollbar{
    display:none;
  }

  .zb-sort-chips button{
    flex:0 0 auto !important;
    padding:9px 14px !important;
    font-size:13px !important;
    line-height:1 !important;
    border-radius:999px !important;
    white-space:nowrap !important;
  }

  /* 전체매물은 작은 카드 2개씩 */
  .zb-property-grid.all{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:12px !important;
    width:100% !important;
  }

  .zb-property-grid.all .zb-card{
    width:100% !important;
    min-width:0 !important;
    border-radius:16px !important;
    overflow:hidden !important;
  }

  .zb-property-grid.all .zb-thumb{
    height:112px !important;
  }

  .zb-property-grid.all .zb-card-body{
    padding:11px !important;
  }

  .zb-property-grid.all .zb-card h3{
    margin:0 0 6px !important;
    font-size:14px !important;
    line-height:1.35 !important;
    letter-spacing:-.04em !important;
    word-break:keep-all !important;
    white-space:normal !important;

    display:-webkit-box !important;
    -webkit-line-clamp:2 !important;
    -webkit-box-orient:vertical !important;
    overflow:hidden !important;
  }

  .zb-property-grid.all .zb-card p{
    font-size:12px !important;
    line-height:1.35 !important;
    margin:0 !important;
    color:#64748b !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }

  .zb-property-grid.all .zb-price{
    display:block !important;
    font-size:17px !important;
    line-height:1.2 !important;
    margin:7px 0 !important;
    letter-spacing:-.04em !important;
  }

  .zb-property-grid.all .zb-meta{
    display:flex !important;
    gap:5px !important;
    flex-wrap:wrap !important;
  }

  .zb-property-grid.all .zb-meta span{
    font-size:10px !important;
    line-height:1 !important;
    padding:5px 6px !important;
    border-radius:7px !important;
  }

  .zb-property-grid.all .zb-card-no{
    margin-top:8px !important;
    text-align:right !important;
    font-size:10px !important;
    color:#94a3b8 !important;
    font-weight:800 !important;
    white-space:nowrap !important;
  }

  /* 전체매물 영역 안 화살표는 모바일에서 과하게 보이면 숨김 */
  .zb-section.zb-two-col .zb-arrow{
    display:none !important;
  }

  /* 2단 레이아웃을 모바일에서는 단일 흐름으로 */
  .zb-two-col{
    display:block !important;
  }

  .zb-map-panel{
    margin-top:24px !important;
  }
}

/* 더 좁은 모바일 */
@media(max-width:380px){
  .zb-property-grid.all{
    gap:10px !important;
  }

  .zb-property-grid.all .zb-thumb{
    height:98px !important;
  }

  .zb-property-grid.all .zb-card h3{
    font-size:13px !important;
  }

  .zb-property-grid.all .zb-price{
    font-size:16px !important;
  }
}