/* Shared alignment, independent of business forms and table renderers. */
.compact-query-toolbar { display:flex; flex-wrap:wrap; align-items:end; gap:8px; }
.compact-query-toolbar > .filter-primary { flex:1 1 280px; min-width:0; margin:0; }
.compact-query-toolbar > .actions { margin:0; gap:8px; }
.compact-query-toolbar > .mobile-filter-toggle { display:inline-flex; margin:0; min-height:44px; align-items:center; gap:8px; }
.compact-query-toolbar button { min-height:44px; white-space:nowrap; }
.compact-query-panel .responsive-filter-grid:not(.filters-expanded) { display:none; }
.compact-query-panel .responsive-filter-grid.filters-expanded { margin-top:16px; }
#clientsPage > .panel, #salesPage > .panel { min-width:0; }
#clientsPage > .panel + .panel, #salesPage > .panel + .panel { margin-top:12px; }
body { overflow-x: visible; }
.panel-title { align-items: center; flex-wrap: wrap; }
.panel-title > *, .meta-actions, .detail-tools, .pager, .filter-grid > *, .inline-form > * { min-width: 0; }
.panel-title .actions { margin-top: 0; }
.standard-product-search label, .standard-product-fields label { margin-bottom: 0; }
.standard-products-table td, #suppliersTableBody td, #accountsTableBody td { vertical-align: middle; }
.pager { flex-wrap: wrap; max-width: 100%; }
.pager button { flex-shrink: 0; white-space: nowrap; }
.detail-tools, .meta-actions { max-width: 100%; }
.sales-filter-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.message, .purchase-order-card, .print-job-card, .detail-totals, .small { overflow-wrap: anywhere; }
.mobile-navigation-button, .mobile-filter-toggle, .mobile-po-total { display: none; }
.navigation-backdrop[hidden] { display: none; }
.po-secondary-actions, .po-secondary-actions > div { display: contents; }
.po-secondary-actions > summary { display: none; }

