/*
 * CYC Ride UI141 R38X HOTFIX10
 * Compact the home summary carousel without changing its two-slide contract,
 * weather data, Ads media, or the HOTFIX9 shortcut-bar alignment.
 */

/*
 * Remove the extra grid row gap between the passenger identity row and the
 * summary card. The HTML prefix is also removed by the deployer; this selector
 * is a harmless fallback for a stale DOM restored by an older browser cache.
 */
html body.passenger-ui66-beauty #passengerStatusCard {
  margin-bottom: 4px !important;
  row-gap: 0 !important;
  padding-bottom: 5px !important;
}

html body.passenger-ui66-beauty #passengerStatusCard #homeSummaryCarousel {
  margin-top: 0 !important;
}

#homeSummaryCarousel .home-wallet-symbol {
  display: none !important;
}

/*
 * The weather slide keeps the same height as the wallet slide. Prevent its
 * auto-sized grid rows from stretching into the spare height so the location
 * buttons sit directly below the weather details.
 */
html body.passenger-ui66-beauty #homeSummaryCarousel #commuteWeatherCard {
  align-content: start !important;
  grid-auto-rows: max-content !important;
}

/*
 * Keep both dots and the swipe hint, but reduce their layout footprint. The
 * pseudo-element extends the effective pointer area without reintroducing the
 * previous 44px-high blank band.
 */
#homeSummaryCarousel .home-summary-pagination {
  height: 34px !important;
  margin: 0 !important;
}

html body.passenger-v284-legacy-spec #homeSummaryCarousel .home-summary-dot,
html body.passenger-ui66-beauty #homeSummaryCarousel .home-summary-dot {
  height: 32px !important;
  min-height: 32px !important;
  min-width: 38px !important;
  position: relative !important;
  width: 38px !important;
}

#homeSummaryCarousel .home-summary-dot::before {
  content: "";
  inset: -6px -3px;
  position: absolute;
}

#homeSummaryCarousel .home-summary-swipe-hint {
  line-height: 1.15 !important;
  margin: 0 0 1px !important;
}

@media (max-width: 560px) {
  /*
   * batch3y layout: two-column main (icon+temp | place/condition/rain),
   * then the three location buttons, then the one-line source note.
   */
  html body.passenger-ui66-beauty #homeSummaryCarousel #commuteWeatherCard {
    align-content: center !important;
    grid-template-rows:
      max-content
      max-content
      max-content !important;
  }

  #homeSummaryCarousel #commuteWeatherCard .commute-weather-main {
    grid-row: 1 !important;
  }

  #homeSummaryCarousel #commuteWeatherCard .commute-weather-tabs {
    grid-row: 2 !important;
  }

  #homeSummaryCarousel #commuteWeatherCard .commute-weather-source {
    grid-row: 3 !important;
  }
}

@media (max-width: 420px) {
  html body.passenger-ui66-beauty #passengerStatusCard {
    padding-bottom: 4px !important;
  }
}
