.booking-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.booking-status button {
  flex: 0 0 auto;
  min-height: 38px;
  padding: 0 12px;
  border: 1px solid currentColor;
  background: transparent;
  color: inherit;
  font: 500 9px Poppins, sans-serif;
  text-transform: uppercase;
  cursor: pointer;
}
.booking-progress {
  display: grid;
  grid-column: 1 / -1;
  grid-template-columns: repeat(3, 1fr);
  margin: 0;
  padding: 0 0 20px;
  border-bottom: 1px solid #ddd;
  list-style: none;
}
.booking-progress li { display: flex; align-items: center; gap: 8px; color: #888; font: 500 10px Poppins, sans-serif; }
.booking-progress li > span { display: grid; place-items: center; width: 28px; height: 28px; border: 1px solid #aaa; border-radius: 50%; }
.booking-progress .active { color: #111; }
.booking-progress .active > span { border-color: #111; background: #111; color: #fff; }
.booking-progress .complete > span { border-color: #3f7b58; background: #3f7b58; color: #fff; font-size: 0; }
.booking-progress .complete > span::before { content: "✓"; font-size: 10px; }
.booking-personal label small { color: #777; font: 400 10px/1.5 Montserrat, sans-serif; }
.slot-empty { grid-column: 1 / -1; display: grid; gap: 6px; padding: 22px; border: 1px dashed #aaa; background: #f7f7f5; color: #666; font-size: 11px; }
.slot-empty strong { color: #111; font: 500 13px Poppins, sans-serif; }
.slot-empty a { width: fit-content; margin-top: 8px; border-bottom: 1px solid #777; color: #111; font: 500 9px Poppins, sans-serif; text-transform: uppercase; }
.slot-filters { display: flex; gap: 8px; margin: 2px 0 14px; padding: 2px 2px 8px; overflow-x: auto; scrollbar-width: thin; }
.slot-filters button { flex: 0 0 auto; min-height: 42px; padding: 0 14px; border: 1px solid #aaa; background: #fff; color: #555; font: 500 11px Poppins, sans-serif; cursor: pointer; }
.slot-filters button[aria-pressed="true"] { border-color: #111; background: #111; color: #fff; }
.booking-success-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 20px; }
.booking-success-actions a,
.booking-success-actions button { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 0 18px; border: 1px solid #777; background: #fff; color: #111; font: 500 10px Poppins, sans-serif; text-transform: uppercase; cursor: pointer; }
.booking-success-actions a:first-child { border-color: #111; background: #111; color: #fff; }
.booking-success-actions [hidden] { display: none; }
@media (max-width: 800px) {
  .booking-progress strong { display: none; }
  .booking-progress li { justify-content: center; }
}
@media (max-width: 480px) {
  .booking-status { align-items: stretch; flex-direction: column; }
  .booking-status button { width: 100%; }
  .booking-success-actions { flex-direction: column; }
  .booking-success-actions a,
  .booking-success-actions button { width: 100%; }
}