/* Mobile workspace: vertical groups, readable summaries and table-only horizontal scroll. */
@media (max-width: 700px) {
  .content { padding: 18px 12px 32px; }
  .page-head, .home-heading { gap: 12px; margin-bottom: 18px; }
  .page-head > *, .home-heading > *, .panel, .panel-head > *, .work-toolbar > * { min-width: 0; }
  .panel { padding: 16px; margin-bottom: 16px; border-radius: 12px; }
  .panel-head { gap: 12px; margin-bottom: 16px; }
  .home-columns, .split, .cash-report-grid { gap: 16px; }
  .metric-grid, .cards { gap: 12px; margin-bottom: 18px; }
  .metric-card { padding: 16px; }
  .metric-card strong { margin-top: 10px; }
  .metric-heading { min-height: 0; }
  .page-head .actions, .home-heading .actions, .orders-toolbar > .actions { width: 100%; }
  .page-head .actions > button, .home-heading .actions > button, .orders-toolbar > .actions > button { flex: 1 1 auto; }
  button, input, select, textarea { min-height: 44px; }
  button { white-space: normal; }
  button.icon { min-width: 44px; }
  input, select, textarea { min-width: 0; }
  label { gap: 8px; font-size: 13px; }
  #fields, .checks { gap: 14px; }
  .workspace-tabs .order-tab { min-width: 0; }
  .workspace-tabs, .orders-tabs, .sale-stage-tabs { gap: 6px; }
  .quick-links { gap: 8px; }
  .detail-grid { gap: 14px; }
  .money-row, .money-overview-row, .cash-report-lines > div { gap: 12px; }
  .money-row > span, .money-overview-row > span, .cash-report-lines dt { min-width: 0; overflow-wrap: anywhere; }
  .money-row > b, .money-overview-row > strong, .cash-report-lines dd { flex-shrink: 0; }
  .stock-product-card { max-width: 100%; }
  .stock-card-title { min-height: 0; }
  .crm-toolbar, .crm-journey-toolbar { gap: 12px; }
  .crm-draft, .crm-messages { padding: 16px; }

  dialog, #order-parent, #dialog {
    width: calc(100vw - 16px);
    max-width: calc(100vw - 16px);
    max-height: calc(100dvh - 16px);
  }
  dialog form, #dialog form { padding: 16px; }
  .dialog-head { gap: 12px; margin-bottom: 18px; }
  .dialog-head h2 { min-width: 0; overflow-wrap: anywhere; }
  .order-window-top { gap: 16px; margin-bottom: 16px; }
  .order-window-summary { gap: 14px; margin-bottom: 18px; }
  .order-window-comment { min-height: 0; padding: 14px; }
  .order-window-comment .order-comment-button { min-height: 0; }
  #dialog .design-top-comment { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
  #dialog .design-top-comment textarea { width: 100%; }

  /* The items table keeps its own horizontal scroll instead of crushing cells. */
  #dialog .table-wrap { max-width: 100%; overflow-x: auto; overscroll-behavior-x: contain; }
  #dialog #sale-confirmation-items table { min-width: 680px !important; }
  #sale-confirmation-items th, #sale-confirmation-items td { overflow-wrap: anywhere; }

  /* Totals and adjustments become one readable full-width group. */
  #sale-confirmation-items ~ #sale-price-preview {
    min-width: 0;
    margin-top: 16px;
    padding: 16px !important;
    border: 1px solid #e0e6e1;
    border-radius: 12px;
    background: #f7f9f7;
  }
  #sale-confirmation-items ~ #sale-price-preview .order-totals,
  #dialog .design-new-totals .order-totals,
  #dialog .design-quick-totals .order-totals {
    width: 100%;
    max-width: 100%;
    margin: 0;
  }
  #sale-confirmation-items ~ #sale-price-preview .order-totals > div,
  #dialog .design-new-totals .order-totals > div,
  #dialog .design-quick-totals .order-totals > div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    align-items: baseline;
  }
  #dialog .order-totals > div > span { min-width: 0; white-space: normal; overflow-wrap: anywhere; }
  #dialog .order-totals > div > b, #dialog .order-totals > div > strong { text-align: right; }
  #sale-price-preview .order-total-final { margin-top: 8px; padding-top: 12px; }
  #sale-price-preview :is(.design-discount-add, .design-promo-add, .design-tradein-add) {
    position: static;
    display: inline-flex;
    margin: 0 12px 10px 0;
    min-height: 40px;
  }
  #dialog .design-new-adjustments { position: static; margin-bottom: 10px; }
  #dialog .design-quick-totals { min-height: 0; }
  #dialog .design-quick-breakdown { max-width: 100%; }

  #dialog:has(#sale-confirmation-items) #fields > .design-order-bottom { gap: 10px; }
  #dialog:has(#sale-confirmation-items) #fields > .design-order-bottom > .design-order-controls { gap: 10px; }
  #dialog .design-order-bottom button { min-height: 44px; }
}

@media (max-width: 480px) {
  .metric-grid, .cards, .quick-links, .detail-grid, .stock-product-grid { grid-template-columns: minmax(0, 1fr); }
  .home-columns > div:last-child { display: block; }
  .panel { padding: 14px; }
  .order-window-summary { grid-template-columns: minmax(0, 1fr); }
  .orders-toolbar > .actions { justify-content: stretch; }
  .stage-tools { width: 100%; }
  .stage-tools > button { flex: 1 1 auto; }
  .sale-stage-tabs .chip-tab { min-width: 0; }
  .cash-report-lines > div, .money-overview-row { align-items: flex-start; }
  .order-window-customer > b { font-size: 17px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; }
}