:root {
  --bg: #f4f6f8;
  --panel: #ffffff;
  --text: #1f2933;
  --muted: #637381;
  --line: #d9e0e7;
  --primary: #1d6f5f;
  --primary-dark: #155447;
  --danger: #b42318;
  --warning: #a15c07;
  --shadow: 0 8px 22px rgba(26, 39, 54, 0.08);
}

#selfPurchases [hidden], #purchaseDialog [hidden] { display: none !important; }
.purchase-toolbar { display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin-bottom: 20px; }
.purchase-toolbar label { min-width: 140px; flex: 1; }
.purchase-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; border: 0; padding: 0; margin: 0 0 18px; min-width: 0; }
.purchase-wide { grid-column: 1 / -1; }
.purchase-fields label { min-width: 0; }
.purchase-fields select { width: 100%; min-width: 0; max-width: 100%; }
.purchase-order-results { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.purchase-order-results [role="status"] { min-width: 0; overflow-wrap: anywhere; }
.purchase-order-price { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 18px; padding: 12px 0; border-block: 1px solid var(--line); }
.purchase-order-price strong { font-size: 24px; }
.purchase-order-price span { overflow-wrap: anywhere; min-width: 0; }
#purchaseOrderDetails { margin-top: 12px; min-width: 0; }
#purchaseOrderDetails summary { cursor: pointer; padding: 8px 0; font-weight: 600; }
#purchaseOrderBusiness dl { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px 24px; }
#purchaseOrderBusiness dl > div { min-width: 0; }
#purchaseOrderBusiness dt { color: var(--muted); font-size: 14px; }
#purchaseOrderBusiness dd { margin: 4px 0 0; overflow-wrap: anywhere; }
#purchaseOrderItems .table-wrap { max-width: 100%; overflow: auto; }
@media (max-width: 500px) { #purchaseOrderBusiness dl { grid-template-columns: minmax(0,1fr); } }
.purchase-fields textarea { width: 100%; min-height: 74px; font: inherit; border: 1px solid var(--line); border-radius: 6px; padding: 10px; resize: vertical; }
.purchase-check { display: flex; align-items: center; gap: 8px; }
.purchase-check input { width: 18px; height: 18px; }
.purchase-table { width: 100%; min-width: 740px; table-layout: fixed; }
.purchase-table td { overflow-wrap: anywhere; vertical-align: top; }
.purchase-table th:nth-child(2) { width: 25%; }
.purchase-table td small { display: block; color: var(--muted); margin-top: 6px; }
.purchase-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin: 20px 0; }
#purchaseCreateForm { padding: 20px 0; border-block: 1px solid var(--line); margin-bottom: 24px; }
#purchaseDialog { width: min(680px,calc(100vw - 24px)); max-height: calc(100dvh - 32px); overflow: auto; box-sizing: border-box; border: 1px solid var(--line); border-radius: 8px; padding: 20px; box-shadow: var(--shadow); }
#purchasePayFields .purchase-check { display: flex; align-items: flex-start; justify-content: flex-start; }
#purchasePayFields .purchase-check input { margin: 3px 0 0; flex: 0 0 18px; }
#purchaseDetailSummary { margin-bottom: 20px; overflow-wrap: anywhere; }
#purchaseHistory { padding-left: 22px; }
#purchaseHistory li { margin-bottom: 12px; overflow-wrap: anywhere; }
#purchaseHistory small { display: block; color: var(--muted); }
#purchaseMessage, #purchaseActionMessage, #purchasePaymentCheck { overflow-wrap: anywhere; }
#purchaseActionMessage, #purchasePaymentCheck { color: var(--danger); }
@media (max-width: 500px) { .purchase-fields { grid-template-columns: minmax(0,1fr); } }

#workbench { letter-spacing: 0; }
#masterData [hidden] { display: none !important; }
.master-tabs { display: flex; gap: 20px; border-bottom: 1px solid var(--line); }
.master-tabs button { border: 0; border-radius: 0; background: transparent; color: var(--muted); padding: 12px 4px; border-bottom: 3px solid transparent; }
.master-tabs button[aria-selected="true"] { border-bottom-color: var(--primary); color: var(--primary); font-weight: 600; }
.master-pane { min-width: 0; padding: 8px 0; }
#masterData .customer-database-form, #masterData .product-database-form { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
#masterData form label { min-width: 0; }
#masterData .wide { grid-column: 1 / -1; }
#masterData .row-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: flex-start; }
#masterData .row-actions button { min-height: 40px; padding: 8px 14px; }
#masterData .catalog-count { display: block; margin-top: 8px; padding: 0; background: transparent; border: 0; color: var(--muted); }
#masterData [role="status"] { overflow-wrap: anywhere; }
#masterData [role="status"]:empty { display: none; }
#masterData .customer-database-list { display: block; max-height: 520px; overflow: auto; }
#masterData .customer-database-item { display: grid; grid-template-columns: minmax(180px, 1.2fr) minmax(160px, 1fr) 40px; gap: 16px; align-items: center; width: 100%; border-radius: 0; text-align: left; }
#masterData .customer-database-item strong, #masterData .customer-database-item span { min-width: 0; overflow-wrap: anywhere; }
#masterData .customer-edit-label { color: var(--primary); }
#masterData .product-database-list-wrap { max-height: 520px; }
#customerDatabaseMore, #productDatabaseMore { margin-top: 12px; }
@media (max-width: 800px) {
  #masterData .customer-database-form, #masterData .product-database-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #masterData .customer-database-item { grid-template-columns: minmax(0, 1fr) 40px; gap: 6px 12px; }
  #masterData .customer-database-item strong { grid-column: 1; }
  #masterData .customer-database-item span:not(.customer-edit-label) { grid-column: 1; }
  #masterData .customer-edit-label { grid-column: 2; grid-row: 1 / 3; }
}
@media (max-width: 480px) { #masterData .customer-database-form, #masterData .product-database-form { grid-template-columns: minmax(0, 1fr); } }
#orderReceiptEntry { width: 100%; min-width: 0; max-width: 1100px; }
#dashboard [hidden], #procurementEntryForm[hidden], #receiptFinancialSection[hidden], #exportCustomerStatement[hidden] { display: none !important; }
#procurementEntryForm button { margin-top: 18px; }
#procurementEntryResult { min-height: 24px; overflow-wrap: anywhere; }
.business-charts:has(section[hidden]) { grid-template-columns: minmax(0, 1fr); }
.receipt-order-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; border: 0; padding: 0; margin: 0; min-width: 0; }
.receipt-order-fields label { min-width: 0; }
.receipt-order-fields textarea, #receiptEditForm textarea { width: 100%; resize: vertical; min-height: 44px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 6px; font: inherit; font-size: 14px; line-height: 1.5; letter-spacing: 0; }
.receipt-order-fields textarea { resize: none; field-sizing: content; color: var(--text); -webkit-text-fill-color: var(--text); background: #edf1f4; opacity: 1; overflow-wrap: anywhere; }
.receipt-order-fields input, .receipt-order-fields textarea:not([readonly]) { background: white; color: var(--text); }
#saveOrderFinancialFields { margin-top: 18px; }
#saveOrderFinancialFields[hidden] { display: none; }
#orderFinancialFieldsResult { min-height: 24px; overflow-wrap: anywhere; }
#orderReceiptItems { min-width: 0; }
.receipt-payments-table { min-width: 820px; table-layout: fixed; }
#orderReceiptPayments th, #orderReceiptPayments td { text-align: left; overflow-wrap: anywhere; }
#orderReceiptPayments .money { text-align: right; font-variant-numeric: tabular-nums; }
#receiptEditResult { color: var(--danger); overflow-wrap: anywhere; }
#receiptEditDialog label { margin-bottom: 12px; }
#orderReceiptPayments .row-actions { flex-wrap: wrap; gap: 6px; }
#receiptEditForm .receipt-edit-actions { flex-wrap: wrap; gap: 12px; }
#receiptEditVoid { margin-right: auto; }
#receiptEditVoid[hidden] { display: none; }
@media (max-width: 800px) { .receipt-order-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .receipt-order-fields { grid-template-columns: minmax(0, 1fr); } }
.order-receipt-search { display: flex; align-items: flex-end; gap: 12px; margin-bottom: 18px; }
.order-receipt-search label { flex: 1; min-width: 0; }
.order-receipt-search button { flex-shrink: 0; }
.order-receipt-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin: 24px 0; padding: 24px 0; border-block: 1px solid var(--line); }
.order-receipt-summary:empty { display: none; }
.order-receipt-summary dt { font-size: 14px; color: var(--muted); }
.order-receipt-summary dd { margin: 8px 0 0; font-weight: 600; overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }
#orderReceiptFields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; border: 0; padding: 0; margin: 0 0 20px; min-width: 0; }
#orderReceiptStatus, #orderReceiptResult { min-height: 24px; overflow-wrap: anywhere; }
#orderReceiptEntry button:disabled { opacity: .5; cursor: default; }
@media (max-width: 600px) {
  .order-receipt-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 12px; }
  #orderReceiptFields { grid-template-columns: minmax(0, 1fr); }
}
.workbench-welcome { display: flex; align-items: center; gap: 18px; padding: 16px 0 24px; border-bottom: 1px solid var(--line); }
.workbench-welcome img { width: 64px; height: 64px; object-fit: contain; flex-shrink: 0; }
.workbench-welcome h3 { font-size: 24px; margin: 6px 0 0; line-height: 1.5; }
.workbench-welcome p { margin: 0; color: var(--muted); overflow-wrap: anywhere; }
.workbench-welcome time { margin-left: auto; color: var(--muted); white-space: nowrap; font-variant-numeric: tabular-nums; }
.workbench-shortcuts { display: flex; flex-wrap: wrap; gap: 10px; padding: 20px 0 4px; }
.workbench-shortcuts button:first-child { background: #0078a9; color: white; border-color: #0078a9; }
#workbenchStatus { color: var(--danger); }
.workbench-metrics { display: flex; flex-wrap: wrap; gap: 24px 48px; padding: 12px 0 28px; }
.workbench-metrics[hidden] { display: none; }
.workbench-metrics span { display: block; color: var(--muted); font-size: 14px; }
.workbench-metrics strong { display: block; font-size: 28px; line-height: 1.5; color: #006f97; font-variant-numeric: tabular-nums; }
.workbench-metrics p { font-size: 13px; line-height: 1.8; color: var(--muted); margin: 0; align-self: center; }
.workbench-layout { display: grid; grid-template-columns: minmax(0, 1fr) 270px; gap: 30px; }
.workbench-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.workbench-heading h3, .workbench-aside h3 { font-size: 18px; margin: 0 0 16px; }
.workbench-heading span { font-size: 12px; color: var(--muted); }
.workbench-queues { display: flex; flex-wrap: wrap; border-bottom: 1px solid var(--line); gap: 4px; }
.workbench-queues button { flex: 1 1 140px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-radius: 0; border-bottom: 3px solid transparent; background: transparent; color: var(--text); padding: 12px 8px; }
.workbench-queues button[aria-selected="true"] { border-bottom-color: #0078a9; background: #eaf4f8; color: #005e85; }
.workbench-queues strong { font-size: 22px; min-width: 32px; text-align: right; font-variant-numeric: tabular-nums; }
.workbench-search { display: flex; gap: 8px; margin: 18px 0 6px; }
.workbench-search input { min-width: 0; }
.workbench-search button { flex-shrink: 0; }
.workbench-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 20px; align-items: center; border-bottom: 1px solid var(--line); padding: 18px 0; min-height: 112px; }
.workbench-row strong { color: var(--text); font-size: 16px; }
.workbench-followup .followup-state { display: inline-block; color: #08705c; font-size: 14px; }
.workbench-followup p { white-space: pre-wrap; }
.workbench-row p { margin: 6px 0; font-size: 14px; }
.workbench-row span { color: var(--muted); font-size: 12px; }
.workbench-row div { overflow-wrap: anywhere; }
.workbench-row button { color: #006f97; }
.workbench-row-actions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; max-width: 200px; }
.workbench-aside { border-left: 1px solid var(--line); padding-left: 24px; min-width: 0; }
.workbench-aside section + section { margin-top: 32px; }
.workbench-link { display: block; width: 100%; height: auto; text-align: left; color: #006f97; background: transparent; border-radius: 0; border-bottom: 1px solid var(--line); padding: 12px 0; overflow-wrap: anywhere; line-height: 1.6; font-size: 14px; }
.workbench-link:hover { background: #eaf4f8; }
.workbench-link span { display: block; color: var(--muted); font-size: 12px; }
.workbench-empty { color: var(--muted); font-size: 14px; line-height: 1.7; }
.workbench-empty-main { padding: 48px 12px; text-align: center; border-bottom: 1px solid var(--line); }
.workbench-pagination { display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding: 18px 0; }
.workbench-pagination span { margin-right: auto; font-size: 13px; color: var(--muted); }
.workbench-pagination button { width: 40px; padding: 0; }
.workbench-pagination button:disabled { opacity: 0.4; cursor: default; }
[data-payment-record]:focus { outline: 2px solid #0078a9; outline-offset: -2px; }
@media (max-width: 1100px) {
  .workbench-layout { grid-template-columns: minmax(0, 1fr); }
  .workbench-aside { border-left: 0; padding-left: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; border-top: 1px solid var(--line); padding-top: 24px; }
  .workbench-aside section + section { margin-top: 0; }
}
@media (max-width: 600px) {
  .workbench-welcome { gap: 12px; flex-wrap: wrap; }
  .workbench-welcome div { flex: 1; min-width: 0; }
  .workbench-welcome h3 { font-size: 20px; }
  .workbench-welcome time { flex-basis: 100%; margin-left: 76px; font-size: 13px; }
  .workbench-row-actions { flex-direction: column; max-width: 100px; }
  .workbench-aside { grid-template-columns: minmax(0, 1fr); }
  .workbench-row { gap: 10px; }
  .workbench-row button { padding: 0 10px; font-size: 14px; }
  .workbench-metrics strong { font-size: 24px; }
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: "Microsoft YaHei", "Segoe UI", Arial, sans-serif;
  font-size: 16px;
}

.site-filing {
  min-height: 48px;
  padding: 12px 16px;
  text-align: center;
  font-size: 13px;
  line-height: 24px;
  color: var(--muted);
  border-top: 1px solid var(--line);
  overflow-wrap: anywhere;
}

.site-filing a { color: inherit; text-underline-offset: 3px; }
.site-filing a:focus-visible { outline: 2px solid var(--primary); outline-offset: 4px; }

button,
input,
select {
  font: inherit;
}

button {
  min-height: 40px;
  border: 0;
  border-radius: 6px;
  background: var(--primary);
  color: #fff;
  padding: 0 14px;
  cursor: pointer;
}

button:hover {
  background: var(--primary-dark);
}

button.secondary {
  border: 1px solid var(--line);
  background: #f8fafb;
  color: var(--text);
}

button.secondary:hover {
  background: #eef3f5;
}

button.danger-action {
  border-color: #f1b8b2;
  color: var(--danger);
}

button.danger-action:hover {
  background: #fff1ef;
}

button.ghost {
  border: 1px solid rgba(255, 255, 255, 0.25);
  background: transparent;
}

input,
select {
  width: 100%;
  min-height: 40px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  color: var(--text);
  padding: 6px 9px;
}

label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  color: var(--muted);
  font-size: 15px;
}

.filter-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  color: var(--muted);
  font-size: 15px;
}

.check-group {
  min-height: 40px;
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  padding: 6px 9px;
}

.check-option {
  flex-direction: row;
  align-items: center;
  gap: 5px;
  color: var(--text);
  font-size: 15px;
  white-space: nowrap;
}

.check-option input {
  width: auto;
  min-height: auto;
  margin: 0;
}

table {
  width: 100%;
  border-collapse: collapse;
  white-space: nowrap;
}

.orders-table {
  width: max-content;
  min-width: 1800px;
  table-layout: auto;
}

.orders-table th,
.orders-table td {
  white-space: normal;
  word-break: break-word;
}

.orders-table tbody tr[data-order-row] {
  cursor: pointer;
}

.orders-table tbody tr[data-order-row]:hover td {
  background: #f8fafc;
}

.orders-table tr.order-row-highlight td {
  background: #fff4bf;
  box-shadow: inset 0 1px 0 #f6d365, inset 0 -1px 0 #f6d365;
}

.orders-table tr.order-row-highlight td:first-child {
  box-shadow: inset 4px 0 0 #d97706, inset 0 1px 0 #f6d365, inset 0 -1px 0 #f6d365;
  font-weight: 700;
}

.orders-list-panel {
  overflow: visible;
  min-width: 0;
}

#orders {
  grid-template-columns: minmax(0, 1fr);
}

#orders .filter-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(160px, 100%), 1fr));
}

#orders .filter-grid > *,
#orders .filter-grid input,
#orders .filter-grid select {
  min-width: 0;
}

#orders .panel-head {
  flex-wrap: wrap;
}

