/* DipidyDawg booking page (instant booking: month calendar, consent boxes, what happens next).
   Builds on /pricing-app/app.css (cards, choices, slots, month grid) and /mypets/portal.css (header, footer). */
.bk-mhead { justify-content: center; }
.bk-cal .mon-cell { min-height: 58px; }
.bk-cal .mon-cell:not(:disabled) { cursor: pointer; }
.bk-cal .mon-cell.bk-on { border-color: var(--brand); background: var(--brand-soft); box-shadow: inset 0 0 0 1px var(--brand); }
.bk-cal .mon-cell.out { visibility: hidden; }
.bk-times { margin-top: .9rem; padding-top: .6rem; border-top: 1px solid var(--line); scroll-margin-top: 4.5rem; }
.bk-times h3 { margin: 0 0 .5rem; }
.bk-times .slot { min-height: 44px; padding: .45rem .7rem; font-size: .92rem; }
#r-confirm { scroll-margin-top: 4.5rem; }
/* The text-message boxes, as on the website's contact form (public/styles.css .consent) */
.bk-consent { margin-top: .8rem; }
.bk-consent .consent { display: flex; gap: 12px; align-items: flex-start; background: var(--cream-2); border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; margin-bottom: 12px; font-size: .88rem; line-height: 1.5; color: var(--cocoa-2); cursor: pointer; }
.bk-consent .consent input { margin-top: 3px; width: 20px; height: 20px; accent-color: var(--brand); flex: none; }
.bk-consent .consent strong { color: var(--cocoa); }
.bk-consent .form-legal { font-size: .82rem; color: var(--muted); margin: 6px 0 4px; line-height: 1.5; }
.bk-next { text-align: left; background: var(--cream-2); border-radius: 12px; padding: .6rem .9rem; margin: .8rem 0; }
.bk-next h3 { margin: 0 0 .3rem; font-size: 1rem; }
.bk-next ul { margin: 0; padding-left: 1.1rem; }
.bk-next li { margin: .25rem 0; }
@media (max-width: 600px) {
  .bk-cal .mon-grid, .bk-cal .mon-dow { gap: .2rem; }
  .bk-cal .mon-cell { min-height: 50px; padding: .2rem; }
  .bk-consent .consent { padding: 12px; }
  .bk-w { display: none; }
}
/* "Book more visits ahead" (repeat-ui.js), on the booking page and in My Pets */
.rp-card { margin-top: .9rem; padding-top: .7rem; border-top: 1px solid var(--line); }
.rp-card .rep-row .grow { flex: 1 1 12rem; min-width: 0; }
.rp-card .rep-row .chip { margin-top: .2rem; }
.rp-card .rep-row .btn.small { min-height: 36px; }
@media (max-width: 600px) {
  .rp-card .rep-row { align-items: flex-start; }
  .rp-card .rep-row .chip { display: block; margin-left: 0 !important; width: fit-content; max-width: 100%; }
}
