/* Compact spacing and booking-card refinements for small screens. */
@media (max-width: 520px) {
  .container { padding: 26px 12px; }
  .card { padding: 16px; margin-top: 20px; border-radius: 12px; }
  body:has(.admin-nav) .container { padding: 22px 9px; }
  body:has(.admin-nav) .card { padding: 14px; margin-top: 18px; }
}

/* Keep the coloured booking line continuous; only the corner below the time tab is square. */
.timeline-card--pending { position: relative; border-left-color: #edb28d; border-top-left-radius: 0; }
.timeline-card--paid { position: relative; border-left-color: #a8d09f; border-top-left-radius: 0; }
.timeline-card--pending::before,
.timeline-card--paid::before { content: none; }

@media (max-width: 760px) {
  .bookings-day-card { padding: 15px 10px; }
  .timeline-card { padding: 12px 11px; }
}

/* Audit log: values are self-explanatory on mobile, labels only waste the narrow column. */
@media (max-width: 800px) {
  .audit-log-table,
  .audit-log-table tbody,
  .audit-log-table tr { width: 100% !important; }
  .audit-log-table tr { grid-template-columns: minmax(0, 1fr) !important; }
  .audit-log-table td { display: block; width: 100% !important; min-width: 0 !important; padding: 0; overflow-wrap: anywhere; }
  .audit-log-table td::before { display: none; }
  .audit-log-table td:nth-child(1) { color: #75685a; font-size: .78rem; white-space: nowrap; }
  .audit-log-table td:nth-child(2) { color: #75685a; font-size: .78rem; }
  .audit-log-table td:nth-child(3) { margin-top: 5px; color: var(--ink); }
  .table-wrap:has(.audit-log-table) { border: 0; overflow: visible; }
}