/* ===== 机票酒店购票网 · 全站移动端适配（≤768px） ===== */
@media (max-width:768px){

  /* ---------- 基础防溢出 ---------- */
  html,body{overflow-x:clip}
  img,svg,video,canvas{max-width:100%}
  button,input,select,textarea{font-size:16px} /* 防 iOS 聚焦自动放大 */

  /* ---------- uitk grid：桌面 by-* 修饰布局移动端强制单列 ---------- */
  .uitk-layout-grid-has-areas-by-medium,
  .uitk-layout-grid-has-areas-by-large,
  .uitk-layout-grid-has-areas-by-extra_large,
  .uitk-layout-grid-has-columns-by-medium,
  .uitk-layout-grid-has-columns-by-large,
  .uitk-layout-grid-has-columns-by-extra_large{
    grid-template-areas:none!important;
    grid-template-columns:minmax(0,1fr)!important;
  }
  .uitk-layout-grid-item-has-column-start-by-medium,
  .uitk-layout-grid-item-has-column-start-by-large,
  .uitk-layout-grid-item-has-column-start-by-extra_large,
  .uitk-layout-grid-item-has-column-end-by-medium,
  .uitk-layout-grid-item-has-column-end-by-large,
  .uitk-layout-grid-item-has-column-end-by-extra_large{
    grid-column:auto/auto!important;
  }
  .uitk-layout-grid-item{min-width:0}

  /* ---------- 租车等表单的 max-content+1fr 两列 grid：移动端单列 ---------- */
  .uitk-layout-grid[style*="--uitk-layoutgrid-columns:max-content minmax"]{
    grid-template-columns:minmax(0,1fr)!important;row-gap:8px;
  }
  .uitk-layout-grid[style*="--uitk-layoutgrid-columns:max-content minmax"] > *{
    grid-column:auto/auto!important;min-width:0!important;
  }
  /* 该 grid 内的 flex 行全宽 */
  .uitk-layout-grid[style*="--uitk-layoutgrid-columns:max-content minmax"] .uitk-layout-flex-flex-direction-row{width:100%}

  /* ---------- 表单内横向 flex 字段组：允许换行防重叠 ---------- */
  form.uitk-form .uitk-layout-flex-flex-wrap-nowrap{flex-wrap:wrap!important;row-gap:8px}
  form.uitk-form .uitk-layout-flex-item{min-width:0}

  /* ---------- 所有 grid/卡片内联 height 塌陷修复（SSR 骨架残留） ---------- */
  .uitk-layout-grid[style*="height"]{height:auto!important;min-height:0!important}
  .uitk-card[style*="height"],.card-custom-appearance[style*="height"]{height:auto!important;min-height:0!important}
  [data-stid="search-form-sticky"] .uitk-layout-grid-has-areas,
  form.uitk-form .uitk-layout-grid-has-areas{
    grid-template-areas:none!important;
    grid-template-columns:minmax(0,1fr)!important;
  }
  [data-stid="search-form-sticky"] .uitk-layout-grid-item,
  form.uitk-form .uitk-layout-grid-item{
    grid-area:auto!important;grid-column:auto/auto!important;grid-row:auto/auto!important;
  }

  /* ---------- 搜索面板标签栏：可横向滑动 ---------- */
  [role="tablist"],.egds-tabs-custom,.egds-tabs{
    overflow-x:auto!important;flex-wrap:nowrap!important;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;
  }
  [role="tablist"]::-webkit-scrollbar,.egds-tabs-custom::-webkit-scrollbar{display:none}
  [role="tablist"]>*{flex:0 0 auto}

  /* ---------- 头部导航紧凑化（防重叠） ---------- */
  header .uitk-button{padding-left:6px!important;padding-right:6px!important}
  header .uitk-layout-flex{min-width:0}
  header nav ul,.global-navigation nav ul{overflow-x:auto;scrollbar-width:none}
  header nav ul::-webkit-scrollbar{display:none}
  .global-navigation-row-container{min-width:0}
  /* 小屏 USD 按钮只留国旗图标（隐藏 USD 文字） */
  header [data-stid="button-type-picker-trigger"]{font-size:0!important;padding:0 4px!important;gap:2px!important;min-width:0!important}
  header [data-stid="button-type-picker-trigger"] svg{width:18px!important;height:18px!important}
  header [data-stid="button-type-picker-trigger"] span{font-size:0!important}
  header .uitk-header-brand-logo img{max-width:100px}

  /* ---------- 轮播/日期价格条：容器内横滑不外溢 ---------- */
  .uitk-carousel{overflow-x:auto!important}
  ul:has(> .uitk-date-range-button-wrapper-natural),
  ol:has(> .uitk-date-range-button-wrapper-natural){
    display:flex!important;flex-wrap:nowrap!important;overflow-x:auto!important;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:4px;
  }
  ul:has(> .uitk-date-range-button-wrapper-natural)::-webkit-scrollbar,
  ol:has(> .uitk-date-range-button-wrapper-natural)::-webkit-scrollbar{display:none}
  .uitk-date-range-button-wrapper-natural{flex:0 0 auto!important}

  /* ---------- 住宿分段控件：等分不截断 ---------- */
  .lodging-segmented-controls{display:flex!important;width:100%!important}
  .lodging-segmented-controls__group{display:flex!important;flex:1 1 0!important;min-width:0!important;width:100%!important}
  .lodging-segmented-controls__group>*{flex:1 1 0!important;min-width:0!important}
  .lodging-segmented-controls label{min-width:0!important}
  .lodging-segmented-controls label span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:13px}

  /* ---------- Hotel-Search 主区：侧栏+结果 单列堆叠 ---------- */
  .uitk-layout-grid:has(> .uitk-layout-grid-item [data-stid="property-listing-results"]){
    grid-template-columns:minmax(0,1fr)!important;
  }
  .uitk-layout-grid:has(> .uitk-layout-grid-item [data-stid="property-listing-results"]) > .uitk-layout-grid-item{
    grid-column:auto/auto!important;
  }
  [data-stid="property-listing-results"] img{object-fit:cover}

  /* ---------- 结果卡片内部布局 ---------- */
  .uitk-card .uitk-layout-flex{min-width:0}
  .uitk-layout-flex-item{min-width:0}

  /* ---------- 弹窗/抽屉适配 ---------- */
  .uitk-dialog,[role="dialog"]{max-width:96vw!important}
  .uitk-menu{max-width:92vw}

  /* ---------- 页脚链接列堆叠 ---------- */
  footer .uitk-layout-grid{grid-template-columns:minmax(0,1fr)!important}

  /* ---------- 航班搜索表单：字段纵向堆叠（原 flex-basis 624px 写死） ---------- */
  #flight_search_form .uitk-layout-flex-flex-wrap-nowrap{flex-wrap:wrap!important}
  #flight_search_form .uitk-layout-flex-item[style*="flex-basis"]{flex-basis:100%!important;min-width:0!important}
  #flight_search_form .uitk-input-swapper{flex-wrap:wrap!important}
  #flight_search_form .uitk-input-swapper-start-input,#flight_search_form .uitk-input-swapper-end-input{width:100%!important;flex:1 1 100%!important}
  #flight_search_form button[type="submit"],#flight_search_form .uitk-button{width:100%;margin-top:4px}

  /* --- 头部登录态头像按钮：小屏只留头像圆，防挤出屏幕 --- */
  header [data-testid="memberprofile-mediumview"]>.uitk-layout-flex>*:not(.uitk-avatar){display:none!important}
  header [data-testid="memberprofile-mediumview"]{min-width:0!important}
  /* --- 航班日期价格条：价格独占一行加粗 --- */
  .uitk-date-range-button .uitk-date-range-button-text{display:block;font-weight:700;margin-top:2px}
  /* ---------- 客服按钮位置 ---------- */
  #chatFab,.chat-fab{right:14px!important;bottom:14px!important}

  /* --- 首页 hero：面板（含白色标题）上移叠加到横幅图底部，恢复原设计观感 --- */
  .searchFormAndDealsBannerSection .search-form-container{margin-block-start:-180px!important}
  .searchFormAndDealsBannerSection .uitk-image-ratio-4-1.hero-image{min-height:300px}
  /* ---------- 横幅 absolute 文字层：图片被压扁时文字溢出修复 ---------- */
  .EditorialBanner .uitk-image-ratio-4-1{padding-top:45%!important} /* 4:1 → 2.2:1 */
  div:has(> .uitk-layout-position-absolute[style*="height: inherit"]){min-height:120px}
  .uitk-layout-position-absolute[style*="height: inherit"]{height:auto!important;min-height:100px}
  .uitk-layout-position-absolute[style*="height: inherit"] .uitk-type-700{font-size:20px!important;line-height:1.2!important}
  .uitk-layout-position-absolute[style*="height: inherit"] .uitk-type-500{font-size:13px!important;line-height:1.3!important}

  /* ---------- 频道页超大 H2 限制 ---------- */
  .uitk-type-style-display-large,.uitk-type-style-display-medium{font-size:clamp(24px,7vw,40px)!important;line-height:1.15!important}

  /* ---------- 表格防溢出 ---------- */
  table{max-width:100%}
}