@media (max-width: 900px) {
  .mobile-navigation-button { display: inline-grid; place-items: center; width: 44px; height: 44px; flex: 0 0 44px; padding: 0; font-size: 26px; }
  .navigation-backdrop { position: fixed; inset: 0; width: 100%; height: 100dvh; border: 0; border-radius: 0; background: #07172470; z-index: 100; }
  .sidebar { position: fixed; inset: 0 auto 0 0; width: min(320px, calc(100vw - 44px)); height: 100dvh; overflow-y: auto; overscroll-behavior: contain; z-index: 101; border-right: 1px solid var(--line); visibility: hidden; transform: translateX(-100%); padding-bottom: max(20px, env(safe-area-inset-bottom)); }
  .navigation-open { overflow: hidden; }
  .navigation-open .sidebar { visibility: visible; transform: none; }
  .sidebar-brand { position: relative; padding-right: 42px; }
  #navigationClose { position: absolute; top: 0; right: 0; }
  .sidebar nav, .sidebar .nav-submenu, .sidebar .global-sync-panel { grid-template-columns: minmax(0, 1fr); }
  .workspace { padding: 12px; }
  .hero { display: flex; align-items: center; gap: 8px; padding: 0 0 12px; margin-bottom: 16px; }
  .hero > div { flex: 1; }
  .hero .account-menu { margin-left: auto; }
  .hero h1 { font-size: 20px; overflow-wrap: anywhere; }
  .panel { padding: 16px; }
  .panel-title { gap: 12px; margin-bottom: 16px; }
  .panel-title h2 { font-size: 18px; }
  .meta-actions { width: 100%; justify-items: start; }
  .detail-tools { justify-content: flex-start; }
  .filter-grid, .sales-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .responsive-filter-grid label { margin-bottom: 0; }
  .responsive-filter-grid > .filter-primary { grid-column: 1 / -1; order: -1; }
  .responsive-filter-grid:not(.filters-expanded) > :not(.filter-primary) { display: none; }
  .mobile-filter-toggle { display: inline-flex; align-items: center; gap: 12px; min-height: 44px; margin: 0 0 12px; }
  .mobile-filter-toggle::after { content: '+'; font-size: 20px; }
  .mobile-filter-toggle[aria-expanded="true"]::after { content: '−'; }
  .responsive-filter-grid + .actions { margin-top: 12px; }
  .print-list-summary, .print-list-tools { flex-wrap: wrap; }
  .print-list-summary .detail-totals { padding-top: 0; }
  .print-meta { margin: 0; text-align: left; }
  .print-job-item { grid-template-columns: minmax(0, 1fr) auto; }
  .print-job-item > :last-child { grid-column: 1 / -1; overflow-wrap: anywhere; min-width: 0; }
  .po-list-summary { gap: 12px 20px; margin: 14px 0; padding: 14px 0; }
  .po-list-summary > div { min-width: 0; flex: 1 1 120px; }
  .po-list-summary .po-summary-totals { flex-basis: 100%; }
  .po-list-summary strong { font-size: 18px; }
  .purchase-order-card > *, .print-job-card > * { min-width: 0; }
  .purchase-order-card .actions { justify-content: flex-start; }
  .purchase-order-header .small { max-width: none; white-space: normal; overflow: visible; }
  .table-footer { justify-content: flex-start; }
}

@media (max-width: 600px) {
  .panel { padding: 12px; }
  .hero .account-menu { flex-basis: auto; max-width: 110px; text-align: right; }
  .hero .account-menu > summary { font-size: 11px; }
  .hero > div { flex: 1 1 100px; }
  .hero .account-menu > summary { padding: 4px 0; min-height: 32px; }
  .hero .po-page-heading { gap: 6px 10px; }
  .hero h1 { font-size: 18px; }
  button, .detail-tools button, .pager button, .print-job-actions button, .purchase-order-card button { min-height: 44px; }
  input:not([type="checkbox"]):not([type="radio"]), select, textarea, .po-line input, .po-line select { font-size: 16px; min-width: 0; max-width: 100%; }
  input[type="checkbox"], input[type="radio"] { width: 20px; height: 20px; flex-shrink: 0; }
  label, input, select, textarea { min-width: 0; }
  .filter-grid { gap: 12px; }
  .filter-grid > label:has(.multi-select), .filter-grid > .wide-filter { grid-column: 1 / -1; }
  .actions { gap: 8px; }
  .standard-product-search { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .standard-product-search label { grid-column: 1 / -1; max-width: none; }
  .standard-product-search button { padding: 8px 6px; }
  #productMappingsPage .panel-title > .actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; }
  #mappingCandidatesOpen { grid-column: 1 / -1; }
  .standard-product-pager { justify-content: flex-start; }
  .standard-product-pager > span:first-child { flex: 1 1 100%; }
  .table-wrap:has(> .responsive-records) { border: 0; border-radius: 0; overflow: visible; }
  .responsive-records { display: block; width: 100% !important; min-width: 0 !important; }
  .responsive-records thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .responsive-records tbody { display: block; width: 100%; }
  .responsive-records tbody tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 14px; padding: 16px 0; border-bottom: 1px solid var(--line); }
  .responsive-records td { display: block; width: auto !important; min-width: 0; padding: 0; border: 0; font-size: 14px; white-space: normal; overflow: visible; overflow-wrap: anywhere; }
  .responsive-records td::before { content: attr(data-label); display: block; margin-bottom: 5px; font-size: 12px; color: var(--muted); }
  .responsive-records td:last-child, .responsive-records td[colspan], .responsive-records td:has(button), .responsive-records td:has(select) { grid-column: 1 / -1; }
  .responsive-records td[colspan]::before { display: none; }
  .responsive-records td button { margin-right: 8px; }
  #mappingCandidatesBody select { min-width: 0; width: 100%; max-width: 100%; margin: 0; }
  .mapping-row-error:empty { display: none; }
  .po-dialog, .modal-dialog { width: calc(100vw - 16px); max-width: none; max-height: calc(100dvh - 16px); margin: auto; padding: 0; }
  .po-modal-shell, .po-dialog #purchaseOrderForm { max-height: calc(100dvh - 16px); }
  .po-modal-header, .po-modal-footer, .po-modal-body, .po-dialog .po-editor-scroll, .po-dialog .po-editor-footer { padding: 12px; }
  .po-modal-header h2, .po-dialog h2 { font-size: 18px; }
  .po-modal-header button, .po-editor-header button { width: 44px; height: 44px; }
  .po-modal-footer { padding-bottom: max(12px, env(safe-area-inset-bottom)); gap: 8px; }
  .po-modal-footer button { padding: 8px 10px; }
  .standard-product-fields > button { width: 44px; height: 44px; }
  .standard-product-fields { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 44px; align-items: end; }
  #purchaseOrderForm .po-editor-scroll > .inline-form { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  #purchaseOrderForm .po-editor-scroll > .inline-form label:first-child { grid-column: 1 / -1; display: flex; align-items: center; gap: 10px; }
  #poOrderDate { flex: 1; background: transparent; border: 0; padding: 4px 0; }
  #purchaseOrderForm .po-editor-scroll > .inline-form label { margin-bottom: 8px; }
  .po-document-fields { margin-bottom: 10px; padding-bottom: 4px; }
  .po-line { gap: 10px; }
  .po-line > label > span { font-size: 12px; }
  .po-field-rawName { padding-right: 52px; }
  .po-line-remove { width: 44px; height: 44px; top: 27px; }
  .po-line input, .po-line select { min-height: 44px; }
  .po-mapping-toggle { height: 44px; }
  .po-line-total { font-size: 14px; }
  #purchaseOrdersPage .po-editor-footer { position: sticky; bottom: 0; z-index: 10; background: var(--panel); border-top: 1px solid var(--line); padding: 10px 0 max(10px, env(safe-area-inset-bottom)); }
  .mobile-po-total { display: block; text-align: right; font-weight: 700; margin-bottom: 8px; overflow-wrap: anywhere; }
  #purchaseOrderForm .po-editor-footer .actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)) 44px; }
  .po-dialog #purchaseOrderForm .po-editor-footer .actions { grid-template-columns: minmax(0, 1fr) 44px; }
  #purchaseOrderForm .po-editor-footer .actions button { padding: 8px; }
  .po-secondary-actions { display: block; position: relative; }
  .po-secondary-actions > summary { display: grid; place-items: center; cursor: pointer; width: 44px; height: 44px; font-size: 22px; border: 1px solid var(--line); border-radius: 6px; }
  .po-secondary-actions > summary::-webkit-details-marker { display: none; }
  .po-secondary-actions[open] > div { position: absolute; right: 0; bottom: calc(100% + 8px); display: grid; gap: 8px; padding: 8px; min-width: 160px; border: 1px solid var(--line); border-radius: 6px; background: var(--panel); box-shadow: 0 4px 16px #07172422; z-index: 20; }
  .po-secondary-actions:not([open]) > div { display: none; }
  #purchaseOrderMessage { max-height: 90px; overflow-y: auto; }
  .modal-card { padding: 12px; }
  #supplierForm > .actions { position: sticky; bottom: -12px; background: var(--panel); padding: 12px 0; border-top: 1px solid var(--line); }
  .column-picker-menu { max-width: calc(100vw - 56px); }
  .print-job-header { flex-wrap: wrap; }
  .print-list-tools .detail-tools { flex-basis: 100%; }
  .print-list-tools .detail-tools button { flex-shrink: 0; white-space: nowrap; }
  #productsPage .panel-title > h2 { display: none; }
  #purchaseOrdersPage .po-new-entry .po-editor-header { display: none; }
}
.mobile-record-list { display: none; }
.mobile-sync-details > summary { display: none; }
.mobile-sync-content { display: grid; gap: 8px; }
.po-list-more, .po-list-more-body, .po-summary-details, .po-summary-details > div { display: contents; }
.po-list-more > summary, .po-summary-details > summary { display: none; }
.wh-draft-warning { border-left: 3px solid #b77900; background: #fff7db; color: #624600; padding: 12px; margin: 12px 0; overflow-wrap: anywhere; }
.wh-draft-warning[hidden] { display: none; }
@media (max-width: 900px) {
  .mobile-sync-details > summary { display: list-item; cursor: pointer; padding: 8px 0; font-weight: 700; }
  .mobile-sync-content > .global-sync-title { display: none; }
  .mobile-sync-details:not([open]) > .mobile-sync-content { display: none; }
}
@media (max-width: 600px) {
  .desktop-record-table { display: none; }
  .mobile-record-list { display: block; min-width: 0; }
  .mobile-record-sort { display: flex; gap: 8px; margin: 12px 0; }
  .mobile-record-sort select { flex: 1; width: 0; min-width: 0; }
  .mobile-record-sort button { flex-shrink: 0; }
  .mobile-record { border-bottom: 1px solid var(--line); padding: 12px 0; }
  .mobile-record > summary { cursor: pointer; display: grid; gap: 6px; overflow-wrap: anywhere; }
  .mobile-record > summary small { color: var(--accent, #087f78); }
  .mobile-record dl { display: grid; grid-template-columns: minmax(75px, 30%) minmax(0, 1fr); gap: 10px; margin: 14px 0 0; }
  .mobile-record dt, .mobile-record dd { margin: 0; overflow-wrap: anywhere; min-width: 0; }
  .mobile-record dt { color: var(--muted); font-size: 12px; }
  .mobile-record dd button { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
  .po-list-more, .po-summary-details { display: block; }
  .po-list-more > summary, .po-summary-details > summary { display: list-item; cursor: pointer; padding: 12px 8px; min-height: 44px; box-sizing: border-box; }
  .po-list-more { flex-basis: 100%; }
  .po-list-more:not([open]) { flex-basis: auto; }
  .po-list-more-body { display: flex; gap: 8px; flex-wrap: wrap; padding: 8px 0; }
  .po-list-more:not([open]) > div, .po-summary-details:not([open]) > div { display: none; }
  #poListSummary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  #poListSummary > div { min-width: 0; font-size: 12px; }
  .po-summary-details { grid-column: 1 / -1; }
  .po-summary-details > div { display: grid; gap: 12px; }
  .purchase-order-card > .account-actions { gap: 8px; }
}