@charset "UTF-8";

/**
 * Tablet / iPad (narrow): 640px–1024px width band where needed,
 * and 769px–1024px where we must stay above mobile (≤768) breakpoints.
 *
 * Mobile (≤768) and wide desktop (≥1025) layouts are intentionally unchanged.
 */

/* Bookings hub: 640px+ uses row cards; tab bar was centered and could overflow on iPad */
@media (min-width: 640px) and (max-width: 1024px) {
  .booking-container .booking-categories {
    left: auto !important;
    transform: none !important;
    display: flex !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    white-space: nowrap;
    justify-content: flex-start;
    box-sizing: border-box;
    scrollbar-width: thin;
  }

  .booking-container .booking-categories button {
    flex: 0 0 auto;
  }

  .booking-container .search-form {
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .booking-container .bookings-section {
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

/* Logged-in shell: slightly tighter horizontal padding on tablet (sidebar still fixed 769–992) */
@media (min-width: 769px) and (max-width: 1024px) {
  .main-content {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }
}