/* 小屏（≤480px）补充 */
@media (max-width:480px){
  h1,.uitk-heading-2{word-break:break-word}
  .uitk-button-large{min-height:48px}
  /* 头部更紧凑：隐藏 USD 文字只留图标区可点 */
  header [data-stid="button-type-picker-trigger"]{font-size:12px!important;padding:0 4px!important}
}

/* ===== V30：搜索页移动端补强 ===== */
@media (max-width:768px){
  /* --- 根因修复：SSR 把桌面列数写进内联 --uitk-layoutgrid-columns 变量；
     常规 grid-template-columns 规则赢不了，直接 !important 覆盖变量本身 --- */
  .uitk-layout-grid[style*="--uitk-layoutgrid-columns"]{
    --uitk-layoutgrid-columns: minmax(0, 1fr) !important;
    --uitk-layoutgrid-columns-medium: minmax(0, 1fr) !important;
    --uitk-layoutgrid-columns-large: minmax(0, 1fr) !important;
    --uitk-layoutgrid-columns-extra_large: minmax(0, 1fr) !important;
  }
  /* 内联 column-start/end 变量同步复位 */
  [style*="--uitk-layoutgrid-column-start"],[style*="--uitk-layoutgrid-column-end"]{
    --uitk-layoutgrid-column-start: auto !important;
    --uitk-layoutgrid-column-end: auto !important;
    --uitk-layoutgrid-column-start-medium: auto !important;
    --uitk-layoutgrid-column-end-medium: auto !important;
    --uitk-layoutgrid-column-start-large: auto !important;
    --uitk-layoutgrid-column-end-large: auto !important;
  }
  /* 行放置变量也复位（hero 图与搜索面板桌面同格叠加 → 移动端纵向堆叠） */
  [style*="--uitk-layoutgrid-row-start"],[style*="--uitk-layoutgrid-row-end"]{
    --uitk-layoutgrid-row-start: auto !important;
    --uitk-layoutgrid-row-end: auto !important;
    --uitk-layoutgrid-row-start-medium: auto !important;
    --uitk-layoutgrid-row-end-medium: auto !important;
    --uitk-layoutgrid-row-start-large: auto !important;
    --uitk-layoutgrid-row-end-large: auto !important;
  }
  /* --- 航班搜索页：防页面 min-content 撑宽（iPhone 整页缩小的根因） --- */
  [data-test-id="search-form-section"],[data-stid="search-form-sticky"],[data-test-id="universal-search-form"]{min-width:0!important}
  #flight_search_form .uitk-layout-flex-item{min-width:0!important}
  #flight_search_form .uitk-field,#flight_search_form input.uitk-field-input{min-width:0!important}
  /* 出发/到达输入纵向堆叠，交换按钮居中（与原站移动端一致） */
  #flight_search_form .uitk-input-swapper-horizlayout-true{display:flex!important;flex-wrap:wrap!important}
  #flight_search_form .uitk-input-swapper-toggle{flex:0 0 auto!important;margin:-8px auto -8px!important;z-index:2;position:relative}
  /* 日期价格条容器可收缩 */
  .uitk-date-range-container{min-width:0!important;max-width:100%!important}
  .uitk-date-range{max-width:100%!important}
  /* 排序下拉防截断 */
  #sort-filter-dropdown-SORT{max-width:190px}
  /* --- 租车搜索页：表单单列 --- */
  form:has([data-stid="carspickUpLoc"]) .uitk-layout-grid[style*="--uitk-layoutgrid-columns"]{grid-template-columns:minmax(0,1fr)!important}
  form:has([data-stid="carspickUpLoc"]) .uitk-layout-grid-item{grid-column:auto/auto!important;min-width:0!important}
  form:has([data-stid="carspickUpLoc"]) .uitk-fake-input{max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
  /* 租车页主内容 12 列网格 → 单列堆叠（侧栏筛选在上、结果在下） */
  .uitk-layout-grid:has(#offer-cards-list){grid-template-columns:minmax(0,1fr)!important}
  .uitk-layout-grid:has(#offer-cards-list) [class*="uitk-layout-grid-item"]{grid-column:auto/auto!important;min-width:0!important}
  /* --- 租车卡片内部 flex 全部允许换行（修复详情/价格重叠） --- */
  #offer-cards-list .car-offer-card-clickable .uitk-layout-flex{flex-wrap:wrap!important}
  #offer-cards-list .car-offer-card-clickable .uitk-card-content-section.uitk-layout-flex-item{flex-basis:100%!important;min-width:0!important}
  #offer-cards-list .car-offer-card-clickable .uitk-layout-flex-item-flex-basis-half_width{flex-basis:100%!important}
  #offer-cards-list .car-offer-card-clickable .uitk-layout-flex-item{min-width:0!important}
  /* --- 租车表单日期/时间行换行（direction-row 行） --- */
  form:has([data-stid="carspickUpLoc"]) .uitk-layout-flex-flex-direction-row{flex-wrap:wrap!important;row-gap:8px}
  form:has([data-stid="carspickUpLoc"]) .uitk-layout-flex-flex-direction-row>.uitk-layout-flex-item{flex:1 1 42%!important;min-width:0!important}
  form:has([data-stid="carspickUpLoc"]) .uitk-layout-flex-flex-direction-row>.uitk-layout-flex-item[class*="max-width-full_width"]{flex:1 1 100%!important}
  form:has([data-stid="carspickUpLoc"]) fieldset.uitk-layout-flex-item{flex:1 1 100%!important}
  form:has([data-stid="carspickUpLoc"]) fieldset.uitk-layout-flex-item button{width:100%!important}
  /* 空徽章隐藏 */
  #offer-cards-list .uitk-badge:has(.uitk-badge-text:empty){display:none!important}
  /* --- 租车表单日期/时间行换行，搜索按钮整行 --- */
  form:has([data-stid="carspickUpLoc"]) .uitk-layout-flex-flex-wrap-nowrap{flex-wrap:wrap!important;row-gap:8px}
  form:has([data-stid="carspickUpLoc"]) .uitk-layout-flex-flex-wrap-nowrap>.uitk-layout-flex-item{flex:1 1 42%!important;min-width:0!important}
  form:has([data-stid="carspickUpLoc"]) button[type="submit"]{flex:1 1 100%!important;width:100%!important}
  /* 租车结果卡片：图/详情/价格纵向堆叠 */
  #offer-cards-list .car-offer-card-clickable>.uitk-layout-flex{flex-wrap:wrap!important}
  #offer-cards-list .uitk-layout-flex-item[style*="flex-basis: 164px"],#offer-cards-list .uitk-layout-flex-item[style*="flex-basis: 117px"]{flex-basis:100%!important}
  #offer-cards-list .uitk-image-ratio-16-9{max-width:340px!important}
  #offer-cards-list .uitk-layout-flex-align-items-flex-end.uitk-layout-flex-item{flex-direction:row!important;align-items:center!important;justify-content:space-between!important;width:100%}
  #offer-cards-list .offer-reserve-button{width:100%}
}

/* ===== V31：Flights-Search 移动端表单减压（交换钮悬浮/按钮整行/行距加大） ===== */
@media (max-width:768px){
  /* 交换按钮：不再独占一行，改为悬浮在出发/到达边界右侧的小圆钮（原站移动端同款） */
  #flight_search_form .uitk-input-swapper{position:relative!important;display:flex!important;flex-direction:column!important;flex-wrap:nowrap!important}
  #flight_search_form .uitk-input-swapper-toggle{
    position:absolute!important;right:14px!important;left:auto!important;top:50%!important;bottom:auto!important;
    transform:translateY(-50%)!important;
    width:36px!important;height:36px!important;min-width:36px!important;max-width:36px!important;max-height:36px!important;
    margin:0!important;flex:none!important;z-index:3;border-radius:50%!important;padding:0!important;
    box-shadow:0 1px 4px rgba(0,0,0,.18)!important;
  }
  #flight_search_form .uitk-input-swapper-toggle svg{width:18px!important;height:18px!important}
  #flight_search_form .uitk-input-swapper-start-input,
  #flight_search_form .uitk-input-swapper-end-input{width:100%!important;flex:none!important}
  /* 输入框右侧留位，避免文字被交换钮遮挡 */
  #flight_search_form .uitk-input-swapper input.uitk-field-input{padding-right:56px!important}
  /* 行距加大（减压） */
  #flight_search_form .uitk-layout-flex-flex-wrap-nowrap{row-gap:12px!important}
  /* 旅客字段与搜索按钮容器各自独占整行 */
  #flight_search_form .uitk-layout-flex-flex-wrap-nowrap>.uitk-layout-flex-item{flex:1 1 100%!important;min-width:0!important}
  /* 搜索按钮：整行、标准高度，去掉矮胖感 */
  #flight_search_form #search_button{width:100%!important;min-height:46px!important;max-height:46px!important;margin:2px 0 0!important}
  /* 旅客菜单弹层宽度防溢出 */
  #flight_search_form .uitk-menu-container{max-width:calc(100vw - 32px)!important}
}

/* ===== V32：首页搜索面板移动端搜索按钮优化（住宿/航班/汽车/游轮全标签） ===== */
@media (max-width:768px){
  /* 搜索按钮：整行、标准高度 44px，去掉矮胖大圆丸感 */
  [data-stid="search-form-sticky"] button[id^="search_button"]{
    width:100%!important;min-height:44px!important;max-height:44px!important;
    margin:4px 0 0!important;font-size:15px!important;
  }
  /* 按钮的 flex 容器撑满整行（航班/游轮/汽车面板） */
  [data-stid="search-form-sticky"] .uitk-layout-flex-item:has(> button[id^="search_button"]){
    flex:1 1 100%!important;min-width:0!important;margin-inline-start:0!important;
  }
  /* 按钮的 grid 容器撑满整行（住宿面板） */
  [data-stid="search-form-sticky"] .uitk-layout-grid-item:has(> button[id^="search_button"]){
    grid-column:1/-1!important;margin-inline-start:0!important;
  }
  /* 航班面板：旅客字段整行，按钮落到下一行（出发/到达并排保持不动） */
  [data-stid="search-form-sticky"] .uitk-layout-flex-flex-wrap-nowrap>.uitk-layout-flex-item:has(.uitk-menu-trigger){
    flex:1 1 100%!important;min-width:0!important;
  }
}