/* Unified sales module visual contract.
   This layer is intentionally presentation-only: ids, events and workflows stay unchanged. */
:root{
  --sales-ui-ink:#17263a;
  --sales-ui-muted:#718096;
  --sales-ui-blue:#087cf0;
  --sales-ui-border:#dce5ee;
  --sales-ui-line:#e9eef3;
  --sales-ui-soft:#f5f8fb;
  --sales-ui-surface:#fff;
  --sales-ui-radius:7px;
}

/* Pages covered by the sales workspace, including the cutting stage of the sales cycle. */
.app-shell :is(
  #completed-orders-view,#order-details-view,#customers-view,#customer-forms-view,#quotations-view,
  #deliveries-view,#reports-view,#returns-view,#sales-invoices-view,#prices-view,#finance-view,
  #finance-receipts-view,#finance-paid-view,#editor-view,#preparation-work-view,#preparation-completed-view
){
  padding:3px 10px 10px!important;
  color:var(--sales-ui-ink)!important;
  font-family:Tahoma,"Segoe UI",Arial,sans-serif!important;
}

/* Compact screen headings. */
.app-shell :is(
  #completed-orders-view,#order-details-view,#customers-view,#customer-forms-view,#quotations-view,
  #deliveries-view,#reports-view,#returns-view,#sales-invoices-view,#prices-view,#finance-view,
  #finance-receipts-view,#finance-paid-view,#editor-view,#preparation-work-view,#preparation-completed-view
) :is(.page-heading,.document-header){
  min-height:39px!important;
  margin:0 0 4px!important;
  padding:3px 4px!important;
  border:0!important;
  border-bottom:1px solid var(--sales-ui-line)!important;
  background:transparent!important;
  box-shadow:none!important;
  gap:8px!important;
}
.app-shell :is(
  #completed-orders-view,#order-details-view,#customers-view,#customer-forms-view,#quotations-view,
  #deliveries-view,#reports-view,#returns-view,#sales-invoices-view,#prices-view,#finance-view,
  #finance-receipts-view,#finance-paid-view,#editor-view,#preparation-work-view,#preparation-completed-view
) :is(.page-heading,.document-header) h1{
  margin:0!important;
  color:var(--sales-ui-ink)!important;
  font-size:16px!important;
  line-height:1.15!important;
  font-weight:800!important;
}
.app-shell :is(
  #completed-orders-view,#order-details-view,#customers-view,#customer-forms-view,#quotations-view,
  #deliveries-view,#reports-view,#returns-view,#sales-invoices-view,#prices-view,#finance-view,
  #finance-receipts-view,#finance-paid-view,#editor-view,#preparation-work-view,#preparation-completed-view
) :is(.page-heading,.document-header) :is(p,.eyebrow){
  margin:1px 0 0!important;
  color:var(--sales-ui-muted)!important;
  font-size:8px!important;
  line-height:1.25!important;
}

/* Internal navigation follows the same compact tabs as orders. */
.app-shell :is(
  #completed-orders-view,#deliveries-view,#preparation-work-view,#finance-view,#finance-receipts-view,
  #finance-paid-view,#prices-view,#customers-view
) :is(.sales-order-module-tabs,.accounting-module-tabs,.catalog-tabs,.customer-directory-tabs){
  display:flex!important;
  align-items:center!important;
  gap:2px!important;
  width:100%!important;
  min-height:30px!important;
  margin:0 0 4px!important;
  padding:2px!important;
  overflow-x:auto!important;
  border:1px solid #e5ebf1!important;
  border-radius:6px!important;
  background:#fff!important;
  box-shadow:none!important;
}
.app-shell :is(
  #completed-orders-view,#deliveries-view,#preparation-work-view,#finance-view,#finance-receipts-view,
  #finance-paid-view,#prices-view,#customers-view
) :is(.sales-order-module-tabs,.accounting-module-tabs,.catalog-tabs,.customer-directory-tabs)>button{
  min-width:104px!important;
  height:24px!important;
  min-height:24px!important;
  margin:0!important;
  padding:0 10px!important;
  border:0!important;
  border-radius:4px!important;
  background:transparent!important;
  color:#617287!important;
  font-size:8.5px!important;
  font-weight:800!important;
  white-space:nowrap!important;
}
.app-shell :is(
  #completed-orders-view,#deliveries-view,#preparation-work-view,#finance-view,#finance-receipts-view,
  #finance-paid-view,#prices-view,#customers-view
) :is(.sales-order-module-tabs,.accounting-module-tabs,.catalog-tabs,.customer-directory-tabs)>button.active{
  background:#eaf4ff!important;
  color:#0874df!important;
  box-shadow:inset 0 -2px var(--sales-ui-blue)!important;
}
.app-shell .sales-cycle-actions{margin-inline-start:auto!important;padding:0!important}
.app-shell .sales-cycle-actions .button{height:24px!important;min-height:24px!important}