#orders .panel-head h3 {
  white-space: nowrap;
}

#orders .order-head-actions {
  flex: 1 1 320px;
  min-width: 0;
  flex-wrap: wrap;
}

#orders .order-head-actions .search {
  flex: 1 1 180px;
  min-width: 0;
}

#orders .orders-empty {
  text-align: center;
  padding: 24px;
  color: var(--muted);
}

.orders-sticky-tools {
  position: relative;
  z-index: 12;
  margin: -16px -16px 12px;
  padding: 16px 16px 12px;
  background: #fff;
  border-bottom: 1px solid var(--line);
  border-radius: 8px 8px 0 0;
  box-shadow: 0 10px 18px rgba(15, 23, 42, 0.08);
}

#orders .orders-table th {
  position: sticky;
  top: 0;
  z-index: 10;
  background: #f7faf9;
  box-shadow: 0 1px 0 var(--line), 0 6px 10px rgba(15, 23, 42, 0.06);
}

#orders .table-wrap {
  overflow: auto;
  max-height: 68vh;
  overscroll-behavior-x: contain;
}

#orders .import-summary {
  grid-template-columns: repeat(auto-fit, minmax(min(150px, 100%), 1fr));
  gap: 8px;
  margin-top: 8px;
}

#orders .import-summary article {
  min-height: 46px;
  padding: 8px 10px;
  border-radius: 6px;
}

#orders .import-summary span {
  font-size: 12px;
}

#orders .import-summary strong {
  margin-top: 2px;
  font-size: 16px;
  line-height: 1.2;
}

.export-panel {
  margin-top: 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fbfdfe;
  padding: 10px;
}

.export-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}

.export-panel-head strong {
  display: block;
  font-size: 15px;
}

.export-panel-head span {
  color: var(--muted);
  font-size: 12px;
}

.export-field-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(120px, 1fr));
  gap: 8px 12px;
}

.order-column-panel {
  margin-top: 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fbfdfe;
  padding: 10px;
}

.order-column-panel-head {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 8px;
}

.order-column-panel-head strong {
  font-size: 15px;
}

.order-column-panel-head span {
  color: var(--muted);
  font-size: 12px;
}

.order-column-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(120px, 1fr));
  gap: 8px 12px;
}

.hidden-column {
  display: none;
}

.table-load-hint {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 8px 0;
  padding: 8px 10px;
  border: 1px solid #bfdbfe;
  border-radius: 6px;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 14px;
}

.table-load-hint.hidden {
  display: none;
}

#orderRenderHint {
  flex-wrap: wrap;
  justify-content: flex-end;
  min-height: 52px;
  background: #f7f9fa;
  border-color: var(--line);
  color: var(--text);
}

#orderRenderHint > span { margin-right: auto; }
#orderRenderHint > label { display: flex; flex-direction: row; align-items: center; gap: 8px; }
#orderRenderHint select { width: 88px; }
#orderRenderHint button { width: 36px; height: 36px; padding: 0; }
#orderRenderHint button:disabled { opacity: .4; cursor: default; }

.orders-table th:nth-child(1),
.orders-table td:nth-child(1) {
  min-width: 72px;
}

.orders-table th:nth-child(2),
.orders-table td:nth-child(2) {
  min-width: 105px;
}

.orders-table th:nth-child(3),
.orders-table td:nth-child(3) {
  min-width: 210px;
  max-width: 260px;
}

.orders-table th:nth-child(4),
.orders-table td:nth-child(4) {
  min-width: 260px;
  max-width: 360px;
}

.orders-table th:nth-child(5),
.orders-table td:nth-child(5) {
  width: 150px;
  min-width: 150px;
  max-width: 150px;
}

