/* 확대·좁은 화면 재배치 (WCAG 1.4.4 텍스트 확대 · 1.4.10 리플로)
   기본 모습(모바일 390px·100%, PC 1280px·100%)은 바꾸지 않는다. 아래 규칙은 전부 조건부다:
   - 폭 320px 이하: 모바일 200% 확대(390px 기기 → 약 195px)·초소형 기기
   - 높이 450px 이하 + 마우스 환경: PC 1280×800 200% 확대(약 640×400)
   - 터치 기기 입력칸 16px: iOS 입력 포커스 자동 확대 방지. 앱 WebView(html.wh-wehome-app)는 제외한다 — 앱 글자 크기는 wh-app-a11y-type.js 게이트가 담당하고 확대도 잠겨 있다. */

/* ── 터치 기기: 16px 미만 입력칸 → 16px (iOS 포커스 자동 확대 방지, PC 모습 유지) ── */
@media (hover: none) and (pointer: coarse) {
  html:not(.wh-wehome-app) #pri-min,
  html:not(.wh-wehome-app) #pri-max,
  html:not(.wh-wehome-app) #wl-new-cat-input,
  html:not(.wh-wehome-app) textarea.msg-textarea {
    font-size: 16px !important;
  }
}

/* ── 폭 320px 이하 ── */
@media (max-width: 320px) {
  /* 가로 스크롤 안전망 (clip은 sticky를 깨지 않는다) */
  html:not(.wh-wehome-app),
  html:not(.wh-wehome-app) body {
    overflow-x: clip;
  }

  /* 앱 유도 상단 바·앱 다운로드 팝업·AI 추천 떠 있는 버튼: 좁은 화면에서 본문·폼을 가린다 */
  html:not(.wh-wehome-app) #wh-app-banner,
  html:not(.wh-wehome-app) #wh-appdl,
  html:not(.wh-wehome-app) #wh-air-fab {
    display: none !important;
  }

  /* 하단 탭: 5칸이 폭을 나눠 갖는다 */
  html:not(.wh-wehome-app) nav#bottom_nav .container .row .col {
    flex: 1 1 0 !important;
    width: auto !important;
    min-width: 0 !important;
    padding-left: 2px !important;
    padding-right: 2px !important;
  }
  html:not(.wh-wehome-app) nav#bottom_nav .container .row .col h2 {
    white-space: nowrap !important;
  }

  /* 홈: 검색 안내 문구 한 줄 말줄임 */
  html:not(.wh-wehome-app) .r26-hero .mobile_search_bar .text_group {
    min-width: 0;
    overflow: hidden;
  }
  html:not(.wh-wehome-app) .r26-hero .mobile_search_bar .main_text,
  html:not(.wh-wehome-app) .r26-hero .mobile_search_bar .sub_text {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  /* 검색: 상단 검색칸 글자 자리 확보 (조건 초기화 버튼은 필터 화면에서도 가능) */
  html:not(.wh-wehome-app) .search-page-header .search-conditions-reset {
    display: none !important;
  }
  html:not(.wh-wehome-app) .search-page-header .search-bar-form {
    padding-left: 10px !important;
  }
  html:not(.wh-wehome-app) .search-page-header .search-bar-mobile-inline {
    flex: 1 1 auto;
    min-width: 0;
  }

  /* 숙소 상세: 상단 버튼 4개가 폭 안에 들어오게 */
  html:not(.wh-wehome-app) .rm-nav {
    padding-left: 4px !important;
    padding-right: 4px !important;
  }
  html:not(.wh-wehome-app) .rm-nav-right {
    gap: 0 !important;
    flex-shrink: 0;
  }
  html:not(.wh-wehome-app) .rm-nav-btn {
    width: 40px !important;
    min-width: 40px !important;
  }
  /* 숙소 상세: 체크인·체크아웃 칸 아이콘 생략 */
  html:not(.wh-wehome-app) #rm-wrap .rm-df-icon { display: none; }
  html:not(.wh-wehome-app) #rm-wrap .rm-df {
    padding-left: 10px;
    padding-right: 10px;
  }

  /* 숙소 상세 하단 예약 바: 가격 → 인원 → 예약하기 세로 배치 (바에 overflow를 걸면 위로 여는 인원 패널이 잘린다) */
  html:not(.wh-wehome-app) #rm-wrap .rm-bottom {
    padding: 6px 10px calc(6px + var(--safe-b, env(safe-area-inset-bottom, 0px)));
    gap: 4px 8px;
  }
  html:not(.wh-wehome-app) #rm-wrap .rm-bottom > div:first-child {
    flex: 1 1 100%;
  }
  html:not(.wh-wehome-app) #rm-wrap .rm-bottom .rm-confirm-speed-note,
  html:not(.wh-wehome-app) #rm-wrap .rm-bottom-total.is-total .rm-sd-meta {
    display: none;
  }
  html:not(.wh-wehome-app) #rm-wrap .rm-bottom-total.is-total .rm-total-label,
  html:not(.wh-wehome-app) #rm-wrap .rm-bottom-dates {
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  html:not(.wh-wehome-app) #rm-wrap .rm-bottom #rm-guest-picker {
    order: 2;
    flex: 1 1 100%;
  }
  html:not(.wh-wehome-app) #rm-wrap .rm-bottom .rm-gp-kicker { display: none; }
  html:not(.wh-wehome-app) #rm-wrap .rm-bottom .rm-gp-trigger {
    min-height: 40px;
  }
  html:not(.wh-wehome-app) #rm-wrap .rm-bottom .rm-book-btn {
    order: 3;
    flex: 1 1 100%;
    min-height: 44px;
    padding: 10px 12px;
  }

  /* 예약 요청 하단 바: 금액 한 줄 + 버튼 한 줄, 버튼 글자 줄바꿈 허용 */
  html:not(.wh-wehome-app) .wh-bottom-bar {
    flex-wrap: wrap;
    gap: 6px 8px;
    padding: 8px 12px calc(10px + env(safe-area-inset-bottom, 0px));
  }
  html:not(.wh-wehome-app) .wh-bottom-bar .wh-bottom-info {
    flex: 1 1 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 0 8px;
  }
  html:not(.wh-wehome-app) .wh-bottom-bar .wh-bottom-btn {
    flex: 1 1 100%;
    min-width: 0;
    white-space: normal;
    text-align: center;
    padding: 12px;
  }
}

