/* Main-world mobile pass (< 768px). The newer build handles phones well except
   for raw data tables that sit in non-scrolling wrappers (e.g. Integrations >
   Shipping companies) and get clipped at the viewport edge. Make every table
   wrapper swipeable and keep cells on one line so columns stay readable. */
@media (max-width: 767.98px) {
  main div:has(> table) {
    overflow-x: auto !important;
    max-width: 100%;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }
  main table th,
  main table td {
    white-space: nowrap;
  }
  main table th:first-child,
  main table td:first-child {
    position: sticky;
    inset-inline-start: 0;
    background: hsl(var(--card, var(--background)));
    z-index: 1;
  }
}