.delivery-text {
  display: -webkit-box;
  max-width: 130px;
  overflow: hidden;
  line-height: 1.45;
  white-space: normal;
  word-break: break-word;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.orders-table th:nth-child(n+6):nth-child(-n+11),
.orders-table td:nth-child(n+6):nth-child(-n+11) {
  min-width: 112px;
  white-space: nowrap;
  text-align: right;
}

.orders-table th:nth-child(12),
.orders-table td:nth-child(12) {
  min-width: 92px;
}

.orders-table th:nth-child(13),
.orders-table td:nth-child(13),
.orders-table th:nth-child(14),
.orders-table td:nth-child(14) {
  min-width: 76px;
  white-space: nowrap;
  text-align: right;
}

.orders-table th:nth-child(15),
.orders-table td:nth-child(15) {
  min-width: 120px;
}

.orders-table th:nth-child(16),
.orders-table td:nth-child(16),
.orders-table th:nth-child(17),
.orders-table td:nth-child(17) {
  min-width: 88px;
}

.orders-table th:nth-child(18),
.orders-table td:nth-child(18) {
  min-width: 260px;
}

.screening-table {
  width: 100%;
  min-width: 1980px;
  table-layout: fixed;
  font-size: 16px;
}

.screening-table th,
.screening-table td {
  padding: 11px 12px;
  vertical-align: middle;
}

.screening-table th:nth-child(1),
.screening-table td:nth-child(1) {
  width: 120px;
}

.screening-table th:nth-child(2),
.screening-table td:nth-child(2) {
  width: 150px;
}

.screening-table th:nth-child(3),
.screening-table td:nth-child(3) {
  width: 132px;
}

.screening-table th:nth-child(4),
.screening-table td:nth-child(4) {
  width: 96px;
}

.screening-table th:nth-child(5),
.screening-table td:nth-child(5) {
  width: 280px;
}

.screening-table th:nth-child(6),
.screening-table td:nth-child(6) {
  width: 380px;
}

.screening-table th:nth-child(7),
.screening-table td:nth-child(7) {
  width: 150px;
}

.screening-table th:nth-child(n+8):nth-child(-n+10),
.screening-table td:nth-child(n+8):nth-child(-n+10) {
  width: 130px;
  text-align: right;
  white-space: nowrap;
}

.screening-table th:nth-child(11),
.screening-table td:nth-child(11) {
  width: 280px;
}

.clamp-text {
  display: -webkit-box;
  overflow: hidden;
  line-height: 1.35;
  white-space: normal;
  word-break: break-word;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.compact-actions {
  gap: 6px;
  flex-wrap: nowrap;
}

.screening-table .row-actions.compact-actions button {
  min-height: 32px;
  height: 32px;
  border-radius: 4px;
  padding: 0 9px;
  font-size: 15px;
}

.screening-table .tag {
  min-height: 28px;
  padding: 0 10px;
  font-size: 15px;
}

th,
td {
  border-bottom: 1px solid var(--line);
  padding: 9px 10px;
  text-align: left;
  vertical-align: top;
}

th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #f7faf9;
  color: #44515c;
  font-weight: 600;
}

td.money,
th.money {
  text-align: right;
}

.ledger-table,
.fund-pool-table,
.fund-ledger-table {
  table-layout: fixed;
}

.ledger-table th,
.ledger-table td,
.fund-pool-table th,
.fund-pool-table td,
.fund-ledger-table th,
.fund-ledger-table td {
  vertical-align: middle;
}

.ledger-table {
  min-width: 2160px;
}

.ledger-table .date-col {
  width: 116px;
}

.ledger-table .salesperson-col {
  width: 100px;
}

.ledger-table .customer-col {
  width: 270px;
}

.ledger-table .summary-col {
  width: 430px;
}

.ledger-table .purpose-col {
  width: 190px;
}

.ledger-table .amount-col {
  width: 118px;
}

.ledger-table .days-col {
  width: 86px;
}

.ledger-table .order-col {
  width: 140px;
}

.ledger-table .action-col {
  width: 120px;
}

.ledger-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}

.ledger-content {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
}

#ledger .import-summary {
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
}

#ledger #ledgerOrderAnalysisSummary {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr));
}

#ledgerOrderAnalysisSummary article { min-width: 0; }
#ledgerOrderAnalysisSummary strong { overflow-wrap: anywhere; }

.ledger-subnav {
  display: flex;
  border-bottom: 1px solid var(--line);
  gap: 18px;
}

.ledger-subnav-button {
  flex-shrink: 0;
  width: auto;
  min-height: 46px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 0 4px;
  background: transparent;
  color: var(--text);
  border: 0;
  border-bottom: 3px solid transparent;
  border-radius: 0;
  box-shadow: none;
  font-weight: 600;
  text-align: left;
}

.ledger-subnav-button.active {
  background: transparent;
  border-bottom-color: var(--primary);
  color: var(--primary-dark);
  box-shadow: none;
}

.account-toolbar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  margin-bottom: 16px;
}

.account-toolbar > label { width: 240px; max-width: 100%; }
.account-toolbar .row-actions { flex-wrap: wrap; }
.account-load-status { margin: 0; padding: 12px 0; color: var(--muted); }
#ledger .panel { background: transparent; border: 0; box-shadow: none; padding: 0; }
#ledger .table-wrap { background: var(--panel); border: 1px solid var(--line); }
#ledger .fund-pool-table { min-width: 880px; }
#ledger .account-action-col { width: 110px; }
#ledger .fund-pool-table td:last-child { text-align: center; }
#ledger .fund-pool-table button { white-space: nowrap; }
#ledger .ledger-subnav-button[hidden], #ledger [hidden] { display: none !important; }
.account-analysis { border-bottom: 1px solid var(--line); padding-bottom: 12px; }
.account-analysis summary { cursor: pointer; color: var(--text); }
.account-analysis[open] summary { margin-bottom: 12px; }
#ledger .settlements-table { min-width: 1080px; width: 100%; table-layout: fixed; }
#ledger .settlements-table th, #ledger .settlements-table td { white-space: normal; text-align: left; }
#ledger .settlements-table th:nth-child(1), #ledger .settlements-table td:nth-child(1) { width: 94px; }
#ledger .settlements-table th:nth-child(2), #ledger .settlements-table td:nth-child(2) { width: 75px; }
#ledger .settlements-table th:nth-child(3), #ledger .settlements-table td:nth-child(3) { width: 230px; }
#ledger .settlements-table th:nth-child(4), #ledger .settlements-table td:nth-child(4) { width: 110px; text-align: right; }
#ledger .settlements-table th:nth-child(5), #ledger .settlements-table td:nth-child(5) { width: 100px; text-align: right; }
#ledger .settlements-table th:nth-child(6), #ledger .settlements-table td:nth-child(6) { width: 190px; }
#ledger .settlements-table th:nth-child(7), #ledger .settlements-table td:nth-child(7) { width: 130px; }
#ledger .settlements-table th:nth-child(8), #ledger .settlements-table td:nth-child(8) { width: 150px; text-align: left; }
#ledger .settlements-table td small { white-space: normal; }
#ledger .settlements-table .row-actions { flex-wrap: wrap; }

.ledger-tab-pane {
  display: none;
  min-width: 0;
}

.ledger-tab-pane > .panel {
  min-width: 0;
}

.ledger-tab-pane.active {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 16px;
}

.ledger-table th:nth-child(n+7),
.ledger-table td.money {
  text-align: right;
}

.ledger-table th:last-child,
.ledger-table td:last-child {
  text-align: center;
}

.ledger-table th:nth-child(-n+6),
.ledger-table td:nth-child(-n+6) {
  text-align: left;
}

.ledger-table-filters {
  display: grid;
  grid-template-columns: repeat(4, minmax(180px, 1fr));
  gap: 10px 12px;
  align-items: end;
  margin-bottom: 12px;
}

.ledger-table-filters label {
  color: var(--muted);
  font-size: 13px;
}

.ledger-purpose-filter {
  position: relative;
  min-width: 0;
  color: var(--muted);
  font-size: 13px;
}

.ledger-purpose-filter details {
  position: relative;
  margin-top: 4px;
}

.ledger-purpose-filter summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 38px;
  padding: 8px 11px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: #fff;
  color: var(--text);
  cursor: pointer;
  list-style: none;
}

.ledger-purpose-filter summary::-webkit-details-marker {
  display: none;
}

.ledger-purpose-filter summary::after {
  content: "";
  width: 7px;
  height: 7px;
  margin-left: 12px;
  border-right: 2px solid #52616d;
  border-bottom: 2px solid #52616d;
  transform: rotate(45deg) translateY(-2px);
  transition: transform 120ms ease;
}

.ledger-purpose-filter details[open] summary {
  border-color: var(--primary);
  box-shadow: 0 0 0 2px rgba(20, 122, 104, 0.12);
}

.ledger-purpose-filter details[open] summary::after {
  transform: rotate(225deg) translateY(-2px);
}

.ledger-purpose-menu {
  position: absolute;
  z-index: 20;
  top: calc(100% + 5px);
  left: 0;
  width: min(620px, calc(100vw - 56px));
  overflow: hidden;
  border: 1px solid #cbd6dc;
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 12px 26px rgba(23, 42, 52, 0.18);
}

.ledger-purpose-menu-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 13px;
}

.ledger-purpose-menu-table th,
.ledger-purpose-menu-table td {
  padding: 8px 10px;
  border-bottom: 1px solid #e4eaed;
  text-align: left;
  vertical-align: top;
}

.ledger-purpose-menu-table thead th {
  background: #f2f6f5;
  color: #4d5d67;
  font-weight: 600;
}

.ledger-purpose-menu-table th:first-child {
  width: 78px;
}

.ledger-purpose-menu-table tbody th {
  color: var(--primary-dark);
  font-weight: 700;
}

.ledger-purpose-menu-table tbody tr:last-child th,
.ledger-purpose-menu-table tbody tr:last-child td {
  border-bottom: 0;
}

.ledger-purpose-menu-table label {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin: 0 10px 5px 0;
  color: #41505c;
  cursor: pointer;
  white-space: nowrap;
}

.ledger-purpose-menu-table input {
  width: 14px !important;
  height: 14px;
  margin: 0 !important;
  accent-color: var(--primary);
}

.ledger-table-filters input,
.ledger-table-filters select,
.ledger-table-filters button {
  width: 100%;
  margin-top: 4px;
}

.ledger-filter-actions {
  display: grid;
  grid-column: span 2;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.ledger-quick-filter {
  display: grid;
  gap: 4px;
  color: var(--muted);
  font-size: 13px;
}

.ledger-quick-filter button {
  margin-top: 0;
}

.ledger-purpose-tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  max-width: 100%;
  min-height: 26px;
  padding: 3px 7px;
  border: 1px solid #cbdce4;
  border-radius: 5px;
  background: #f3f7f9;
  color: #3c5360;
  font-size: 12px;
  line-height: 1.35;
  text-align: center;
  white-space: normal;
  overflow-wrap: anywhere;
}

.ledger-filter-actions button {
  margin-top: 0;
}

.ledger-transaction-totals {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 8px;
}

.ledger-transaction-totals article {
  display: grid;
  gap: 3px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #f8fbfa;
}

.ledger-transaction-totals small {
  color: var(--muted);
  font-size: 12px;
}

.empty-hint {
  margin: 0;
  color: var(--muted);
}

