/* A. S. Bookbinding ERP R31 — critical dialog/modal behavior contract */
#modal{overflow:hidden!important}
#modal .modalbox{
  width:min(860px,calc(100vw - 36px))!important;
  max-width:calc(100vw - 36px)!important;
  max-height:calc(100dvh - 36px)!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
  box-sizing:border-box!important;
}
#modal .modalhead{flex:0 0 auto!important;position:static!important}
#modal #modalBody{
  flex:1 1 auto!important;
  min-width:0!important;
  min-height:0!important;
  max-width:100%!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  box-sizing:border-box!important;
  scrollbar-gutter:auto!important;
}
#modal #modalBody>*{max-width:100%;box-sizing:border-box}
#modal #modalBody input[type="radio"],
#modal #modalBody input[type="checkbox"]{
  width:18px!important;
  min-width:18px!important;
  max-width:18px!important;
  height:18px!important;
  min-height:18px!important;
  max-height:18px!important;
  padding:0!important;
  margin:0!important;
  flex:0 0 18px!important;
}
#modal #modalBody>.toolbar:last-child{
  flex:0 0 auto!important;
  display:flex!important;
  flex-wrap:wrap!important;
  justify-content:flex-end!important;
  gap:7px!important;
  position:sticky!important;
  bottom:-16px!important;
  overflow:visible!important;
}

/* Recipient pickers are compact business selectors, never giant loading panels. */
#modal .modalbox:has(.invoice-send-recipient-list){
  width:min(720px,calc(100vw - 36px))!important;
  max-width:720px!important;
}
#modal #modalBody .invoice-send-recipient-list{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:7px!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  min-height:0!important;
  max-height:min(320px,42vh)!important;
  margin:12px 0!important;
  padding:2px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  scrollbar-gutter:auto!important;
}
#modal #modalBody .invoice-send-recipient{
  display:grid!important;
  grid-template-columns:22px minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:10px!important;
  width:100%!important;
  min-width:0!important;
  max-width:100%!important;
  min-height:50px!important;
  height:auto!important;
  margin:0!important;
  padding:9px 10px!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
  white-space:normal!important;
}
#modal #modalBody .invoice-send-recipient-copy,
#modal #modalBody .invoice-send-recipient-copy b,
#modal #modalBody .invoice-send-recipient-copy span{
  display:block!important;
  min-width:0!important;
  max-width:100%!important;
  width:auto!important;
  height:auto!important;
  white-space:normal!important;
  overflow-wrap:normal!important;
  writing-mode:horizontal-tb!important;
}
#modal #modalBody .invoice-send-recipient-tags{
  min-width:0!important;
  max-width:220px!important;
  overflow:hidden!important;
}

/* Compact, explicit loading/error states; never empty oversized placeholders. */
.r31-modal-state{
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  min-height:44px!important;
  width:100%!important;
  padding:10px 12px!important;
  margin:10px 0!important;
  border:1px solid #d7e0e8!important;
  border-radius:7px!important;
  background:#f8fafc!important;
  color:#475467!important;
  box-sizing:border-box!important;
}
.r31-modal-state.error{border-color:#e1a8a2!important;background:#fff4f3!important;color:#8a2d27!important}
.r31-modal-state .r31-spinner{
  width:16px!important;height:16px!important;min-width:16px!important;border:2px solid #cbd5df!important;
  border-top-color:#2f6fa6!important;border-radius:50%!important;animation:r31spin .75s linear infinite!important
}
@keyframes r31spin{to{transform:rotate(360deg)}}

@media(max-width:760px){
  #modal .modalbox,#modal .modalbox:has(.invoice-send-recipient-list){
    width:100vw!important;max-width:100vw!important;height:100dvh!important;max-height:100dvh!important;border-radius:0!important
  }
  #modal #modalBody .invoice-send-recipient{grid-template-columns:22px minmax(0,1fr)!important}
  #modal #modalBody .invoice-send-recipient-tags{grid-column:2!important;justify-content:flex-start!important;max-width:100%!important}
}

/* R31 modal overflow contract: ordinary business dialogs wrap instead of creating side-scroll. */
#modal #modalBody .scrollbox,
#modal #modalBody .table-wrap{
  max-width:100%!important;
  min-width:0!important;
  overflow-x:hidden!important;
}
#modal #modalBody table:not(.v4460-report-table){
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  table-layout:fixed!important;
}
#modal #modalBody table:not(.v4460-report-table) th,
#modal #modalBody table:not(.v4460-report-table) td{
  min-width:0!important;
  max-width:100%!important;
  white-space:normal!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}
