/* ub-listing-v2: listing page, property cards, header profile. Loaded last. */

/* ---- bedrooms / beds / guests with icons ---- */
.ub-meta{display:inline-flex;flex-wrap:wrap;align-items:center;gap:4px 14px;vertical-align:top}
.ub-meta-i{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.ub-meta-i svg{flex:none;width:15px;height:15px;color:#1d7be8;opacity:.9}
.ub-meta-card .ub-meta-i svg{width:14px;height:14px}
.stay-card-meta .ub-meta{gap:3px 12px}
.listing-title-row p.ub-meta-line{margin-top:8px}
.listing-title-row .ub-meta-detail .ub-meta-i svg{width:17px;height:17px}

/* ---- property card (home + search results): Book button 30% smaller ---- */
.ub-book-btn{gap:6px;padding:7px 14px;font-size:11.5px;line-height:1.2}
.ub-book-btn svg{width:14px;height:14px}

/* ---- host row: location, small note, Send message ---- */
.ub-hostrow{flex-wrap:wrap}
.ub-hostrow .ub-hostinfo{flex:1 1 220px;min-width:0}
.ub-hostrow .ub-loc{margin:2px 0 0;color:var(--muted,#64748b)}
.ub-hostrow .ub-loc-note,.ub-loc-note{margin:1px 0 0;font-size:12px;line-height:1.35;color:#8a9bb2}
.ub-hostrow .ub-msg-btn{flex:none;margin:0 0 0 auto;min-height:40px;padding:0 20px;border-radius:999px;font-weight:700;text-decoration:none;display:inline-flex;align-items:center;justify-content:center}

/* ---- gallery cells ---- */
.photo-gallery .ub-gcell{position:relative;overflow:hidden;min-width:0;min-height:0}
.photo-gallery .ub-gcell img{display:block;width:100%;height:100%;object-fit:cover}
.photo-gallery .ub-more{position:absolute;inset:0;display:grid;place-items:center;background:rgba(11,42,99,.55);color:#fff;font-size:24px;font-weight:800;letter-spacing:.01em;pointer-events:none}
.photo-gallery .ub-more-m{display:none}

/* ---- title actions: desktop vs mobile ---- */
.ub-wish-m,.ub-book-now{display:none}
.ub-wish-d{display:inline-flex}

/* ---- header height variable (set by JS) + anchor offset ---- */
#ub-bk,#reviews{scroll-margin-top:calc(var(--ub-hdr,84px) + 14px)}

/* ---- desktop: booking card sticks BELOW the sticky header ---- */
@media (min-width:801px){
  .listing-detail-layout{align-items:start}
  .listing-detail-layout .booking-card{position:sticky;top:calc(var(--ub-hdr,84px) + 18px);z-index:5}
}

/* ---- header: guest icon + profile avatar/chevron ---- */
.ub-guest-btn{display:none;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;color:var(--navy,#0f2a5c);text-decoration:none}
.ub-guest-btn:hover{background:#f0f6fd}
@media (max-width:1400px){.header-actions .ub-guest-btn{display:inline-flex}}
.user-menu summary .um-avatar{display:inline-flex;border-radius:50%;line-height:0}
.user-menu summary .um-chev{display:inline-flex;align-items:center;padding:6px 4px;border-radius:999px}
.user-menu summary .um-chev:hover{background:#f0f6fd}

/* ---- mobile ---- */
@media (max-width:800px){
  /* chevron sits right next to the profile picture */
  .header-actions{gap:6px;padding-right:2px}
  .user-menu summary{gap:0;padding:2px}
  .user-menu summary .um-chev{padding:6px 2px}
  .user-menu summary .um-chev svg{width:16px;height:16px}

  /* title row: rating, small heart icon, Book now where the wishlist button was */
  .listing-title-row{gap:10px}
  .ub-title-actions{width:100%;flex-wrap:nowrap;gap:10px}
  .ub-wish-d{display:none!important}
  .ub-wish-m{display:grid;flex:none;width:44px;height:44px;margin:0}
  .ub-wish-m button,.ub-wish-m.icon-button{width:44px;height:44px;font-size:20px}
  .ub-book-now{display:inline-flex;align-items:center;justify-content:center;flex:1 1 auto;min-height:44px;padding:0 20px;border-radius:999px;font-weight:700;text-decoration:none}
  .ub-rating-pill{padding:9px 13px}

  /* gallery: first 4 photos only, 4th carries the +N */
  .listing-detail .photo-gallery{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:230px 96px;gap:6px}
  .listing-detail .photo-gallery .gallery-main{grid-column:1 / -1;grid-row:auto}
  .photo-gallery .ub-g-d,.photo-gallery .gallery-empty{display:none}
  .photo-gallery .ub-more-m{display:grid}
  .photo-gallery .ub-more-d{display:none}
  .photo-gallery .ub-more{font-size:20px}

  /* booking card sits above Guest reviews (not hidden at the very bottom) */
  .listing-detail-layout{display:flex!important;flex-direction:column;gap:0;padding-top:20px}
  .listing-detail-layout>.ub-main-col{display:contents}
  .listing-detail-layout>.booking-card{order:5;position:static;width:100%;box-sizing:border-box;margin:6px 0 26px}
  .listing-detail-layout>.ub-main-col>#reviews{order:10}
  .listing-detail-layout>.ub-main-col>.secure-note{order:11}
  .listing-detail-layout>.ub-main-col>section.listing-summary{margin-bottom:10px}
}

.ub-host-pic{display:inline-flex;flex:none;border-radius:50%;line-height:0;transition:opacity .15s}
.ub-host-pic:hover{opacity:.85}
.ub-hostrow{align-items:center}

/* listing title: more room above, 2px smaller, lighter */
.listing-title-row{padding-top:44px}
.listing-title-row h1{font-size:clamp(20px,calc(3.6vw - 5px),33px);font-weight:600}
@media (max-width:800px){.listing-title-row{padding-top:30px}.ub-hostrow .ub-msg-btn{margin:10px auto 0}.ub-title-actions{justify-content:center}.ub-title-actions .ub-book-now{flex:.8 1 0%;min-width:0}}

/* Send message answer popup */
.ub-msg-modal{border:0;border-radius:18px;padding:26px 26px 20px;max-width:380px;width:calc(100% - 32px);box-shadow:0 20px 60px rgba(15,42,92,.25);color:#0f2a5c}
.ub-msg-modal::backdrop{background:rgba(15,23,42,.5)}
.ub-msg-modal h3{margin:0 0 8px;font-size:20px}
.ub-msg-modal p{margin:0 0 18px;color:#64748b;line-height:1.5}
.ub-msg-actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}
.ub-msg-actions button{min-height:42px;padding:0 20px;border-radius:999px;font:700 14px/1 inherit;font-family:inherit;cursor:pointer;border:1px solid #cfd8e8;background:#fff;color:#0f2a5c}
.ub-msg-actions .ub-msg-go{border-color:#1d7be8;background:#1d7be8;color:#fff}