/* mobile-admin-move-fix.css */
/* 모바일에서 행정구역 선택 UI 및 현재위치 버튼 위치 조정 + iOS Safe Area 대응 */

@media (max-width: 768px) {

  /* ===== iOS Safe Area 변수 ===== */
  :root{
    --safe-top: env(safe-area-inset-top, 0px);
    --safe-right: env(safe-area-inset-right, 0px);
    --safe-bottom: env(safe-area-inset-bottom, 0px);
    --safe-left: env(safe-area-inset-left, 0px);
  }

  /* ===== 모바일 스크롤 방지 ===== */
  body {
    overflow: hidden !important;
    position: fixed !important;
    width: 100% !important;
    height: 100% !important;
  }

  /* ===== 도시 선택창 - 최상단 배치 (Safe Area 반영) ===== */
  #adminMoveUI {
    position: absolute !important;
    top: calc(16px + var(--safe-top)) !important;
    left: calc(10px + var(--safe-left)) !important;
    right: calc(80px + var(--safe-right)) !important;
    width: auto !important;
    margin: 0 !important;
    z-index: 1001 !important;

    background: #fff !important;
    border: 1px solid #e7e7e7 !important;
    border-radius: 8px !important;
    padding: 10px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
  }

  #adminMoveUI .admin-move-row {
    display: flex !important;
    gap: 6px !important;
    flex-wrap: nowrap !important;
  }

  #adminMoveUI select {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    height: 32px !important;
    font-size: 12px !important;
    padding: 0 8px !important;
    border: 1px solid #d8d8d8 !important;
    border-radius: 6px !important;
    background: #fff !important;
    white-space: nowrap;
  }

  /* ===== 현재위치 버튼 (Safe Area 반영) ===== */
  .tool-wrap {
    position: fixed !important;
    top: calc(135px + var(--safe-top)) !important;
    right: calc(15px + var(--safe-right)) !important;   /* 살짝 왼쪽 */
    z-index: 1002 !important;
  }

  .tool-wrap .tool-group {
    display: flex !important;
    flex-direction: column !important;
  }

  .tool-wrap .tool {
    width: 48px !important;
    height: 48px !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    padding: 0 !important;
    border: none !important;
    cursor: pointer;
  }

  .tool-wrap .tool__title {
    transform: translateY(8px);
  }

  /* 검색 버튼 숨김 */
  .tool-wrap .search-tool {
    display: none !important;
  }

  /* ===== 카카오맵 "지도타입(일반/위성/하이브리드)" 버튼 (Safe Area 반영) =====
     - 위성 선택 창을 더 위로 올림 (260px → 320px)
  */
  .map-type-control {
    bottom: calc(320px + var(--safe-bottom)) !important;
    right: calc(16px + var(--safe-right)) !important;
  }

  /* ===== 상담 신청하기 버튼 크기 축소 ===== */
  img.support-image.support-extended {
    width: 100px !important;      /* 150px → 100px로 축소 */
    height: auto !important;
  }

  /* ===== valuetouch-sidebar 위치 조정 (아래로 내림) ===== */
  .valuetouch-sidebar {
    top: auto !important;
    bottom: calc(140px + var(--safe-bottom)) !important;
    right: calc(16px + var(--safe-right)) !important;
  }

  /* valuetouch-sidebar 버튼 크기 조정 (모바일용) */
  .valuetouch-sidebar a {
    width: 60px !important;
    height: 60px !important;
    margin-bottom: 10px !important;
  }

  .valuetouch-sidebar img {
    width: 20px !important;
    height: 20px !important;
  }

  /* ===== (선택) 하단 고정 상담/지원 버튼류도 Safe Area 반영하고 싶으면 아래 주석 해제 ===== */
  /*
  .support-fixed,
  #ch-plugin,
  .ch-plugin {
    bottom: calc(16px + var(--safe-bottom)) !important;
    right: calc(16px + var(--safe-right)) !important;
  }
  */

  /* ===== 집합건물/테이블 오버레이가 모바일에서 꽉 채우기 ===== */
  .building-wrap {
    display: none !important;
  }

  .building-wrap.show {
    display: block !important;
  }

  .building-wrap {
      position: fixed !important;
      top: 0 !important;
      left: 0 !important;
      right: 0 !important;
      bottom: 0 !important;
      width: 100% !important;
      height: 100% !important;
      z-index: 3000 !important;
      background: #fff !important;
      overflow: auto !important;
      -webkit-overflow-scrolling: touch;
    }

  .building-wrap__header {
    position: sticky !important;
    top: 0 !important;
    z-index: 3001 !important;
    background: #fff !important;
    padding: 16px !important;
  }

  .building-wrap__content {
    padding: 16px !important;
    height: 100% !important;
  }

   .tab-wrap.building-wrap.show-blurred {
        display: block !important;
   }


  /* land-wrap을 풀스크린 오버레이로 */
    .tab-wrap.land-wrap.show,
    .tab-wrap.land-wrap.show-blurred {
      position: fixed !important;
      inset: 0 !important;              /* top/right/bottom/left = 0 */
      width: 100vw !important;
      height: 100vh !important;
      margin: 0 !important;

      display: block !important;
      background: #fff !important;
      z-index: 5000 !important;

      overflow: auto !important;
      -webkit-overflow-scrolling: touch !important;
    }

    /* 헤더는 위에 고정(원하면) */
    .tab-wrap.land-wrap .tab-wrap__header {
      position: sticky !important;
      top: 0 !important;
      z-index: 5001 !important;
      background: #fff !important;
    }

    /* 닫기 버튼이 항상 최상단 */
    .tab-wrap.land-wrap img.header__btn.land-close {
      position: fixed !important;
      top: calc(12px + env(safe-area-inset-top, 0px)) !important;
      right: calc(12px + env(safe-area-inset-right, 0px)) !important;
      z-index: 6000 !important;
      pointer-events: auto !important;
    }

    /* (선택) 모바일에서는 whole-table-wrapper는 절대 안 보이게 */
    #whole-table-wrapper {
      display: none !important;
    }

    /* 비로그인(= show-blurred)일 때 토지 헤더 텍스트 3개 블러 처리 */
      .tab-wrap.land-wrap.show-blurred #land-header-1,
      .tab-wrap.land-wrap.show-blurred #land-header-2,
      .tab-wrap.land-wrap.show-blurred #land-header-3 {
        filter: blur(5px) !important;
        opacity: 0.55 !important;         /* 더 “잠김” 느낌 */
        user-select: none !important;
        pointer-events: none !important;  /* 텍스트 클릭/드래그 방지 */
      }

      /* (선택) iOS에서 blur가 약하게 보일 때 대비 */
      .tab-wrap.land-wrap.show-blurred #land-header-1,
      .tab-wrap.land-wrap.show-blurred #land-header-2,
      .tab-wrap.land-wrap.show-blurred #land-header-3 {
        -webkit-filter: blur(5px) !important;
      }

       /* 비로그인(= show-blurred)일 때 집합건물 헤더 텍스트 3개 블러 처리 */
        .tab-wrap.building-wrap.show-blurred #build-header-1,
        .tab-wrap.building-wrap.show-blurred #build-header-2,
        .tab-wrap.building-wrap.show-blurred #build-header-3 {
          filter: blur(5px) !important;
          -webkit-filter: blur(5px) !important;
          opacity: 0.55 !important;

          user-select: none !important;
          pointer-events: none !important;
        }
}