.ledger-table td:nth-child(3),
.ledger-table td:nth-child(4),
.ledger-table .ledger-summary,
.fund-ledger-table .ledger-summary {
  white-space: normal;
  word-break: break-word;
  overflow-wrap: anywhere;
  line-height: 1.45;
}

.ledger-row-negative-settlement > td {
  background: #fff7e8;
}

.ledger-row-negative-settlement > td:first-child {
  box-shadow: inset 4px 0 0 #d68b23;
}

.ledger-row-negative-settlement:hover > td {
  background: #ffefd1;
}

.ledger-special-badge {
  display: inline-block;
  margin-right: 6px;
  padding: 2px 5px;
  border: 1px solid #e2a64f;
  border-radius: 4px;
  background: #fff0d2;
  color: #8a5610;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.3;
  vertical-align: 1px;
}

.ledger-auto-sync-hint {
  display: inline-flex;
  min-height: 30px;
  align-items: center;
  border: 1px solid #9ccdc1;
  border-radius: 5px;
  background: #edf7f3;
  color: #176c5c;
  padding: 0 8px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
  cursor: help;
}

.ledger-order-link {
  border: 0;
  background: transparent;
  color: #126b7a;
  padding: 2px 0;
  font: inherit;
  font-weight: 700;
  text-decoration: underline;
  text-decoration-color: rgba(18, 107, 122, 0.35);
  text-underline-offset: 3px;
}

.ledger-order-link:hover,
.ledger-order-link:focus-visible {
  background: transparent;
  color: #0b4f5b;
  text-decoration-color: currentColor;
}

.ledger-order-link:disabled {
  color: #126b7a;
  opacity: 0.65;
}

.form-status {
  min-height: 20px;
  color: var(--primary-dark);
  font-size: 13px;
}

.expense-refund-preview {
  display: grid;
  gap: 10px;
  margin: 2px 0;
  border: 1px solid #b9d8d0;
  border-left: 4px solid var(--primary);
  border-radius: 6px;
  background: #f3f9f7;
  padding: 12px 14px;
}

.refund-preview-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  color: var(--text);
}

.refund-preview-heading span,
.refund-preview-source,
.refund-preview-error {
  font-size: 13px;
}

.refund-status-ok {
  color: var(--primary-dark);
  font-weight: 700;
}

.refund-status-warning,
.refund-preview-error {
  color: var(--danger);
  font-weight: 700;
}

.refund-preview-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(120px, 1fr));
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--line);
  gap: 1px;
}

.refund-preview-grid > div {
  display: grid;
  gap: 4px;
  background: #fff;
  padding: 9px 10px;
}

.refund-preview-grid span {
  color: var(--muted);
  font-size: 12px;
}

.refund-preview-grid strong {
  color: var(--text);
  font-size: 16px;
}

.refund-preview-grid .refund-preview-emphasis {
  background: #eaf6f2;
}

.refund-preview-grid .refund-preview-emphasis strong {
  color: var(--primary-dark);
}

.refund-preview-source,
.refund-preview-error {
  margin: 0;
}

.refund-preview-source {
  color: var(--muted);
}

@media (max-width: 1180px) {
  .refund-preview-grid {
    grid-template-columns: repeat(3, minmax(140px, 1fr));
  }
}

.fund-pool-table .salesperson-col {
  width: 150px;
}

.fund-pool-table .amount-col {
  width: calc((100% - 150px) / 5);
}

.fund-pool-table th:not(:first-child),
.fund-pool-table td.money,
.fund-ledger-table th:nth-child(n+5),
.fund-ledger-table td.money {
  text-align: right;
}

.fund-pool-table th:first-child,
.fund-pool-table td:first-child,
.fund-ledger-table th:nth-child(-n+4),
.fund-ledger-table td:nth-child(-n+4) {
  text-align: left;
}

.fund-ledger-table {
  min-width: 1180px;
}

.fund-ledger-table .date-col {
  width: 116px;
}

.fund-ledger-table .salesperson-col {
  width: 100px;
}

.fund-ledger-table .type-col {
  width: 116px;
}

.fund-ledger-table .summary-col {
  width: auto;
}

.fund-ledger-table .amount-col {
  width: 118px;
}

.hidden {
  display: none !important;
}

.role-readonly [data-edit],
.role-readonly [data-cancel],
.role-readonly [data-order-confirm],
.role-readonly [data-order-workflow],
.role-readonly [data-edit-product-catalog-id],
.role-readonly [data-edit-payment-allocation],
.role-readonly [data-delete-payment-allocation],
.role-readonly [data-save-finance-note],
.role-readonly [data-save-penalty-base],
.role-readonly [data-review],
.role-readonly [data-confirm-status],
.role-readonly [data-settlement-confirm],
.role-readonly [data-ledger-edit],
.role-readonly [data-ledger-delete],
body:not(.can-order-edit):not(.can-payment-edit):not(.can-procurement-entry) [data-edit],
body:not(.can-order-close) [data-cancel],
body:not(.can-order-confirm) [data-order-confirm][data-confirm-status="confirmed"],
body:not(.can-order-close) [data-order-confirm][data-confirm-status="cancelled"],
body:not(.can-order-submit):not(.can-finance-review) [data-order-workflow],
body:not(.can-catalog-write) [data-edit-product-catalog-id],
body:not(.can-payment-edit) [data-edit-payment-allocation],
body:not(.can-payment-reverse) [data-delete-payment-allocation],
body:not(.can-finance-review) [data-save-finance-note],
body:not(.can-finance-review) [data-review],
body:not(.can-finance-review) [data-confirm-status]:not([data-order-confirm]),
body:not(.can-fund-confirm) [data-settlement-confirm],
body:not(.can-order-adjust) [data-save-penalty-base],
body:not(.can-ledger-adjust) [data-ledger-edit],
body:not(.can-ledger-adjust) [data-ledger-delete],
body:not(.can-payment-create) #paymentForm,
body:not(.can-ledger-create) #expenseForm,
body:not(.can-customer-write) #customerForm,
body:not(.can-catalog-write) #productDatabaseForm {
  display: none !important;
}

.login-shell {
  min-height: calc(100vh - 49px);
  display: grid;
  place-items: center;
  padding: 24px;
  background:
    linear-gradient(rgba(244, 246, 248, 0.92), rgba(244, 246, 248, 0.92)),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160'%3E%3Cg fill='none' stroke='%23c7d0d9' stroke-width='1'%3E%3Cpath d='M0 40h160M0 80h160M0 120h160M40 0v160M80 0v160M120 0v160'/%3E%3C/g%3E%3C/svg%3E");
}

.login-panel {
  width: min(520px, 100%);
  display: grid;
  gap: 18px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
  padding: 28px;
}

.login-panel h1 {
  margin: 0;
  font-size: 20px;
  font-weight: 600;
  line-height: 1.4;
}

.company-logo {
  display: block;
  object-fit: contain;
  flex-shrink: 0;
  background: #fff;
}

.login-heading {
  display: grid;
  gap: 12px;
}

.login-brand {
  display: grid;
  grid-template-columns: 112px minmax(0, max-content);
  justify-content: start;
  align-items: center;
  gap: 12px 8px;
}

.login-brand-copy {
  min-width: 0;
  display: grid;
  gap: 4px;
  color: #000;
  text-align: center;
}

.login-wordmark {
  font-size: 20px;
  font-weight: 700;
  line-height: 1.4;
  white-space: nowrap;
}

.login-company-english {
  font-family: Arial, sans-serif;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.4;
  text-wrap: balance;
}

@media (max-width: 480px) {
  .login-shell {
    padding: 12px;
  }

  .login-panel {
    padding: 24px 14px;
  }

  .login-brand {
    grid-template-columns: minmax(0, 1fr);
    justify-items: center;
    gap: 8px;
  }

  .login-brand .login-logo {
    grid-row: auto;
  }

  .login-brand .login-titles {
    grid-column: 1;
  }
}

.login-titles {
  grid-column: 2;
  text-align: center;
}

.login-logo {
  grid-row: 1 / span 2;
  width: 112px;
  height: 112px;
}

.sidebar-logo {
  width: 52px;
  height: 52px;
  border-radius: 6px;
}

.login-panel {
  min-width: 0;
  color-scheme: light;
}

.login-panel label {
  color: #44515c;
}

.login-panel input {
  min-width: 0;
  min-height: 44px;
  border-color: #73818c;
  background: #fff;
  color: var(--text);
}

.login-panel input:focus-visible,
.login-panel button:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}

.login-panel .error {
  min-height: 1.5em;
  line-height: 1.5;
  overflow-wrap: anywhere;
}

.dashboard-accounts-table {
  min-width: 560px;
}

.business-dashboard {
  min-width: 0;
  padding: 0 0 22px;
  border-bottom: 1px solid var(--line);
}

.business-heading,
.business-chart-head {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 16px;
  flex-wrap: wrap;
}

.business-heading h2 {
  font-size: 22px;
  margin: 0;
}

.business-heading p,
.business-chart h3 {
  margin: 6px 0 0;
}

.business-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.business-filters label {
  min-width: 100px;
  flex: 1 1 100px;
}

.business-filters select,
.business-chart-head select {
  font-size: 14px;
}

.business-totals {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(210px, 100%), 1fr));
  gap: 16px;
  margin: 20px 0 12px;
}

.business-totals article {
  min-width: 0;
  padding: 12px 0;
  border-top: 3px solid #087ca7;
}

.business-totals article:last-child {
  border-color: #237e65;
}

.business-totals span {
  display: block;
  color: #53616d;
  font-size: 14px;
}

.business-totals strong {
  display: block;
  margin-top: 10px;
  font-size: 24px;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}

.business-basis {
  font-size: 13px;
  color: #53616d;
  line-height: 1.7;
}

.business-category-wrap {
  overflow: auto;
  margin: 18px 0 24px;
}

