/* "Facilities Near Me" (js/facilities.js), on the homepage and in a guide page's "Facilities Near Me" block: a Google
   map of the chosen place, the list of the town's places and the place card. Wide screens: map | list | card in one row of a fixed height, so choosing a filter never moves the page;
   the list scrolls inside it (size containment keeps its rows from stretching the row). Tablets: the map across,
   list and card under it. Phones: the filters and the places are one row each, swiped sideways, above the map. */
#facilities [hidden] { display: none !important; }
#facilities .k7-map iframe { display: block; width: 100%; height: 100%; min-height: 300px; border: 0; border-radius: 14px; background: #e9e2d8; }
#facilities .k7-towns { display: inline-flex; border: 1px solid rgba(255, 255, 255, .45); border-radius: 999px; padding: 3px; margin: 0 10px 10px 0; vertical-align: middle; }
#facilities .k7-towns button { border: 0; background: transparent; color: #fff; font: inherit; font-weight: 600; padding: 7px 16px; border-radius: 999px; cursor: pointer; }
#facilities .k7-towns button[aria-pressed="true"] { background: #fff; color: #7a1f1f; }
#facilities .k7-chip.soon { opacity: .72; }
#facilities .k7-soon-card { margin-top: 10px; color: #6b5a4e; font-size: .95rem; line-height: 1.5; }
#facilities .k7-sample { position: absolute; left: 10px; bottom: 10px; z-index: 1; padding: 3px 9px; border-radius: 999px; background: rgba(31, 21, 18, .7); color: #fff; font-size: .72rem; line-height: 1.4; }
#facilities .k7-list { display: flex; flex-direction: column; min-height: 0; padding: 16px 0 10px; border-radius: 22px; background: #fff; }
#facilities .k7-list-h { margin: 0 18px 10px; font-weight: 700; color: #2b1d14; }
#facilities .k7-list-h small { display: block; margin-top: 2px; font-size: .82rem; font-weight: 400; color: #6b5a4e; }
#facilities .k7-places { flex: 1 1 auto; min-height: 0; margin: 0; padding: 0; list-style: none; overflow-y: auto; scrollbar-width: thin; }
#facilities .k7-places li + li { border-top: 1px solid #f0e4d8; }
#facilities .k7-places button { display: block; width: 100%; padding: 10px 18px 10px 14px; border: 0; border-left: 4px solid transparent; background: transparent; color: #2b1d14; font: inherit; text-align: left; cursor: pointer; }
#facilities .k7-places button b { display: block; font-size: .95rem; font-weight: 600; line-height: 1.3; }
#facilities .k7-places button span { display: block; margin-top: 2px; font-size: .8rem; color: #6b5a4e; }
#facilities .k7-places button:hover { background: #fff7ee; }
#facilities .k7-places button:focus-visible { outline: 2px solid #7a1f1f; outline-offset: -2px; }
#facilities .k7-places button[aria-pressed="true"] { border-left-color: #f0821e; background: #fff1e2; }
#facilities .k7-places .k7-empty { margin: 8px 18px; color: #6b5a4e; font-size: .9rem; }
@media (min-width: 1101px) {
  #facilities .k7-fac-main { display: grid !important; grid-template-columns: minmax(0, 1.45fr) minmax(250px, .85fr) minmax(300px, 1fr); grid-auto-rows: minmax(440px, auto); gap: 18px; align-items: stretch; }
  #facilities .k7-fac-main > * { min-width: 0; }
  #facilities .k7-map-wrap { height: 100%; box-sizing: border-box; }
  #facilities .k7-map { height: 100%; aspect-ratio: auto; }
  #facilities .k7-list { contain: size; }
  #facilities .k7-place { width: auto !important; max-width: none !important; }
}
@media (min-width: 701px) and (max-width: 1100px) {
  #facilities .k7-fac-main { display: grid !important; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: auto minmax(440px, auto); gap: 16px; }
  #facilities .k7-fac-main > * { min-width: 0; }
  #facilities .k7-map-wrap { grid-column: 1 / -1; }
  #facilities .k7-map { aspect-ratio: auto; }
  #facilities .k7-map iframe { height: 340px; }
  #facilities .k7-list { contain: size; }
}
@media (max-width: 700px) {
  #facilities .k7-fac-panel { display: flex; flex-direction: column; }
  #facilities .k7-chips { order: 1; flex-wrap: nowrap; overflow-x: auto; padding-bottom: 6px; }
  #facilities .k7-chips > * { flex: 0 0 auto; }
  #facilities .k7-fac-main { order: 2; display: flex !important; flex-direction: column; }
  #facilities .k7-fac-note { order: 3; }
  #facilities .k7-list { order: 1; margin-bottom: 14px; padding: 0; background: transparent; }
  #facilities .k7-list-h { margin: 8px 0 6px; font-size: .9rem; font-weight: 400; color: rgba(255, 255, 255, .85); }
  #facilities .k7-list-h small { display: inline; font-size: inherit; color: inherit; }
  #facilities .k7-list-h small::before { content: "· "; }
  #facilities .k7-places { display: flex; gap: 8px; overflow-x: auto; overflow-y: hidden; padding-bottom: 8px; }
  #facilities .k7-places li { flex: 0 0 auto; }
  #facilities .k7-places li + li { border-top: 0; }
  #facilities .k7-places button { width: auto; max-width: 230px; height: 100%; padding: 8px 14px; border: 1px dashed rgba(255, 255, 255, .55); border-radius: 12px; background: rgba(255, 255, 255, .08); color: #fff; }
  #facilities .k7-places button span { display: none; }
  #facilities .k7-places button:hover { background: rgba(255, 255, 255, .16); }
  #facilities .k7-places button[aria-pressed="true"] { border: 1px solid #fff; background: #fff; color: #7a1f1f; }
  #facilities .k7-places button:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
  #facilities .k7-places .k7-empty { margin: 0; color: rgba(255, 255, 255, .85); }
  #facilities .k7-map-wrap { order: 2; min-width: 0; }
  #facilities .k7-map { aspect-ratio: auto; }
  #facilities .k7-map iframe { height: 300px; }
  #facilities .k7-place { order: 3; }
}
