/* 2026-08 large, readable ERP interface */
:root {
  --canvas: #eef3f1;
  --paper: #ffffff;
  --line: #d7e2de;
  --ink: #172f35;
  --muted: #657a80;
  --teal: #147a6e;
  --teal-dark: #0e625a;
  --mint: #e3f3ef;
}

html { font-size: 17px; }
body { font-size: 15px; line-height: 1.55; background: linear-gradient(135deg, #f4f7f6 0%, #eaf0ee 100%); }
button, input, select { min-height: 40px; }
button { transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease; }
button:hover { transform: translateY(-1px); }
button:focus-visible, input:focus-visible, select:focus-visible { outline: 3px solid #53bba73b; outline-offset: 2px; }

.app-shell { grid-template-columns: 260px minmax(0, 1fr); }
.sidebar { width: 260px; padding: 18px 22px 22px; grid-template-columns: 52px 1fr; background: linear-gradient(180deg, #123b45 0%, #0b2933 58%, #08232c 100%); box-shadow: 10px 0 30px #09263014; }
.sidebar-tools { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.sidebar-tools button { display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 36px; border: 1px solid #ffffff1f; border-radius: 9px; color: #d6e5e6; background: #ffffff0a; font-size: 12px; font-weight: 700; }
.sidebar-tools button:hover { border-color: #58bba9; color: #fff; background: #ffffff14; }
.sidebar-tools button span { color: #72d1c1; font-size: 17px; }
.sidebar-tools button .sidebar-tool-label { color: inherit; font-size: inherit; }
.brand-mark { width: 48px; height: 48px; border-radius: 13px; font-size: 25px; }
.brand-copy { padding: 1px 0 0 12px; }
.brand-copy strong { font-size: 18px; letter-spacing: 1.6px; }
.brand-copy span { font-size: 11px; letter-spacing: 2px; }
.sidebar nav { gap: 9px; margin-top: 34px; overflow-y: auto; scrollbar-width: none; }
.sidebar nav::-webkit-scrollbar { display: none; }
.sidebar nav button { border: 0; color: #c2d3d7; }
.nav-group { display: grid; gap: 4px; }
.sidebar nav .nav-group-toggle { width: 100%; height: 54px; border-radius: 12px; padding: 0 13px; display: grid; grid-template-columns: 28px 1fr 18px; align-items: center; gap: 10px; text-align: left; background: #ffffff08; font-size: 16px; }
.sidebar nav .nav-group-toggle:hover, .sidebar nav .nav-group-toggle.active { color: #fff; background: #ffffff13; }
.nav-group-icon { width: 28px; height: 28px; border-radius: 8px; display: grid; place-items: center; color: #72d1c1; background: #ffffff0d; font-size: 18px; }
.nav-group-toggle strong { font-weight: 800; letter-spacing: 1px; }
.nav-chevron { width: 18px; color: #89aeb3; font-size: 16px; text-align: center; transition: transform .18s ease; }
.nav-group.open .nav-chevron { transform: rotate(90deg); }
.nav-submenu { display: grid; gap: 3px; padding: 2px 0 4px 18px; }
.sidebar nav .nav-subitem { position: relative; width: 100%; height: 43px; border-radius: 9px; padding: 0 10px; display: flex; align-items: center; gap: 10px; text-align: left; color: #a9c0c5; background: transparent; font-size: 13px; font-weight: 600; }
.sidebar nav .nav-subitem > span { width: 22px; color: #72a8ad; text-align: center; font-size: 16px; }
.sidebar nav .nav-subitem > .nav-item-label { width: auto; min-width: 0; color: inherit; text-align: left; font-size: inherit; }
.sidebar nav .nav-subitem:hover, .sidebar nav .nav-subitem.active { color: #fff; background: linear-gradient(90deg, #36a89528, #ffffff08); }
.sidebar nav .nav-subitem.active::before { content: ""; position: absolute; left: -18px; width: 3px; height: 25px; border-radius: 0 3px 3px 0; background: #4bc0ac; }
.sidebar nav em { min-width: 24px; height: 24px; border-radius: 12px; font-size: 12px; }
.sidebar-foot { grid-template-columns: 42px 1fr auto; gap: 12px; padding-top: 20px; }
.avatar { width: 42px; height: 42px; font-size: 16px; }
.sidebar-foot strong { font-size: 14px; }
.sidebar-foot span { font-size: 11px; line-height: 1.4; }
.sidebar-foot button { min-height: 36px; padding: 0 6px; font-size: 12px; }
.app-shell > main { grid-column: 2; }

@media (min-width: 901px) {
  .sidebar { grid-template-rows: 36px 52px minmax(0, 1fr) auto; row-gap: 14px; overflow: hidden; }
  .sidebar-tools { grid-row: 1; }
  .brand-mark, .brand-copy { grid-row: 2; }
  .sidebar nav { grid-row: 3; grid-column: 1 / -1; align-self: stretch; height: 100%; min-height: 0; margin-top: 0; padding: 10px 6px 0 0; scrollbar-width: thin; scrollbar-color: #4bc0ac66 transparent; }
  .sidebar-foot { grid-row: 4; grid-column: 1 / -1; }
  .sidebar nav::-webkit-scrollbar { display: block; width: 5px; }
  .sidebar nav::-webkit-scrollbar-thumb { border-radius: 5px; background: #4bc0ac66; }
}

.topbar { height: 94px; padding: 0 42px; background: #fffffff5; box-shadow: 0 5px 24px #102f3a0a; }
.topbar p { margin-bottom: 8px; font-size: 13px; }
.topbar h1 { font-size: 27px; }
.top-actions { gap: 12px; }
.api-state, .icon-button, .help-button { height: 44px; border-radius: 11px; font-size: 13px; box-shadow: 0 2px 8px #173a4510; }
.api-state { padding: 0 15px; }
.api-state i { width: 9px; height: 9px; }
.api-state b { padding: 3px 7px; border-radius: 6px; }
.icon-button { width: 44px; display: grid; place-items: center; }
.icon-button.todo-button { width: 54px; height: 54px; position: relative; color: #173f49; border: 2px solid #cbdad7; background: #fff; }
.icon-button.todo-button.has-todos { color: #b42318; border-color: #ef9a91; box-shadow: 0 4px 16px #b4231824; }
.icon-button.todo-button .todo-badge { position: absolute; top: -8px; right: -8px; display: grid; place-items: center; min-width: 23px; height: 23px; padding: 0 5px; border: 2px solid #fff; border-radius: 12px; background: #d92d20; color: #fff; font: 800 11px/1 Arial, sans-serif; box-shadow: 0 2px 8px #b4231840; }
.help-button { padding: 0 15px; }
.help-button span { font-size: 13px; }

.page-content { max-width: 1660px; padding: 36px 42px 64px; }
.intro-row { margin-bottom: 28px; }
.eyebrow { font-size: 11px; letter-spacing: 2.2px; }
.intro-row h2 { margin: 10px 0 9px; font-size: 34px; }
.intro-row p { font-size: 15px; }
.today-card { min-width: 310px; padding: 17px 21px; border-radius: 13px; border-left-width: 4px; box-shadow: 0 10px 30px #14363e12; }
.today-card > span { font-size: 13px; }
.today-card strong { font-size: 30px; }
.today-card small, .today-card em { font-size: 11px; }

.panel { border-radius: 16px; box-shadow: 0 10px 30px #12343e0b; overflow: hidden; }
.workspace-grid { grid-template-columns: minmax(360px, 405px) minmax(680px, 1fr); gap: 24px; }
.upload-column { gap: 24px; }
.upload-panel { padding: 25px; }
.panel-title { margin-bottom: 21px; }
.panel-title > div, .review-head > div:first-child { gap: 14px; }
.panel-title > div > span, .step-no { font-size: 12px; }
.panel-title h3, .review-head h3 { font-size: 20px; }
.panel-title p, .review-head p { margin-top: 7px; font-size: 13px; }
.text-button, .more-button { min-height: 34px; font-size: 13px; font-weight: 700; }
.dropzone { min-height: 225px; padding: 28px 18px; border-radius: 13px; border-width: 2px; }
.upload-icon { width: 54px; height: 54px; font-size: 29px; }
.dropzone strong { font-size: 16px; }
.dropzone p { margin: 9px 0 16px; font-size: 12px; }
.file-types { gap: 7px; }
.file-types span { border-radius: 6px; padding: 4px 9px; font-size: 10px; }
.recognize-button { height: 50px; border-radius: 11px; margin-top: 16px; font-size: 15px; }
.recognize-button em { font-size: 11px; }
.queue-panel { padding: 20px 0 10px; }
.panel-title.compact { padding: 0 22px; }
.doc-list { max-height: 360px; }
.doc-card { grid-template-columns: 44px minmax(0, 1fr) auto; gap: 13px; padding: 14px 21px; }
.file-icon { width: 40px; height: 44px; border-radius: 7px; font-size: 10px; }
.doc-meta strong { font-size: 13px; }
.doc-meta span { font-size: 11px; }
.stage { border-radius: 7px; padding: 5px 8px; font-size: 11px; }

.review-panel { min-height: 760px; }
.review-head { min-height: 88px; padding: 23px 27px 18px; }
.confidence { gap: 8px; font-size: 12px; }
.confidence strong { font-size: 15px; }
.document-toolbar { min-height: 60px; height: auto; padding: 0 27px; }
.document-type-tabs button { padding: 0 17px; font-size: 13px; }
.sync-state { border-radius: 7px; padding: 5px 9px; font-size: 11px; }
.delete-current-button { height: 36px; border-radius: 8px; padding: 0 13px; font-size: 12px; }
.warning-strip { grid-template-columns: 28px 1fr auto; gap: 12px; margin: 20px 27px 0; padding: 14px 15px; border-radius: 11px; }
.warning-strip > span { width: 27px; height: 27px; }
.warning-strip strong, .warning-strip p, .warning-strip button { font-size: 12px; }
.form-section { padding: 22px 27px 0; }
.section-label { margin-bottom: 16px; }
.section-label > span { font-size: 13px; }
.section-label button { min-height: 32px; font-size: 12px; }
.field-grid { gap: 15px; }
.field-grid label > span { margin-bottom: 7px; font-size: 12px; font-weight: 600; }
.field-grid input, .field-grid select { height: 44px; border-radius: 9px; padding: 0 12px; font-size: 14px; }
.item-table-wrap { border-radius: 10px; }
table { min-width: 720px; }
th { padding: 12px; font-size: 12px; font-weight: 700; }
td { padding: 12px; font-size: 13px; }
td input { font-size: 13px; }
td small { font-size: 11px; }
.review-footer { margin-top: 25px; padding: 20px 27px; }
.amounts { gap: 28px; }
.amounts span { font-size: 12px; }
.amounts strong { font-size: 20px; }
.secondary-button, .create-button { height: 44px; border-radius: 10px; padding: 0 19px; font-size: 13px; }
.ocr-upload-button { display: inline-flex; align-items: center; justify-content: center; cursor: pointer; white-space: nowrap; }
.ocr-upload-button.is-busy { opacity: .65; pointer-events: none; }
.empty-review { min-height: 620px; font-size: 15px; }

.bottom-grid { grid-template-columns: 1fr; gap: 24px; margin-top: 24px; }
.bottom-head { padding: 21px 24px 16px; }
.bottom-head span { font-size: 11px; }
.bottom-head h3 { font-size: 18px; }
.bottom-head button { min-height: 34px; font-size: 12px; }
.overview-cards { padding: 22px; }
.overview-cards > div { grid-template-columns: 44px auto auto 1fr; padding: 7px 17px; }
.overview-cards i { width: 41px; height: 41px; font-size: 13px; }
.overview-cards span, .overview-cards em { font-size: 11px; }
.overview-cards strong { font-size: 25px; }
.recent-row { grid-template-columns: 36px minmax(220px, 1fr) 110px 110px 110px 70px 52px; gap: 12px; padding: 13px 22px; }
.mini-doc { width: 34px; height: 34px; border-radius: 8px; }
.recent-number-button { min-height: 0; border: 0; padding: 0; color: #17323a; background: transparent; font-size: 13px; font-weight: 800; text-align: left; text-decoration: underline; text-decoration-color: #73b8ad; text-underline-offset: 3px; }
.recent-number-button:hover { color: var(--teal); transform: none; }
.recent-row div small { font-size: 10px; }
.recent-row > b { font-size: 13px; }
.recent-row em, .recent-row time { font-size: 10px; }
.recent-row time, .recent-operator { color: #657a80; font-size: 11px; white-space: nowrap; }
.delete-record-button { height: 34px; font-size: 11px; }

.module-page { gap: 22px; }
.module-hero { min-height: 168px; padding: 31px 35px; border-radius: 18px; background: radial-gradient(circle at 82% 15%, #258479 0%, #174b53 28%, #102f3a 72%); box-shadow: 0 14px 40px #102a3626; }
.module-hero h2 { margin: 10px 0 8px; font-size: 34px; }
.module-hero p { font-size: 15px; }
.module-actions { gap: 11px; }
.module-stats { gap: 18px; }
.module-stats > div { min-height: 132px; padding: 22px 24px; border-radius: 14px; border-top-width: 4px; box-shadow: 0 8px 24px #12343e0a; }
.module-stats span, .module-stats small { font-size: 12px; }
.module-stats strong { margin: 10px 0 7px; font-size: 27px; }
.module-table-head { min-height: 82px; padding: 18px 24px; }
.module-table-head span { font-size: 11px; }
.module-table-head h3 { font-size: 19px; }
.module-table-head > div:last-child { flex-wrap: wrap; justify-content: flex-end; gap: 9px; }
.module-table-head input { min-width: 155px; height: 40px; border-radius: 9px; padding: 9px 12px; font-size: 13px; }
.module-table-head button { height: 40px; border-radius: 9px; padding: 0 15px; font-size: 12px; font-weight: 700; }
.module-table-wrap th, .module-table-wrap td { padding: 16px 20px; font-size: 13px; }
.module-table-wrap tbody tr:hover { background: #f1f8f6; }
.module-delete-button { height: 36px; border-radius: 8px; padding: 0 13px; font-size: 12px; }
.module-edit-button { height: 36px; border: 1px solid #9dbbb5; border-radius: 8px; padding: 0 13px; color: #285e56; background: #fff; font-size: 12px; font-weight: 800; }
.module-edit-button:hover { color: #fff; background: #287f72; border-color: #287f72; }
.module-row-actions { display: flex; align-items: center; gap: 7px; min-width: max-content; }
.module-table-wrap td:last-child { width: auto; min-width: 150px; }
.module-action-button { min-width: 88px; height: 38px; border: 1px solid #82beb3; border-radius: 9px; padding: 0 14px; color: #0f7167; background: #eaf7f4; font-size: 12px; font-weight: 800; }
.module-action-button:hover { color: #fff; background: var(--teal); border-color: var(--teal); box-shadow: 0 7px 16px #147a6e29; }
.module-shortcuts { gap: 15px; }
.module-shortcuts button { grid-template-columns: 43px 1fr; column-gap: 13px; min-height: 96px; padding: 17px; border-radius: 13px; box-shadow: 0 6px 20px #12343e08; }
.module-shortcuts span { width: 43px; height: 43px; font-size: 20px; }
.module-shortcuts strong { font-size: 14px; }
.module-shortcuts small { margin-top: 5px; font-size: 11px; }

.ledger-table-wrap { overflow-x: auto; padding-bottom: 8px; scrollbar-color: #6ca99f #e8efed; scrollbar-width: auto; }
.ledger-table-wrap::-webkit-scrollbar { height: 13px; }
.ledger-table-wrap::-webkit-scrollbar-track { background: #e8efed; border-radius: 8px; }
.ledger-table-wrap::-webkit-scrollbar-thumb { background: #6ca99f; border: 3px solid #e8efed; border-radius: 8px; }
.module-table-wrap .ledger-table { width: max-content; min-width: 100%; table-layout: fixed; }
.module-table-wrap .ledger-table th, .module-table-wrap .ledger-table td { min-width: 128px; max-width: 260px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.module-table-wrap .ledger-table .locked-column { position: sticky; z-index: 2; background: #fff; box-shadow: 1px 0 #dbe5e2; }
.module-table-wrap .ledger-table th.locked-column { z-index: 4; background: #f5f7f6; }
.module-table-wrap .ledger-table .locked-document-no { left: 0; width: 190px; min-width: 190px; max-width: 190px; }
.module-table-wrap .ledger-table .locked-document-date { left: 190px; width: 130px; min-width: 130px; max-width: 130px; }
.module-table-wrap .ledger-table .locked-customer { left: 320px; width: 220px; min-width: 220px; max-width: 220px; box-shadow: 8px 0 14px #173b4412; }
.module-table-wrap .ledger-table tbody tr:hover .locked-column { background: #f1f8f6; }
.module-table-wrap .sales-ledger-table .locked-customer { left: 0; width: 190px; min-width: 190px; max-width: 190px; box-shadow: 1px 0 #dbe5e2; }
.module-table-wrap .sales-ledger-table .locked-document-date { left: 190px; width: 120px; min-width: 120px; max-width: 120px; box-shadow: 8px 0 14px #173b4412; }
.module-table-wrap .closed-loop-table .locked-document-no { left: 0; width: 190px; min-width: 190px; max-width: 190px; }
.module-table-wrap .closed-loop-table .locked-customer { left: 190px; width: 220px; min-width: 220px; max-width: 220px; box-shadow: 1px 0 #dbe5e2; }
.module-table-wrap .closed-loop-table .locked-progress { left: 410px; width: 160px; min-width: 160px; max-width: 160px; box-shadow: 8px 0 14px #173b4412; }
.workflow-progress { display: flex; align-items: center; gap: 8px; min-width: 130px; }
.workflow-progress > span { width: 88px; height: 8px; overflow: hidden; border-radius: 999px; background: #e4ecea; }
.workflow-progress i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, #d6a54d, var(--teal)); }
.workflow-progress strong { min-width: 34px; color: #176f67; font-size: 11px; text-align: right; }
.module-table-wrap .sales-ledger-table .sales-group-row td { background: #eaf6f3; font-weight: 700; }
.module-table-wrap .sales-ledger-table .sales-group-row:hover td { background: #dff1ed; }
.sales-group-toggle { display: flex; align-items: flex-start; gap: 7px; width: 100%; padding: 0; border: 0; color: #21433f; background: transparent; text-align: left; cursor: pointer; }
.sales-group-toggle > b { color: var(--teal); font-size: 15px; line-height: 18px; }
.sales-group-toggle > span, .sales-group-child-label > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.sales-group-number-toggle strong { display: block; overflow: hidden; color: #155f57; font-size: 13px; text-overflow: ellipsis; }
.sales-group-toggle small, .sales-group-child-label small { display: block; margin-top: 3px; overflow: hidden; color: #5d7772; font-size: 10px; font-weight: 600; text-overflow: ellipsis; }
.sales-group-toggle .sales-search-match, .sales-group-child-label .sales-search-match { color: #1769c2; font-weight: 800; }
.sales-group-child-label { display: flex; align-items: flex-start; gap: 7px; padding-left: 9px; }
.sales-group-child-label > b { color: #79a69e; }
.module-table-wrap .sales-ledger-table .sales-group-child-row.is-date-match td { background: #fff9e9; }
.module-table-wrap .sales-ledger-table .sales-group-child-row.is-date-match:hover td { background: #fff3d3; }
.module-table-wrap .sales-ledger-table .sales-group-child-row.is-date-match small { color: #a26800; }
.module-table-wrap .sales-ledger-table .sales-group-child-row.is-date-outside td { color: #7e8e92; background: #fafcfc; }
.module-table-wrap .sales-ledger-table .sales-group-child-row.is-date-outside:hover td { background: #f3f7f6; }
.module-table-wrap .closed-loop-table .sales-group-child-row.is-date-match td { background: #fbfcf9; }
.module-table-wrap .closed-loop-table .sales-group-child-row.is-date-match:hover td { background: #f3f8f5; }
.module-table-wrap .sales-ledger-table th:last-child,
.module-table-wrap .sales-ledger-table td:last-child { position: sticky; right: 0; z-index: 3; min-width: 150px; background: #fff; box-shadow: -8px 0 14px #173b4412; }
.module-table-wrap .sales-ledger-table th:last-child { z-index: 5; background: #f5f7f6; }
.module-table-wrap .sales-ledger-table tbody tr:hover td:last-child { background: #f1f8f6; }
.module-table-wrap .sales-ledger-table .sales-group-row td:last-child { background: #eaf6f3; }
.module-table-wrap .sales-ledger-table .sales-group-row:hover td:last-child { background: #dff1ed; }
.module-table-wrap .sales-ledger-table .sales-group-child-row.is-date-match td:last-child { background: #fff9e9; }
.module-table-wrap .sales-ledger-table .sales-group-child-row.is-date-outside td:last-child { background: #fafcfc; }
.module-table-wrap .closed-loop-table th:last-child, .module-table-wrap .closed-loop-table td:last-child { position: static; right: auto; z-index: auto; min-width: 128px; box-shadow: none; }
.module-table-wrap .closed-loop-table th:last-child { background: #f5f7f6; }
.module-table-wrap .closed-loop-table td:last-child { background: #fff; }
.module-table-wrap .closed-loop-table .sales-group-row td, .module-table-wrap .closed-loop-table .sales-group-row td:last-child { background: #f1f3f4; }
.module-table-wrap .closed-loop-table tbody tr.sales-group-row:hover td, .module-table-wrap .closed-loop-table tbody tr.sales-group-row:hover td:last-child { background: #e6e9ec; }
.module-table-wrap .closed-loop-table .sales-group-child-row.is-date-match td:last-child { background: #fbfcf9; }
.module-table-wrap .closed-loop-table .sales-group-child-row.is-date-outside td:last-child { background: #fafcfc; }
.voucher-count-button { display: inline-grid; place-items: center; min-width: 32px; height: 30px; border: 1px solid #86b9b1; border-radius: 999px; padding: 0 9px; color: #0f756b; background: #eaf7f4; font-size: 12px; font-weight: 800; cursor: pointer; }
.voucher-count-button:hover, .voucher-count-button:focus-visible { border-color: #167c73; outline: 2px solid #56a89b38; background: #dff2ee; }
.closed-loop-multi-value { position: relative; display: block; min-width: 0; }
.closed-loop-multi-value::after { content: "▼"; position: absolute; top: 50%; right: 9px; translate: 0 -50%; color: #287f72; font-size: 9px; pointer-events: none; }
.closed-loop-multi-value select { appearance: none; width: 100%; min-height: 34px; overflow: hidden; border: 1px solid #cddbd7; border-radius: 8px; padding: 5px 27px 5px 9px; color: #294047; background: #f8fbfa; font-size: 13px; text-overflow: ellipsis; cursor: pointer; }
.actual-sales-customer-select select { border-color: #90bdb4; background: #f1faf7; font-weight: 700; }
.closed-loop-document-number { display: block; width: 100%; overflow: visible; font-variant-numeric: tabular-nums; white-space: nowrap; }
.closed-loop-document-number.is-long { font-size: 11px; letter-spacing: -.2px; }
.closed-loop-document-number.is-very-long { width: 128%; font-size: 9px; letter-spacing: -.35px; transform: scaleX(.78); transform-origin: left center; }
.voucher-list-modal { position: relative; width: min(560px, 100%); max-height: calc(100vh - 48px); overflow: auto; border-top: 5px solid var(--teal); border-radius: 16px; padding: 30px; background: #fff; box-shadow: 0 28px 80px #071b2247; }
.voucher-list-modal .close-button { position: absolute; top: 16px; right: 16px; display: grid; place-items: center; width: 34px; height: 34px; border: 0; border-radius: 50%; color: #65797e; background: #edf3f1; font-size: 20px; line-height: 1; cursor: pointer; }
.voucher-list-modal .close-button:hover, .voucher-list-modal .close-button:focus-visible { outline: 2px solid #56a89b38; color: #176f65; background: #dfeeea; }
.voucher-list-modal > span { color: var(--teal); letter-spacing: 1.5px; font-size: 11px; font-weight: 800; }
.voucher-list-modal h2 { margin: 7px 42px 20px 0; color: #20343b; font: 700 24px Georgia, Microsoft YaHei, serif; }
.voucher-list-modal ol { display: grid; gap: 9px; margin: 0; padding: 0; list-style: none; }
.voucher-list-modal li { min-width: 0; }
.voucher-list-modal li button { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; align-items: center; gap: 11px; width: 100%; border: 1px solid #d9e5e2; border-radius: 10px; padding: 10px 12px; color: inherit; background: #f8fbfa; text-align: left; cursor: pointer; }
.voucher-list-modal li button:hover, .voucher-list-modal li button:focus-visible { border-color: #65a99f; outline: 2px solid #56a89b38; background: #edf8f6; }
.voucher-list-modal li button:disabled { cursor: default; opacity: .58; }
.voucher-list-modal li b { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; color: #fff; background: var(--teal); font-size: 11px; }
.voucher-list-modal li span { overflow: hidden; color: #29484d; font-size: 13px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.voucher-list-modal li strong { color: #087b6e; font-size: 12px; white-space: nowrap; }
.voucher-preview-modal { position: relative; display: grid; grid-template-rows: auto minmax(0, 1fr); width: min(1080px, calc(100vw - 48px)); height: min(820px, calc(100vh - 48px)); overflow: hidden; border-top: 5px solid var(--teal); border-radius: 16px; padding: 22px; background: #fff; box-shadow: 0 28px 80px #071b2247; }
.voucher-preview-modal .close-button { position: absolute; top: 14px; right: 14px; z-index: 2; display: grid; place-items: center; width: 34px; height: 34px; border: 0; border-radius: 50%; color: #65797e; background: #edf3f1; font-size: 20px; cursor: pointer; }
.voucher-preview-head { display: flex; align-items: center; gap: 16px; min-width: 0; padding: 0 48px 16px 0; }
.voucher-preview-head button { min-height: 36px; border: 1px solid #89b9b1; border-radius: 8px; padding: 0 12px; color: #176f65; background: #edf8f6; font-weight: 700; cursor: pointer; white-space: nowrap; }
.voucher-preview-head h2 { overflow: hidden; margin: 0; color: #20343b; font-size: 17px; text-overflow: ellipsis; white-space: nowrap; }
.voucher-preview-modal > img { width: 100%; height: 100%; min-height: 0; border-radius: 10px; object-fit: contain; background: #e7eceb; }
.product-table-wrap { overflow-x: auto; padding-bottom: 8px; scrollbar-color: #6ca99f #e8efed; scrollbar-width: auto; }
.product-table-wrap::-webkit-scrollbar { height: 13px; }
.product-table-wrap::-webkit-scrollbar-track { background: #e8efed; border-radius: 8px; }
.product-table-wrap::-webkit-scrollbar-thumb { background: #6ca99f; border: 3px solid #e8efed; border-radius: 8px; }
.module-table-wrap .product-table { width: 100%; min-width: 1320px; table-layout: fixed; }
.module-table-wrap .product-table th, .module-table-wrap .product-table td { padding: 16px 14px; min-width: 110px; max-width: 240px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.module-table-wrap .product-table th:nth-child(2), .module-table-wrap .product-table td:nth-child(2) { width: 480px; min-width: 480px; max-width: 480px; }
.module-table-wrap .product-table td:nth-child(2) { white-space: normal; overflow: visible; text-overflow: clip; overflow-wrap: anywhere; word-break: break-word; line-height: 1.55; }
.module-table-wrap .product-table th:nth-child(4), .module-table-wrap .product-table td:nth-child(4) { width: 210px; min-width: 210px; max-width: 210px; }
.module-table-wrap .product-table th:last-child, .module-table-wrap .product-table td:last-child { position: sticky; right: 0; z-index: 2; width: 160px; min-width: 160px; background: #fff; box-shadow: -8px 0 14px #173b4412; }
.module-table-wrap .product-table th:last-child { z-index: 3; background: #f5f7f6; }
.module-table-wrap .product-table tbody tr:hover td:last-child { background: #f1f8f6; }
.product-master-fields .sale-edit-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.product-master-fields input[readonly] { background: #eef4f2; color: #315e58; font-weight: 750; }
.customer-table-wrap { overflow-x: auto; padding-bottom: 8px; scrollbar-color: #6ca99f #e8efed; scrollbar-width: auto; }
.customer-table-wrap::-webkit-scrollbar { height: 13px; }
.customer-table-wrap::-webkit-scrollbar-track { background: #e8efed; border-radius: 8px; }
.customer-table-wrap::-webkit-scrollbar-thumb { background: #6ca99f; border: 3px solid #e8efed; border-radius: 8px; }
.module-table-wrap .customer-table { width: 100%; min-width: 1080px; table-layout: fixed; }
.module-table-wrap .customer-table th, .module-table-wrap .customer-table td { padding: 16px 12px; min-width: 100px; max-width: 260px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.module-table-wrap .customer-table th:nth-child(2), .module-table-wrap .customer-table td:nth-child(2) { width: 240px; min-width: 240px; max-width: 240px; }
.module-table-wrap .customer-table th:last-child, .module-table-wrap .customer-table td:last-child { position: sticky; right: 0; z-index: 2; width: 220px; min-width: 220px; text-align: center; background: #fff; box-shadow: -8px 0 14px #173b4412; }
.customer-table .module-row-actions { min-width: 0; justify-content: center; gap: 10px; }
.customer-table .module-row-actions button { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; min-width: 64px; height: 38px; padding: 0 12px; }
.module-table-wrap .customer-table th:last-child { z-index: 3; background: #f5f7f6; }
.module-table-wrap .customer-table tbody tr:hover td:last-child { background: #f1f8f6; }
.module-table-head .product-add-button { border-color: #147a6e; color: #fff; background: #147a6e; }
.module-table-head .product-add-button:hover { color: #fff; background: #0e625a; }
.module-table-head .product-import-button { display: inline-flex; align-items: center; justify-content: center; height: 40px; border: 1px solid #82aaa3; border-radius: 9px; padding: 0 15px; color: #246b61; background: #f4fbf9; font-size: 14px; font-weight: 800; cursor: pointer; }
.module-table-head .product-import-button:hover { border-color: #147a6e; background: #e8f6f2; }
.module-table-head .product-import-button.is-busy { opacity: .65; cursor: wait; }
.logistics-code-field { position: relative; display: block; }
.logistics-code-field::after { content: "▼"; position: absolute; top: 50%; right: 10px; translate: 0 -50%; color: #287f72; font-size: 9px; pointer-events: none; }
.logistics-code-select { appearance: none; width: 100%; min-height: 34px; border: 1px solid #cddbd7; border-radius: 8px; padding: 5px 28px 5px 9px; color: #294047; background: #f8fbfa; font-size: 12px; cursor: pointer; }
.module-pagination { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 20px; border-top: 1px solid #e2e9e7; background: #fafcfb; color: #6d7e83; font-size: 12px; }
.module-pagination > div { display: flex; align-items: center; gap: 10px; }
.module-pagination button { min-height: 34px; border: 1px solid #cddbd7; border-radius: 8px; padding: 0 13px; color: #285e56; background: #fff; font-size: 12px; font-weight: 700; }
.module-pagination button:disabled { opacity: .45; cursor: default; }
.module-pagination strong { min-width: 48px; text-align: center; color: #294047; }
.module-page-size { display: flex; align-items: center; gap: 6px; white-space: nowrap; }
.module-page-size select { min-height: 34px; border: 1px solid #cddbd7; border-radius: 8px; padding: 0 28px 0 10px; color: #285e56; background: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.closed-loop-filter-panel { overflow: hidden; border-top: 4px solid #147a6e; }
.closed-loop-filter-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 22px 14px; border-bottom: 1px solid #e2e9e7; }
.closed-loop-filter-heading span { color: #147a6e; font-size: 11px; font-weight: 800; letter-spacing: 1.2px; }
.closed-loop-filter-heading h2 { margin: 4px 0 0; color: #20343b; font-size: 20px; }
.closed-loop-filter-heading button { min-height: 40px; border: 0; border-radius: 9px; padding: 0 18px; color: #fff; background: #147a6e; font-size: 13px; font-weight: 800; }
.closed-loop-filter-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 13px 16px; padding: 18px 22px; }
.closed-loop-filter-grid label { display: grid; gap: 7px; min-width: 0; color: #40565d; font-size: 12px; font-weight: 700; }
.closed-loop-filter-grid input { width: 100%; min-width: 0; min-height: 40px; border: 1px solid #ccd9d6; border-radius: 8px; padding: 8px 11px; color: #20343b; background: #fbfdfc; font: inherit; font-weight: 500; }
.closed-loop-filter-grid input:focus { outline: 2px solid #75c4b5; outline-offset: 1px; border-color: #147a6e; }
.closed-loop-date-filter { grid-column: span 2; }
.closed-loop-date-filter > div { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; }
.closed-loop-date-filter em { color: #708388; font-style: normal; font-weight: 500; }
.closed-loop-filter-footer { display: flex; align-items: center; justify-content: space-between; padding: 0 22px 18px; color: #6d7e83; font-size: 12px; }
.closed-loop-filter-footer button { min-height: 34px; border: 1px solid #cddbd7; border-radius: 8px; padding: 0 13px; color: #285e56; background: #fff; font-weight: 700; }
.closed-loop-table mark.closed-loop-filter-match { color: #0759bd; background: #dcecff; border-radius: 3px; padding: 1px 2px; font-weight: 800; }
.closed-loop-table select.closed-loop-filter-match, .closed-loop-table option.closed-loop-filter-match { color: #0759bd; background: #e8f2ff; font-weight: 800; }

.account-create-panel { padding: 30px; }
.account-form { gap: 20px; }
.account-form label { gap: 9px; font-size: 14px; }
.account-form input, .account-form select { min-height: 46px; border-radius: 10px; padding: 12px 14px; font-size: 15px; }
.account-form .create-button { height: 46px; }
.account-form .field-permissions { padding: 16px 18px; border-radius: 12px; gap: 19px; }
.account-form .field-permissions legend { font-size: 14px; }
.account-form .field-permissions label { font-size: 13px; }
.account-form .field-permissions input { min-height: 18px; width: 18px; }
.account-row-actions { display: flex; gap: 8px; }
.account-row-actions button { white-space: nowrap; }

.info-modal { width: min(520px, 100%); border-radius: 16px; padding: 34px; }
.info-modal > span { font-size: 11px; }
.info-modal h2 { font-size: 26px; }
.info-modal p { font-size: 14px; }
.toast { z-index: 300; border-radius: 12px; padding: 15px 20px; font-size: 14px; }

.clodop-install-dialog { width: min(600px, calc(100vw - 32px)); max-height: calc(100vh - 48px); margin: auto; overflow: auto; padding: 26px; border: 1px solid #c7dfdc; border-top: 4px solid #0e8176; border-radius: 18px; color: #21434b; background: #fff; box-shadow: 0 24px 80px #102d3c55; }
.clodop-install-dialog::backdrop { background: #102d3c99; }
.clodop-install-dialog header { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.clodop-install-dialog h2 { margin: 0; font-size: 22px; }
.clodop-install-dialog p, .clodop-install-dialog li { font-size: 15px; line-height: 1.7; }
.clodop-install-dialog ol { padding-left: 22px; }
.clodop-install-dialog li { margin: 10px 0; overflow-wrap: anywhere; }
.clodop-install-note { padding: 10px 14px; border-radius: 10px; background: #f0f7f6; }
.clodop-install-actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 18px 0 12px; }
.clodop-install-actions a { display: inline-flex; align-items: center; text-decoration: none; }
@media print { .clodop-install-dialog { display: none !important; } }
.sale-edit-modal { width: min(960px, 100%); max-height: calc(100vh - 40px); overflow: auto; border-top: 5px solid var(--teal); border-radius: 17px; padding: 34px; background: #fff; position: relative; box-shadow: 0 28px 80px #071b2247; }
.sale-edit-modal > span { color: var(--teal); letter-spacing: 1.8px; font-size: 11px; font-weight: 800; }
.sale-edit-modal h2 { margin: 8px 40px 3px 0; color: #20343b; font: 700 27px Georgia, Microsoft YaHei, serif; }
.sale-edit-modal > p { margin: 0 0 24px; color: var(--muted); font-size: 13px; }
.sale-edit-linked-button { position: absolute; top: 28px; right: 70px; margin: 0; min-height: 38px; }
.sale-edit-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.sale-edit-grid label { display: flex; flex-direction: column; gap: 7px; color: #52686e; font-size: 13px; font-weight: 700; }
.sale-edit-grid label.wide { grid-column: 1 / -1; }
.sale-edit-grid input, .sale-edit-grid select { width: 100%; min-height: 45px; border: 1px solid #cedbd7; border-radius: 10px; padding: 10px 12px; color: #1e373d; background: #fbfdfc; font-size: 14px; }
.sale-edit-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 25px; }
.document-edit-modal { width: min(920px, 100%); }
.invoice-file-panel { margin-top: 22px; border: 1px solid #d8e4e1; border-radius: 13px; padding: 16px; background: #f8fbfa; }
.invoice-file-panel > div:first-child { display: flex; flex-direction: column; gap: 4px; color: #27484e; }
.invoice-file-panel > div:first-child span { color: #6d8085; font-size: 12px; }
.invoice-file-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.invoice-file-actions > .invoice-file-open { display: inline-flex; align-items: center; min-height: 34px; border: 0; border-radius: 8px; padding: 0 13px; color: #fff; background: #17796e; font-size: 12px; font-weight: 800; cursor: pointer; }
.invoice-file-actions > span { color: #718388; font-size: 12px; }
.invoice-image-preview.compact img { max-height: 260px; }
.workflow-hint { margin-top: 18px; border-left: 4px solid #dda63c; border-radius: 8px; padding: 12px 14px; color: #775a20; background: #fff8e8; font-size: 13px; font-weight: 700; }
.master-data-edit-modal { padding-bottom: 26px; }
.master-data-section { margin-top: 18px; border: 1px solid #dbe5e2; border-radius: 13px; padding: 18px; background: #f9fbfa; }
.master-data-section h3 { margin: 0 0 15px; color: #24434a; font-size: 15px; }
.sale-edit-line-table { min-width: 780px; }
.sale-edit-line-table th:nth-child(1), .sale-edit-line-table td:nth-child(1) { width: 76px; }
.sale-edit-line-table th:nth-child(2), .sale-edit-line-table td:nth-child(2) { width: 180px; }
.sale-edit-line-table th:nth-child(3), .sale-edit-line-table td:nth-child(3) { width: 150px; }
.sale-edit-line-table th:nth-child(4), .sale-edit-line-table td:nth-child(4) { width: 130px; }
.sale-edit-live-preview { background: #eef5f4; }
.sale-edit-preview-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 14px; }
.sale-edit-preview-heading h3 { margin: 0 0 4px; }
.sale-edit-preview-heading p { margin: 0; color: var(--muted); font-size: 13px; }
.sale-edit-preview-heading strong { color: var(--teal); font-size: 20px; }
.sale-edit-preview-actions { display: flex; align-items: center; gap: 14px; }
.sale-edit-preview-stage { overflow: auto; padding: 18px; border: 1px solid #cbdeda; border-radius: 12px; background: #dce8e5; }
.sale-edit-preview-stage .sales-print-pages { width: 813px; margin: auto; }
.sale-edit-preview-stage .sales-print-sheet { margin: 0; box-shadow: 0 5px 20px #163f4930; }
.finance-settlement-modal { width: min(1180px, 100%); }
.sale-edit-with-history { width: min(1240px, 100%); }
.sale-edit-content { display: grid; grid-template-columns: minmax(0, 1fr) 230px; gap: 24px; align-items: start; }
.sale-edit-body { min-width: 0; }
.sale-operation-history { position: sticky; top: 0; padding: 16px 0 16px 8px; }
.sale-operation-history h3 { margin: 0 0 22px; font-size: 16px; color: #20343b; }
.sale-operation-history > p { color: #75878b; font-size: 13px; }
.sale-operation-timeline { list-style: none; margin: 0 0 0 5px; padding: 0; border-left: 1px solid #d0ddda; }
.sale-operation-timeline li { position: relative; display: grid; gap: 6px; padding: 0 0 26px 20px; font-size: 13px; }
.sale-operation-timeline li::before { content: ""; position: absolute; left: -4px; top: 5px; width: 7px; height: 7px; border-radius: 50%; background: var(--teal); }
.sale-operation-timeline li::after { content: ""; position: absolute; left: 3px; top: 8px; width: 11px; border-top: 1px solid #d0ddda; }
.sale-operation-timeline time, .sale-operation-timeline span { color: #75878b; font-size: 12px; }
.sale-operation-timeline strong { color: #334b50; font-weight: 500; line-height: 1.6; overflow-wrap: anywhere; }
@media screen and (max-width: 900px) {
  .sale-edit-content { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .sale-operation-history { position: static; border-top: 1px solid #e3ece9; padding-top: 20px; }
}
.finance-settlement-section { display: grid; gap: 16px; margin-top: 18px; border: 1px solid #cfdeda; border-radius: 14px; padding: 18px; background: #f7fbfa; }
.finance-amount-summary { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; }
.finance-amount-summary article { display: grid; gap: 7px; min-width: 0; border: 1px solid #d9e5e2; border-radius: 11px; padding: 13px; background: #fff; }
.finance-amount-summary span { color: #647a7f; font-size: 13px; }
.finance-amount-summary strong { color: #19383e; font-size: 18px; }
.finance-amount-summary .due { border-color: #71b6aa; background: #edf9f6; }
.finance-amount-summary .due strong, .finance-amount-summary .settled strong { color: #087b6e; }
.finance-amount-summary .remaining { border-color: #e8c178; background: #fff9ed; }
.finance-amount-summary .remaining strong { color: #a25f00; }
.finance-section-heading h3 { margin: 0 0 4px; color: #24434a; font-size: 18px; }
.finance-section-heading p { margin: 0; color: #708388; font-size: 13px; }
.finance-group-heading { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.receivable-group-card { display: grid; gap: 12px; margin: 15px 0; border: 1px solid #bcd8d2; border-radius: 12px; padding: 14px; background: #f8fcfb; }
.receivable-group-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.receivable-group-title strong { color: #173d43; }
.receivable-group-title span { color: #60787d; font-size: 13px; }
.receivable-group-members { display: grid; gap: 7px; }
.receivable-group-members > div { display: grid; grid-template-columns: 180px minmax(160px, 1fr) 120px 110px; align-items: center; gap: 10px; border-radius: 8px; padding: 10px 12px; background: #fff; font-size: 13px; }
.receivable-group-members > div.pending { opacity: .72; border: 1px dashed #c6d2cf; }
.receivable-group-members span { color: #60777c; }
.receivable-group-members strong { text-align: right; color: #173d43; }
.receivable-group-members em { color: #087b6e; font-style: normal; text-align: right; }
.receivable-group-members .pending em { color: #a25f00; }
.prepaid-apply-card { display: grid; grid-template-columns: minmax(240px, 1fr) minmax(190px, .7fr) auto; align-items: end; gap: 14px; margin: 15px 0; border: 1px solid #e3c27f; border-radius: 12px; padding: 14px; background: #fffaf0; }
.prepaid-apply-card > div { display: grid; gap: 4px; }
.prepaid-apply-card span, .prepaid-apply-card small { color: #6d7777; }
.prepaid-apply-card strong { color: #9a5a00; font-size: 20px; }
.prepaid-apply-card label { display: grid; gap: 6px; color: #445c60; font-size: 13px; }
.prepaid-apply-card input { width: 100%; }
.finance-subsidy-editor { min-width: 0; margin: 0; border: 0; padding: 0; }
.finance-subsidy-editor legend { margin-bottom: 7px; color: #5f470e; font-size: 14px; font-weight: 800; }
.finance-subsidy-restriction { margin: 0 0 8px; color: #a25f00; font-size: 13px; font-weight: 700; }
.finance-subsidy-note { margin: 0 0 8px; color: #397266; font-size: 13px; font-weight: 650; }
.finance-subsidy-editor:disabled .finance-subsidy-options { opacity: .55; }
.finance-flow-note { margin: 10px 0 16px; border-left: 4px solid #178577; padding: 10px 12px; color: #3e6166; background: #edf8f5; font-size: 14px; line-height: 1.6; }
.finance-flow-note.warning { border-left-color: #d98a20; color: #83530e; background: #fff8eb; }
.finance-subsidy-options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.finance-subsidy-option { display: grid; align-content: start; gap: 9px; min-width: 0; border: 1px solid #e4d8b5; border-radius: 10px; padding: 11px; background: #fffdf7; }
.finance-subsidy-option.selected { border-color: #d5ac43; background: #fff8e5; }
.finance-subsidy-option > label { display: flex; align-items: center; gap: 7px; color: #574821; font-size: 14px; font-weight: 700; }
.finance-subsidy-option input[type="checkbox"] { width: 17px; height: 17px; accent-color: var(--teal); }
.finance-subsidy-amount { display: grid !important; gap: 5px !important; color: #876719 !important; font-size: 12px !important; }
.finance-subsidy-amount span { display: flex; align-items: center; gap: 6px; }
.finance-subsidy-amount input { width: 100%; min-width: 0; height: 36px; border: 1px solid #d9c58e; border-radius: 7px; padding: 0 9px; color: #322a19; background: #fff; font-size: 14px; }
.finance-attachment-card { min-width: 0; overflow: hidden; border: 1px solid #b8d3ce; border-radius: 12px; background: #fff; }
.finance-attachment-controls { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 13px 15px; border-bottom: 1px solid #d5e4e1; background: #eef7f5; }
.finance-attachment-controls > div { display: grid; gap: 3px; }
.finance-attachment-controls span { color: #4d686d; font-size: 13px; font-weight: 800; }
.finance-attachment-controls strong { color: #087b6e; font-size: 18px; }
.finance-attachment-controls small { color: #74878b; }
.finance-attachment-preview { position: fixed; top: 0; left: -10000px; width: 209mm; height: 87mm; overflow: hidden; }
.finance-sales-attachment-print { width: 209mm; height: 87mm; overflow: hidden; margin: 0 auto; padding: 4mm 6mm 3mm; color: #202020; background: #fff; box-shadow: 0 5px 18px #153e4730; font-family: "SimSun", "Microsoft YaHei", sans-serif; }
.finance-attachment-title { text-align: center; }
.finance-attachment-title strong { display: block; font-size: 25px; letter-spacing: 1px; }
.finance-attachment-title span { display: block; margin-top: 1mm; font-size: 19px; font-weight: 700; letter-spacing: 4px; }
.finance-attachment-meta { width: 100%; margin: 2.5mm 0 1.5mm; border-collapse: collapse; font-size: 14px; line-height: 1.35; }
.finance-attachment-meta td { width: 50%; padding: 0; border: 0; }
.finance-attachment-meta td:last-child { text-align: right; }
.finance-attachment-number { font-family: Arial, "Microsoft YaHei", sans-serif; font-variant-numeric: tabular-nums; white-space: nowrap; }
.finance-attachment-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 12px; }
.finance-attachment-table th, .finance-attachment-table td { border: 1px solid #222; padding: 2.5px; text-align: center; vertical-align: middle; }
.finance-attachment-table th { height: 7mm; font-size: 13px; }
.finance-attachment-table tbody td { height: 10mm; }
.finance-attachment-table tfoot td { height: 7mm; font-weight: 700; }
.finance-attachment-table .product-cell { line-height: 1.35; }
.finance-attachment-table .col-seq { width: 5%; }.finance-attachment-table .col-product { width: 27%; }.finance-attachment-table .col-qty { width: 8%; }.finance-attachment-table .col-price { width: 10%; }.finance-attachment-table .col-sales { width: 11%; }.finance-attachment-table .col-red-envelope { width: 9%; }.finance-attachment-table .col-volume { width: 9%; }.finance-attachment-table .col-opening { width: 10%; }.finance-attachment-table .col-paid { width: 11%; }
.finance-attachment-note { margin-top: 2mm; font-size: 12px; line-height: 1.5; }
.finance-attachment-note strong { font-weight: 700; }
.finance-attachment-note span { font-family: Arial, "Microsoft YaHei", sans-serif; font-variant-numeric: tabular-nums; }
.finance-meta-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.finance-meta-grid label, .finance-receipt-row > label { display: grid; gap: 6px; color: #4f696e; font-size: 14px; font-weight: 700; }
.finance-meta-grid select, .finance-receipt-row input { width: 100%; min-width: 0; min-height: 42px; border: 1px solid #c8d9d5; border-radius: 9px; padding: 8px 10px; color: #19383e; background: #fff; font-size: 15px; }
.finance-receipt-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.finance-receipt-head h3 { margin: 0 0 4px; color: #24434a; font-size: 17px; }
.finance-receipt-head p { margin: 0; color: #708388; font-size: 13px; }
.finance-receipt-list { display: grid; gap: 10px; }
.finance-receipt-row { display: grid; grid-template-columns: 34px 140px minmax(160px, 1fr) minmax(190px, 1.15fr) 130px minmax(160px, 1fr) minmax(220px, auto); align-items: end; gap: 10px; border: 1px solid #d7e4e1; border-radius: 11px; padding: 12px; background: #fff; }
.receipt-number { display: grid; place-items: center; width: 30px; height: 30px; margin-bottom: 6px; border-radius: 50%; color: #fff; background: #177b70; font-weight: 800; }
.receipt-voucher-actions { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 7px; min-height: 42px; }
.receipt-voucher-actions button, .receipt-voucher-actions label { display: inline-flex; align-items: center; justify-content: center; min-height: 36px; border: 1px solid #89b9b1; border-radius: 8px; padding: 0 10px; color: #176f65; background: #edf8f6; font-size: 13px; font-weight: 700; cursor: pointer; }
.receipt-voucher-actions .recognizing { cursor: wait; color: #fff; background: #177b70; }
.receipt-voucher-actions button:disabled { cursor: wait; opacity: .55; }
.receipt-upload-spinner { width: 15px; height: 15px; margin-right: 7px; border: 2px solid #ffffff66; border-top-color: #fff; border-radius: 50%; animation: receipt-spin .7s linear infinite; }
@keyframes receipt-spin { to { transform: rotate(360deg); } }
.receipt-voucher-actions .remove { border-color: #efc1bd; color: #ad332a; background: #fff6f5; }
.finance-receipt-empty { border: 1px dashed #b9cfca; border-radius: 10px; padding: 22px; color: #71868a; background: #fff; text-align: center; }
.invoice-profile-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.invoice-profile-head h3 { margin-bottom: 5px; }
.invoice-profile-head p { margin: 0; color: #6b8186; font-size: 13px; }
.invoice-profile-list { display: grid; gap: 12px; margin-top: 14px; }
.invoice-profile-row { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) auto; align-items: end; gap: 12px; padding: 12px; border: 1px solid #dbe5e2; border-radius: 11px; background: #fff; }
.invoice-profile-row label { display: flex; flex-direction: column; gap: 7px; color: #52686e; font-size: 13px; font-weight: 700; }
.invoice-profile-row input { width: 100%; min-height: 45px; border: 1px solid #cedbd7; border-radius: 10px; padding: 10px 12px; color: #1e373d; background: #fbfdfc; font-size: 16px; }

.invoice-image-upload { display: inline-flex; align-items: center; justify-content: center; min-height: 34px; border: 1px solid #8abbb3; border-radius: 8px; padding: 0 13px; color: #176f65; background: #edf8f6; font-size: 12px; font-weight: 800; cursor: pointer; }
.invoice-image-preview { display: block; width: 100%; overflow: hidden; margin-top: 12px; border: 1px solid #d6e2df; border-radius: 12px; padding: 0; color: #176f65; background: #f3f8f7; font: inherit; text-decoration: none; cursor: zoom-in; }
.invoice-image-preview img { display: block; width: 100%; max-height: 520px; object-fit: contain; background: #eaf1ef; }
.invoice-image-preview span { display: block; padding: 10px 14px; text-align: center; font-size: 12px; font-weight: 700; }
.invoice-image-empty { margin-top: 12px; border: 1px dashed #b7cbc6; border-radius: 12px; padding: 28px 18px; color: #708287; background: #f8fbfa; text-align: center; font-size: 13px; }
.invoice-preview-backdrop { position: fixed; inset: 0; z-index: 120; display: grid; place-items: center; padding: 20px; background: #06191fd9; }
.invoice-preview-modal { position: relative; display: flex; width: min(1200px, 100%); max-height: calc(100vh - 40px); flex-direction: column; align-items: center; gap: 14px; overflow: auto; border-radius: 16px; padding: 48px 20px 20px; background: #fff; box-shadow: 0 30px 90px #0008; }
.invoice-preview-modal > img { display: block; max-width: 100%; max-height: calc(100vh - 150px); object-fit: contain; }

.sales-order-form { overflow: hidden; }
.sales-customer-field { display: grid; gap: 6px; min-width: 0; }
.sales-index-input { display: flex; align-items: stretch; min-width: 0; height: 43px; overflow: hidden; border: 1px solid #cad9d5; border-radius: 7px; background: #fff; }
.sales-order-form .sales-index-input input { flex: 1; width: 0; min-width: 0; height: 100%; border: 0; border-radius: 0; background: transparent; }
.sales-order-form .sales-index-input input:focus { outline: none; border: 0; background: transparent; }
.sales-index-input:focus-within { outline: 2px solid #56a89b38; border-color: #409184; }
.sales-customer-index-toggle { display: flex; align-items: center; justify-content: center; flex: 0 0 36px; width: 36px; padding: 0; margin: 0; border: 0; border-left: 1px solid #d6e3dd; border-radius: 0; color: #147a6e; background: transparent; box-shadow: none; cursor: pointer; }
.sales-customer-index-toggle:hover, .sales-customer-index-toggle:focus-visible { background: #e4f4ed; outline: none; }
.sales-index-dialog { position: fixed; inset: 0; margin: auto; width: min(720px, calc(100vw - 32px)); max-height: calc(100dvh - 48px); padding: 0; border: 1px solid #cadfd8; border-radius: 18px; background: #f8fcfa; color: #203d43; box-shadow: 0 24px 80px #102e3a40; }
.sales-index-dialog::backdrop { background: #173b4666; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.sales-index-content { padding: 24px; }
.sales-index-title { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 20px; }
.sales-index-title h3 { margin: 0; font-size: 22px; }
.sales-index-content > p { margin: 12px 0; color: #426c60; font-size: 14px; }
.sales-product-field { height: 38px; background: #f8fbfa; }
.sales-customer-index-head { display: flex; align-items: flex-end; gap: 12px; }
.sales-customer-index-head label { display: grid; flex: 1; gap: 8px; min-width: 0; font-weight: 700; color: #285e56; }
.sales-customer-index-head input { width: 100%; min-width: 0; height: 43px; border: 1px solid #a6c6bc; border-radius: 8px; padding: 0 12px; background: white; color: #19363c; font: inherit; }
.sales-customer-selected { margin: 12px 0; color: #426c60; font-size: 14px; }
.sales-customer-selected { padding: 0 24px; }
.sales-customer-index-list { max-height: 300px; overflow-y: auto; border: 1px solid #d7e5df; border-radius: 10px; background: white; }
.sales-customer-index-list > button { display: flex; align-items: center; justify-content: space-between; gap: 16px; width: 100%; padding: 12px 14px; border: 0; border-bottom: 1px solid #e5eeea; background: white; text-align: left; color: #203d43; cursor: pointer; }
.sales-customer-index-list > button:hover, .sales-customer-index-list > button:focus-visible { background: #e4f4ed; outline: 2px solid #398779; outline-offset: -2px; }
.sales-customer-index-list > button > span { display: grid; gap: 5px; min-width: 0; overflow-wrap: anywhere; }
.sales-customer-index-list > button > span:last-child { text-align: right; }
.sales-customer-index-list strong { font-size: 16px; }
.sales-customer-index-list small { color: #637b73; font-size: 13px; }
.sales-customer-index-list b { color: #147a6e; font-size: 14px; }
.sales-customer-index-list > p { padding: 16px; color: #637b73; }
.sales-order-total { color: #147a6e; font-size: 20px; }
.sales-order-section { padding: 24px; border-top: 1px solid #e4ebe9; }
.sales-order-section h4 { margin: 0 0 16px; color: #203d43; font-size: 16px; }
.sales-order-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.sales-order-grid label { display: flex; flex-direction: column; gap: 7px; min-width: 0; color: #52686e; font-size: 13px; font-weight: 700; }
.sales-order-grid label.wide { grid-column: span 2; }
.sales-order-grid input, .sales-order-grid select { width: 100%; min-width: 0; min-height: 45px; border: 1px solid #cedbd7; border-radius: 10px; padding: 10px 12px; color: #1e373d; background: #fbfdfc; font-size: 14px; }
.sales-order-grid input:focus, .sales-order-grid select:focus { outline: 2px solid #56a89b38; border-color: #409184; }
.sales-order-submit { display: flex; align-items: center; justify-content: flex-end; gap: 10px; padding: 20px 24px 24px; border-top: 1px solid #e4ebe9; background: #fafcfb; }
.sales-order-submit > span { margin-right: auto; color: #657b80; font-size: 12px; }
.sales-order-paper { border-top: 4px solid #177d72; }
.linked-sale-banner { display: flex; align-items: center; gap: 14px; margin: 18px 24px 0; border: 1px solid #b9d8d2; border-left: 4px solid var(--teal); border-radius: 10px; padding: 13px 16px; background: #edf8f5; color: #36565d; }
.linked-sale-banner strong { flex: 0 0 auto; color: #087b6e; font-size: 15px; }
.linked-sale-banner span { font-size: 14px; line-height: 1.7; }
.sales-paper-title { position: relative; padding: 22px 24px 18px; text-align: center; }
.sales-paper-title span { color: #177d72; font-size: 9px; font-weight: 800; letter-spacing: 2px; }
.sales-paper-title h3 { margin: 4px 0 0; color: #18383e; font: 700 25px Georgia, "Microsoft YaHei", serif; }
.sales-paper-title strong { position: absolute; right: 24px; bottom: 20px; color: #177d72; font-size: 18px; }
.sales-paper-meta { display: grid; grid-template-columns: minmax(0, 1fr) 260px; gap: 14px 24px; padding: 20px 24px; border-top: 1px solid #dbe5e2; background: #fbfdfc; }
.sales-paper-meta .sales-contact-fields { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1fr) minmax(0, 1fr); gap: 14px 24px; }
@media (max-width: 640px) { .sales-paper-meta .sales-contact-fields { grid-template-columns: minmax(0, 1fr); } }
.sales-paper-meta label, .sales-paper-note label, .sales-paper-signoff label { display: grid; gap: 6px; min-width: 0; color: #496269; font-size: 13px; font-weight: 700; }
.sales-paper-meta input, .sales-paper-meta select, .sales-paper-note input, .sales-paper-signoff input, .sales-paper-signoff select { min-width: 0; height: 43px; border: 1px solid #cad9d5; border-radius: 7px; padding: 0 11px; color: #19363c; background: #fff; font-size: 14px; }
.sales-line-wrap { overflow-x: auto; border-top: 1px solid #dbe5e2; border-bottom: 1px solid #dbe5e2; }
.sales-line-table { min-width: 1120px; table-layout: fixed; }
.sales-line-table th { padding: 11px 7px; color: #36575d; background: #edf5f3; text-align: center; font-size: 12px; font-weight: 700; }
.sales-line-table td { height: 56px; padding: 6px; text-align: center; }
.sales-line-table th:nth-child(1), .sales-line-table td:nth-child(1) { width: 48px; }
.sales-line-table th:nth-child(2), .sales-line-table td:nth-child(2) { width: 210px; }
.sales-line-table th:nth-child(3), .sales-line-table td:nth-child(3) { width: 150px; }
.sales-line-table th:nth-child(4), .sales-line-table td:nth-child(4) { width: 120px; }
.sales-line-table th:nth-child(9), .sales-line-table td:nth-child(9) { width: 95px; }
.sales-line-table th:nth-child(10), .sales-line-table td:nth-child(10) { width: 130px; }
.sales-line-table input { width: 100%; height: 38px; border: 1px solid transparent; border-radius: 6px; padding: 0 7px; background: #f8fbfa; text-align: inherit; }
.sales-line-table input:focus, .sales-paper-meta input:focus, .sales-paper-meta select:focus, .sales-paper-note input:focus, .sales-paper-signoff input:focus, .sales-paper-signoff select:focus { outline: 2px solid #56a89b38; border-color: #409184; background: #fff; }
.sales-line-table tfoot td { height: 45px; color: #26484e; background: #f4f8f7; font-weight: 700; }
.sales-paper-note { padding: 16px 24px; }
.sales-paper-signoff { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; padding: 18px 24px; border-top: 1px solid #dbe5e2; background: #fbfdfc; }
.sales-paper-signoff input[readonly] { color: #687c81; background: #f2f5f4; }
.sales-payment-method { display: flex; justify-content: flex-end; padding: 14px 24px; border-top: 1px solid #e4ebe9; background: #fbfdfc; }
.sales-payment-method label { display: grid; width: 230px; gap: 6px; color: #496269; font-size: 13px; font-weight: 700; }
.sales-payment-method select { width: 100%; height: 43px; border: 1px solid #cad9d5; border-radius: 7px; padding: 0 11px; color: #19363c; background: #fff; font-size: 14px; }
.outbound-entry-form .sales-paper-title span { color: #315f86; font-size: 15px; font-family: "SimSun", "Microsoft YaHei", sans-serif; }
.outbound-source-banner { display: grid; grid-template-columns: minmax(260px, auto) 1fr; align-items: center; gap: 14px; padding: 13px 16px; border-bottom: 1px solid #b9d8d2; background: #edf8f5; color: #244a50; }
.outbound-source-banner strong { color: #087b6e; }
.outbound-source-banner span { font-size: 13px; }
.outbound-entry-meta { grid-template-columns: minmax(0, 1fr) 300px; }
.outbound-entry-table { min-width: 820px; }
.outbound-entry-table th:nth-child(2), .outbound-entry-table td:nth-child(2) { width: 140px; }
.outbound-entry-table th:nth-child(3), .outbound-entry-table td:nth-child(3) { width: 300px; }
.outbound-entry-table th:nth-child(4), .outbound-entry-table td:nth-child(4), .outbound-entry-table th:nth-child(5), .outbound-entry-table td:nth-child(5) { width: 120px; }
.outbound-entry-table th:nth-child(6), .outbound-entry-table td:nth-child(6) { width: 160px; }
.outbound-entry-table th:nth-child(7), .outbound-entry-table td:nth-child(7) { width: 76px; }
.outbound-entry-form input:read-only { background: #eef2f1; color: #66736f; cursor: not-allowed; }
.outbound-line-button { width: 30px; height: 30px; border: 1px solid #188579; border-radius: 50%; color: #fff; background: #188579; font-size: 20px; line-height: 1; cursor: pointer; }
.outbound-line-button.remove { margin-left: 4px; border-color: #cbd8d5; color: #657b80; background: #fff; }
.outbound-entry-trace { display: grid; grid-template-columns: minmax(560px, 1.6fr) minmax(300px, .8fr); gap: 18px; padding: 22px 24px; background: #fbfdfc; }
.outbound-entry-trace label { display: grid; align-content: start; gap: 8px; color: #496269; font-size: 13px; font-weight: 700; }
.outbound-entry-trace textarea { width: 100%; min-height: 210px; resize: vertical; border: 1px solid #cad9d5; border-radius: 8px; padding: 12px; color: #19363c; background: #fff; font: 14px/1.6 Consolas, monospace; }
.outbound-entry-trace textarea:focus { outline: 2px solid #56a89b38; border-color: #409184; }
.outbound-code-preview { min-height: 210px; border: 1px solid #d2dfdc; border-radius: 8px; padding: 12px; background: #fff; }
.outbound-code-preview > strong { color: #176f65; font-size: 13px; }
.outbound-code-preview ol { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px 10px; max-height: 155px; overflow: auto; margin: 10px 0; padding: 0; list-style: none; }
.outbound-code-preview li { display: flex; min-width: 0; gap: 6px; font: 12px/1.4 Consolas, monospace; }
.outbound-code-preview li b { flex: 0 0 24px; color: #177d72; text-align: right; }
.outbound-code-preview li span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.outbound-code-preview small { color: #718388; font-size: 11px; }
.outbound-entry-signoff { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.sales-print-backdrop { position: fixed; inset: 0; z-index: 180; padding: 12px; background: #21272db8; }
.sales-print-preview { display: grid; width: 100%; height: 100%; grid-template-rows: 46px 64px minmax(0, 1fr) 58px; overflow: hidden; border: 1px solid #59616a; border-radius: 10px; background: #eef0f2; box-shadow: 0 24px 70px #0007; }
.sales-print-preview > header { display: flex; align-items: center; justify-content: space-between; padding: 0 18px; border-bottom: 1px solid #ccd0d4; background: #f8f8f8; color: #41474d; }
.sales-print-preview > header strong { font-size: 17px; font-weight: 500; }
.sales-print-preview > header button { border: 0; padding: 8px 13px; color: #50565c; background: transparent; cursor: pointer; }
.sales-print-toolbar { display: flex; align-items: stretch; gap: 0; padding: 7px 12px; border-bottom: 1px solid #aeb4ba; background: #f7f7f7; }
.sales-print-toolbar button, .sales-print-toolbar output { display: grid; min-width: 58px; place-items: center; border: 0; border-right: 1px solid #c6c9cc; padding: 0 13px; color: #222b34; background: transparent; font: 500 13px "Microsoft YaHei", sans-serif; cursor: pointer; }
.sales-print-toolbar button:hover, .sales-print-toolbar button.active { background: #dfefff; box-shadow: inset 0 0 0 1px #8ebbe8; }
.sales-print-toolbar button.primary { color: #fff; background: #177d72; }
.sales-print-toolbar span { display: flex; align-items: center; margin-left: auto; padding: 0 18px; color: #555f67; font-size: 13px; }
.sales-print-stage { overflow: auto; background: #777d82; }
.sales-print-paper-frame { width: 832px; min-height: 359px; margin: 28px auto; transform-origin: top center; box-shadow: 0 4px 18px #0006; }
.sales-print-paper-frame.outbound-paper-frame { width: 813px; min-height: 529px; }
.sales-print-pages { display: flex; flex-direction: column; gap: 10mm; }
.sales-print-sheet { position: relative; display: block; width: 209mm; height: 87mm; min-height: 0; overflow: hidden; margin: 4mm 3mm; padding: 4mm 6mm 3mm; background: #fff; color: #17436d; font-family: "SimSun", "Microsoft YaHei", sans-serif; }
.sales-print-sheet.outbound-print-sheet { height: 132mm; }
.sales-print-title { text-align: center; }
.sales-print-title strong { display: block; font-size: 28px; letter-spacing: 2px; }
.sales-print-title span { display: block; margin-top: 2px; font-size: 20px; font-weight: 700; }
.sales-print-meta { width: 100%; margin: 3mm 0 2mm; border-collapse: collapse; font-size: 16px; line-height: 1.35; }
.sales-print-meta td { width: 50%; padding: 0; border: 0; }
.sales-print-meta .meta-right { text-align: right; }
.sales-print-number { font-family: Arial, "Microsoft YaHei", sans-serif; font-stretch: normal; font-variant-numeric: tabular-nums; letter-spacing: 0; white-space: nowrap; }
.sales-print-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 14px; }
.sales-print-table th, .sales-print-table td { border: 1px solid #17436d; padding: 3px; text-align: center; vertical-align: middle; }
.sales-print-table th { font-weight: 700; }
.sales-print-table tbody td { height: 17mm; }
.sales-print-table tfoot td { height: 7mm; font-weight: 700; }
.sales-print-table .product-cell { line-height: 1.55; }
.sales-print-table .col-seq { width: 5%; }.sales-print-table .col-name { width: 24%; }.sales-print-table .col-spec { width: 14%; }.sales-print-table .col-store { width: 9%; }.sales-print-table .col-unit { width: 6%; }.sales-print-table .col-number { width: 8%; }.sales-print-table .col-price { width: 10%; }.sales-print-table .col-amount { width: 11%; }.sales-print-table .col-case { width: 6%; }.sales-print-table .col-note { width: 7%; }
.sales-print-signatures { position: absolute; right: 6mm; bottom: 3mm; left: 6mm; width: 197mm; border-collapse: separate; border-spacing: 3mm 0; table-layout: fixed; font-size: 15px; }
.sales-print-signatures td { width: 20%; padding: 0; border: 0; }
.sales-print-signatures span { display: block; min-height: 5mm; border-bottom: 1px solid #17436d; padding-bottom: 2px; white-space: nowrap; }
.sales-print-signatures-row { display: block; white-space: nowrap; }
.sales-print-signatures-row span { display: inline-block; width: 20%; border-bottom: 0; padding-right: 3mm; vertical-align: top; }
.sales-print-signatures-row span:last-child { padding-right: 0; }
.sales-print-remark { margin-top: 2mm; font-size: 14px; }
.sales-print-preview > footer { display: flex; align-items: center; gap: 10px; padding: 8px 14px; border-top: 1px solid #adb3b8; background: #f7f7f7; }
.sales-print-preview > footer span { color: #4a5b64; font-size: 12px; }
.sales-print-preview > footer b { margin-left: auto; color: #606a70; font-size: 12px; font-weight: 500; }
.sales-print-preview > footer button { min-height: 38px; }

@media print {
  @page { size: 215mm 95mm; margin: 4mm 3mm; }
  html, body { width: auto !important; height: auto !important; min-height: 0 !important; overflow: visible !important; background: #fff !important; }
  body * { visibility: hidden !important; }
  .sales-print-pages, .sales-print-pages *, .sales-print-sheet, .sales-print-sheet *, .finance-sales-attachment-print, .finance-sales-attachment-print * { visibility: visible !important; }
  .sales-print-backdrop { position: static !important; inset: auto !important; padding: 0 !important; background: #fff !important; }
  .sales-print-preview { display: block !important; width: auto !important; height: auto !important; overflow: visible !important; border: 0 !important; background: #fff !important; box-shadow: none !important; }
  .sales-print-preview > header, .sales-print-toolbar, .sales-print-preview > footer { display: none !important; }
  .finance-attachment-preview { position: static !important; width: auto !important; height: auto !important; overflow: visible !important; }
  .sales-print-stage { overflow: visible !important; background: #fff !important; }
  .sales-print-paper-frame, .sales-print-paper-frame.outbound-paper-frame { width: auto !important; min-height: 0 !important; margin: 0 !important; transform: none !important; box-shadow: none !important; }
  .sales-print-pages { position: static !important; inset: auto !important; display: block; gap: 0; }
  .sales-print-sheet { position: relative; width: 209mm; height: 87mm; min-height: 0; margin: 0; page-break-after: always; break-after: page; }
  .sales-print-sheet:last-child { page-break-after: auto; break-after: auto; }
  .finance-sales-attachment-print { position: fixed !important; inset: 0 auto auto 0 !important; width: 209mm !important; height: 87mm !important; overflow: hidden !important; margin: 0 !important; box-shadow: none !important; page-break-after: auto !important; break-after: auto !important; }
}

@media (max-width: 900px) {
  .outbound-source-banner { grid-template-columns: 1fr; }
  .sales-paper-meta { grid-template-columns: 1fr 1fr; }
  .sales-paper-signoff { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .finance-subsidy-options { grid-template-columns: 1fr; }
  .outbound-entry-trace { grid-template-columns: 1fr 1fr; }
  .outbound-code-preview { grid-column: 1 / -1; }
}

@media (max-width: 620px) {
  .sales-paper-title { text-align: left; }
  .sales-paper-title strong { position: static; display: block; margin-top: 10px; }
  .sales-paper-meta, .sales-paper-signoff { grid-template-columns: 1fr; padding: 16px; }
  .sales-payment-method { padding: 14px 16px; }
  .sales-payment-method label { width: 100%; }
  .sales-paper-note { padding: 16px; }
}

@media (max-width: 1280px) {
  .app-shell { grid-template-columns: 88px minmax(0, 1fr); }
  .sidebar { width: 88px; padding: 22px 12px; }
  .app-shell > main { grid-column: 2; }
  .sidebar nav .nav-group-toggle { grid-template-columns: 1fr; justify-items: center; padding: 0; }
  .nav-group-toggle strong, .nav-chevron { display: none; }
  .nav-submenu { padding-left: 0; }
  .sidebar nav .nav-subitem { justify-content: center; padding: 0; font-size: 0; }
  .sidebar nav .nav-subitem > span { font-size: 20px; }
  .sidebar nav .nav-subitem.active::before { left: -12px; }
  .brand-copy, .sidebar-foot > div:not(.avatar), .sidebar-foot button { display: none; }
  .sidebar-tools { width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px; }
  .sidebar-tools button { width: 100%; min-width: 0; padding: 0; font-size: 0; }
  .sidebar-tools button span { font-size: 19px; }
  .workspace-grid { grid-template-columns: 340px minmax(0, 1fr); }
  .page-content { padding: 30px 28px 52px; }
  .module-table-wrap th, .module-table-wrap td { padding: 14px 15px; }
}

@media (max-width: 1380px) {
  .workspace-grid { grid-template-columns: minmax(0, 1fr); }
  .upload-column { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1050px) {
  .workspace-grid { grid-template-columns: 1fr; }
  .upload-column { grid-template-columns: 1fr 1fr; display: grid; }
  .module-stats, .module-shortcuts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sales-order-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .recent-row { grid-template-columns: 36px minmax(180px, 1fr) 100px 90px 100px 70px 52px; }
}

@media (max-width: 720px) {
  html { font-size: 16px; }
  .app-shell { display: block; }
  .sidebar { width: 100%; height: 72px; padding: 8px 10px; }
  .sidebar-tools, .brand-mark, .brand-copy, .sidebar-foot { display: none; }
  .sidebar nav { width: 100%; justify-content: flex-start; overflow-x: auto; overflow-y: visible; scrollbar-width: none; }
  .sidebar nav::-webkit-scrollbar { display: none; }
  .nav-group { position: relative; flex: 0 0 58px; }
  .sidebar nav .nav-group-toggle { width: 100%; height: 54px; }
  .nav-submenu { position: absolute; left: 0; bottom: 62px; min-width: 180px; padding: 8px; border: 1px solid #ffffff16; border-radius: 12px; background: #0b2b34; box-shadow: 0 -12px 32px #061c2466; }
  .nav-group:nth-child(n+3) .nav-submenu { right: 0; left: auto; }
  .sidebar nav .nav-subitem { justify-content: flex-start; padding: 0 12px; font-size: 13px; }
  .sidebar nav .nav-subitem.active::before { left: -8px; }
  .app-shell > main { padding-bottom: 76px; }
  .topbar { height: 74px; padding: 0 16px; }
  .topbar h1 { font-size: 22px; }
  .page-content { padding: 23px 14px 38px; }
  .intro-row h2, .module-hero h2 { font-size: 27px; }
  .intro-row p, .module-hero p { font-size: 14px; }
  .module-hero { min-height: auto; padding: 25px 20px; }
  .upload-column { display: flex; }
  .panel-title h3, .review-head h3 { font-size: 18px; }
  .document-type-tabs button { padding: 0 9px; font-size: 12px; }
  .field-grid { grid-template-columns: 1fr; }
  .review-footer { display: block; }
  .amounts { flex-wrap: wrap; gap: 12px 20px; }
  .module-stats { grid-template-columns: 1fr; }
  .module-stats > div { min-height: 105px; }
  .module-table-head { align-items: flex-start; gap: 14px; flex-direction: column; }
  .module-table-head > div:last-child { width: 100%; justify-content: flex-start; }
  .module-table-head input { flex: 1 1 140px; min-width: 0; }
  .module-shortcuts { grid-template-columns: 1fr 1fr; }
  .account-create-panel { padding: 20px; }
  .account-form { grid-template-columns: 1fr; }
  .sale-edit-modal { padding: 25px 18px; }
  .sale-edit-linked-button { position: static; display: block; margin: 0 42px 16px auto; }
  .sale-edit-grid { grid-template-columns: 1fr; }
  .sale-edit-grid label.wide { grid-column: auto; }
  .invoice-profile-head { align-items: stretch; flex-direction: column; }
  .invoice-profile-row { grid-template-columns: 1fr; align-items: stretch; }
  .sales-order-grid { grid-template-columns: 1fr; }
  .sales-order-grid label.wide { grid-column: auto; }
  .sales-order-section { padding: 20px 16px; }
  .sales-order-submit { padding: 18px 16px 20px; }
  .sales-order-submit { align-items: stretch; flex-direction: column; }
  .recent-row { grid-template-columns: 30px minmax(0, 1fr) 78px 42px; gap: 9px; padding: 12px 13px; }
  .recent-row time, .recent-operator, .recent-row em { display: none; }
  .recent-row > b { font-size: 11px; text-align: right; }
  .recent-number-button { max-width: 100%; overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
}

/* 2026-08-27 readability pass: keep all business text legible without scaling the layout. */
body { font-size: 17px; }
.brand-copy strong { font-size: 20px; }
.brand-copy span, .sidebar-foot span { font-size: 13px; }
.sidebar nav .nav-group-toggle { font-size: 18px; }
.sidebar-foot strong { font-size: 16px; }
.sidebar-foot button, .sidebar-tools button { font-size: 14px; }
.topbar p, .api-state, .icon-button, .help-button, .help-button span { font-size: 15px; }
.top-actions .api-state { height: 34px; padding: 0 10px; gap: 5px; border-radius: 9px; font-size: 12px; }
.top-actions .api-state i { width: 7px; height: 7px; }
.top-actions .api-state b { padding: 2px 5px; border-radius: 5px; font-size: 12px; }
.topbar h1 { font-size: 30px; }
.eyebrow { font-size: 13px; }
.intro-row h2, .module-hero h2 { font-size: 37px; }
.intro-row p, .module-hero p { font-size: 17px; }
.today-card > span { font-size: 15px; }
.today-card small, .today-card em { font-size: 13px; }
.panel-title > div > span, .step-no { font-size: 14px; }
.panel-title h3, .review-head h3 { font-size: 22px; }
.panel-title p, .review-head p { font-size: 15px; }
.text-button, .more-button { font-size: 15px; }
.dropzone strong { font-size: 18px; }
.dropzone p { font-size: 14px; }
.file-types span { font-size: 12px; }
.recognize-button { font-size: 17px; }
.recognize-button em { font-size: 13px; }
.file-icon { font-size: 12px; }
.doc-meta strong { font-size: 15px; }
.doc-meta span, .stage, .sync-state { font-size: 13px; }
.confidence { font-size: 14px; }
.confidence strong { font-size: 17px; }
.document-type-tabs button { font-size: 15px; }
.delete-current-button, .warning-strip strong, .warning-strip p, .warning-strip button { font-size: 14px; }
.section-label > span { font-size: 15px; }
.section-label button, .field-grid label > span { font-size: 14px; }
.field-grid input, .field-grid select { font-size: 16px; }
th { font-size: 14px; }
td, td input { font-size: 15px; }
td small { font-size: 13px; }
.amounts span { font-size: 14px; }
.amounts strong { font-size: 22px; }
.secondary-button, .create-button { font-size: 15px; }
.empty-review { font-size: 17px; }
.bottom-head span { font-size: 13px; }
.bottom-head h3 { font-size: 20px; }
.bottom-head button { font-size: 14px; }
.overview-cards span, .overview-cards em { font-size: 13px; }
.recent-number-button, .recent-row > b { font-size: 15px; }
.recent-row div small, .recent-row em, .recent-row time, .recent-operator { font-size: 13px; }
.delete-record-button { font-size: 13px; }
.module-stats span, .module-stats small { font-size: 14px; }
.module-table-head span { font-size: 13px; }
.module-table-head h3 { font-size: 21px; }
.module-table-head input, .module-table-head button { font-size: 14px; }
.module-table-wrap th { font-size: 14px; }
.module-table-wrap td { font-size: 15px; }
.module-delete-button, .module-edit-button, .module-action-button { font-size: 14px; }
.module-shortcuts strong { font-size: 16px; }
.module-shortcuts small { font-size: 13px; }
.workflow-progress strong, .logistics-code-select, .module-pagination, .module-pagination button { font-size: 13px; }
.account-form label, .account-form .field-permissions legend { font-size: 16px; }
.account-form input, .account-form select { font-size: 17px; }
.account-form .field-permissions label { font-size: 15px; }
.info-modal > span, .sale-edit-modal > span { font-size: 13px; }
.info-modal p, .toast { font-size: 16px; }
.sale-edit-modal > p, .sale-edit-grid label, .workflow-hint, .invoice-image-empty,
.sales-order-grid label { font-size: 15px; }
.sale-edit-grid input, .sale-edit-grid select, .sales-order-grid input, .sales-order-grid select { font-size: 16px; }
.invoice-file-panel > div:first-child span, .invoice-file-actions > .invoice-file-open,
.invoice-file-actions > span, .invoice-image-upload, .invoice-image-preview span,
.sales-order-submit > span { font-size: 14px; }
.master-data-section h3, .sales-order-section h4 { font-size: 17px; }
.sale-edit-grid input::placeholder { color: #829a9e; opacity: 1; }
.sale-attachment-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.sale-attachment-card { display: grid; gap: 9px; padding: 14px; border: 1px solid #d6e3e1; border-radius: 12px; background: #f8fbfa; }
.sale-attachment-card strong { color: #12373c; font-size: 16px; }
.sale-attachment-card span { color: #688084; font-size: 14px; }
.sale-attachment-card button, .sale-attachment-card label { width: fit-content; }
.todo-modal { width: min(720px, 100%); }
.todo-list { display: grid; gap: 12px; max-height: 60vh; overflow: auto; }
.todo-list article { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 16px; border: 1px solid #d6e3e1; border-radius: 12px; background: #f8fbfa; }
.todo-list article div { min-width: 0; }
.todo-list article strong, .todo-list article span, .todo-list article small { display: block; }
.todo-list article strong { color: #17373d; font-size: 16px; }
.todo-list article span { margin-top: 4px; color: #48656b; font-size: 14px; }
.todo-list article small { margin-top: 3px; color: #7b8e92; font-size: 12px; }
.todo-list article .create-button { flex: 0 0 auto; }
.todo-reminder-toast { position: fixed; right: 24px; bottom: 24px; z-index: 70; display: flex; align-items: center; gap: 12px; min-width: 300px; padding: 16px 18px; border: 1px solid #f3b5ae; border-radius: 14px; color: #fff; background: linear-gradient(135deg, #b42318, #d92d20); box-shadow: 0 16px 44px #79170f4d; text-align: left; }
.todo-reminder-toast > span { display: grid; place-items: center; flex: 0 0 34px; width: 34px; height: 34px; border-radius: 50%; color: #b42318; background: #fff; font-weight: 900; }
.todo-reminder-toast strong, .todo-reminder-toast small { display: block; }
.todo-reminder-toast strong { font-size: 17px; }
.todo-reminder-toast small { margin-top: 3px; color: #ffe4e1; font-size: 13px; }

@media (min-width: 1281px) {
  .sidebar nav .nav-subitem { font-size: 15px; }
}

@media (max-width: 720px) {
  body { font-size: 16px; }
  .topbar h1 { font-size: 25px; }
  .intro-row h2, .module-hero h2 { font-size: 30px; }
  .intro-row p, .module-hero p { font-size: 16px; }
  .panel-title h3, .review-head h3 { font-size: 20px; }
  .sidebar nav .nav-subitem { font-size: 15px; }
  .document-type-tabs button { font-size: 14px; }
  .recent-row > b, .recent-number-button { font-size: 13px; }
  .sale-attachment-grid { grid-template-columns: 1fr; }
  .todo-list article { align-items: stretch; flex-direction: column; }
  .todo-list article .create-button { width: 100%; }
  .icon-button.todo-button { width: 48px; height: 48px; }
  .todo-reminder-toast { right: 13px; bottom: 76px; left: 13px; min-width: 0; }
  .finance-amount-summary, .finance-meta-grid { grid-template-columns: 1fr 1fr; }
  .prepaid-apply-card { grid-template-columns: 1fr; align-items: stretch; }
  .finance-group-heading, .receivable-group-title { align-items: stretch; flex-direction: column; }
  .receivable-group-members > div { grid-template-columns: 1fr 1fr; }
  .receivable-group-members strong, .receivable-group-members em { text-align: left; }
  .finance-receipt-head { align-items: stretch; flex-direction: column; }
  .finance-receipt-row { grid-template-columns: 34px 1fr; }
  .finance-receipt-row > label, .receipt-voucher-actions { grid-column: 2; }
  .receipt-voucher-actions { justify-content: flex-start; }
}

@media (max-width: 1050px) {
  .closed-loop-filter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 620px) {
  .closed-loop-filter-heading { align-items: stretch; flex-direction: column; }
  .closed-loop-filter-heading button { width: 100%; }
  .closed-loop-filter-grid { grid-template-columns: 1fr; padding: 16px; }
  .closed-loop-date-filter { grid-column: auto; }
  .closed-loop-date-filter > div { grid-template-columns: 1fr; }
  .closed-loop-date-filter em { text-align: center; }
}

/* Keep controls readable when window width or browser zoom reduces usable space. */
@media screen {
  .sidebar-tools button { white-space: nowrap; }
  .topbar { height: auto; min-height: 94px; padding-block: 16px; flex-wrap: wrap; gap: 14px 24px; }
  .topbar > div:first-child { flex: 1 1 300px; min-width: 0; }
  .topbar p { overflow-wrap: anywhere; }
  .topbar h1 { line-height: 1.3; font-size: clamp(24px, 2.3vw, 30px); }
  .top-actions { flex: 0 1 auto; flex-wrap: wrap; min-width: 0; }
  .top-actions > button { flex-shrink: 0; white-space: nowrap; }
  .top-actions .api-state { max-width: 100%; height: auto; min-height: 34px; flex-wrap: wrap; padding-block: 5px; }
  .intro-row { display: flex; flex-wrap: wrap; gap: 20px 28px; align-items: flex-start; }
  .intro-row > div:first-child { flex: 1 1 520px; min-width: 0; }
  .intro-row h2 { font-size: clamp(27px, 2.7vw, 37px); line-height: 1.4; }
  .intro-row p { line-height: 1.7; }
  .today-card { flex: 0 1 310px; width: 310px; min-width: 0; max-width: 100%; }
  .workspace-grid > *, .upload-column > * { min-width: 0; }
  .page-content fieldset, .module-page, .sales-order-form { min-width: 0; }
  .panel-title { flex-wrap: wrap; gap: 12px 16px; align-items: flex-start; }
  .panel-title > div:first-child { flex: 1 1 210px; min-width: 0; }
  .panel-title > div:first-child > div { min-width: 0; }
  .panel-title > div > span { flex-shrink: 0; }
  .panel-title h3, .review-head h3 { line-height: 1.4; }
  .panel-title p, .review-head p { line-height: 1.6; }
  .panel-title > .text-button { flex: 0 0 auto; white-space: nowrap; padding-inline: 8px; }
  .panel-title > .queue-actions { flex: 0 1 auto; margin-left: auto; flex-wrap: wrap; justify-content: flex-end; }
  .queue-actions > * { flex-shrink: 0; }
  .queue-actions button { height: auto; min-height: 40px; padding-block: 8px; white-space: nowrap; }
  .file-types { flex-wrap: wrap; justify-content: center; }
  .recognize-button { height: auto; min-height: 50px; padding: 12px; line-height: 1.5; }
  .recognize-button em:empty { display: none; }
  .review-head, .document-toolbar, .review-footer { flex-wrap: wrap; gap: 14px; }
  .review-head > div:first-child { min-width: 0; flex: 1 1 250px; }
  .document-type-tabs { height: auto; flex-wrap: wrap; }
  .document-toolbar { padding-block: 12px; }
  .document-type-tabs button { min-height: 40px; white-space: nowrap; }
  .amounts { flex-wrap: wrap; gap: 12px 24px; }
  .review-footer > div:last-child { display: flex; flex-wrap: wrap; gap: 8px; }
  .review-footer .secondary-button { margin-right: 0; }
  .field-grid label { min-width: 0; }
  .module-hero > div:first-child { min-width: 0; }
  .module-actions { flex-wrap: wrap; }
  .module-actions button { height: auto; min-height: 44px; padding-block: 10px; white-space: nowrap; }
}

@media screen and (min-width: 721px) and (max-width: 1280px) {
  .sidebar { display: grid; grid-template-columns: 1fr; grid-template-rows: 36px 52px minmax(0, 1fr) auto; row-gap: 14px; overflow: hidden; }
  .sidebar-tools { grid-row: 1; }
  .sidebar-tools button { gap: 0; }
  .sidebar-tools .sidebar-tool-label, .sidebar nav .nav-item-label { display: none; }
  .brand-mark { grid-row: 2; justify-self: center; }
  .sidebar nav { grid-row: 3; display: flex; flex-direction: column; align-self: stretch; height: 100%; min-height: 0; margin-top: 0; padding: 4px 0; overflow-y: auto; overflow-x: hidden; }
  .sidebar nav .nav-group-toggle, .sidebar nav .nav-subitem { flex-shrink: 0; }
  .sidebar nav .nav-subitem { position: relative; }
  .sidebar nav .nav-subitem em { display: grid; position: absolute; top: 0; right: 0; margin-left: 0; min-width: 18px; height: 18px; padding-inline: 3px; font-size: 10px; }
  .sidebar-foot { grid-row: 4; grid-template-columns: 1fr; justify-items: center; padding-inline: 0; }
}

@media screen and (max-width: 1380px) {
  .upload-column { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); align-items: stretch; }
}

@media screen and (max-width: 900px) {
  .page-content { padding: 24px 20px 48px; }
  .topbar { padding-inline: 20px; }
  .module-hero { flex-wrap: wrap; gap: 20px; }
  .module-hero > div:first-child { flex: 1 1 360px; }
}

@media screen and (max-width: 720px) {
  .sidebar { inset: auto 0 0; display: flex; flex-direction: row; }
  .sidebar nav .nav-subitem > .nav-item-label { display: inline; }
  .sidebar nav { display: flex; flex-direction: row; margin-top: 0; }
  .topbar { position: relative; min-height: 74px; padding: 16px; }
  .topbar > div:first-child { flex-basis: 100%; }
  .top-actions { width: 100%; gap: 8px; }
  .help-button { padding-inline: 10px; }
  .page-content { padding: 22px 14px 38px; }
  .upload-panel { padding: 20px; }
  .panel-title.compact { padding-inline: 20px; }
  .field-grid label.wide { grid-column: auto; }
  .review-footer > div:last-child { margin-top: 14px; }
}