.business-reconciliation { margin: 16px 0; border-block: 1px solid #d7dfe5; padding: 12px 0; }
.business-reconciliation summary { cursor: pointer; font-size: 14px; font-weight: 600; overflow-wrap: anywhere; }
.business-reconciliation summary span { display: inline-block; margin-left: 12px; font-weight: 400; }
.business-reconciliation table { width: 100%; min-width: 0; table-layout: fixed; margin-top: 10px; font-size: 13px; }
.business-reconciliation th, .business-reconciliation td { padding: 8px; white-space: normal; overflow-wrap: anywhere; }
.business-reconciliation th:first-child { text-align: left; }
.business-reconciliation tbody th { font-weight: 400; }
.business-reconciliation td, .business-reconciliation th:not(:first-child) { text-align: right; font-variant-numeric: tabular-nums; }
.business-reconciliation tfoot { font-weight: 600; border-top: 2px solid #d7dfe5; }

.business-category-table {
  min-width: 760px;
  background: #fff;
}
.sales-only .business-category-table { min-width: 0; width: 100%; table-layout: fixed; }
.sales-only .business-category-table th:first-child { width: 100px; }
.sales-only .business-category-table th, .sales-only .business-category-table td { overflow-wrap: anywhere; }

.business-category-table td,
.business-category-table th:not(:first-child) {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.business-charts {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px;
}

.business-chart {
  min-width: 0;
}

.business-chart-head {
  min-height: 72px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}

.business-chart h3,
.dashboard-history-title {
  font-size: 18px;
}

.business-bars,
.business-trend {
  max-height: 420px;
  overflow-y: auto;
  padding: 4px 8px 0 0;
}

.business-person-row {
  margin: 16px 0 22px;
}

.business-person-label {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  font-size: 14px;
  margin-bottom: 8px;
}

.business-person-label span {
  overflow-wrap: anywhere;
  min-width: 0;
}

.business-person-label strong {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.business-bar-track {
  height: 10px;
  background: #e5eaed;
  min-width: 0;
}

.business-bar-track i {
  display: block;
  height: 100%;
  max-width: 100%;
}

.business-bar-track .sales,
.sales-key::before {
  background: #087ca7;
}

.business-bar-track .receipts,
.receipts-key::before {
  background: #237e65;
}

.business-legend {
  display: flex;
  gap: 16px;
  font-size: 13px;
}

.business-legend span::before {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  margin-right: 6px;
}

.business-trend-row {
  display: grid;
  grid-template-columns: 84px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line);
  font-size: 12px;
}

.business-trend-series {
  display: grid;
  gap: 8px;
}

.business-trend-value {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 126px;
  align-items: center;
  gap: 8px;
}

.business-trend-value span {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

@media (max-width: 1100px) {
  .business-charts {
    grid-template-columns: minmax(0, 1fr);
  }
}

@media (max-width: 480px) {
  .business-trend-row {
    grid-template-columns: minmax(0, 1fr);
  }
}

#dashboard {
  grid-template-columns: minmax(0, 1fr);
}

#dashboard > .panel {
  min-width: 0;
}

.dashboard-accounts-table th.money,
.dashboard-accounts-table td.money {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.eyebrow {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  letter-spacing: 0;
}

.hint {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}

.error {
  margin: 0;
  color: var(--danger);
}

.layout {
  display: grid;
  grid-template-columns: 236px 1fr;
  min-height: 100vh;
}

.sidebar {
  position: sticky;
  top: 0;
  height: 100vh;
  display: flex;
  flex-direction: column;
  gap: 22px;
  background: #21313b;
  color: #fff;
  padding: 20px 14px;
}

.brand {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  align-items: center;
  gap: 12px;
  padding: 6px 8px 14px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.16);
}

.brand-copy {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.brand strong {
  font-size: 20px;
}

.brand span {
  color: #b9c6ce;
  font-size: 12px;
}

nav {
  display: grid;
  gap: 8px;
}

.nav {
  justify-content: flex-start;
  width: 100%;
  background: transparent;
  color: #dbe5ea;
  text-align: left;
}

.nav.active,
.nav:hover {
  background: #2e4650;
}

.user-box {
  margin-top: auto;
  display: grid;
  gap: 10px;
  padding: 12px 8px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.16);
}

.content {
  min-width: 0;
  padding: 22px;
}

.topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 18px;
}

.topbar h2 {
  margin: 3px 0 0;
  font-size: 28px;
}

.view {
  display: none;
}

.view.active {
  display: grid;
  gap: 16px;
}

.metric-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(150px, 1fr));
  gap: 12px;
}

.metric {
  min-height: 92px;
  display: grid;
  align-content: center;
  gap: 7px;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
  padding: 16px;
}

.metric span {
  color: var(--muted);
  font-size: 12px;
}

.metric strong {
  font-size: 22px;
}

.compact-metrics {
  grid-template-columns: repeat(3, minmax(150px, 1fr));
}

.compact-metrics .metric {
  min-height: 76px;
  padding: 12px 14px;
}

.panel {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 8px;
  box-shadow: var(--shadow);
  padding: 16px;
}

.panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}

.panel-head h3 {
  margin: 0;
  font-size: 18px;
}

.order-entry-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-wrap: wrap;
}

.order-editor-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 0;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--line);
}

.order-editor-toolbar[hidden] { display: none; }
.order-editor-toolbar h3 { margin: 0; font-size: 18px; }
#orderActionResult { margin: 0 0 12px; }
#orderReceiptForm { scroll-margin-top: 24px; }
#orderReceiptStatus:empty, #orderFinancialFieldsResult:empty { display: none; }
#returnToOrdersAfterReceipt { margin: 8px 0 0 8px; }

.order-head-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  min-width: min(520px, 100%);
}

.order-head-actions .search {
  flex: 1;
}

.split {
  display: grid;
  grid-template-columns: minmax(520px, 2fr) minmax(260px, 1fr);
  gap: 16px;
}

.form-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 12px;
}

.user-form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  align-items: end;
  gap: 12px;
}

.salesperson-form-grid {
  display: grid;
  grid-template-columns: 160px minmax(180px, 1fr) minmax(180px, 1fr) auto;
  align-items: end;
  gap: 12px;
}

.user-form-action {
  display: flex;
  justify-content: flex-end;
}

.user-field-disabled {
  opacity: 0.55;
}

.user-table {
  min-width: 980px;
}

.salesperson-table {
  min-width: 1180px;
}

#users,
#users .panel,
#users .user-table-wrap {
  min-width: 0;
}

.user-table td:first-child {
  display: grid;
  gap: 3px;
}

.account-note {
  display: block;
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
}

.status-badge {
  display: inline-block;
  border: 1px solid var(--line);
  border-radius: 4px;
  padding: 3px 7px;
  font-size: 12px;
}

.status-active {
  border-color: #9ccfbe;
  background: #edf8f3;
  color: #155447;
}

.status-inactive {
  background: #f3f4f6;
  color: var(--muted);
}

.app-dialog {
  width: min(720px, calc(100vw - 32px));
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel);
  color: var(--text);
  box-shadow: 0 18px 48px rgba(15, 23, 42, 0.24);
  padding: 20px;
}

.app-dialog::backdrop {
  background: rgba(19, 31, 42, 0.46);
}

.compact-dialog {
  width: min(520px, calc(100vw - 32px));
}

.app-dialog form {
  display: grid;
  gap: 14px;
}

.dialog-head,
.dialog-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.dialog-head h3 {
  margin: 0;
  font-size: 20px;
}

.dialog-actions {
  justify-content: flex-end;
  padding-top: 4px;
}

.dialog-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(180px, 1fr));
  gap: 12px;
}

.dialog-context {
  min-height: 20px;
  margin: 0;
  color: var(--muted);
}

input[readonly] {
  background: #f3f6f7;
  color: var(--muted);
}

.wide {
  grid-column: 1 / -1;
}

.form-section {
  margin-top: 6px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}

.form-section h4 {
  margin: 0 0 4px;
  font-size: 17px;
}

.form-section p {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
}

.edit-notice {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 10px 12px;
  border: 1px solid #f5c26b;
  border-radius: 8px;
  background: #fff8e6;
  color: #5d3b00;
}

.edit-notice.hidden {
  display: none;
}

.edit-notice div {
  display: grid;
  gap: 3px;
}

.edit-notice span {
  font-size: 14px;
}

.form-help {
  margin: -4px 0 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.5;
}

.section-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}

.product-items-section {
  display: grid;
  gap: 10px;
}

.product-section-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

.catalog-count {
  color: #236154;
  background: #e8f4ef;
  border: 1px solid #b9d9cd;
  border-radius: 6px;
  padding: 7px 10px;
  font-size: 13px;
  white-space: nowrap;
}

.customer-database-browser {
  display: grid;
  gap: 10px;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.data-database-grid {
  display: grid;
  grid-template-columns: minmax(300px, 0.8fr) minmax(560px, 1.2fr);
  gap: 18px;
  align-items: start;
}

.customer-database-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.customer-database-form button {
  grid-column: 1 / -1;
}

.product-database-form {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 10px;
}

.product-database-form .row-actions {
  justify-content: flex-end;
}

.product-database-browser {
  display: grid;
  gap: 10px;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}

.product-database-list-wrap {
  max-height: 440px;
  overflow-y: auto;
  border: 1px solid var(--line);
  border-radius: 6px;
}

.product-database-list-wrap table {
  min-width: 680px;
}

.product-database-list-wrap thead {
  position: sticky;
  top: 0;
  z-index: 1;
}

.unit-badge {
  display: inline-flex;
  min-width: 30px;
  justify-content: center;
  padding: 3px 7px;
  border: 1px solid #b9d9cd;
  border-radius: 6px;
  background: #e8f4ef;
  color: #236154;
  font-size: 12px;
  line-height: 1.2;
}

.customer-database-list {
  display: block;
  max-height: 470px;
  overflow-y: auto;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}

.customer-database-item {
  display: grid;
  width: 100%;
  gap: 2px;
  min-height: 58px;
  align-content: center;
  padding: 9px 10px;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: #fff;
  color: var(--text);
  text-align: left;
}

.customer-database-item:last-child {
  border-bottom: 0;
}

.customer-database-item:hover {
  background: #edf7f3;
}

.customer-database-item strong {
  font-size: 13px;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.customer-database-item span {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.product-name-picker {
  display: grid;
  grid-template-columns: minmax(150px, 1fr) auto;
  gap: 6px;
  min-width: 0;
}

.product-name-picker button {
  min-height: 34px;
  padding: 0 10px;
}

#productCatalogPanel {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 30;
  width: min(1040px, calc(100vw - 28px));
  max-height: calc(100vh - 28px);
  overflow: hidden;
  transform: translate(-50%, -50%);
  box-shadow:
    0 22px 60px rgba(20, 32, 44, 0.24),
    0 0 0 9999px rgba(19, 31, 42, 0.32);
}

#productCatalogPanel .panel-head {
  margin-bottom: 14px;
}

#productCatalogPanel .panel-head > div {
  display: grid;
  gap: 4px;
}

.product-picker-count {
  color: var(--muted);
  font-size: 13px;
}

.product-picker-layout {
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr);
  gap: 14px;
  min-height: min(560px, calc(100vh - 130px));
}

.product-picker-layout h4 {
  margin: 0 0 10px;
  font-size: 14px;
}

.product-category-list {
  display: grid;
  gap: 6px;
}

.product-category-button {
  min-height: 42px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border: 1px solid var(--line);
  background: #f7f9fa;
  color: var(--text);
  padding: 8px 10px;
  text-align: left;
}

