/* Guest pages of an apartment: G-01, its preview, and G-02 */

/* G-01: one column on phones in the owner's order; from 768 px the title comes first and the price card sticks beside
   the content. Rows have no gap, so the price card's span leaves no empty space when a section is missing. */
.bh-apt { display: grid; grid-template-columns: minmax(0, 1fr); max-width: 1200px; margin: 0 auto; padding-bottom: var(--space-12); }
.bh-apt > * { min-width: 0; margin-inline: var(--page-pad); }
.bh-apt > * + * { margin-top: var(--space-8); }
.bh-apt > .bh-apt-gallery { margin-inline: 0; }
.bh-apt > .bh-apt-head { margin-top: var(--space-4); }
.bh-apt > .bh-apt-facts { margin-top: var(--space-4); }

.bh-apt-gallery { position: relative; }
.bh-apt-cover { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; background: var(--sunken); }
.bh-apt-cover--none { display: grid; place-items: center; background: var(--primary-soft); color: var(--primary); }
.bh-apt-all { position: absolute; right: var(--space-4); bottom: var(--space-4); }

.bh-apt-head { display: grid; gap: var(--space-2); }
.bh-apt-where { display: flex; align-items: center; gap: var(--space-1); }
.bh-apt-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2) var(--space-4); color: var(--ink-2); }
.bh-apt-facts > li, .bh-apt-amenities > li, .bh-apt-lines > li { display: flex; align-items: flex-start; gap: var(--space-2); min-width: 0; }
.bh-apt-facts .bh-icon, .bh-apt-amenities .bh-icon, .bh-apt-lines .bh-icon { flex: none; margin-top: 2px; color: var(--ink-2); }

.bh-apt-price { display: grid; gap: var(--space-3); }
.bh-apt-from { color: var(--ink-1); font-size: var(--text-h1); line-height: var(--leading-h1); font-weight: var(--weight-bold); }

.bh-apt-host { display: grid; gap: var(--space-4); }
.bh-apt-host-head { display: flex; align-items: center; gap: var(--space-3); min-width: 0; }
.bh-apt-avatar {
  display: grid; flex: none; place-items: center; width: 40px; height: 40px; border-radius: 50%;
  background: var(--primary-soft); color: var(--primary); font-weight: var(--weight-bold);
}
.bh-apt-lines { display: grid; gap: var(--space-3); }

.bh-apt-section { display: grid; gap: var(--space-3); }
.bh-apt-prose { display: grid; gap: var(--space-3); overflow-wrap: anywhere; }
.bh-apt-prose > p { white-space: pre-line; }
.bh-apt-amenities { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3) var(--space-4); }
.bh-apt-rules { display: grid; gap: var(--space-1); padding-left: var(--space-5); list-style: disc; overflow-wrap: anywhere; }

.bh-apt-map { height: 240px; }
[data-area-map][hidden], [data-map-failed][hidden] { display: none; }

.bh-apt-preview { position: sticky; top: 0; z-index: 5; align-items: center; border-radius: 0; padding-inline: var(--page-pad); }
.bh-apt-preview > .bh-banner-body { flex: 1 1 auto; }

@media (min-width: 768px) {
  .bh-apt { grid-template-columns: minmax(0, 1fr) minmax(300px, 360px); column-gap: var(--space-12); padding: var(--space-8) var(--page-pad) var(--space-16); }
  .bh-apt > * { grid-column: 1; margin-inline: 0; }
  .bh-apt > * + * { margin-top: var(--space-12); }
  .bh-apt > .bh-apt-head { grid-row: 1; grid-column: 1 / -1; margin-top: 0; }
  .bh-apt > .bh-apt-gallery { grid-row: 2; grid-column: 1 / -1; margin-top: var(--space-6); }
  .bh-apt > .bh-apt-facts { margin-top: var(--space-8); }
  .bh-apt > .bh-apt-price { grid-column: 2; grid-row: 3 / span 9; align-self: start; position: sticky; top: var(--space-6); margin-top: var(--space-8); padding: var(--space-6); }
  .bh-apt-cover { aspect-ratio: auto; height: 440px; border-radius: var(--radius-card); }
  .bh-apt-facts { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .bh-apt-amenities { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .bh-apt-map { height: 320px; }
}

/* G-02: the list of photos, one column on phones and three from 768 px */
.bh-photos { display: grid; gap: var(--space-4); max-width: 1200px; margin: 0 auto; padding-bottom: var(--space-8); }
.bh-photos-head { display: flex; align-items: center; gap: var(--space-1); min-height: 64px; padding: var(--space-2) var(--page-pad) var(--space-2) var(--space-1); border-bottom: 1px solid var(--line); }
.bh-photos-title { display: grid; min-width: 0; }
.bh-photos-list { display: grid; gap: var(--space-2); }
.bh-photos-list img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; background: var(--sunken); }
.bh-photos > p, .bh-photos-end { padding-inline: var(--page-pad); }
.bh-photos-end { display: grid; gap: var(--space-3); justify-items: stretch; }
.bh-photos-end > .bh-btn--tertiary { justify-self: center; }
@media (min-width: 768px) {
  .bh-photos { padding-inline: var(--page-pad); }
  .bh-photos-head { padding-inline: 0; }
  .bh-photos > p, .bh-photos-end { padding-inline: 0; }
  .bh-photos-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .bh-photos-end { justify-items: start; }
  .bh-photos-end > .bh-btn--block { width: auto; }
}