/* RB5920: Mobile-only improvements. Desktop rules intentionally untouched. */
@media (max-width: 680px) {
  html { overflow-x: clip; }
  body { overflow-x: clip; }
  /* Keep the autocomplete physically attached to its input even as the page scrolls. */
  .search-field.destination, .search-field.destination:focus-within {
    position: relative !important; overflow: visible !important; isolation: isolate;
    z-index: 85 !important;
  }
  #destinationDropdown.destination-dropdown {
    position: absolute !important; top: 100% !important; bottom: auto !important;
    left: 0 !important; right: auto !important; width: 100% !important;
    min-width: 100% !important; max-width: 100% !important;
    transform: none !important; margin-top: 4px !important;
    max-height: min(43dvh, 290px) !important; overflow-y: auto !important;
    overscroll-behavior: contain; z-index: 999 !important;
    box-sizing: border-box; border-radius: 14px !important;
  }
  #destinationDropdown.hidden { display: none !important; }

  /* Real logo remains the image already present in the HTML. */
  .site-header .header-inner {
    display: flex !important; align-items: center !important; flex-wrap: nowrap !important;
    justify-content: space-between !important; gap: 7px !important;
    min-height: 56px !important; padding-top: 6px !important; padding-bottom: 6px !important;
  }
  .site-header .brand-logo { display: block !important; flex: 0 1 166px !important; min-width: 0 !important; }
  .site-header .brand-logo img { display: block !important; width: 100% !important; max-width: 166px !important; height: auto !important; max-height: 46px !important; object-fit: contain !important; }
  .site-header .header-nav { display: flex !important; flex: 0 0 auto !important; align-items: center !important; flex-wrap: nowrap !important; gap: 6px !important; margin-left: auto !important; }
  .site-header .rb-shell-links { display: none !important; }
  .site-header .header-nav a, .site-header .header-nav button { white-space: nowrap !important; }
  .hero { min-height: 0 !important; padding-top: 34px !important; padding-bottom: 78px !important; }
  .hero-content { padding-top: 0 !important; padding-bottom: 0 !important; }
  .hero-kicker { margin-bottom: 12px !important; font-size: 12px !important; padding: 6px 12px !important; }
  .hero h1 { font-size: clamp(28px, 8vw, 38px) !important; line-height: 1.1 !important; margin: 0 auto 10px !important; }
  .hero-subtitle { font-size: 13px !important; line-height: 1.4 !important; margin: 0 auto !important; }
  .search-wrapper { margin-top: -52px !important; }
  .search-panel { padding: 16px 14px !important; }
  .search-panel .search-grid { gap: 11px !important; }

  /* The help launcher must not conceal hotel prices, filters, or page links. */
  #rbChatToggle, .rb-chat-toggle {
    width: 45px !important; height: 45px !important; min-width: 45px !important;
    padding: 0 !important; right: 10px !important; bottom: 12px !important;
    border-radius: 50% !important; display: flex !important; justify-content: center !important;
    align-items: center !important; font-size: 16px !important; z-index: 90 !important;
  }
  #rbChatToggle strong, .rb-chat-toggle strong { display: none !important; }
  #rbChatToggle > span, .rb-chat-toggle > span { margin: 0 !important; }

  /* Progressive enhancement: the form and filters stay usable if JS fails. */
  html.rb5920-enhanced .results-search-bar { padding-top: 7px !important; padding-bottom: 7px !important; }
  html.rb5920-enhanced .results-search-bar > .container { padding-top: 0 !important; padding-bottom: 0 !important; }
  html.rb5920-enhanced .rb5920-search-summary {
    display: flex !important; align-items: center; justify-content: space-between; gap: 10px;
    background: #f5f8fd; border: 1px solid #dee8f5; border-radius: 12px;
    padding: 8px 10px; margin: 0 0 6px;
  }
  .rb5920-summary-copy { display: flex; flex-direction: column; min-width: 0; gap: 2px; }
  .rb5920-summary-destination { color: #12355d; font-size: 14px; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .rb5920-summary-details { color: #61718a; font-size: 11px; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .rb5920-modify { flex: 0 0 auto; padding: 8px 11px; border: 1px solid #0a4eab; border-radius: 9px; background: #fff; color: #08489d; font-size: 12px; font-weight: 800; }
  html.rb5920-enhanced .results-search-form { display: none !important; }
  html.rb5920-enhanced .results-search-bar.rb5920-search-open .results-search-form { display: grid !important; padding-top: 9px !important; margin-bottom: 8px !important; }
  html.rb5920-enhanced .results-summary-secondary { margin: 4px 0 0 !important; padding: 0 !important; }
  html.rb5920-enhanced .results-summary-secondary h1, html.rb5920-enhanced #resultsTitle { font-size: 17px !important; line-height: 1.25 !important; margin: 0 !important; }

  html.rb5920-enhanced .results-layout { display: block !important; grid-template-columns: none !important; padding-top: 0 !important; }
  html.rb5920-enhanced .results-main { min-width: 0 !important; width: 100% !important; max-width: 100% !important; }
  html.rb5920-enhanced .results-sidebar { display: none !important; }
  html.rb5920-enhanced .results-sidebar.rb5920-open {
    display: block !important; position: fixed !important; inset: 0 !important;
    z-index: 99999 !important; width: 100vw !important; max-width: 100vw !important;
    height: 100dvh !important; max-height: 100dvh !important; overflow: auto !important;
    overscroll-behavior: contain; background: #fff !important; padding: 0 12px 72px !important;
    box-sizing: border-box; box-shadow: 0 0 0 100vmax rgba(0,0,0,.35);
  }
  body.rb5920-filter-lock { overflow: hidden !important; }
  .rb5920-filter-head { position: sticky; top: 0; z-index: 2; display: flex; justify-content: space-between; align-items: center; background: #fff; padding: 15px 4px 10px; border-bottom: 1px solid #dfe6f0; }
  .rb5920-filter-head strong { color: #10355e; font-size: 18px; }
  .rb5920-filter-close { border: 1px solid #d8e2ef; border-radius: 9px; background: #f7faff; color: #173a61; font-size: 15px; padding: 8px 12px; }
  .rb5920-filter-apply { position: fixed; bottom: 0; left: 0; width: 100%; z-index: 3; border: 0; border-radius: 0; background: #fb6906; color: #fff; font-size: 15px; font-weight: 800; padding: 16px; }
  .rb5920-mobile-tools { display: flex !important; align-items: center; gap: 8px; padding: 8px 0 10px; }
  .rb5920-filter-button { flex: 0 0 auto; min-height: 38px; padding: 8px 12px; border: 1px solid #d6e1f0; border-radius: 10px; background: #fff; color: #173b65; font-size: 13px; font-weight: 750; }
  .rb5920-sort-label { flex: 1 1 auto; display: flex; align-items: center; gap: 6px; min-width: 0; color: #516985; font-weight: 750; font-size: 12px; }
  .rb5920-mobile-sort { min-width: 0; width: 100%; height: 38px; border: 1px solid #d6e1f0; border-radius: 10px; padding: 0 8px; color: #173b65; background: #fff; font-size: 13px; font-weight: 750; }
  html.rb5920-enhanced .results-toolbar { padding: 0 0 2px !important; margin: 0 !important; min-height: 0 !important; }
  html.rb5920-enhanced .results-toolbar .sort-control { display: none !important; }
  html.rb5920-enhanced #hotelCount { font-size: 13px !important; font-weight: 750 !important; }
  html.rb5920-enhanced .hotel-list { display: flex !important; flex-direction: column !important; gap: 7px !important; margin-top: 5px !important; }

  /* Each row is roughly 178-195px: photo left, details and both prices right. */
  html.rb5920-enhanced .hotel-card { width: 100% !important; max-width: 100% !important; min-width: 0 !important; margin: 0 !important; border-radius: 12px !important; overflow: hidden !important; }
  html.rb5920-enhanced .hotel-card-main {
    display: grid !important; grid-template-columns: 110px minmax(0, 1fr) !important;
    grid-template-areas: 'photo info' 'photo price' !important;
    grid-template-rows: minmax(0,1fr) auto !important; gap: 2px 10px !important;
    align-items: stretch !important; padding: 9px !important; min-height: 173px !important;
    box-sizing: border-box !important;
  }
  html.rb5920-enhanced .hotel-image {
    grid-area: photo !important; align-self: stretch !important; display: block !important;
    width: 110px !important; height: 173px !important; min-width: 110px !important;
    max-height: 190px !important; border-radius: 9px !important; overflow: hidden !important;
    margin: 0 !important; padding: 0 !important;
  }
  html.rb5920-enhanced .hotel-image img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; }
  html.rb5920-enhanced .hotel-content { grid-area: info !important; width: 100% !important; min-width: 0 !important; padding: 0 !important; margin: 0 !important; }
  html.rb5920-enhanced .hotel-heading { margin: 0 !important; padding: 0 !important; }
  html.rb5920-enhanced .hotel-name { font-size: 14px !important; line-height: 1.18 !important; font-weight: 800 !important; margin: 0 0 4px !important; max-height: 34px !important; overflow: hidden !important; display: -webkit-box !important; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
  html.rb5920-enhanced .hotel-address { font-size: 11px !important; line-height: 1.2 !important; max-height: 14px !important; overflow: hidden !important; white-space: nowrap !important; text-overflow: ellipsis !important; margin: 0 0 4px !important; padding: 0 !important; }
  html.rb5920-enhanced .hotel-facilities { display: none !important; }
  html.rb5920-enhanced .hotel-offer-summary { margin: 2px 0 0 !important; padding: 0 !important; }
  html.rb5920-enhanced .hotel-room { font-size: 11px !important; line-height: 1.25 !important; font-weight: 700 !important; max-height: 15px !important; overflow: hidden !important; white-space: nowrap !important; text-overflow: ellipsis !important; margin: 0 0 2px !important; }
  html.rb5920-enhanced .hotel-details { display: flex !important; flex-wrap: wrap !important; gap: 2px 4px !important; padding: 0 !important; margin: 0 !important; }
  html.rb5920-enhanced .hotel-badge { font-size: 10px !important; line-height: 1.2 !important; padding: 2px 4px !important; border-radius: 4px !important; }
  html.rb5920-enhanced .hotel-cancellation { flex: 1 1 100%; font-size: 10px !important; line-height: 1.2 !important; max-height: 13px !important; overflow: hidden !important; white-space: nowrap !important; text-overflow: ellipsis !important; margin: 0 !important; }
  html.rb5920-enhanced .hotel-price {
    grid-area: price !important; display: grid !important; width: 100% !important; min-width: 0 !important;
    grid-template-columns: minmax(0, 1fr) auto !important; grid-template-rows: auto auto auto !important;
    align-items: end !important; justify-content: stretch !important; gap: 0 5px !important;
    margin: 0 !important; padding: 3px 0 0 !important; border: 0 !important;
    background: transparent !important; box-shadow: none !important; text-align: left !important;
  }
  html.rb5920-enhanced .price-label { display: none !important; }
  html.rb5920-enhanced .price-amount { grid-column: 1 !important; grid-row: 1 !important; display: block !important; font-size: 20px !important; line-height: 1.12 !important; font-weight: 900 !important; white-space: nowrap !important; color: #12355d !important; margin: 0 !important; }
  html.rb5920-enhanced .price-amount::before { content: 'Total '; font-size: 10px; line-height: 1; font-weight: 650; color: #718198; }
  html.rb5920-enhanced .price-per-night { grid-column: 1 !important; grid-row: 2 !important; display: block !important; font-size: 11px !important; line-height: 1.3 !important; font-weight: 750 !important; white-space: nowrap !important; color: #0b7540 !important; margin: 0 !important; }
  html.rb5920-enhanced .price-subtitle { grid-column: 1 / 3 !important; grid-row: 3 !important; display: block !important; color: #6b7a90 !important; font-size: 10px !important; line-height: 1.25 !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; margin: 1px 0 0 !important; }
  html.rb5920-enhanced .hotel-view { grid-column: 2 !important; grid-row: 1 / 3 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; align-self: end !important; width: auto !important; min-width: 76px !important; max-width: 90px !important; min-height: 35px !important; padding: 7px 9px !important; border: 0 !important; border-radius: 8px !important; font-size: 11px !important; font-weight: 800 !important; line-height: 1.1 !important; white-space: nowrap !important; margin: 0 !important; }
  html.rb5920-enhanced .hotel-view span { display: none !important; }
}

@media (max-width: 360px) {
  html.rb5920-enhanced .hotel-card-main { grid-template-columns: 96px minmax(0,1fr) !important; gap: 2px 7px !important; padding: 7px !important; }
  html.rb5920-enhanced .hotel-image { width: 96px !important; min-width: 96px !important; }
  html.rb5920-enhanced .price-amount { font-size: 18px !important; }
  html.rb5920-enhanced .hotel-view { min-width: 67px !important; padding: 6px !important; font-size: 10px !important; }
}

@media (min-width: 681px) {
  .rb5920-search-summary, .rb5920-mobile-tools, .rb5920-filter-head, .rb5920-filter-apply { display: none !important; }
}