.product-category-button strong {
  min-width: 28px;
  border-radius: 10px;
  background: #e7edef;
  color: var(--muted);
  font-size: 12px;
  line-height: 20px;
  text-align: center;
}

.product-category-button:hover,
.product-category-button.active {
  border-color: var(--primary);
  background: #e8f3f0;
  color: var(--primary-dark);
}

.product-category-button.active strong {
  background: var(--primary);
  color: #fff;
}

.product-model-browser {
  min-width: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 10px;
}

.product-catalog-results {
  min-height: 0;
  max-height: min(510px, calc(100vh - 190px));
  overflow-y: auto;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}

.product-catalog-option {
  width: 100%;
  min-height: 64px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(180px, 0.65fr) auto;
  align-items: center;
  gap: 14px;
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: #fff;
  color: var(--text);
  padding: 9px 12px;
  text-align: left;
}

.product-catalog-option:last-child {
  border-bottom: 0;
}

.product-catalog-option:hover,
.product-catalog-option:focus-visible {
  background: #edf7f3;
  color: var(--text);
}

.product-catalog-option > span {
  min-width: 0;
  display: grid;
  gap: 4px;
}

.product-catalog-option strong,
.product-catalog-option small,
.product-catalog-option b,
.product-catalog-option em {
  overflow-wrap: anywhere;
}

.product-catalog-option strong {
  font-size: 14px;
}

.product-catalog-option small {
  color: var(--muted);
  font-size: 12px;
  line-height: 1.4;
}

.product-catalog-option b {
  color: var(--primary-dark);
  font-size: 14px;
  line-height: 1.4;
}

.product-catalog-option em {
  color: var(--muted);
  font-size: 12px;
  font-style: normal;
  white-space: nowrap;
}

@media (max-width: 720px) {
  .data-database-grid,
  .customer-database-form,
  .product-database-form {
    grid-template-columns: 1fr;
  }

  .product-picker-layout {
    grid-template-columns: 1fr;
    min-height: 0;
  }

  .product-category-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .product-catalog-results {
    max-height: calc(100vh - 390px);
  }

  .product-catalog-option {
    grid-template-columns: 1fr;
    gap: 5px;
  }

  .product-catalog-option {
    grid-template-columns: 1fr;
    gap: 4px;
  }
}

.product-items-table {
  min-width: 1360px;
  table-layout: fixed;
}

.product-items-table th,
.product-items-table td {
  padding: 7px 8px;
  vertical-align: middle;
}

.product-items-table th:nth-child(1),
.product-items-table td:nth-child(1) {
  width: 66px;
}

.product-items-table th:nth-child(2),
.product-items-table td:nth-child(2) {
  width: 280px;
}

.product-items-table th:nth-child(3),
.product-items-table td:nth-child(3) {
  width: 230px;
}

.product-items-table th:nth-child(4),
.product-items-table td:nth-child(4) {
  width: 76px;
}

.product-items-table th:nth-child(5),
.product-items-table td:nth-child(5) {
  width: 92px;
}

.product-items-table th:nth-child(6),
.product-items-table td:nth-child(6) {
  width: 124px;
}

.product-items-table th:nth-child(n+6):nth-child(-n+9),
.product-items-table td:nth-child(n+6):nth-child(-n+9) {
  width: 124px;
}

.product-items-table th:nth-child(10),
.product-items-table td:nth-child(10) {
  width: 170px;
}

.product-items-table th:nth-child(11),
.product-items-table td:nth-child(11) {
  width: 82px;
}

.product-items-table input {
  min-height: 34px;
  padding: 5px 7px;
}

.product-items-table button {
  min-height: 34px;
  padding: 0 8px;
}

.field-label {
  display: inline-flex;
  align-items: baseline;
  gap: 3px;
}

.required-mark {
  color: #c2413b;
  font-weight: 700;
}

[aria-invalid="true"] {
  border-color: #c2413b;
  box-shadow: 0 0 0 2px rgba(194, 65, 59, 0.12);
}

.product-items-summary {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px 16px;
  color: var(--muted);
}

.product-items-summary strong {
  margin-left: 4px;
  color: var(--text);
  font-size: 17px;
}

.check {
  justify-content: end;
  flex-direction: row;
  align-items: center;
}

.check input {
  width: auto;
  min-height: auto;
}

.compact-form {
  display: grid;
  gap: 10px;
}

.search {
  max-width: 320px;
}

.table-input {
  min-width: 180px;
  width: 220px;
}

.confirm-note-input {
  display: block;
  width: 100%;
  min-width: 240px;
  min-height: 46px;
  margin-top: 6px;
  padding: 6px 8px;
  resize: vertical;
  line-height: 1.4;
  white-space: normal;
}

.filter-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(120px, 1fr));
  gap: 10px;
  align-items: end;
  margin: 0 0 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #f8fafb;
  padding: 10px;
}

#screening {
  gap: 18px;
}

#screening .panel {
  padding: 18px;
}

#screening .panel-head h3 {
  font-size: 20px;
}

#screening .import-summary {
  grid-template-columns: repeat(6, minmax(170px, 1fr));
  gap: 14px;
}

#screening .import-summary article {
  min-height: 78px;
  padding: 14px 16px;
}

#screening .import-summary span {
  font-size: 15px;
}

#screening .import-summary strong {
  font-size: 25px;
}

#screening .filter-grid {
  grid-template-columns: 300px 300px 300px;
  justify-content: start;
  gap: 14px;
  padding: 14px;
}

#screening .table-wrap {
  border-radius: 8px;
}

.filter-grid button {
  align-self: end;
}

.table-wrap {
  max-width: 100%;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 6px;
}

.tag {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  border-radius: 999px;
  padding: 0 9px;
  background: #edf5f2;
  color: var(--primary-dark);
  font-size: 12px;
}

.tag.warning {
  background: #fff4e5;
  color: var(--warning);
}

.tag.danger {
  background: #fff0ee;
  color: var(--danger);
}

.tag.ok {
  background: #edf7ed;
  color: #247a3d;
}

.row-actions {
  display: flex;
  gap: 6px;
}

.row-actions button {
  min-height: 28px;
  padding: 0 8px;
}

.confirmations-table td {
  white-space: normal;
}

.confirmations-table th:nth-child(10),
.confirmations-table td:nth-child(10) {
  min-width: 220px;
  max-width: 320px;
}

.confirmations-table th:nth-child(11),
.confirmations-table td:nth-child(11) {
  min-width: 340px;
}

.confirmations-table .row-actions {
  flex-wrap: wrap;
}

.allocation-box {
  border: 1px dashed var(--line);
  border-radius: 6px;
  padding: 12px;
}

.allocation-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 160px 40px;
  align-items: end;
  gap: 8px;
  margin-top: 8px;
}

.allocation-row input,
.allocation-row select {
  min-width: 0;
}

.allocation-row button {
  width: 40px;
  height: 40px;
  padding: 0;
}

.allocation-filters {
  display: grid;
  grid-template-columns: minmax(180px, 260px) minmax(260px, 1fr);
  gap: 12px;
  margin-bottom: 8px;
}

.import-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(160px, 1fr));
  gap: 12px;
  margin-top: 14px;
}

.import-summary article {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafb;
  padding: 12px;
}

.import-summary span {
  display: block;
  color: var(--muted);
  font-size: 12px;
}

.import-summary strong {
  display: block;
  margin-top: 4px;
  font-size: 20px;
}

.detail-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  gap: 10px;
}

#orderDetailPanel {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 20;
  width: min(1520px, calc(100vw - 28px));
  max-height: calc(100vh - 28px);
  overflow: auto;
  overscroll-behavior: contain;
  transform: translate(-50%, -50%);
  font-size: 16px;
  box-shadow:
    0 22px 60px rgba(20, 32, 44, 0.24),
    0 0 0 9999px rgba(19, 31, 42, 0.22);
}

#orderDetailPanel .detail-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr));
}

#orderDetailPanel .inline-edit-grid {
  grid-template-columns: repeat(auto-fit, minmax(min(180px, 100%), 1fr));
}

#orderDetailPanel .inline-edit-grid input {
  min-width: 0;
}

#orderDetailBody,
#orderDetailPanel .detail-grid > * {
  min-width: 0;
}

#orderDetailPanel .detail-section {
  overflow-wrap: anywhere;
}

#orderDetailPanel .panel-head {
  position: sticky;
  top: -14px;
  z-index: 2;
  margin: -14px -14px 12px;
  border-bottom: 1px solid var(--line);
  background: var(--panel);
  padding: 14px;
}

.detail-grid div,
.detail-grid > .detail-text-cell {
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #f8fafb;
  min-height: 66px;
  padding: 12px;
}

.detail-grid span {
  display: block;
  color: var(--muted);
  font-size: 14px;
}

.detail-grid strong {
  display: block;
  margin-top: 7px;
  font-size: 16px;
  line-height: 1.35;
  word-break: break-word;
}

.detail-section {
  margin-top: 18px;
}

.detail-section h3 {
  margin: 0 0 10px;
  font-size: 18px;
}

#orderDetailPanel .detail-text-cell summary { cursor: pointer; color: var(--muted); }
#orderDetailPanel .detail-text-cell summary > span { display: inline; }
#orderDetailPanel .detail-text-preview { color: var(--text); overflow-wrap: anywhere; }
#orderDetailPanel .detail-text-cell:not([open]) .detail-text-preview {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}
#orderDetailPanel .detail-disclosure { border: 0; border-top: 1px solid var(--line); border-radius: 0; background: transparent; margin: 0; padding: 0; }
#orderDetailPanel .detail-disclosure > summary { cursor: pointer; padding: 14px 0; font-size: 16px; font-weight: 600; }
#orderDetailPanel .detail-disclosure[open] { padding-bottom: 18px; }
#orderDetailPanel .detail-disclosure summary:focus-visible,
#orderDetailPanel .detail-text-cell summary:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }
#orderDetailPanel .detail-receipts { margin-bottom: 12px; }
#orderDetailPanel .finance-note-section { margin-top: 18px; }
#orderDetailPanel .penalty-base-editor { border: 0; background: transparent; padding: 0; }
#orderDetailPanel .penalty-base-editor > h3 { display: none; }
@media (max-width: 600px) {
  #orderDetailPanel .detail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  #orderDetailPanel .detail-grid strong { font-size: 14px; }
}

.penalty-base-editor {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafb;
  padding: 14px;
}

.inline-edit-grid {
  display: grid;
  grid-template-columns: minmax(260px, 1fr) minmax(190px, 0.65fr) auto;
  gap: 12px;
  align-items: end;
}

.inline-edit-grid label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  color: var(--muted);
  font-size: 14px;
  font-weight: 600;
}

.inline-edit-grid input {
  width: 100%;
  min-height: 40px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  color: var(--text);
  font: inherit;
  padding: 8px 10px;
}

