/* DreamPet place directory: reference proportions, shared semantic type roles. */
:root {
  --dp-type-family: var(--dp-font-ui);
  --dp-type-page: var(--dp-text-page);
  --dp-type-section: var(--dp-text-section);
  --dp-type-body: var(--dp-text-body);
  --dp-type-label: var(--dp-text-label);
  --dp-type-caption: var(--dp-text-caption);
  --dp-type-tracking: -.015em;
  --dp-place-line: #e9e9e6;
}
body .local-community-page { width: min(1180px, calc(100% - 64px)); max-width: none; padding: 0; }
body .local-community-page .blc-community {
  position: relative; left: auto; width: 100%; max-width: none; height: auto;
  min-height: 0; margin: 24px 0 48px; padding: 0; transform: none;
  font-family: var(--dp-type-family); letter-spacing: var(--dp-type-tracking);
}
.local-community-page .blc-sidebar-tools { padding: 0 0 22px; border-bottom: 1px solid var(--dp-place-line); }
.local-community-page .blc-place-title {
  min-height: 136px; padding: 20px 40px; margin: 0 0 24px; border-radius: 10px;
  background: #f3f8fc url('../images/pet-place-city-v2.png') right center / auto 100% no-repeat;
}
.local-community-page .blc-place-title .blc-kicker,
.local-community-page .blc-place-title > .blc-location-button { display: none; }
.local-community-page .blc-place-title h1 { font: var(--dp-type-page); letter-spacing: var(--dp-type-tracking); }
.local-community-page .dp-place-intro { margin: 10px 0 0; color: var(--ink); font: var(--dp-type-body); }
body .local-community-page .blc-place-search {
  width: min(820px, 100%); min-height: 40px; grid-template-columns: minmax(0, 1fr) 42px;
  border-radius: 8px; background: #fff;
}
body .local-community-page .blc-place-search input { height: 40px; font: var(--dp-type-label); }
body .local-community-page .blc-place-search button { width: 42px; height: 40px; min-height: 40px; }
body .local-community-page .blc-categories { flex-wrap: wrap; gap: 8px; margin: 12px 0 0; padding: 0; overflow: visible; }
body .local-community-page .blc-categories button { min-height: 32px; padding: 5px 13px; font: var(--dp-type-caption); }
.local-community-page .dp-place-category-icon { display: inline-flex; width: 16px; height: 16px; margin-right: 5px; align-items: center; justify-content: center; vertical-align: middle; }
.local-community-page .dp-place-category-icon svg { width: 16px; height: 16px; }
.local-community-page .dp-place-map-heading { display: none; }
body .local-community-page .blc-community[data-blc-app] .blc-workspace {
  position: relative; display: grid; grid-template-columns: minmax(0, 43fr) minmax(0, 57fr) !important;
  gap: 22px; height: 450px; min-height: 0; max-height: none; width: 100%;
  margin-top: 6px; border: 0; border-radius: 0; box-shadow: none; overflow: visible; transition: none;
}
body .local-community-page .blc-place-panel {
  position: relative; inset: auto; display: flex !important; flex-direction: column;
  grid-column: 1; grid-row: 1; width: 100%; min-width: 0; height: 100%; max-height: none;
  border: 0; border-radius: 0; box-shadow: none; overflow: hidden;
}
body .local-community-page .blc-place-panel > header { min-height: 34px; padding: 5px 0; }
body .local-community-page .blc-place-panel > header h2 { font: var(--dp-type-section); }
body .local-community-page .blc-place-panel > header [data-blc-close-panel] { display: none; }
body .local-community-page .blc-panel-status { min-height: 28px; margin: 0; padding: 0 0 8px; border: 0; font: var(--dp-type-caption); }
body .local-community-page .blc-place-list { padding: 0 3px 0 0; overflow-y: auto; }
body .local-community-page .blc-place-card {
  width: 100%; min-height: 98px; grid-template-columns: 138px minmax(0, 1fr); gap: 16px;
  padding: 7px 10px; margin: 0 0 8px; border: 1px solid var(--dp-place-line); border-radius: 10px;
}
body .local-community-page .blc-place-thumb { width: 138px; height: 86px; border-radius: 7px; }
body .local-community-page .blc-place-copy { min-width: 0; }
body .local-community-page .blc-place-copy h3 { margin: 0 0 5px; font: var(--dp-type-label); font-weight: 600; letter-spacing: var(--dp-type-tracking); white-space: normal; overflow-wrap: anywhere; }
body .local-community-page .blc-place-copy p { margin: 0 0 2px; font: var(--dp-type-caption); }
body .local-community-page .blc-place-meta { margin-top: 5px; font: var(--dp-type-caption); }
body .local-community-page .blc-map-panel:not(.is-map-fullscreen):not(.is-fallback-fullscreen) {
  position: relative; inset: auto; grid-column: 2; grid-row: 1; width: 100%; height: 450px;
  min-height: 0; border: 1px solid var(--dp-place-line); border-radius: 10px; overflow: hidden;
}
body .local-community-page .blc-map { min-height: 0; height: 100%; }
body .local-community-page .blc-mobile-switcher,
body .local-community-page .blc-mobile-backdrop { display: none !important; }
.local-community-page .blc-place-detail { position: absolute; z-index: 900; inset: 0 auto 0 0; width: 43%; height: 450px; border: 1px solid var(--dp-place-line); border-radius: 10px; box-shadow: 0 8px 28px #201f1b18; display: none; }
.local-community-page .blc-community[data-detail-open="true"] .blc-place-detail { display: flex; width: 43%; }
.local-community-page .blc-categories button:focus-visible,
.local-community-page .blc-place-card:focus-visible { outline: 2px solid #986c00; outline-offset: 2px; }
@media (max-width: 1024px) and (min-width: 821px) {
  body .local-community-page { width: calc(100% - 40px); }
  body .local-community-page .blc-place-card { grid-template-columns: 100px minmax(0, 1fr); gap: 10px; }
  body .local-community-page .blc-place-thumb { width: 100px; }
}
@media (max-width: 820px) {
  :root { --dp-type-page: var(--dp-text-page); --dp-type-body: var(--dp-text-body); }
  body .local-community-page { width: calc(100% - 32px); }
  body .local-community-page .blc-community { margin: 12px 0 28px; }
  .local-community-page .blc-sidebar-tools { padding-bottom: 16px; border: 0; }
  .local-community-page .blc-place-title { min-height: 104px; margin: 0 -16px 16px; padding: 14px 16px; border-radius: 0; background-size: auto 83%; background-position: right bottom; }
  .local-community-page .dp-place-intro { max-width: 220px; margin-top: 6px; }
  body .local-community-page .blc-categories { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 12px 4px; margin-top: 15px; }
  body .local-community-page .blc-categories button { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 5px; padding: 0; min-height: 66px; border: 0; border-radius: 0; background: transparent; font: var(--dp-type-caption); white-space: normal; }
  .local-community-page .dp-place-category-icon { width: 44px; height: 44px; margin: 0; border-radius: 50%; background: #fff8e8; color: #755527; }
  .local-community-page .dp-place-category-icon svg { width: 23px; height: 23px; }
  .local-community-page .is-active .dp-place-category-icon { background: #ffdc55; }
  body .local-community-page .blc-community[data-blc-app] .blc-workspace { display: flex; flex-direction: column; gap: 16px; height: auto; margin-top: 0; }
  body .local-community-page .blc-map-panel:not(.is-map-fullscreen):not(.is-fallback-fullscreen) { order: 0; flex: 0 0 220px; height: 220px; }
  body .local-community-page .blc-place-panel { order: 1; height: auto; overflow: visible; }
  .local-community-page .dp-place-map-heading { display: block; order: -1; margin: 0; font: var(--dp-type-section); }
  body .local-community-page .blc-place-panel > header { display: none; }
  .local-community-page .blc-map-controls { top: 10px; right: 10px; gap: 5px; }
  .local-community-page .blc-map-zoom-controls button { width: 34px; height: 34px; min-height: 34px; }
  .local-community-page .blc-map-controls .blc-map-location-button { width: auto; min-height: 34px; height: 34px; padding: 0 9px; }
  .local-community-page .blc-map-controls .blc-map-fullscreen-button { width: 34px; min-height: 34px; height: 34px; padding: 0; }
  .local-community-page .blc-map-fullscreen-button span { display: none; }
  body .local-community-page .blc-place-list { flex: none; overflow: visible; padding: 0; }
  body .local-community-page .blc-place-card { grid-template-columns: 116px minmax(0,1fr); gap: 12px; padding: 7px; min-height: 112px; }
  body .local-community-page .blc-place-thumb { width: 116px; height: 96px; }
  .local-community-page .blc-place-detail,
  .local-community-page .blc-community[data-detail-open="true"] .blc-place-detail { position: fixed; inset: 76px 12px 84px; width: auto; height: auto; max-height: calc(100dvh - 160px); }
}