/* Bookings: the list, one booking (its link, its names), the edit and slot
   dialogs, and the roster line on a plan's day cards. */

.bookings-card .register-toggles { margin-bottom: .25rem; }
.booking-back { display: inline-block; margin-bottom: .5rem; color: var(--label); font-weight: 600; text-decoration: none; }
.booking-link-row { display: flex; flex-direction: column; gap: .4rem; padding: .7rem .8rem; border: 1px solid var(--border); border-radius: .8rem; background: #f8fafc; }
.booking-link-row .button-row { align-items: center; }
.booking-link-row .toggle-setting { margin: 0 0 0 .5rem; }
.booking-link-input { font-family: var(--mono); font-size: .85rem; }
.booking-closed-note { margin: .6rem 0 0; padding: .5rem .7rem; border-radius: .6rem; background: var(--warning-bg); border: 1px solid var(--warning-border); color: var(--warning-text); font-weight: 600; }
.booking-facts { margin: .8rem 0; }
.booking-slot-head { display: flex; flex-wrap: wrap; align-items: flex-end; gap: .5rem 1rem; margin-top: .5rem; }
.booking-slot-head .form-field { min-width: 11rem; }
.booking-slot-head .small-note { margin: 0 0 .7rem; }
.roster-table { min-width: 40rem; }
.roster-table tr.is-removed > td { background: #fffbeb; }
.roster-table .badge { margin-top: .25rem; }

.appointment-day { margin-top: .8rem; }
.appointment-day h3 { margin-bottom: .4rem; }
.appointment-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(8.5rem, 1fr)); gap: .4rem; }
.appointment-slot {
  flex-direction: column;
  align-items: flex-start;
  gap: .1rem;
  min-height: 0;
  padding: .45rem .6rem;
  border: 1px solid var(--border);
  background: #fff;
  color: var(--text);
  font-weight: 400;
  text-align: left;
}
.appointment-slot.is-booked { background: #eef2ff; border-color: #a5b4fc; }
.appointment-slot .muted { font-size: .78rem; }

.app-dialog.booking-edit-dialog { width: min(96vw, 720px); }
.booking-fieldset { border: 1px solid var(--border); border-radius: .75rem; padding: .6rem .75rem; margin: .6rem 0; }
.slot-move { display: flex; align-items: flex-end; gap: .5rem; margin-top: .5rem; }
.slot-move .form-field { flex: 1; }

/* A day card's roster line. */
.day-roster { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem .75rem; margin: .5rem 0; padding: .45rem .65rem; border: 1px dashed var(--border); border-radius: .65rem; }
.day-roster .small-note { margin: 0; }
.day-roster-entry { display: inline-flex; flex-wrap: wrap; align-items: center; gap: .4rem; }