/* The v2 places lists (Browse/placeslist.htm, myplacesv2.htm). Uses the routes list's bar,
   map and page styles, repeated here so the page needs one stylesheet. */
.placesx { padding-bottom: 24px; }
.routesx-titlerow { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; flex-wrap: wrap; }
.placesx-filter { display: flex; flex-direction: column; gap: 14px; margin-bottom: 20px; }
.placesx-filter .chips { gap: 6px; }
.chip-check { cursor: pointer; }
.chip-check input { position: absolute; opacity: 0; pointer-events: none; }
.chip-check:has(input:checked) { background: var(--c-primary); border-color: var(--c-primary); color: var(--c-on-primary); }
.chip-check .dot { width: 9px; height: 9px; border-radius: 50%; }
.placesx-filter-row { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.placesx-filter-row .search-field { flex: 1 1 260px; height: 44px; }
.placesx-filter-row .select { width: auto; min-width: 180px; height: 44px; }
.routesx-bar { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 16px; }
.routesx-map { overflow: hidden; margin-bottom: 20px; }
.routesx-canvas { height: min(62vh, 560px); }
.grid.placesx-grid { --cols: 4; }
@media (max-width: 1280px) { .grid.placesx-grid { --cols: 3; } }
@media (max-width: 860px) { .grid.placesx-grid { --cols: 2; } }
@media (max-width: 560px) { .grid.placesx-grid { --cols: 1; } }
.placesx-nophoto { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; background: var(--c-surface-2); }
.placesx-nophoto .dot { width: 18px; height: 18px; border-radius: 50%; background: var(--kind); border: 4px solid #fff; }
.placesx-desc { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.routesx-count { position: absolute; right: 12px; bottom: 12px; background: rgb(0 0 0 / .6); color: #fff; font-size: 12px; font-weight: 600; padding: 3px 8px; border-radius: 999px; }
.routesx-adrow { grid-column: 1 / -1; padding-block: 8px; }
.routesx-pages { margin-top: 28px; display: flex; justify-content: center; }
