/* ============================================================
   집테리어 모바일 터치타겟 보정  css/zp-touch-target.css
   2026-09-08 신설
   ------------------------------------------------------------
   [배경] 모바일 전담 세션 감사에서 집테리어 첫 화면에 44px 미만
   터치타겟이 21개(공용 GNB 것 4개 제외) 나왔다. 애플 HIG/구글 M3
   권장은 44x44 이고, 디자인 총괄 확정 원칙은 **"44는 시각 크기가
   아니라 히트영역 기준"** 이다.

   [모바일 세션과 합의한 3분류]
     (A) 아이콘 버튼   시각 크기를 지켜야 함 -> ::after 로 히트영역만 확장
     (B) 텍스트 버튼   배경 없음 -> padding 으로 키움(시각 변화 없음)
     (C) 폼 컨트롤     select/input -> min-height 로 요소 자체를 키움
                       (히트영역만 넓히면 시각적으로 작아 보여 어색)

   [특정도 주의] 기존 규칙이 style.css 에 있고 대부분 (0,1,0)/(0,1,1)
   이다. 이 파일은 index.html 에서 style.css **뒤에** 로드되므로,
   같은 셀렉터를 그대로 써서 특정도를 맞추면 나중 선언으로 이긴다.
   (@media 는 특정도를 올려주지 않는다 -- 같은 날 두 세션이 이걸로
   배포를 한 번씩 헛쳤다.)

   [겹침 실측] 히트영역을 44 로 넓히면 인접 버튼 클릭을 가로챌 수 있어
   전부 실측했다. 지도 레일은 버튼 간 8~9px 여백이 있고 이미 44x44 라
   위험 없음. 패널 안에서 겹치는 쌍은 평/㎡ 하나뿐(중심간 35px).
   ============================================================ */

@media (max-width: 760px) {

  /* ---- (A) 아이콘 버튼: 시각 크기 유지, 히트영역만 44 ---- */

  /* 단지 패널 닫기 38x38 -> 히트영역 44x44 (기존 ::after 없음 확인) */
  .panel-close::after {
    content: "";
    position: absolute;
    inset: -3px;
  }

  /* 업체·포폴 패널 닫기 38x38 */
  .company-detail-close, .portfolio-detail-close { position: relative; }
  .company-detail-close::after, .portfolio-detail-close::after {
    content: "";
    position: absolute;
    inset: -3px;
  }

  /* 즐겨찾기 하트 38x38 / 40x40 */
  .portfolio-detail-favorite, .company-favorite-heart { position: relative; }
  .portfolio-detail-favorite::after { content: ""; position: absolute; inset: -3px; }
  .company-favorite-heart::after    { content: ""; position: absolute; inset: -2px; }

  /* 채팅 닫기 24x24 -- 가장 작았다 */
  .chat-close { position: relative; }
  .chat-close::after { content: ""; position: absolute; inset: -10px; }

  /* ---- 지도 레일은 이번 범위에서 뺐다 ----
     줌 +/- 42x44, 일반/위성·평/㎡ 42x42 로 잡히지만, 실측해보니
     **컨테이너가 이미 44x44 이고 border 1px 때문에 내부 button 이
     42px** 인 구조였다(zoom 컨테이너 44x90, type/unit 44x44).
     즉 실제 부족분은 테두리 1px 뿐이라 체감 개선이 거의 없고,
     zoom 컨테이너는 overflow:hidden 이라 ::after 확장이 잘린다.
     건드리면 레일 정렬이 틀어질 위험이 이득보다 커서 그대로 둔다.
     (접근성 감사 도구에는 계속 42px 로 잡힌다 -- 알고 남기는 것) */

  /* ---- (B) 텍스트 버튼: padding 으로 ---- */
  /* 단지/타입/포트폴리오 탭 114x43 -- 세로 1px 부족 */
  .detail-tab { padding: 13px 4px; }

  /* ---- (C) 폼 컨트롤: 요소 자체를 키움 ---- */
  /* 포트폴리오 필터 select 3개 108x38 (#areaFilter/#typeFilter/#sortFilter) */
  .filters select { min-height: 44px; }
}