.inline-edit-grid input:disabled {
  background: #eef3f5;
  color: var(--text);
}

.detail-table {
  min-width: 860px;
  table-layout: fixed;
}

.detail-table th,
.detail-table td {
  font-size: 15px;
  white-space: nowrap;
  vertical-align: middle;
}

.finance-note-section {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafb;
  padding: 14px;
}

.finance-note-input {
  width: 100%;
  min-height: 112px;
  resize: vertical;
  margin: 0;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  color: var(--text);
  font-size: 16px;
  line-height: 1.6;
  padding: 12px;
}

.finance-note-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 10px;
}

.detail-table .date-col {
  width: 130px;
}

.detail-table .days-col {
  width: 90px;
}

.detail-table .amount-col {
  width: 150px;
}

.detail-table .rate-col {
  width: 90px;
}

.product-detail-table {
  min-width: 1410px;
}

.product-detail-table th,
.product-detail-table td {
  white-space: normal;
  overflow-wrap: anywhere;
  text-align: left;
}

.product-detail-table .product-sequence-col { width: 64px; }
.product-detail-table .product-name-col { width: 200px; }
.product-detail-table .product-model-col { width: 230px; }
.product-detail-table .product-unit-col { width: 72px; }
.product-detail-table .product-quantity-col { width: 96px; }
.product-detail-table .product-price-col { width: 112px; }
.product-detail-table .product-amount-col { width: 132px; }
.product-detail-table .product-note-col { width: 260px; }

.product-detail-table .product-unit-cell {
  text-align: center;
}

.product-detail-table th.money,
.product-detail-table td.money {
  text-align: right;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.product-detail-table .total-row td {
  background: #f8fafb;
  font-weight: 700;
}

.detail-table .method-col {
  width: 110px;
}

.detail-table:where(:not(.product-detail-table)) th:nth-child(n+3),
.detail-table td.money {
  text-align: right;
}

.payment-table th:nth-child(4),
.payment-table td:nth-child(4),
.payment-table th:nth-child(5),
.payment-table td:nth-child(5) {
  text-align: left;
}

.payments-history-table {
  width: 100%;
  min-width: 1110px;
  table-layout: fixed;
}

#payments {
  grid-template-columns: minmax(0, 1fr);
}

#payments > .panel,
#paymentForm label,
#paymentForm .allocation-box {
  min-width: 0;
}

.payments-history-table th:nth-child(1),
.payments-history-table td:nth-child(1) {
  width: 120px;
}

.payments-history-table th:nth-child(2),
.payments-history-table td:nth-child(2) {
  width: 260px;
  white-space: normal;
  overflow-wrap: anywhere;
}

.payments-history-table th:nth-child(3),
.payments-history-table td:nth-child(3),
.payments-history-table th:nth-child(4),
.payments-history-table td:nth-child(4) {
  width: 160px;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.payments-history-table th:nth-child(5),
.payments-history-table td:nth-child(5) {
  width: 90px;
}

.payments-history-table th:nth-child(6),
.payments-history-table td:nth-child(6) {
  width: auto;
  min-width: 320px;
}

.settlements-table {
  width: 100%;
  min-width: 1540px;
  table-layout: fixed;
}

.settlements-table th:nth-child(1),
.settlements-table td:nth-child(1) {
  width: 82px;
}

.settlements-table th:nth-child(2),
.settlements-table td:nth-child(2) {
  width: 78px;
}

.settlements-table th:nth-child(3),
.settlements-table td:nth-child(3) {
  width: 118px;
}

.settlements-table th:nth-child(4),
.settlements-table td:nth-child(4) {
  width: 220px;
}

.settlements-table th:nth-child(5),
.settlements-table td:nth-child(5) {
  width: 280px;
}

.settlements-table th:nth-child(6),
.settlements-table td:nth-child(6) {
  width: 76px;
}

.settlements-table th:nth-child(7),
.settlements-table td:nth-child(7),
.settlements-table th:nth-child(8),
.settlements-table td:nth-child(8),
.settlements-table th:nth-child(9),
.settlements-table td:nth-child(9) {
  width: 118px;
  white-space: nowrap;
}

.settlements-table th:nth-child(10),
.settlements-table td:nth-child(10) {
  width: 210px;
}

.settlements-table th:nth-child(11),
.settlements-table td:nth-child(11) {
  width: 150px;
}

.settlements-table th:nth-child(12),
.settlements-table td:nth-child(12) {
  width: 156px;
}

.wrap-note {
  display: block;
  max-width: 100%;
  white-space: normal;
  word-break: break-word;
  overflow-wrap: anywhere;
  line-height: 1.45;
}

.payment-timeline-table {
  min-width: 760px;
}

.payment-timeline-table th,
.payment-timeline-table td {
  font-size: 16px;
}

.payment-timeline-table th:nth-child(5),
.payment-timeline-table td:nth-child(5) {
  font-weight: 700;
}

#toast {
  position: fixed;
  right: 18px;
  bottom: 18px;
  max-width: 360px;
  display: none;
  border-radius: 8px;
  background: #21313b;
  color: #fff;
  box-shadow: var(--shadow);
  padding: 12px 14px;
}

#toast.show {
  display: block;
}

@media (max-width: 1100px) {
  .metric-grid {
    grid-template-columns: repeat(2, minmax(150px, 1fr));
  }

  .ledger-layout {
    grid-template-columns: 1fr;
  }

  .ledger-subnav {
    position: static;
    grid-template-columns: repeat(3, minmax(110px, 1fr));
  }

  .split {
    grid-template-columns: 1fr;
  }

  .form-grid {
    grid-template-columns: repeat(2, minmax(150px, 1fr));
  }

  .user-form-grid {
    grid-template-columns: repeat(2, minmax(180px, 1fr));
  }

  .salesperson-form-grid {
    grid-template-columns: repeat(2, minmax(180px, 1fr));
  }
}