/* Cards and toolbars. */
.app-shell :is(
  #completed-orders-view,#order-details-view,#customers-view,#customer-forms-view,#quotations-view,
  #deliveries-view,#reports-view,#returns-view,#sales-invoices-view,#prices-view,#finance-view,
  #finance-receipts-view,#finance-paid-view,#editor-view,#preparation-work-view,#preparation-completed-view
) .content-card{
  margin:0 0 5px!important;
  border:1px solid var(--sales-ui-border)!important;
  border-radius:var(--sales-ui-radius)!important;
  background:var(--sales-ui-surface)!important;
  box-shadow:0 1px 3px rgba(22,43,64,.035)!important;
  overflow:hidden!important;
}
.app-shell :is(
  #completed-orders-view,#order-details-view,#customers-view,#customer-forms-view,#quotations-view,
  #deliveries-view,#reports-view,#returns-view,#sales-invoices-view,#prices-view,#finance-view,
  #finance-receipts-view,#finance-paid-view,#editor-view,#preparation-work-view,#preparation-completed-view
) .card-toolbar{
  min-height:34px!important;
  margin:0!important;
  padding:3px 7px!important;
  border:0!important;
  border-bottom:1px solid var(--sales-ui-line)!important;
  background:#fff!important;
  gap:7px!important;
}
.app-shell :is(
  #completed-orders-view,#order-details-view,#customers-view,#customer-forms-view,#quotations-view,
  #deliveries-view,#returns-view,#sales-invoices-view,#prices-view,#finance-view,#finance-receipts-view,
  #finance-paid-view,#preparation-work-view,#preparation-completed-view
) .card-toolbar h2{margin:0!important;color:#26384d!important;font-size:11px!important;line-height:1.2!important}
.app-shell :is(
  #completed-orders-view,#order-details-view,#customers-view,#customer-forms-view,#quotations-view,
  #deliveries-view,#returns-view,#sales-invoices-view,#prices-view,#finance-view,#finance-receipts-view,
  #finance-paid-view,#preparation-work-view,#preparation-completed-view
) .card-toolbar p{margin:1px 0 0!important;color:var(--sales-ui-muted)!important;font-size:7.5px!important}

/* Dense ERP tables: horizontal separators only, no boxed columns. */
.app-shell :is(
  #completed-orders-view,#order-details-view,#customers-view,#customer-forms-view,#quotations-view,
  #deliveries-view,#reports-view,#returns-view,#sales-invoices-view,#prices-view,#finance-view,
  #finance-receipts-view,#finance-paid-view,#editor-view,#preparation-work-view,#preparation-completed-view
) .table-wrap{
  margin:0!important;
  border:0!important;
  border-radius:0!important;
  background:#fff!important;
  overflow:auto!important;
  scrollbar-width:thin!important;
}
.app-shell :is(
  #completed-orders-view,#order-details-view,#customers-view,#customer-forms-view,#quotations-view,
  #deliveries-view,#reports-view,#returns-view,#sales-invoices-view,#prices-view,#finance-view,
  #finance-receipts-view,#finance-paid-view,#editor-view,#preparation-work-view,#preparation-completed-view
) table{width:100%!important;border-collapse:separate!important;border-spacing:0!important}
.app-shell :is(
  #completed-orders-view,#order-details-view,#customers-view,#customer-forms-view,#quotations-view,
  #deliveries-view,#reports-view,#returns-view,#sales-invoices-view,#prices-view,#finance-view,
  #finance-receipts-view,#finance-paid-view,#editor-view,#preparation-work-view,#preparation-completed-view
) table th{
  height:34px!important;
  padding:4px 8px!important;
  border:0!important;
  border-bottom:1px solid #dfe7ee!important;
  background:#f5f8fb!important;
  color:#526379!important;
  font-size:8.5px!important;
  font-weight:850!important;
  text-align:right!important;
  white-space:nowrap!important;
}
.app-shell :is(
  #completed-orders-view,#order-details-view,#customers-view,#customer-forms-view,#quotations-view,
  #deliveries-view,#reports-view,#returns-view,#sales-invoices-view,#prices-view,#finance-view,
  #finance-receipts-view,#finance-paid-view,#editor-view,#preparation-work-view,#preparation-completed-view
) table td{
  height:35px!important;
  padding:4px 8px!important;
  border:0!important;
  border-bottom:1px solid #edf1f4!important;
  background:#fff!important;
  color:#34475c!important;
  font-size:9px!important;
  vertical-align:middle!important;
}
.app-shell :is(
  #completed-orders-view,#order-details-view,#customers-view,#customer-forms-view,#quotations-view,
  #deliveries-view,#reports-view,#returns-view,#sales-invoices-view,#prices-view,#finance-view,
  #finance-receipts-view,#finance-paid-view,#editor-view,#preparation-work-view,#preparation-completed-view
) table tbody tr:nth-child(even) td{background:#fbfcfe!important}
.app-shell :is(
  #completed-orders-view,#order-details-view,#customers-view,#customer-forms-view,#quotations-view,
  #deliveries-view,#reports-view,#returns-view,#sales-invoices-view,#prices-view,#finance-view,
  #finance-receipts-view,#finance-paid-view,#editor-view,#preparation-work-view,#preparation-completed-view
) table tbody tr:hover td{background:#f3f8fe!important}

/* Controls and actions use the same scale as the orders register. */
.app-shell :is(
  #completed-orders-view,#order-details-view,#customers-view,#customer-forms-view,#quotations-view,
  #deliveries-view,#reports-view,#returns-view,#sales-invoices-view,#prices-view,#finance-view,
  #finance-receipts-view,#finance-paid-view,#editor-view,#preparation-work-view,#preparation-completed-view
) :is(input,select,.smart-select-input,.smart-select-trigger){
  height:29px!important;
  min-height:29px!important;
  border:1px solid #d6e0e9!important;
  border-radius:6px!important;
  background:#fff!important;
  color:#263b51!important;
  font-size:9px!important;
  box-shadow:none!important;
}
.app-shell :is(
  #completed-orders-view,#order-details-view,#customers-view,#customer-forms-view,#quotations-view,
  #deliveries-view,#reports-view,#returns-view,#sales-invoices-view,#prices-view,#finance-view,
  #finance-receipts-view,#finance-paid-view,#editor-view,#preparation-work-view,#preparation-completed-view
) textarea{
  min-height:52px!important;
  padding:6px 8px!important;
  border:1px solid #d6e0e9!important;
  border-radius:6px!important;
  background:#fff!important;
  color:#263b51!important;
  font-size:9px!important;
  box-shadow:none!important;
}
.app-shell :is(
  #completed-orders-view,#order-details-view,#customers-view,#customer-forms-view,#quotations-view,
  #deliveries-view,#reports-view,#returns-view,#sales-invoices-view,#prices-view,#finance-view,
  #finance-receipts-view,#finance-paid-view,#editor-view,#preparation-work-view,#preparation-completed-view
) :is(input,select,textarea,.smart-select-input):focus{
  border-color:#64a6e8!important;
  outline:0!important;
  box-shadow:0 0 0 2px rgba(8,124,240,.08)!important;
}
.app-shell :is(
  #completed-orders-view,#order-details-view,#customers-view,#customer-forms-view,#quotations-view,
  #deliveries-view,#reports-view,#returns-view,#sales-invoices-view,#prices-view,#finance-view,
  #finance-receipts-view,#finance-paid-view,#editor-view,#preparation-work-view,#preparation-completed-view
) .button{
  height:28px!important;
  min-height:28px!important;
  padding:0 10px!important;
  border-radius:6px!important;
  font-size:8.5px!important;
  line-height:1!important;
  white-space:nowrap!important;
}
.app-shell :is(
  #completed-orders-view,#order-details-view,#customers-view,#customer-forms-view,#quotations-view,
  #deliveries-view,#reports-view,#returns-view,#sales-invoices-view,#prices-view,#finance-view,
  #finance-receipts-view,#finance-paid-view,#editor-view,#preparation-work-view,#preparation-completed-view
) :is(.field,.compact-field)>span{margin:0 0 2px!important;color:#52667c!important;font-size:8px!important;font-weight:800!important}
.app-shell .table-search{height:29px!important;border:1px solid #d6e0e9!important;border-radius:6px!important;background:#fff!important}
.app-shell .table-search input{height:27px!important;border:0!important;box-shadow:none!important}
.app-shell .smart-select-input{padding-right:34px!important;padding-left:8px!important}

/* Lists, page filters and result labels. */
.app-shell :is(#completed-orders-view,#customers-view,#prices-view) :is(.completed-orders-filter,.toolbar-actions,.catalog-filter-strip,.catalog-heading-actions){
  display:flex!important;
  align-items:center!important;
  flex-wrap:wrap!important;
  gap:5px!important;
  min-height:32px!important;
  padding:2px 4px!important;
}
.app-shell #completed-orders-view .completed-orders-filter{display:grid!important;grid-template-columns:minmax(250px,1fr) 135px 135px auto auto!important;width:min(780px,100%)!important}
.app-shell #completed-orders-view .completed-orders-heading{min-width:145px!important}
.app-shell #completed-orders-view .orders-card>.table-wrap,
.app-shell #preparation-work-view .content-card>.table-wrap,
.app-shell #deliveries-view .content-card>.table-wrap{max-height:calc(100vh - 104px)!important}

/* Status, statistics and workflow information. */
.app-shell :is(
  #completed-orders-view,#customers-view,#customer-forms-view,#quotations-view,#deliveries-view,
  #returns-view,#sales-invoices-view,#finance-view,#finance-receipts-view,#finance-paid-view,
  #preparation-work-view,#preparation-completed-view
) .status{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  min-width:66px!important;height:23px!important;padding:0 8px!important;border:0!important;
  border-radius:999px!important;font-size:8px!important;font-weight:850!important;
}
.app-shell :is(#quotations-view,#finance-view) .stats-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(130px,1fr))!important;
  gap:5px!important;
  margin:0 0 5px!important;
}
.app-shell :is(#quotations-view,#finance-view) .stat-card{
  min-height:57px!important;
  padding:6px 8px!important;
  border:1px solid var(--sales-ui-border)!important;
  border-radius:7px!important;
  background:#fff!important;
  box-shadow:none!important;
}
.app-shell :is(#quotations-view,#finance-view) .stat-icon{width:28px!important;height:28px!important;font-size:13px!important}
.app-shell :is(#quotations-view,#finance-view) .stat-card span{font-size:8px!important}.app-shell :is(#quotations-view,#finance-view) .stat-card strong{font-size:14px!important}.app-shell :is(#quotations-view,#finance-view) .stat-card small{font-size:7px!important}
.app-shell #deliveries-view .workflow-banner{min-height:34px!important;margin:0 0 4px!important;padding:4px 7px!important;border:1px solid #dbe7f1!important;border-radius:6px!important;background:#f7fbff!important}
.app-shell #deliveries-view .workflow-banner :is(strong,span){font-size:8.5px!important}
.app-shell #customer-forms-view .workflow-rule{min-height:34px!important;margin:0 0 5px!important;padding:5px 8px!important;border-radius:6px!important;font-size:8.5px!important}

/* Sales order editor: keep its workflow, apply the compact reference rhythm. */
.app-shell #editor-view .document-header{position:sticky!important;top:0!important;z-index:20!important;background:#fff!important}
.app-shell #editor-view .editor-layout{gap:6px!important}
.app-shell #editor-view .editor-main{gap:5px!important}
.app-shell #editor-view .form-card{padding:0!important}
.app-shell #editor-view .section-title{min-height:34px!important;padding:4px 7px!important;border-bottom:1px solid var(--sales-ui-line)!important;background:#fff!important}
.app-shell #editor-view .section-title h2{margin:0!important;font-size:11px!important}.app-shell #editor-view .section-title p{margin:1px 0 0!important;font-size:7.5px!important;color:var(--sales-ui-muted)!important}
.app-shell #editor-view .section-icon{width:24px!important;height:24px!important;border-radius:6px!important;font-size:11px!important}
.app-shell #editor-view .order-head-grid{gap:5px!important;padding:6px!important}
.app-shell #editor-view .order-creator-field{min-height:46px!important;padding:4px 7px!important;border:1px solid #dce5ee!important;border-radius:6px!important;background:#f8fafc!important}
.app-shell #editor-view .lines-table-wrap{max-height:calc(100vh - 270px)!important;border:0!important}
.app-shell #editor-view .add-line-wide{min-height:28px!important;margin:4px!important;border-color:#9ec8ee!important;border-radius:6px!important;background:#f4f9ff!important;font-size:8.5px!important}
.app-shell #editor-view .summary-card,.app-shell #editor-view .timeline-card{padding:7px!important}
.app-shell #editor-view .summary-heading h2,.app-shell #editor-view .timeline-card h2{font-size:11px!important}.app-shell #editor-view .summary-row{min-height:27px!important;padding:3px 0!important;font-size:8.5px!important}
.app-shell #editor-view .timeline-item{min-height:34px!important}.app-shell #editor-view .timeline-item :is(strong,span){font-size:8px!important}

/* Product and pricing workspace receives the same compact hierarchy. */
.app-shell #prices-view .catalog-heading-actions{justify-content:flex-start!important;margin:0 0 4px!important;border:1px solid var(--sales-ui-border)!important;border-radius:6px!important;background:#fff!important}
.app-shell #prices-view .catalog-list-filter{display:flex!important;align-items:center!important;gap:4px!important;min-width:155px!important}
.app-shell #prices-view .catalog-list-filter>span{font-size:8px!important;font-weight:800!important;white-space:nowrap!important}
.app-shell #prices-view .catalog-tree-card>.table-wrap{max-height:calc(100vh - 145px)!important}
.app-shell #prices-view .catalog-title-block :is(h2,span){margin:0!important}

/* Reports remain richer, but share field, card and table proportions. */
.app-shell #reports-view .report-filterbar{display:grid!important;grid-template-columns:145px 145px minmax(220px,1fr) auto!important;gap:5px!important;padding:5px!important}
.app-shell #reports-view .sales-kpi-grid{gap:5px!important;margin:0 0 5px!important}.app-shell #reports-view .sales-kpi{min-height:64px!important;padding:7px 9px!important;border:1px solid var(--sales-ui-border)!important;border-radius:7px!important;box-shadow:none!important}
.app-shell #reports-view .sales-kpi span{font-size:8px!important}.app-shell #reports-view .sales-kpi strong{font-size:15px!important}.app-shell #reports-view .sales-kpi small{font-size:7px!important}
.app-shell #reports-view .sales-report-layout{gap:5px!important}.app-shell #reports-view .analytics-heading{min-height:36px!important;padding:5px 7px!important;border-bottom:1px solid var(--sales-ui-line)!important}.app-shell #reports-view .analytics-heading h2{font-size:11px!important}.app-shell #reports-view .analytics-heading p{font-size:7.5px!important}

/* Detail views: compact data blocks and clear table hierarchy. */
.app-shell #order-details-view .order-detail-header{display:flex!important;align-items:center!important;justify-content:space-between!important}
.app-shell #order-details-view .document-title{gap:6px!important}.app-shell #order-details-view .document-header-actions{display:flex!important;align-items:center!important;gap:4px!important;flex-wrap:wrap!important}
.app-shell #order-detail-content :is(.document-summary,.order-detail-summary,.detail-summary,.document-meta-grid){gap:5px!important;padding:6px!important}
.app-shell #order-detail-content :is(.document-summary>div,.order-detail-summary>div,.detail-summary>div,.document-meta-grid>div){min-height:42px!important;padding:5px 7px!important;border:1px solid var(--sales-ui-border)!important;border-radius:6px!important;background:#fff!important}

/* Sales dialogs and detail overlays. */
:is(
  #customer-modal,#agent-customers-modal,#customer-report-modal,#customer-request-modal,#quotation-modal,
  #delivery-modal,#delivery-detail-modal,#return-modal,#price-modal,#price-list-modal,#invoice-modal,
  #cutting-create-modal,#cutting-preview-modal,#preparation-modal,#sales-invoice-editor-modal,
  #new-sales-invoice-modal,#invoice-detail-modal,#receipt-detail-modal,#receipt-modal
).modal-layer{
  padding:12px!important;
  background:rgba(10,26,43,.56)!important;
  backdrop-filter:blur(1.5px)!important;
  font-family:Tahoma,"Segoe UI",Arial,sans-serif!important;
}
:is(
  #customer-modal,#agent-customers-modal,#customer-report-modal,#customer-request-modal,#quotation-modal,
  #delivery-modal,#delivery-detail-modal,#return-modal,#price-modal,#price-list-modal,#invoice-modal,
  #cutting-create-modal,#cutting-preview-modal,#preparation-modal,#sales-invoice-editor-modal,
  #new-sales-invoice-modal,#invoice-detail-modal,#receipt-detail-modal,#receipt-modal
).modal-layer .modal-card{
  width:min(760px,calc(100vw - 24px))!important;
  max-width:calc(100vw - 24px)!important;
  max-height:calc(100vh - 24px)!important;
  margin:0!important;
  border:1px solid #d5e0e9!important;
  border-radius:10px!important;
  background:#fbfcfe!important;
  box-shadow:0 24px 70px rgba(8,25,43,.28)!important;
  overflow:auto!important;
}
:is(
  #agent-customers-modal,#customer-report-modal,#customer-request-modal,#delivery-modal,#delivery-detail-modal,
  #cutting-preview-modal,#preparation-modal,#sales-invoice-editor-modal,#invoice-detail-modal,#receipt-detail-modal
).modal-layer .modal-card{width:min(1180px,calc(100vw - 24px))!important}
:is(
  #customer-modal,#agent-customers-modal,#customer-report-modal,#customer-request-modal,#quotation-modal,
  #delivery-modal,#delivery-detail-modal,#return-modal,#price-modal,#price-list-modal,#invoice-modal,
  #cutting-create-modal,#cutting-preview-modal,#preparation-modal,#sales-invoice-editor-modal,
  #new-sales-invoice-modal,#invoice-detail-modal,#receipt-detail-modal,#receipt-modal
).modal-layer .modal-header{
  position:sticky!important;top:0!important;z-index:15!important;
  min-height:45px!important;padding:6px 10px!important;
  border:0!important;border-bottom:1px solid var(--sales-ui-line)!important;
  background:#fff!important;box-shadow:none!important;
}
:is(
  #customer-modal,#agent-customers-modal,#customer-report-modal,#customer-request-modal,#quotation-modal,
  #delivery-modal,#delivery-detail-modal,#return-modal,#price-modal,#price-list-modal,#invoice-modal,
  #cutting-create-modal,#cutting-preview-modal,#preparation-modal,#sales-invoice-editor-modal,
  #new-sales-invoice-modal,#invoice-detail-modal,#receipt-detail-modal,#receipt-modal
).modal-layer .modal-header h2{margin:0!important;color:var(--sales-ui-ink)!important;font-size:14px!important;line-height:1.2!important}
:is(
  #customer-modal,#agent-customers-modal,#customer-report-modal,#customer-request-modal,#quotation-modal,
  #delivery-modal,#delivery-detail-modal,#return-modal,#price-modal,#price-list-modal,#invoice-modal,
  #cutting-create-modal,#cutting-preview-modal,#preparation-modal,#sales-invoice-editor-modal,
  #new-sales-invoice-modal,#invoice-detail-modal,#receipt-detail-modal,#receipt-modal
).modal-layer .modal-header :is(p,.eyebrow){margin:1px 0 0!important;color:var(--sales-ui-muted)!important;font-size:7.5px!important}
:is(
  #customer-modal,#agent-customers-modal,#customer-report-modal,#customer-request-modal,#quotation-modal,
  #delivery-modal,#delivery-detail-modal,#return-modal,#price-modal,#price-list-modal,#invoice-modal,
  #cutting-create-modal,#cutting-preview-modal,#preparation-modal,#sales-invoice-editor-modal,
  #new-sales-invoice-modal,#invoice-detail-modal,#receipt-detail-modal,#receipt-modal
).modal-layer .modal-header>.icon-button{width:27px!important;height:27px!important;border:1px solid #e0e7ee!important;border-radius:6px!important;background:#fff!important;color:#52667a!important;font-size:15px!important}
:is(
  #customer-modal,#agent-customers-modal,#customer-report-modal,#customer-request-modal,#quotation-modal,
  #delivery-modal,#delivery-detail-modal,#return-modal,#price-modal,#price-list-modal,#invoice-modal,
  #cutting-create-modal,#cutting-preview-modal,#preparation-modal,#sales-invoice-editor-modal,
  #new-sales-invoice-modal,#invoice-detail-modal,#receipt-detail-modal,#receipt-modal
).modal-layer :is(form,.cutting-create-body,#cutting-preview-content,#delivery-detail-content,#invoice-detail-content,#receipt-detail-content){padding:7px!important}
:is(
  #customer-modal,#agent-customers-modal,#customer-report-modal,#customer-request-modal,#quotation-modal,
  #delivery-modal,#delivery-detail-modal,#return-modal,#price-modal,#price-list-modal,#invoice-modal,
  #cutting-create-modal,#cutting-preview-modal,#preparation-modal,#sales-invoice-editor-modal,
  #new-sales-invoice-modal,#invoice-detail-modal,#receipt-detail-modal,#receipt-modal
).modal-layer .modal-form{gap:5px 7px!important;padding:0!important}
:is(
  #customer-modal,#agent-customers-modal,#customer-report-modal,#customer-request-modal,#quotation-modal,
  #delivery-modal,#delivery-detail-modal,#return-modal,#price-modal,#price-list-modal,#invoice-modal,
  #cutting-create-modal,#cutting-preview-modal,#preparation-modal,#sales-invoice-editor-modal,
  #new-sales-invoice-modal,#invoice-detail-modal,#receipt-detail-modal,#receipt-modal
).modal-layer .field{gap:2px!important;min-width:0!important}
:is(
  #customer-modal,#agent-customers-modal,#customer-report-modal,#customer-request-modal,#quotation-modal,
  #delivery-modal,#delivery-detail-modal,#return-modal,#price-modal,#price-list-modal,#invoice-modal,
  #cutting-create-modal,#cutting-preview-modal,#preparation-modal,#sales-invoice-editor-modal,
  #new-sales-invoice-modal,#invoice-detail-modal,#receipt-detail-modal,#receipt-modal
).modal-layer .field>span{margin:0!important;color:#50657a!important;font-size:8.5px!important;font-weight:800!important}
:is(
  #customer-modal,#agent-customers-modal,#customer-report-modal,#customer-request-modal,#quotation-modal,
  #delivery-modal,#delivery-detail-modal,#return-modal,#price-modal,#price-list-modal,#invoice-modal,
  #cutting-create-modal,#cutting-preview-modal,#preparation-modal,#sales-invoice-editor-modal,
  #new-sales-invoice-modal,#invoice-detail-modal,#receipt-detail-modal,#receipt-modal
).modal-layer :is(input,select,.smart-select-input,.smart-select-trigger){
  height:31px!important;min-height:31px!important;padding-block:3px!important;
  border:1px solid #d5e0e9!important;border-radius:6px!important;background:#fff!important;
  color:#263b51!important;font-size:9px!important;box-shadow:none!important;
}
:is(
  #customer-modal,#agent-customers-modal,#customer-report-modal,#customer-request-modal,#quotation-modal,
  #delivery-modal,#delivery-detail-modal,#return-modal,#price-modal,#price-list-modal,#invoice-modal,
  #cutting-create-modal,#cutting-preview-modal,#preparation-modal,#sales-invoice-editor-modal,
  #new-sales-invoice-modal,#invoice-detail-modal,#receipt-detail-modal,#receipt-modal
).modal-layer textarea{min-height:52px!important;padding:5px 7px!important;border:1px solid #d5e0e9!important;border-radius:6px!important;background:#fff!important;font-size:9px!important}
:is(
  #customer-modal,#agent-customers-modal,#customer-report-modal,#customer-request-modal,#quotation-modal,
  #delivery-modal,#delivery-detail-modal,#return-modal,#price-modal,#price-list-modal,#invoice-modal,
  #cutting-create-modal,#cutting-preview-modal,#preparation-modal,#sales-invoice-editor-modal,
  #new-sales-invoice-modal,#invoice-detail-modal,#receipt-detail-modal,#receipt-modal
).modal-layer .smart-select-input{padding-right:34px!important;padding-left:8px!important}
:is(
  #customer-modal,#agent-customers-modal,#customer-report-modal,#customer-request-modal,#quotation-modal,
  #delivery-modal,#delivery-detail-modal,#return-modal,#price-modal,#price-list-modal,#invoice-modal,
  #cutting-create-modal,#cutting-preview-modal,#preparation-modal,#sales-invoice-editor-modal,
  #new-sales-invoice-modal,#invoice-detail-modal,#receipt-detail-modal,#receipt-modal
).modal-layer .smart-select-list{max-height:230px!important;padding:3px!important;border:1px solid #cddae5!important;border-radius:7px!important;box-shadow:0 14px 32px rgba(17,42,65,.19)!important}
:is(
  #customer-modal,#agent-customers-modal,#customer-report-modal,#customer-request-modal,#quotation-modal,
  #delivery-modal,#delivery-detail-modal,#return-modal,#price-modal,#price-list-modal,#invoice-modal,
  #cutting-create-modal,#cutting-preview-modal,#preparation-modal,#sales-invoice-editor-modal,
  #new-sales-invoice-modal,#invoice-detail-modal,#receipt-detail-modal,#receipt-modal
).modal-layer .smart-select-option{min-height:28px!important;padding:5px 7px!important;border-radius:5px!important;font-size:9px!important}

/* Modal tables and generated detail content. */
:is(
  #customer-modal,#agent-customers-modal,#customer-report-modal,#customer-request-modal,#quotation-modal,
  #delivery-modal,#delivery-detail-modal,#return-modal,#price-modal,#price-list-modal,#invoice-modal,
  #cutting-create-modal,#cutting-preview-modal,#preparation-modal,#sales-invoice-editor-modal,
  #new-sales-invoice-modal,#invoice-detail-modal,#receipt-detail-modal,#receipt-modal
).modal-layer .table-wrap{margin:5px 0!important;border:1px solid var(--sales-ui-border)!important;border-radius:7px!important;background:#fff!important;overflow:auto!important}
:is(
  #customer-modal,#agent-customers-modal,#customer-report-modal,#customer-request-modal,#quotation-modal,
  #delivery-modal,#delivery-detail-modal,#return-modal,#price-modal,#price-list-modal,#invoice-modal,
  #cutting-create-modal,#cutting-preview-modal,#preparation-modal,#sales-invoice-editor-modal,
  #new-sales-invoice-modal,#invoice-detail-modal,#receipt-detail-modal,#receipt-modal
).modal-layer table{width:100%!important;border-collapse:separate!important;border-spacing:0!important}
:is(
  #customer-modal,#agent-customers-modal,#customer-report-modal,#customer-request-modal,#quotation-modal,
  #delivery-modal,#delivery-detail-modal,#return-modal,#price-modal,#price-list-modal,#invoice-modal,
  #cutting-create-modal,#cutting-preview-modal,#preparation-modal,#sales-invoice-editor-modal,
  #new-sales-invoice-modal,#invoice-detail-modal,#receipt-detail-modal,#receipt-modal
).modal-layer table th{height:33px!important;padding:4px 7px!important;border:0!important;border-bottom:1px solid #dfe7ee!important;background:#f4f7fa!important;color:#506277!important;font-size:8.5px!important;text-align:right!important;white-space:nowrap!important}
:is(
  #customer-modal,#agent-customers-modal,#customer-report-modal,#customer-request-modal,#quotation-modal,
  #delivery-modal,#delivery-detail-modal,#return-modal,#price-modal,#price-list-modal,#invoice-modal,
  #cutting-create-modal,#cutting-preview-modal,#preparation-modal,#sales-invoice-editor-modal,
  #new-sales-invoice-modal,#invoice-detail-modal,#receipt-detail-modal,#receipt-modal
).modal-layer table td{height:34px!important;padding:4px 7px!important;border:0!important;border-bottom:1px solid #edf1f4!important;background:#fff!important;color:#34475c!important;font-size:9px!important}
:is(
  #customer-modal,#agent-customers-modal,#customer-report-modal,#customer-request-modal,#quotation-modal,
  #delivery-modal,#delivery-detail-modal,#return-modal,#price-modal,#price-list-modal,#invoice-modal,
  #cutting-create-modal,#cutting-preview-modal,#preparation-modal,#sales-invoice-editor-modal,
  #new-sales-invoice-modal,#invoice-detail-modal,#receipt-detail-modal,#receipt-modal
).modal-layer .modal-actions{
  position:sticky!important;bottom:0!important;z-index:15!important;
  min-height:45px!important;margin:5px -7px -7px!important;padding:6px 10px!important;
  border:0!important;border-top:1px solid var(--sales-ui-line)!important;
  background:#fff!important;gap:4px!important;
}
:is(
  #customer-modal,#agent-customers-modal,#customer-report-modal,#customer-request-modal,#quotation-modal,
  #delivery-modal,#delivery-detail-modal,#return-modal,#price-modal,#price-list-modal,#invoice-modal,
  #cutting-create-modal,#cutting-preview-modal,#preparation-modal,#sales-invoice-editor-modal,
  #new-sales-invoice-modal,#invoice-detail-modal,#receipt-detail-modal,#receipt-modal
).modal-layer .modal-actions .button{height:29px!important;min-height:29px!important;padding:0 11px!important;border-radius:6px!important;font-size:8.5px!important}

/* Cutting selectors and document summaries. */
#cutting-create-modal .cutting-orders-dropdown{margin-top:5px!important;border:1px solid #d5e0e9!important;border-radius:7px!important;background:#fff!important}
#cutting-create-modal .cutting-orders-dropdown>summary{min-height:34px!important;padding:5px 8px!important;font-size:9px!important}
#cutting-create-modal .cutting-order-options{max-height:350px!important;padding:4px!important}
#cutting-preview-modal #cutting-preview-content,#preparation-modal .preparation-order-summary{margin:0!important;padding:7px!important;background:#fbfcfe!important}
#delivery-modal .delivery-order-preview{margin:6px 0!important;border:1px solid var(--sales-ui-border)!important;border-radius:7px!important;background:#fff!important}
#sales-invoice-editor-modal .invoice-editor-head{gap:5px!important;padding:7px!important}
#sales-invoice-editor-modal .invoice-editor-lines{max-height:calc(100vh - 235px)!important}
#sales-invoice-editor-modal .invoice-editor-total{min-height:38px!important;margin:5px 7px!important;padding:6px 9px!important;border:1px solid #b9d4ed!important;border-radius:7px!important;background:#f3f9ff!important}

/* Sales invoice entry needs the full viewport because its adaptive item grid can
   contain measurement, weight and pricing columns at the same time. */
body > #sales-invoice-editor-modal.modal-layer{
  padding:6px!important;
  align-items:center!important;
}
body > #sales-invoice-editor-modal.modal-layer .sales-invoice-editor-modal{
  width:calc(100vw - 12px)!important;
  max-width:calc(100vw - 12px)!important;
  height:calc(100vh - 12px)!important;
  max-height:calc(100vh - 12px)!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
}
body > #sales-invoice-editor-modal .modal-header{
  flex:0 0 auto!important;
  padding-inline:14px!important;
}
body > #sales-invoice-editor-modal #sales-invoice-editor-form{
  flex:1 1 auto!important;
  min-height:0!important;
  display:flex!important;
  flex-direction:column!important;
  padding:8px 10px!important;
  overflow:hidden!important;
}
body > #sales-invoice-editor-modal .invoice-editor-head{
  flex:0 0 auto!important;
  grid-template-columns:145px 145px 165px minmax(280px,1fr)!important;
  padding:0!important;
  gap:7px!important;
}
body > #sales-invoice-editor-modal .invoice-editor-lines{
  flex:1 1 auto!important;
  min-height:220px!important;
  max-height:none!important;
  margin:5px 0!important;
  overflow:auto!important;
  scrollbar-gutter:stable both-edges;
}
body > #sales-invoice-editor-modal .invoice-editor-lines table{
  width:max-content!important;
  min-width:100%!important;
  table-layout:auto!important;
}
body > #sales-invoice-editor-modal .invoice-editor-lines thead{
  position:sticky!important;
  top:0!important;
  z-index:6!important;
}
body > #sales-invoice-editor-modal .invoice-editor-lines th,
body > #sales-invoice-editor-modal .invoice-editor-lines td{
  height:38px!important;
  padding:5px 6px!important;
  font-size:10px!important;
  line-height:1.35!important;
  vertical-align:middle!important;
}
body > #sales-invoice-editor-modal .invoice-editor-lines :is(th,td):nth-child(1){min-width:38px!important;width:38px!important;text-align:center!important}
body > #sales-invoice-editor-modal .invoice-editor-lines :is(th,td):nth-child(2){min-width:88px!important;width:88px!important}
body > #sales-invoice-editor-modal .invoice-editor-lines :is(th,td):nth-child(3){min-width:190px!important;width:210px!important;white-space:normal!important}
body > #sales-invoice-editor-modal .invoice-editor-lines :is(th,td):nth-child(4){min-width:72px!important;width:72px!important}
body > #sales-invoice-editor-modal .invoice-editor-lines :is(th,td):nth-child(5){min-width:62px!important;width:62px!important;text-align:center!important}
body > #sales-invoice-editor-modal .invoice-editor-lines :is(th,td):nth-child(6),
body > #sales-invoice-editor-modal .invoice-editor-lines :is(th,td):nth-child(7),
body > #sales-invoice-editor-modal .invoice-editor-lines :is(th,td):nth-child(8){min-width:72px!important;width:72px!important;text-align:center!important}
body > #sales-invoice-editor-modal .invoice-editor-lines :is(th,td):nth-child(9){min-width:66px!important;width:66px!important;text-align:center!important}
body > #sales-invoice-editor-modal .invoice-editor-lines :is(th,td):nth-child(n+10){min-width:88px!important;text-align:center!important}
body > #sales-invoice-editor-modal .invoice-editor-lines input{
  width:78px!important;
  height:30px!important;
  min-height:30px!important;
  font-size:10px!important;
}
body > #sales-invoice-editor-modal .invoice-editor-lines td:nth-child(3) input{
  width:100%!important;
  min-width:160px!important;
}
body > #sales-invoice-editor-modal :is(.invoice-db-summary,.invoice-editor-total,#sales-invoice-editor-message,.modal-actions){
  flex:0 0 auto!important;
}
body > #sales-invoice-editor-modal .modal-actions{
  margin:5px -10px -8px!important;
  padding-inline:12px!important;
}

@media(max-width:1100px){
  .app-shell #completed-orders-view .completed-orders-filter{grid-template-columns:minmax(220px,1fr) 125px 125px auto!important}
  .app-shell #completed-orders-view #clear-completed-orders-filter{display:none!important}
  .app-shell #reports-view .report-filterbar{grid-template-columns:1fr 1fr!important}
  .app-shell :is(#quotations-view,#finance-view) .stats-grid{grid-template-columns:repeat(2,minmax(130px,1fr))!important}
}
@media(max-width:760px){
  .app-shell :is(
    #completed-orders-view,#order-details-view,#customers-view,#customer-forms-view,#quotations-view,
    #deliveries-view,#reports-view,#returns-view,#sales-invoices-view,#prices-view,#finance-view,
    #finance-receipts-view,#finance-paid-view,#editor-view,#preparation-work-view,#preparation-completed-view
  ){padding-inline:5px!important}
  .app-shell #completed-orders-view .completed-orders-filter{grid-template-columns:1fr 1fr!important;width:100%!important}
  .app-shell :is(#quotations-view,#finance-view) .stats-grid{grid-template-columns:1fr!important}
  :is(
    #customer-modal,#agent-customers-modal,#customer-report-modal,#customer-request-modal,#quotation-modal,
    #delivery-modal,#delivery-detail-modal,#return-modal,#price-modal,#price-list-modal,#invoice-modal,
    #cutting-create-modal,#cutting-preview-modal,#preparation-modal,#sales-invoice-editor-modal,
    #new-sales-invoice-modal,#invoice-detail-modal,#receipt-detail-modal,#receipt-modal
  ).modal-layer{padding:5px!important}
  :is(
    #customer-modal,#agent-customers-modal,#customer-report-modal,#customer-request-modal,#quotation-modal,
    #delivery-modal,#delivery-detail-modal,#return-modal,#price-modal,#price-list-modal,#invoice-modal,
    #cutting-create-modal,#cutting-preview-modal,#preparation-modal,#sales-invoice-editor-modal,
    #new-sales-invoice-modal,#invoice-detail-modal,#receipt-detail-modal,#receipt-modal
  ).modal-layer .modal-card{width:calc(100vw - 10px)!important;max-width:calc(100vw - 10px)!important;max-height:calc(100vh - 10px)!important}
}

/* Persistent workspace title and stable scroll rails.
   Reserving scrollbar space prevents the application width from jumping between screens. */
html{overflow-y:scroll!important;scrollbar-gutter:stable!important}
body{min-height:100vh!important;overflow-x:hidden!important}
body:has(#app-shell:not(.hidden)){overflow-y:hidden!important}
.app-shell{height:100vh!important;min-height:100vh!important;overflow:hidden!important}
.app-shell .main-area{
  height:100vh!important;
  min-height:0!important;
  overflow-x:hidden!important;
  overflow-y:scroll!important;
  scrollbar-gutter:stable!important;
}
.app-shell .sidebar{height:100vh!important;overflow:hidden!important}
.app-shell .sidebar .nav-list{
  min-height:0!important;
  overflow-x:hidden!important;
  overflow-y:scroll!important;
  scrollbar-gutter:stable!important;
}
.app-shell :is(.table-wrap,.smart-select-list,.modal-card,.unified-filter-results){scrollbar-gutter:stable!important}

/* The former global toolbar is now a title-only bar; name and path are supplied by setView(). */
.app-shell .topbar{
  position:sticky!important;
  top:0!important;
  z-index:70!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  width:100%!important;
  height:39px!important;
  min-height:39px!important;
  padding:3px 11px!important;
  border:0!important;
  border-bottom:1px solid #e4eaf0!important;
  background:#fff!important;
  box-shadow:0 1px 3px rgba(18,40,61,.045)!important;
}
.app-shell .topbar>.global-search,.app-shell .topbar>.top-actions{display:none!important}
.app-shell .topbar-context{display:flex!important;align-items:center!important;width:100%!important;min-width:0!important}
.app-shell .workspace-title-copy{display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:center!important;gap:1px!important;min-width:0!important}
.app-shell #workspace-page-title{display:block!important;margin:0!important;color:#17283d!important;font-size:14px!important;font-weight:850!important;line-height:1.05!important;white-space:nowrap!important}
.app-shell .workspace-title-copy .crumbs{display:flex!important;align-items:center!important;gap:4px!important;color:#8390a0!important;font-size:6.8px!important;line-height:1!important;white-space:nowrap!important}
.app-shell .workspace-title-copy .crumbs i{color:#b2bdc7!important;font-style:normal!important}
.app-shell .workspace-title-copy #page-crumb{color:#66788b!important;font-weight:750!important}

/* Screen-local title copies are redundant once the persistent title is visible. Keep their actions only. */
.app-shell #orders-view>.orders-reference-heading{display:none!important}
.app-shell .page-view>.page-heading>div:first-child{display:none!important}
.app-shell .page-view>.page-heading{
  min-height:0!important;
  height:auto!important;
  margin:0 0 3px!important;
  padding:0!important;
  border:0!important;
  justify-content:flex-end!important;
}
.app-shell .page-view>.page-heading:not(:has(>.button,>.document-actions,>.warehouse-heading-actions,>.reports-actions)){display:none!important}
.app-shell :is(.customer-directory-tabs,.catalog-tabs,.warehouse-module-tabs,.inventory-content-nav,.accounting-inner-tabs,.sales-order-module-tabs,.accounting-module-tabs,.approval-tabs)>.unified-tab-actions{
  display:flex!important;
  align-items:center!important;
  gap:3px!important;
  margin-right:auto!important;
  margin-left:0!important;
  padding-right:5px!important;
  white-space:nowrap!important;
}
.app-shell :is(.customer-directory-tabs,.catalog-tabs,.warehouse-module-tabs,.inventory-content-nav,.accounting-inner-tabs,.sales-order-module-tabs,.accounting-module-tabs,.approval-tabs)>.unified-tab-actions :is(.button,a.button){
  height:24px!important;
  min-height:24px!important;
  padding:0 9px!important;
  border-radius:5px!important;
  font-size:8.5px!important;
}

/* One compact entry point for every row action, matching the sales-order register. */
.app-shell .sales-row-actions{position:relative!important;display:inline-block!important;z-index:3!important;vertical-align:middle!important}
.app-shell .sales-row-actions[open]{z-index:90!important}
.app-shell tr:has(.sales-row-actions[open]) td{position:relative!important;z-index:80!important}
.app-shell .sales-row-actions>summary{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  width:70px!important;
  height:26px!important;
  min-height:26px!important;
  padding:0 8px!important;
  border:1px solid #afd0ef!important;
  border-radius:5px!important;
  background:#eef7ff!important;
  color:#0874df!important;
  font-size:8.5px!important;
  font-weight:850!important;
  cursor:pointer!important;
  list-style:none!important;
  user-select:none!important;
}
.app-shell .sales-row-actions>summary::-webkit-details-marker{display:none!important}
.app-shell .sales-row-actions>summary b{font-size:12px!important;line-height:1!important}
.app-shell .sales-row-action-menu{
  position:absolute!important;
  top:calc(100% + 4px)!important;
  left:0!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  gap:1px!important;
  width:180px!important;
  padding:5px!important;
  border:1px solid #d4dfe9!important;
  border-radius:7px!important;
  background:#fff!important;
  box-shadow:0 13px 30px rgba(18,40,61,.22)!important;
}
.app-shell .sales-row-action-menu :is(button,a.button,a.small-action,.doc-action){
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  width:100%!important;
  height:29px!important;
  min-height:29px!important;
  margin:0!important;
  padding:0 8px!important;
  border:0!important;
  border-radius:5px!important;
  background:#fff!important;
  color:#344a60!important;
  box-shadow:none!important;
  font-size:8.5px!important;
  text-align:right!important;
  text-decoration:none!important;
  white-space:nowrap!important;
}
.app-shell .sales-row-action-menu :is(button,a.button,a.small-action,.doc-action):hover{background:#eef6ff!important;color:#0874df!important}
.app-shell .sales-row-action-menu :is(button,a.button,a.small-action,.doc-action).danger{color:#b52e3c!important}
.app-shell .sales-row-action-menu :is(button,a.button,a.small-action,.doc-action):disabled{display:none!important}
.app-shell tbody tr:nth-last-child(-n+3) .sales-row-action-menu{top:auto!important;bottom:calc(100% + 4px)!important}
/* Row actions float over the page. They must never resize a register or become
   clipped by its scrolling table container. Coordinates are supplied by the
   shared action-menu controller. */
html body .app-shell details.sales-row-actions>.sales-row-action-menu.action-menu-floating{
  position:fixed!important;
  top:var(--action-menu-top)!important;
  bottom:auto!important;
  left:var(--action-menu-left)!important;
  right:auto!important;
  margin:0!important;
  max-height:var(--action-menu-max-height)!important;
  overflow:auto!important;
  z-index:10000!important;
  pointer-events:auto!important;
}

/* Keep rails visible and consistently narrow everywhere. */
.app-shell .main-area::-webkit-scrollbar,.app-shell .sidebar .nav-list::-webkit-scrollbar,.app-shell .table-wrap::-webkit-scrollbar,.modal-layer .modal-card::-webkit-scrollbar{width:7px;height:7px}
.app-shell .main-area::-webkit-scrollbar-track,.app-shell .sidebar .nav-list::-webkit-scrollbar-track,.app-shell .table-wrap::-webkit-scrollbar-track,.modal-layer .modal-card::-webkit-scrollbar-track{background:#edf2f6}
.app-shell .main-area::-webkit-scrollbar-thumb,.app-shell .sidebar .nav-list::-webkit-scrollbar-thumb,.app-shell .table-wrap::-webkit-scrollbar-thumb,.modal-layer .modal-card::-webkit-scrollbar-thumb{background:#aebdca;border-radius:999px;border:1px solid #edf2f6}
.app-shell .sidebar .nav-list::-webkit-scrollbar-thumb{background:#48647c;border-color:#14283c}