/* 홈 헤더: 로고가 오른쪽 버튼(언어·알림)과 겹치기 시작하는 폭 */
@media (max-width: 260px) {
  html:not(.wh-wehome-app) .r26-hero .r26-header-logo {
    display: none;
  }
  html:not(.wh-wehome-app) .r26-continue-search__icon {
    display: none;
  }
}

/* ── 높이 450px 이하 + 마우스 환경 (PC 1280×800 200% ≈ 640×400) ──
   고정 바가 화면을 나눠 먹어 본문이 150~200px만 남던 문제. 휴대폰 가로 모드(터치)는 제외. */
@media (max-height: 450px) and (pointer: fine) and (min-width: 321px) {
  html:not(.wh-wehome-app) #wh-app-banner,
  html:not(.wh-wehome-app) #wh-appdl {
    display: none !important;
  }

  /* 숙소 상세: 상단 바는 흐름 속으로, 하단 예약 바는 한 줄로 */
  html:not(.wh-wehome-app) .rm-nav {
    position: relative !important;
  }
  html:not(.wh-wehome-app) #rm-wrap .rm-bottom {
    flex-wrap: nowrap;
    padding-top: 6px;
    padding-bottom: calc(6px + var(--safe-b, env(safe-area-inset-bottom, 0px)));
  }
  html:not(.wh-wehome-app) #rm-wrap .rm-bottom .rm-confirm-speed-note {
    display: none;
  }
  html:not(.wh-wehome-app) #rm-wrap .rm-bottom > div:first-child {
    flex: 1 1 auto;
    min-width: 0;
  }
  html:not(.wh-wehome-app) #rm-wrap .rm-bottom #rm-guest-picker {
    order: 2;
    flex: 0 1 200px;
    min-width: 0;
  }
  html:not(.wh-wehome-app) #rm-wrap .rm-bottom .rm-book-btn {
    order: 3;
  }
}

/* ── 마우스 환경 좁은 폭 (PC 확대 150~200%): 검색 칩 줄이 화면 밖으로 넘쳐 문서 전체가 가로로 밀리던 문제 ──
   모바일(터치)은 원래 가로 스크롤 칩 줄, PC 1024px+(search-force-desktop-ui)는 해당 없음. */
@media (pointer: fine) and (max-width: 1023px) {
  html:not(.wh-wehome-app):not(.search-force-desktop-ui) #filter-chip-row {
    min-width: 0;
    max-width: 100%;
  }
  html:not(.wh-wehome-app):not(.search-force-desktop-ui) #filter-chip-row .r26-chips-wrap {
    overflow-x: auto;
  }
}