@media (max-width: 760px) {
  .layout {
    grid-template-columns: 1fr;
  }

  .sidebar {
    position: static;
    height: auto;
    min-width: 0;
    gap: 12px;
    padding: 12px 14px;
  }

  .sidebar nav {
    display: flex;
    overflow-x: auto;
    gap: 6px;
    padding-bottom: 4px;
  }

  .sidebar .nav {
    flex: 0 0 auto;
    width: auto;
    white-space: nowrap;
  }

  .sidebar .user-box {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    padding-top: 8px;
    gap: 8px;
    font-size: 14px;
  }

  .sidebar #userName {
    grid-column: 1 / -1;
    overflow-wrap: anywhere;
  }

  .content {
    padding: 14px;
  }

  .metric-grid,
  .form-grid,
  .user-form-grid,
  .salesperson-form-grid,
  .dialog-form-grid {
    grid-template-columns: 1fr;
  }

  .allocation-row {
    grid-template-columns: minmax(0, 1fr) 40px;
  }

  .allocation-order-field {
    grid-column: 1 / -1;
  }

  #paymentForm .allocation-filters {
    grid-template-columns: minmax(0, 1fr);
  }

  .ledger-subnav {
    grid-template-columns: 1fr;
  }

  .ledger-table-filters {
    grid-template-columns: 1fr;
  }

  .ledger-filter-actions {
    grid-column: auto;
  }

  .ledger-purpose-menu {
    width: min(620px, calc(100vw - 28px));
  }
}
.credit-form {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr);
  gap: 14px;
  padding: 16px 0 22px;
  border-bottom: 1px solid #d5dee5;
  margin-bottom: 24px;
}
.credit-form h3, .credit-form .credit-reason { grid-column: 1 / -1; }
.credit-form button { justify-self: start; }
.credit-table-wrap { overflow-x: auto; margin-bottom: 28px; }
.credit-table { min-width: 1040px; width: 100%; table-layout: auto; }
.credit-history { min-width: 1120px; width: 100%; table-layout: auto; }
.credit-table th, .credit-table td,
.credit-history th, .credit-history td { vertical-align: top; padding: 12px; }
.credit-table th:not(:first-child), .credit-table td.money,
.credit-history th:nth-child(3), .credit-history td.money { text-align: right; font-variant-numeric: tabular-nums; }
.credit-table th { white-space: nowrap; }
.credit-table .money, .credit-history .money { white-space: nowrap; min-width: 112px; }
.credit-history td:nth-child(5) { min-width: 190px; }
.credit-history td:nth-child(6) { min-width: 180px; max-width: 320px; overflow-wrap: anywhere; white-space: normal; }
.credit-votes { padding: 0; margin: 0; list-style: none; }
.credit-votes li { margin-bottom: 8px; white-space: normal; }
.credit-votes small { display: block; color: #536878; overflow-wrap: anywhere; }
.credit-actions { display: flex; gap: 8px; flex-wrap: wrap; min-width: 100px; }
#creditLimits { min-width: 0; }
#creditLimits h3 { margin: 16px 0 12px; }
@media (max-width: 640px) {
  .credit-form { grid-template-columns: minmax(0, 1fr); }
  .ledger-subnav { flex-wrap: wrap; column-gap: 12px; row-gap: 0; }
}
/* Office roles retain business prices without financial collection panels. */
.office-privacy #orderReceiptSummary, .office-privacy .office-finance-section { display: none; }
#orders [hidden] { display: none !important; }
.office-privacy #businessTotals, .office-privacy .business-charts { display: none; }
:root { --business-warning: #8a4700; }
.business-missing-tag { display: block; margin-top: 5px; padding: 3px 6px; border-left: 3px solid #e39b26; background: #fff3cf; color: var(--business-warning); font-size: 12px; white-space: normal; max-width: 230px; }
.business-warning { color: var(--business-warning); background: #fff3cf; padding: 10px 12px; border-left: 3px solid #e39b26; }
.business-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
#businessDataForm { border-bottom: 1px solid #d7dfe5; padding-bottom: 24px; margin-bottom: 24px; }
#businessChanges [hidden] { display: none !important; }
#businessDataForm > label { display: block; margin: 16px 0; }
.business-items { min-width: 1080px; }
#businessChanges { min-width: 0; grid-template-columns: minmax(0, 1fr); }
#businessChanges > * { min-width: 0; }
#businessOrderTitle, #businessOrderIdentity { overflow-wrap: anywhere; }
#businessChanges .table-wrap { overflow-x: auto; max-width: 100%; }
#businessChanges textarea { width: 100%; padding: 10px; border: 1px solid #b8c7d3; border-radius: 6px; font: inherit; margin: 6px 0 12px; resize: vertical; }
.business-items input { width: 100%; min-width: 75px; }
.business-items td:first-child { min-width: 145px; }
.business-change { padding: 16px 0; border-bottom: 1px solid #d7dfe5; }
.business-change h4 { margin: 10px 0; font-size: 16px; }
.business-change p { overflow-wrap: anywhere; }
.business-change details { margin-bottom: 12px; }
.business-compare { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.business-compare > div { overflow: auto; overflow-wrap: anywhere; }
.business-compare strong { display: block; margin-bottom: 8px; }
@media (max-width: 620px) { .business-fields, .business-compare { grid-template-columns: minmax(0, 1fr); } }
/* Financial inbox uses unframed rows; only tables scroll on narrow screens. */
.finance-review-row {border-bottom:1px solid #ccd7df;padding:16px 0;}
.finance-review-row summary {display:flex;gap:16px;flex-wrap:wrap;cursor:pointer;align-items:center;}
.finance-review-row summary strong {flex:1;min-width:180px;}
.finance-review-fields {display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;margin:12px 0;}
.finance-review-fields dt {font-size:13px;color:#657480;}
.finance-review-fields dd {margin:4px 0;overflow-wrap:anywhere;}
.finance-review-order,.finance-review-actions {display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:12px 0;}
.finance-review-row textarea {width:100%;box-sizing:border-box;}
.detail-fund-workflow { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px 0; margin-bottom:16px; border-bottom:1px solid #d4dfe6; flex-wrap:wrap; }
.detail-fund-workflow p { margin:6px 0; }
.detail-fund-workflow > div { min-width:0; overflow-wrap:anywhere; }
.settlements-table td small { display:block; white-space:nowrap; color:#526373; margin-top:4px; }
#orderReturns { min-width: 0; grid-template-columns: minmax(0, 1fr); }
.erp-order-id { display: block; color: #566674; white-space: nowrap; font-size: 12px; margin-top: 4px; }
.feedback-dialog { width: min(1040px, calc(100vw - 32px)); max-height: calc(100vh - 40px); border: 1px solid #b8c7d3; border-radius: 6px; padding: 20px; overflow: auto; }
.feedback-dialog::backdrop { background: rgba(0, 0, 0, .36); }
.feedback-dialog textarea, .feedback-order textarea, #orderReturns textarea { width: 100%; box-sizing: border-box; padding: 10px; border: 1px solid #b8c7d3; border-radius: 4px; font: inherit; resize: vertical; }
.paste-mapping { display: grid; grid-template-columns: repeat(auto-fit, minmax(155px, 1fr)); gap: 10px; margin: 12px 0; }
.paste-mapping label { min-width: 0; overflow-wrap: anywhere; }
.paste-mapping select { width: 100%; }
#itemPasteMessage { white-space: pre-wrap; overflow-wrap: anywhere; max-height: 180px; overflow: auto; }
.order-note { padding: 10px 0; border-bottom: 1px solid #d3dde5; }
.order-note p { white-space: pre-wrap; overflow-wrap: anywhere; margin: 0 0 6px; }
.feedback-order button { margin: 8px 0; }
.order-cancellation button { margin: 8px 0; }
.order-cancellation p, .order-cancellation small, #cancelRows h4 { overflow-wrap: anywhere; }
#cancelRows p { white-space: pre-wrap; }
#cancelPrev, #cancelNext { width: 40px; height: 40px; padding: 0; flex: 0 0 40px; }
#orderReturns .business-compare > div { min-width: 0; overflow: auto; }
.inspection-dialog { box-sizing: border-box; width: min(820px, calc(100vw - 24px)); max-height: calc(100dvh - 32px); overflow: auto; padding: 20px; border: 1px solid var(--line); border-radius: 6px; }
.inspection-dialog::backdrop { background: rgba(0,0,0,.36); }
.inspection-dialog h3 { font-size: 20px; margin: 0; overflow-wrap: anywhere; }
.inspection-dialog [hidden] { display: none !important; }
.inspection-dialog p, .inspection-history li { overflow-wrap: anywhere; }
.inspection-stages, .inspection-statuses { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; margin: 14px 0; }
.inspection-stages button { min-width: 0; min-height: 76px; padding: 12px 6px; background: #fff; color: var(--text); border: 1px solid var(--line); white-space: normal; }
.inspection-stages button[aria-expanded="true"] { border-color: var(--primary); box-shadow: inset 0 -3px var(--primary); }
.inspection-stages button:disabled { opacity: 1; background: #f4f6f8; color: #637381; cursor: not-allowed; }
.inspection-stages strong, .inspection-stages span, .inspection-statuses span, .inspection-history span { display: block; }
.inspection-statuses > div { min-width: 0; overflow-wrap: anywhere; }
.inspection-statuses p { white-space: pre-wrap; margin: 8px 0; }
[data-inspection-status="approved"] { color: #17673b; }
[data-inspection-status="rejected"], [data-inspection-status="stale"] { color: #a52b20; }
.inspection-history { padding-left: 20px; }
.inspection-history li { padding: 12px 0; border-bottom: 1px solid var(--line); }
.inspection-history p { margin: 6px 0; white-space: pre-wrap; }
.inspection-history span { color: var(--muted); font-size: 13px; margin-top: 4px; }
.inspection-reject { width: min(520px, calc(100vw - 24px)); }
.inspection-reject textarea { width: 100%; box-sizing: border-box; font: inherit; padding: 10px; border: 1px solid var(--line); border-radius: 4px; resize: vertical; }
@media (max-width: 520px) { .inspection-stages, .inspection-statuses { grid-template-columns: minmax(0,1fr); } .inspection-stages button { min-height: 58px; } }
.sales-account-plan-row { padding: 12px 0; border-bottom: 1px solid #d3dce3; }
.sales-account-plan-row label { display: block; margin: 8px 0; }
.sales-account-plan-row input { width: 100%; box-sizing: border-box; }
/* Account entry and its document register share one work surface. */
#expenseForm { border: 0; border-radius: 0; box-shadow: none; padding: 0 0 18px; }
.expense-history { border-top: 1px solid #d7dee3; padding-top: 16px; min-width: 0; }
.expense-history-toolbar { display: flex; align-items: end; flex-wrap: wrap; gap: 10px; margin-bottom: 12px; }
.expense-history-toolbar h3 { font-size: 16px; margin: 0 auto 8px 0; }
.expense-history-toolbar label { min-width: 120px; margin: 0; }
.expense-history-search { flex: 0 1 240px; }
.expense-history-toolbar input, .expense-history-toolbar select { width: 100%; }
.expense-history-wrap { max-height: 480px; overflow: auto; border: 1px solid #d7dee3; border-radius: 0; }
.expense-history-table { width: 100%; min-width: 1230px; table-layout: fixed; font-size: 13px; }
.expense-history-table th { position: sticky; top: 0; z-index: 1; background: #edf2f5; }
.expense-history-table th, .expense-history-table td { padding: 9px 10px; text-align: left; vertical-align: top; overflow-wrap: anywhere; letter-spacing: 0; }
.expense-history-table th:nth-child(1) { width: 85px; }
.expense-history-table th:nth-child(2) { width: 105px; }
.expense-history-table th:nth-child(3) { width: 80px; }
.expense-history-table th:nth-child(4) { width: 150px; }
.expense-history-table th:nth-child(5), .expense-history-table th:nth-child(7), .expense-history-table th:nth-child(8) { width: 112px; text-align: right; }
.expense-history-table th:nth-child(6) { width: 65px; text-align: right; }
.expense-history-table th:nth-child(9) { width: 110px; }
.expense-history-table th:nth-child(10) { width: 240px; }
.expense-history-table th:nth-child(11) { width: 140px; }
.expense-history-table td.number { text-align: right; font-variant-numeric: tabular-nums; }
.expense-history-table tbody tr:nth-child(even) { background: #f8fafb; }
.expense-history-table tbody tr.expense-history-saved { background: #e7f5ee; }
.expense-history-table .row-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.expense-history-table button { font-size: 12px; padding: 5px 9px; }
.expense-state { font-weight: 600; }
.expense-state-pending { color: #936210; }
.expense-state-approved { color: #176952; }
.expense-state-rejected, .expense-review-note { color: #a34242; }
.expense-review-note { margin-top: 4px; }
.expense-history-empty { height: 110px; text-align: center !important; vertical-align: middle !important; color: #66717b; }
.expense-history-footer { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding-top: 12px; }
.expense-history-footer span { margin-right: auto; }
@media (max-width: 640px) {
  .expense-history-toolbar h3 { flex-basis: 100%; }
  .expense-history-toolbar label { flex: 1 1 135px; min-width: 0; }
  .expense-history-toolbar button { min-height: 38px; }
  .expense-history-footer span { flex-basis: 100%; }
  #expenseForm .panel-head { flex-wrap: wrap; gap: 8px; }
}
/* Receipt correction shares the account workspace's compact table layout. */
.correction-toolbar { display: flex; flex-wrap: wrap; align-items: end; gap: 12px; margin: 14px 0; }
.correction-toolbar h3 { margin-right: auto; }
.correction-toolbar label { min-width: 170px; max-width: 100%; }
.correction-table { min-width: 780px; width: 100%; }
.correction-table td { vertical-align: top; overflow-wrap: anywhere; max-width: 300px; }
.correction-dialog { width: min(960px, calc(100vw - 32px)); max-height: calc(100dvh - 40px); overflow: auto; padding: 24px; border: 1px solid #c9d3d7; border-radius: 6px; color: #20343d; background: #fff; }
.correction-dialog::backdrop { background: rgb(0 0 0 / 35%); }
.correction-dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.correction-dialog h3 { font-size: 18px; margin: 0; }
.correction-dialog p, .correction-dialog li { overflow-wrap: anywhere; }
.correction-dialog form { display: grid; gap: 12px; }
.expense-correction-dialog form { grid-template-columns: minmax(0, 1fr); }
.expense-correction-dialog form > * { min-width: 0; }
.correction-dialog label { display: grid; gap: 6px; min-width: 0; }
.correction-dialog input, .correction-dialog select, .correction-dialog textarea { width: 100%; min-width: 0; box-sizing: border-box; }
.correction-dialog textarea { padding: 9px 10px; font: inherit; border: 1px solid #cfdbdf; border-radius: 4px; resize: vertical; }
.correction-dialog .correction-comparison { min-width: 0; table-layout: fixed; }
.correction-comparison th, .correction-comparison td { white-space: normal; overflow-wrap: anywhere; text-align: left; }
.correction-edit-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.correction-warning { border-left: 3px solid #c18a27; background: #fff7df; padding: 10px 12px; }
.correction-events { padding-left: 22px; font-size: 13px; line-height: 1.7; }
[data-correction-error] { color: #a43636; }
@media (max-width: 600px) { .correction-dialog { padding: 16px; } .correction-edit-grid { grid-template-columns: minmax(0, 1fr); } .correction-comparison th, .correction-comparison td { padding: 8px 5px; font-size: 13px; } }