/* The six-card area shares its top and bottom edges with the map and stay search. */
@media (min-width: 1181px) {
  body :is(.pc-browser, .category-browser, .rental-browser, .hair-v3-browser):has(#mList) {
    align-items: stretch;
    margin-top: 0;
    margin-bottom: 54px;
  }

  body :is(.pc-browser, .category-browser, .rental-browser, .hair-v3-browser):has(#mList) > * {
    position: relative;
    top: auto;
    display: flex;
    min-width: 0;
    flex-direction: column;
  }

  body :is(.pc-map-shell, .category-map-shell, .rental-map, .hair-v3-map-shell) {
    flex: 1 0 auto;
  }

  body :is(.pc-studio-list, .hair-v3-studio-list, .live-rental-list):has(> #mList),
  body .category-browser > .list:has(> #mList) {
    position: relative;
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 0;
  }

  body :is(.pc-list-sort-row, .category-list-sort-row, .hair-v3-sort-row) {
    position: absolute;
    right: 0;
    bottom: 100%;
    margin: 0 0 8px;
  }

  body #mList[data-card-layout="studio-horizontal"] {
    display: grid;
    flex: 1;
    grid-template-rows: repeat(6, minmax(116px, 1fr));
    gap: 8px;
    margin: 0;
    padding: 0;
  }

  body #mapVendorPagination {
    position: absolute;
    top: 100%;
    inset-inline: 0;
    margin-top: 12px;
  }
}

@media (max-width: 1180px) {
  body :is(.pc-browser, .category-browser, .rental-browser, .hair-v3-browser):has(#mList) {
    grid-template-columns: minmax(0, 1fr);
  }

  body :is(.pc-map-column, .category-map-column, .rental-map-column, .hair-v3-map-column) {
    position: relative;
    top: auto;
  }
}