#modal #modalBody input:not([type="radio"]):not([type="checkbox"]),
#modal #modalBody select,
#modal #modalBody textarea{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
}

/* R31 Labels & Printing: no avoidable horizontal scrolling in the production queue. */
.pl-queue-scroll{
  overflow-x:hidden!important;
  overflow-y:auto!important;
  max-width:100%!important;
}
.pl-queue-scroll .pl-queue-table{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  table-layout:fixed!important;
}
.pl-queue-scroll .pl-queue-table th,
.pl-queue-scroll .pl-queue-table td{
  min-width:0!important;
  max-width:none!important;
  white-space:normal!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
}
.pl-queue-scroll .pl-queue-table th:nth-child(1),
.pl-queue-scroll .pl-queue-table td:nth-child(1){width:42px!important;text-align:center}
.pl-queue-scroll .pl-queue-table th:nth-child(2),
.pl-queue-scroll .pl-queue-table td:nth-child(2){width:19%!important}
.pl-queue-scroll .pl-queue-table th:nth-child(3),
.pl-queue-scroll .pl-queue-table td:nth-child(3){width:18%!important}
.pl-queue-scroll .pl-queue-table th:nth-child(4),
.pl-queue-scroll .pl-queue-table td:nth-child(4){width:25%!important}
.pl-queue-scroll .pl-queue-table th:nth-child(5),
.pl-queue-scroll .pl-queue-table td:nth-child(5){width:16%!important}
.pl-queue-scroll .pl-queue-table th:nth-child(6),
.pl-queue-scroll .pl-queue-table td:nth-child(6){width:76px!important}
.pl-queue-scroll .pl-queue-table th:nth-child(7),
.pl-queue-scroll .pl-queue-table td:nth-child(7){width:152px!important}
.pl-queue-scroll .pl-queue-table .action-bar{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:4px!important;
  align-items:center!important;
}
.pl-queue-scroll .pl-queue-table .action-bar button{
  min-width:0!important;
  max-width:100%!important;
  padding:5px 7px!important;
  white-space:normal!important;
}
.pl-queue-scroll .pl-copy-input{width:62px!important;max-width:100%!important}
@media(max-width:900px){
  .pl-queue-scroll .pl-queue-table th:nth-child(5),
  .pl-queue-scroll .pl-queue-table td:nth-child(5){display:none!important}
  .pl-queue-scroll .pl-queue-table th:nth-child(2),
  .pl-queue-scroll .pl-queue-table td:nth-child(2){width:22%!important}
  .pl-queue-scroll .pl-queue-table th:nth-child(3),
  .pl-queue-scroll .pl-queue-table td:nth-child(3){width:20%!important}
  .pl-queue-scroll .pl-queue-table th:nth-child(4),
  .pl-queue-scroll .pl-queue-table td:nth-child(4){width:30%!important}
}
@media(max-width:680px){
  .pl-queue-scroll{border:0!important;max-height:none!important;overflow:visible!important}
  .pl-queue-scroll .pl-queue-table,
  .pl-queue-scroll .pl-queue-table tbody,
  .pl-queue-scroll .pl-queue-table tr,
  .pl-queue-scroll .pl-queue-table td{display:block!important;width:100%!important;max-width:100%!important}
  .pl-queue-scroll .pl-queue-table thead{display:none!important}
  .pl-queue-scroll .pl-queue-table tr{border:1px solid var(--line);border-radius:9px;padding:9px;margin:0 0 9px;background:#fff}
  .pl-queue-scroll .pl-queue-table td{border:0!important;padding:5px 6px!important}
  .pl-queue-scroll .pl-queue-table td:nth-child(1){width:auto!important;text-align:left!important}
  .pl-queue-scroll .pl-queue-table td:nth-child(5){display:block!important}
  .pl-queue-scroll .pl-queue-table td:nth-child(6){max-width:120px!important}
  .pl-queue-scroll .pl-queue-table .action-bar{justify-content:flex-start!important}
}

/* R31 release rule: normal business pages must fit the viewport without horizontal scrolling. */
@media(max-width:1200px){
  .page .panel{overflow-x:hidden!important;max-width:100%!important;min-width:0!important}
  .page table:not(.pl-preview-sheet):not(.v4460-report-table){
    display:table!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    table-layout:fixed!important;
    overflow:visible!important;
  }
  .page table:not(.pl-preview-sheet):not(.v4460-report-table) th,
  .page table:not(.pl-preview-sheet):not(.v4460-report-table) td{
    min-width:0!important;
    max-width:100%!important;
    white-space:normal!important;
    overflow-wrap:normal!important;
  }
  .professional-table-scroll{overflow-x:hidden!important;max-width:100%!important}
  .professional-table-scroll table{min-width:0!important;width:100%!important;table-layout:fixed!important}
}

/* R32: packing dialogs keep controls and actions readable at every width. */
#modal .modalbox[data-packing-dialog]:not([data-packing-dialog=""]){width:min(1200px,96vw)!important;max-width:96vw!important;max-height:94vh!important;display:flex;flex-direction:column;overflow:hidden}
#modal .modalbox[data-packing-dialog="recipients"][data-packing-dialog]{width:min(820px,96vw)!important}
#modal .modalbox[data-packing-dialog] #modalBody{min-height:0;overflow:auto;overscroll-behavior:contain;padding:16px}
#modal .modalbox[data-packing-dialog] .modalhead{flex:0 0 auto}
#modal .modalbox[data-packing-dialog="recipients"] .v3847-recipient-list{max-height:30vh;overflow:auto}
#modal .modalbox[data-packing-dialog="recipients"] .v3847-recipient{display:grid!important;grid-template-columns:24px minmax(0,1fr) auto!important;gap:10px;align-items:center}
#modal .v3847-recipient-copy small{overflow-wrap:normal;white-space:normal}
#modal .v3847-recipient-tools{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
#modal .v3851-attachment-row{display:grid!important;grid-template-columns:20px minmax(0,1fr)!important;gap:10px;align-items:start}
#modal .v3851-attachment-row input{width:17px!important;height:17px!important;margin:3px 0!important}
#modal .v3847-sticky-actions{position:sticky;bottom:-16px;margin:16px -16px -16px;padding:12px 16px;background:white;border-top:1px solid #dbe3ec;display:flex;justify-content:flex-end;gap:8px;z-index:3}
#modal .v3847-history-wrap,#modal .v3847-lines-wrap{max-width:100%;overflow-x:auto}
#modal .v3847-history{min-width:720px}#modal .v3847-lines{min-width:900px}
@media(max-width:650px){#modal .modalbox[data-packing-dialog] #modalBody{padding:12px}#modal .v3847-recipient-tags{grid-column:2}#modal .v3847-summary{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}#modal .v3847-manager-head{flex-wrap:wrap}#modal .v3847-sticky-actions{bottom:-12px;margin:12px -12px -12px;padding:12px}#modal .v3847-sticky-actions button{flex:1;white-space:normal}}

/* Keep Actions and its arrow together across every screen. */
html body #appScreen [data-r32-action-label],html body #modal [data-r32-action-label],html body .h18-actions-menu>summary,html body .h40-packing-actions>summary{white-space:nowrap!important;word-break:normal!important;overflow-wrap:normal!important;hyphens:none!important;min-width:max-content!important;flex-shrink:0!important}
html body .h40-packing-row-actions>details{flex:0 0 auto!important;min-width:max-content!important}

/* R32 owner requirement: wrap at spaces, never through a word. */
html body #appScreen *,html body #modal *,html body .modal *,html body [role="dialog"] *{word-break:normal!important;overflow-wrap:normal!important;hyphens:none!important}
/* Tables may grow to their longest word; the containing region can scroll. */
html body #appScreen .page table:not(.pl-preview-sheet),html body #modal table{table-layout:auto!important;min-width:min-content!important;max-width:none!important}
html body #appScreen .page .panel,html body #appScreen .table-wrap,html body #appScreen .data-table-wrap,html body #modal .v3847-history-wrap,html body #modal .v3847-lines-wrap{overflow-x:auto!important}
html body #appScreen button,html body #modal button,html body #appScreen summary,html body #modal summary{word-break:keep-all!important;overflow-wrap:normal!important;min-width:min-content!important}

/* Catalog actions need intrinsic tracks: fractional tracks let their labels overlap. */
html body #appScreen .v4460-item-table th:last-child,
html body #appScreen .v4460-item-table td:last-child{min-width:164px!important;width:auto!important}
html body #appScreen .v4460-row-actions{display:grid!important;grid-template-columns:repeat(3,max-content)!important;gap:6px!important;width:max-content!important;min-width:0!important;align-items:start}
html body #appScreen .v4460-row-actions>button,
html body #appScreen .v4460-row-actions>details{width:auto!important;min-width:max-content!important;max-width:none!important}
html body #appScreen .v4460-row-actions button,
html body #appScreen .v4460-row-actions summary{white-space:nowrap!important}
html body #appScreen .v4460-row-actions>.v4480-more[open]{grid-column:1/-1!important;width:100%!important}
/* Expand the row for the menu so scroll containers cannot crop its actions. */
html body #appScreen .v4460-row-actions>.v4480-more[open]>div{position:static!important;box-sizing:border-box;min-width:160px!important;width:100%!important;margin-top:4px}
html body #appScreen .v4460-row-actions>.v4480-more[open]>div button{width:100%!important;text-align:left}

/* Scope document printing so editor/report print rules cannot hide this preview. */
@media print{
 html body.r32-document-print>*{display:none!important}
 html body.r32-document-print>#appScreen{display:block!important}
 html body.r32-document-print #appScreen>.layout,html body.r32-document-print #appScreen>.layout>main{display:block!important;width:100%!important;margin:0!important;padding:0!important;overflow:visible!important}
 html body.r32-document-print #appScreen .page,html body.r32-document-print #appScreen header,html body.r32-document-print #nav,html body.r32-document-print #v40Topbar,html body.r32-document-print #modal,html body.r32-document-print .no-print,html body.r32-document-print .toolbar,html body.r32-document-print button{display:none!important}
 html body.r32-document-print #appScreen #printPage{display:block!important}
 html body.r32-document-print #invoicePaper{display:block!important;width:100%!important;max-width:none!important;margin:0!important;padding:0!important;box-shadow:none!important}
 html body.r32-document-print #invoicePaper table{width:100%!important;min-width:0!important;table-layout:fixed!important}
 html body.r32-document-print #invoicePaper thead{display:table-header-group!important}
 html body.r32-document-print #invoicePaper tr{break-inside:avoid;page-break-inside:avoid}
}

/* Item options: one clear name/price row, with optional details below. */
html body .v32-item-options.v32-no-components{grid-template-columns:minmax(0,1fr)!important}
html body .v32-upgrade-editor{display:grid!important;grid-template-columns:minmax(180px,2fr) minmax(100px,1fr) minmax(115px,1fr) auto!important;gap:12px!important;align-items:end;padding:14px!important;margin:12px 0;border:1px solid #dbe3ec;border-radius:10px;background:#f8fafc}
html body .v32-upgrade-editor .field{min-width:0!important;margin:0!important}
html body .v32-upgrade-editor input:not([type="checkbox"]),html body .v32-upgrade-editor select{width:100%;box-sizing:border-box}
html body .v32-upgrade-details{grid-column:1/-1!important}
html body .v32-upgrade-details>summary{cursor:pointer;color:#334155;padding:6px 0}
html body .v32-upgrade-details[open]>.grid{margin:10px 0}
html body .v32-saved-upgrade{display:grid!important;grid-template-columns:minmax(180px,2fr) minmax(100px,1fr) minmax(115px,1fr)!important;gap:10px!important;align-items:center!important}
html body .v32-upgrade-select{display:flex;gap:10px;align-items:center}
html body .v32-upgrade-select input,html body .v32-upgrade-remember input{width:18px!important;height:18px!important;flex:0 0 18px}
html body .v32-upgrade-remember{grid-column:1/-1!important;display:flex;gap:8px;align-items:center;font-size:13px}
@media(max-width:650px){html body .v32-upgrade-editor,html body .v32-saved-upgrade{grid-template-columns:minmax(0,1fr) minmax(100px,1fr)!important}html body .v32-upgrade-name,html body .v32-upgrade-select{grid-column:1/-1}html body .v32-upgrade-editor>button{grid-column:1/-1;justify-self:end}}

/* Invoice preview actions use a readable dialog rather than a clipped popup. */
.r32-invoice-action-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;padding:8px 0}.r32-invoice-action-list>button{min-height:42px;white-space:nowrap;word-break:normal;overflow-wrap:normal;color:#173b57;background:#fff;border:1px solid #b8c6d3;text-align:left;padding:10px 14px}#r32InvoiceOutputStatus{margin-top:10px;line-height:1.5;color:#31536c}#r32InvoiceOutputStatus.error{color:#a32929}