/* Pet-owner pages (booking, manage, owner link): narrow, phone-first, on top of app.css tokens. */
body.pub { background: var(--bg); }
.pub-wrap { max-width: 560px; margin: 0 auto; padding: 0 16px 60px; min-width: 0; width: 100%; box-sizing: border-box; }
.pub-hero { background: #16130f; color: #f4ece0; padding: 22px 16px 26px; margin-bottom: 18px; }
.pub-hero .in { max-width: 560px; margin: 0 auto; }
.pub-hero h1 { color: #f4ece0; font-size: 28px; }
.pub-hero .meta { color: #c9bca9; font-size: 14px; margin-top: 6px; display: flex; gap: 6px 14px; flex-wrap: wrap; }
.pub-hero .meta a { color: #f0c27a; text-decoration: none; }
.pub-hero .about { color: #c9bca9; font-size: 14px; margin-top: 10px; }
.pub-hero .stars { color: #f0c27a; font-weight: 600; }
.pub-top { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.pub-top select.lang option { color: #1d1915; }
.pub-top .paw { font-size: 18px; line-height: 1; }
.done-card { text-align: center; padding: 30px 20px; }
.done-card .big { width: 64px; height: 64px; border-radius: 50%; background: var(--ok-soft); color: var(--ok); display: grid; place-items: center; margin: 0 auto 14px; }
.done-card .big svg { width: 32px; height: 32px; }
.review-stars { display: flex; gap: 6px; justify-content: center; margin: 10px 0 14px; }
.review-stars button { font-size: 34px; background: none; border: 0; cursor: pointer; color: var(--line2); line-height: 1; padding: 2px; }
.review-stars button.on { color: #e0a43a; }
.powered { text-align: center; font-size: 12px; color: var(--ink3); margin-top: 30px; }
.powered a { color: inherit; }

/* week pager for the day picker */
/* shop photos in the header: a wrapping grid, no sideways scrolling */
.gallery { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin-top: 14px; }
.gallery a { aspect-ratio: 4 / 3; border-radius: 10px; overflow: hidden; display: block; }
.gallery img { width: 100%; height: 100%; object-fit: cover; }
.pub-wrap { padding-bottom: calc(60px + env(safe-area-inset-bottom)); }
.pub-hero { padding-top: max(22px, env(safe-area-inset-top)); }
/* booking page: the shop's story is one tap away, the booking steps stay above the fold */
.about-more { margin-top: 12px; }
.about-more summary { cursor: pointer; color: #e9dcc8; font-weight: 600; min-height: 44px; display: flex; align-items: center; }
/* offers on the booking page: deal prices, the referral banner, the birthday field */
.deal-price s { color: var(--ink3); font-weight: 500; font-size: 12.5px; }
.deal-price { color: var(--accent); white-space: nowrap; }
.deal-price s { margin-inline-end: 4px; }
.bday { display: flex; gap: 8px; }
.bday select { flex: 1; min-width: 0; }