/* Bookings page. Components live in ../css/components.css */
.appbar .brandmark { white-space: nowrap; }
@media (min-width: 900px) { .topnav { flex-wrap: wrap; min-width: 0; flex: 1 1 auto; row-gap: 4px; } .topnav a { padding-inline: 10px; } }
.bk { display: grid; gap: 14px; padding-block-end: calc(var(--sp-12, 48px) + 64px); }
@media (min-width: 900px) { .bk { padding-block-end: var(--sp-12, 48px); } }
.bk__bar { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; justify-content: space-between; }
.bk__bar .chip-row { flex: 1 1 auto; min-width: 0; }
@media (min-width: 900px) { .bk__bar .chip-row { margin-inline: 0; padding-inline: 0; } }
.bk__grid { display: grid; gap: 12px; }
@media (min-width: 800px) { .bk__grid { grid-template-columns: 1fr 1fr; } }
.bk-card, .bk__skel { min-height: 196px; display: grid; gap: 8px; align-content: start; }
.bk-card__media { height: 120px; border-radius: 12px; object-fit: cover; width: 100%; background: var(--surface-3); }
.bk-card__top { display: flex; justify-content: space-between; gap: 8px; align-items: flex-start; }
.bk-card__name { margin: 0; font-size: var(--fs-headline); font-weight: 800; line-height: 1.5; }
.bk-card__meta { margin: 0; color: var(--text-2); font-size: var(--fs-footnote); line-height: 1.7; }
.bk-card__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.bk__more { display: grid; justify-items: center; }
.bk-detail { display: grid; gap: 12px; }
.bk-detail__row { display: flex; justify-content: space-between; gap: 12px; min-height: 28px; }
.bk-detail__row span:first-child { color: var(--text-2); }
.bk-detail h3 { margin: 8px 0 0; font-size: var(--fs-callout); }
.bk-detail ul { margin: 0; padding-inline-start: 1.2em; line-height: 1.8; }