/* Responsive presentation of the existing order controls; desktop table unchanged. */
.mobile-order-fields { display: none; }
@media (max-width: 640px) {
  #ordersTabs { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); width: 100%; }
  #ordersTabs .ds-tab { min-width: 0; padding: 12px 4px; font-size: 12px; gap: 4px; white-space: normal; }
  #ordersTabs .ds-tab > span[aria-hidden] { display: none; }
  #ordersTable, #ordersTable tbody { display: block; width: 100%; min-width: 0; }
  #ordersTable thead { display: none; }
  #ordersTable tr[data-idx] { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; border: 1px solid var(--border); border-radius: 14px; padding: 12px; margin-bottom: 12px; }
  #ordersTable tr[data-idx] > td { display: none; min-width: 0; padding: 0; border: 0; text-align: left; }
  #ordersTable tr[data-idx] > td.mobile-core, #ordersTable tr.mobile-expanded > td { display: block; }
  #ordersTable tr[data-idx] > td::before { content: attr(data-mobile-label); display: block; color: var(--text-muted); font-size: 11px; line-height: 1.4; margin-bottom: 4px; }
  #ordersTable tr[data-idx] > td:first-child, #ordersTable tr[data-idx] > td:nth-child(3), #ordersTable tr[data-idx] > td:nth-child(4), #ordersTable td[data-mobile-field="datum"] { grid-column: 1 / -1; }
  #ordersTable tr[data-idx] input:not([type=checkbox]), #ordersTable tr[data-idx] select { width: 100% !important; min-width: 0 !important; max-width: 100%; min-height: 44px; box-sizing: border-box; }
  #ordersTable button { min-height: 44px; min-width: 44px; }
  #ordersTable .mobile-order-fields { display: inline-flex; margin-left: 6px; }
  #ordersTable td.mobile-action { grid-column: 1 / -1; }
  #ordersTable .detail-row, #ordersTable .detail-row > td { max-width: 100%; }
  #ordersTable .detail-row > td { display: block; }
}