:root {
  --ink: #1b2421;
  --muted: #68736f;
  --line: #dfe5e2;
  --surface: #ffffff;
  --canvas: #f4f6f5;
  --brand: #0a765b;
  --brand-dark: #075441;
  --accent: #d99c2b;
  --danger: #c13f3f;
  --shadow: 0 18px 52px rgba(16, 30, 25, 0.16);
}

.coding-rule-page,
.coding-rule-detail-page {
  padding: 0;
  background: #f2f4f7;
}

.coding-rule-list-header {
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 5px 18px;
  border-bottom: 1px solid #dce1e8;
  background: #fff;
}

.coding-rule-scheme-wrap,
.coding-rule-list-search,
.coding-rule-list-search label,
.coding-rule-filter-bar,
.coding-rule-toolbar,
.coding-rule-pagination,
.coding-rule-pagination > div,
.coding-rule-pagination label {
  display: flex;
  align-items: center;
}

.coding-rule-scheme-wrap {
  position: relative;
  gap: 14px;
  font-size: 14px;
}

.coding-rule-scheme-wrap > button {
  width: 176px;
  height: 31px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 10px;
  border: 1px solid #cbd2dc;
  border-radius: 2px;
  background: #fff;
  cursor: pointer;
}

.coding-rule-scheme-wrap svg,
.coding-rule-list-search svg,
.coding-rule-tree-panel svg,
.coding-rule-split svg {
  width: 14px;
  height: 14px;
}

.coding-rule-list-search {
  gap: 16px;
}

.coding-rule-list-search label,
.coding-rule-tree-panel > label {
  height: 31px;
  gap: 7px;
  padding: 0 9px;
  border: 1px solid #d4dae3;
  background: #fff;
}

.coding-rule-list-search label {
  width: 240px;
}

.coding-rule-list-search input,
.coding-rule-tree-panel input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  font-size: 12px;
}

.coding-rule-list-search > button {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 0;
  border: 0;
  color: #4f82df;
  background: transparent;
  cursor: pointer;
  font-size: 12px;
}

.coding-rule-filter-bar {
  min-height: 50px;
  justify-content: space-between;
  padding: 8px 18px;
  border-bottom: 1px solid #dce1e8;
  background: #fff;
}

.coding-rule-filter-bar label {
  min-width: 500px;
  display: grid;
  grid-template-columns: 122px minmax(220px, 368px);
  align-items: center;
  font-size: 12px;
}

.coding-rule-filter-bar select {
  height: 30px;
  padding: 0 10px;
  border: 1px solid #ccd3dd;
  background: #fff;
}

.coding-rule-toolbar {
  min-height: 46px;
  flex-wrap: wrap;
  gap: 7px;
  padding: 7px 18px;
  border-bottom: 7px solid #e8edf3;
  background: #fff;
}

.coding-rule-toolbar > button,
.coding-rule-split > button,
.coding-rule-detail-toolbar > button {
  min-width: 58px;
  height: 30px;
  padding: 0 13px;
  border: 1px solid #4f82df;
  border-radius: 2px;
  color: #fff;
  background: #4f82df;
  cursor: pointer;
  font-size: 12px;
}

.coding-rule-toolbar > button:hover,
.coding-rule-split > button:hover,
.coding-rule-detail-toolbar > button:hover {
  border-color: #3e70cc;
  background: #3e70cc;
}

.coding-rule-split {
  position: relative;
  display: inline-flex;
}

.coding-rule-split > button:first-child {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.coding-rule-split > button:nth-child(2) {
  min-width: 27px;
  width: 27px;
  padding: 0;
  border-left-color: rgba(255, 255, 255, 0.45);
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.coding-rule-dropdown {
  min-width: 128px;
  position: absolute;
  z-index: 90;
  top: calc(100% + 4px);
  right: 0;
  padding: 5px 0;
  border: 1px solid #d4dae3;
  box-shadow: 0 7px 20px rgba(37, 49, 66, 0.15);
  background: #fff;
}

.coding-rule-scheme-wrap .coding-rule-dropdown {
  left: 108px;
  right: auto;
}

.coding-rule-dropdown button {
  width: 100%;
  height: 32px;
  padding: 0 14px;
  border: 0;
  color: #2d3540;
  background: #fff;
  cursor: pointer;
  text-align: left;
  font-size: 12px;
}

.coding-rule-dropdown button:hover {
  color: #356bc7;
  background: #edf4ff;
}

.coding-rule-list-layout {
  height: calc(100vh - 235px);
  min-height: 450px;
  display: grid;
  grid-template-columns: minmax(215px, 24%) 8px minmax(0, 1fr);
  background: #fff;
}

.coding-rule-tree-panel {
  padding: 10px 8px;
  border-right: 1px solid #ced5df;
  overflow-y: auto;
}

.coding-rule-tree-panel > label {
  display: flex;
  margin-bottom: 8px;
}

#codingRuleTree button {
  width: 100%;
  min-height: 34px;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 0 14px;
  border: 0;
  color: #303844;
  background: #fff;
  cursor: pointer;
  text-align: left;
  font-size: 12px;
}

#codingRuleTree button:hover,
#codingRuleTree button.active {
  color: #356bc7;
  background: #edf4ff;
}

.coding-rule-tree-children button {
  padding-left: 39px !important;
}

.coding-rule-tree-resizer {
  position: relative;
  border-right: 1px solid #c6cdd7;
  background: #f0f2f5;
}

.coding-rule-tree-resizer span {
  width: 7px;
  height: 36px;
  position: absolute;
  top: 50%;
  border-radius: 3px;
  background: #97a3b2;
  transform: translateY(-50%);
}

.coding-rule-table-panel {
  min-width: 0;
  position: relative;
  overflow: hidden;
}

.coding-rule-pagination {
  min-height: 39px;
  justify-content: space-between;
  gap: 12px;
  padding: 4px 10px;
  border-bottom: 1px solid #dce1e8;
  color: #505966;
  font-size: 12px;
}

.coding-rule-pagination > div {
  gap: 5px;
}

.coding-rule-pagination label {
  gap: 5px;
  white-space: nowrap;
}

.coding-rule-pagination input[type="number"] {
  width: 48px;
  height: 27px;
  border: 1px solid #ccd3dd;
  text-align: center;
}

.coding-rule-pagination select {
  height: 28px;
  border: 1px solid #ccd3dd;
  background: #fff;
}

.coding-rule-table-scroll {
  width: 100%;
  height: calc(100% - 39px);
  overflow: auto;
}

.coding-rule-table {
  min-width: 1320px;
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}

.coding-rule-table th,
.coding-rule-table td {
  height: 37px;
  padding: 0 8px;
  border-right: 1px solid #e1e5ea;
  border-bottom: 1px solid #dfe3e8;
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
}

.coding-rule-table th {
  height: 33px;
  background: #f3f5f7;
  font-weight: 500;
}

.coding-rule-table th:first-child,
.coding-rule-table td:first-child {
  width: 42px;
  text-align: center;
}

.coding-rule-table tbody tr:hover,
.coding-rule-table tbody tr.selected {
  background: #edf4ff;
}

.coding-rule-name-link {
  max-width: 100%;
  padding: 0;
  border: 0;
  overflow: hidden;
  color: #2f69c9;
  background: transparent;
  cursor: pointer;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.coding-rule-detail-toolbar {
  min-height: 53px;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
  padding: 8px 22px;
  border-bottom: 8px solid #e8edf3;
  background: #fff;
}

.coding-rule-detail-main {
  height: calc(100vh - 122px);
  overflow: auto;
}

.coding-rule-basic-section,
.coding-rule-segment-section {
  border-bottom: 8px solid #edf0f4;
  background: #fff;
}

.coding-rule-basic-section h2,
.coding-rule-segment-section h3 {
  margin: 0;
  padding: 13px 20px;
  border-bottom: 1px solid #e1e5ea;
  color: #2d3540;
  font-size: 15px;
  font-weight: 500;
}

.coding-rule-form-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(210px, 1fr));
  gap: 14px 24px;
  padding: 22px 28px;
}

.coding-rule-form-grid > label:not(.coding-rule-check) {
  display: grid;
  grid-template-columns: 118px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  font-size: 12px;
}

.coding-rule-form-grid > label:not(.coding-rule-check) > span {
  text-align: right;
}

.coding-rule-form-grid b,
.coding-rule-segment-config b,
.coding-breakpoint-form b {
  color: #d9363e;
}

.coding-rule-form-grid input[type="text"],
.coding-rule-form-grid select,
.coding-rule-segment-config input:not([type="checkbox"]),
.coding-rule-segment-config select {
  width: 100%;
  min-width: 0;
  height: 30px;
  padding: 0 8px;
  border: 1px solid #cdd4de;
  background: #fff;
}

.coding-rule-check {
  display: flex;
  align-items: center;
  gap: 7px;
  padding-left: 28px;
  font-size: 12px;
}

.coding-rule-form-grid fieldset {
  grid-column: span 2;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 18px;
  min-width: 0;
  margin: 0;
  padding: 10px 14px;
  border: 1px solid #d7dce4;
  font-size: 12px;
}

.coding-rule-form-grid fieldset label {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.coding-rule-segment-section > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px solid #e1e5ea;
}

.coding-rule-segment-section > header h3 {
  border: 0;
}

.coding-rule-segment-section > header > div {
  display: flex;
  gap: 7px;
  padding-right: 20px;
}

.coding-rule-segment-section > header button,
.coding-rule-feature-filters button,
#addCodingRuleSchemeCondition,
#addCodingRuleSort,
#addCodingStartCondition {
  height: 29px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 0 11px;
  border: 1px solid #4f82df;
  color: #4f82df;
  background: #fff;
  cursor: pointer;
  font-size: 12px;
}

.coding-rule-segment-section button svg {
  width: 13px;
  height: 13px;
}

.coding-rule-segment-scroll {
  width: 100%;
  overflow: auto;
}

.coding-rule-segment-scroll table,
.coding-rule-feature-table-wrap table,
.coding-rule-scheme-panel table {
  width: 100%;
  border-collapse: collapse;
}

.coding-rule-segment-scroll table {
  min-width: 980px;
}

.coding-rule-segment-scroll th,
.coding-rule-segment-scroll td,
.coding-rule-feature-table-wrap th,
.coding-rule-feature-table-wrap td,
.coding-rule-scheme-panel th,
.coding-rule-scheme-panel td {
  min-height: 36px;
  padding: 7px 9px;
  border-right: 1px solid #e0e4e9;
  border-bottom: 1px solid #dfe3e8;
  text-align: left;
  font-size: 12px;
}

.coding-rule-segment-scroll th,
.coding-rule-feature-table-wrap th,
.coding-rule-scheme-panel th {
  background: #f4f5f7;
  font-weight: 500;
}

.coding-rule-segment-scroll th:first-child,
.coding-rule-segment-scroll td:first-child,
.coding-rule-segment-scroll th:nth-child(2),
.coding-rule-segment-scroll td:nth-child(2) {
  width: 42px;
  text-align: center;
}

.coding-rule-segment-scroll th:nth-child(3) { width: 145px; }
.coding-rule-segment-scroll th:nth-child(5) { width: 110px; }

.coding-rule-segment-config {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 14px;
}

.coding-rule-segment-config label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}

.coding-rule-segment-config input:not([type="checkbox"]),
.coding-rule-segment-config select {
  width: 120px;
}

.coding-rule-example {
  min-height: 47px;
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 8px 20px;
  background: #f7f9fc;
  font-size: 12px;
}

.coding-rule-example strong {
  color: #356bc7;
  font-family: Consolas, monospace;
  letter-spacing: 0;
}

.coding-rule-scheme-panel,
.coding-rule-feature-panel {
  width: min(920px, calc(100vw - 32px));
  max-height: calc(100vh - 48px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid #d4dae2;
  background: #fff;
}

.coding-rule-scheme-panel {
  width: min(980px, calc(100vw - 32px));
  min-height: 620px;
}

.coding-rule-scheme-panel > header,
.coding-rule-feature-panel > header {
  min-height: 50px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 8px 18px;
  border-bottom: 1px solid #dce1e8;
}

.coding-rule-scheme-panel h2,
.coding-rule-feature-panel h2,
.coding-rule-feature-panel p {
  margin: 0;
}

.coding-rule-scheme-panel h2,
.coding-rule-feature-panel h2 {
  font-size: 16px;
}

.coding-rule-scheme-layout {
  min-height: 0;
  flex: 1;
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
}

.coding-rule-scheme-layout > aside {
  padding: 14px 10px;
  border-right: 1px solid #dce1e8;
  overflow: auto;
}

.coding-rule-scheme-layout > aside h3 {
  margin: 12px 10px 5px;
  font-size: 12px;
  font-weight: 500;
}

.coding-rule-scheme-layout > aside button {
  width: 100%;
  height: 33px;
  padding: 0 12px;
  border: 0;
  background: #fff;
  text-align: left;
}

.coding-rule-scheme-layout > aside button.active,
.coding-rule-scheme-layout > aside button:hover {
  color: #356bc7;
  background: #edf4ff;
}

.coding-rule-scheme-layout > main {
  min-width: 0;
  overflow: auto;
}

.coding-rule-scheme-name {
  display: flex;
  align-items: center;
  gap: 15px;
  padding: 15px 20px 8px;
  font-size: 12px;
}

.coding-rule-scheme-name input {
  width: 245px;
  height: 30px;
  border: 1px solid #cdd4de;
}

.coding-rule-scheme-name b {
  color: #d9363e;
}

.coding-rule-scheme-layout main > nav {
  display: flex;
  padding: 0 20px;
  border-bottom: 1px solid #dce1e8;
}

.coding-rule-scheme-layout main > nav button {
  height: 36px;
  padding: 0 18px;
  border: 0;
  border-bottom: 2px solid transparent;
  color: #495260;
  background: #fff;
}

.coding-rule-scheme-layout main > nav button.active {
  border-bottom-color: #4f82df;
  color: #356bc7;
}

.coding-rule-scheme-layout main > section {
  padding: 15px 20px;
}

.coding-rule-condition-row,
.coding-rule-start-condition,
.coding-rule-condition-head {
  display: grid;
  grid-template-columns: 58px 145px 150px minmax(110px, 1fr) 58px 86px 32px;
  gap: 7px;
  align-items: center;
  margin-bottom: 8px;
}

.coding-rule-condition-row select,
.coding-rule-condition-row input,
.coding-rule-start-condition select,
.coding-rule-start-condition input,
.coding-rule-scheme-panel td select {
  width: 100%;
  min-width: 0;
  height: 30px;
  border: 1px solid #ccd3dd;
  background: #fff;
}

.coding-rule-condition-row button,
.coding-rule-scheme-panel td button {
  width: 29px;
  height: 29px;
  border: 0;
  color: #7d8794;
  background: transparent;
}

.coding-rule-condition-row svg,
.coding-rule-scheme-panel td svg {
  width: 14px;
  height: 14px;
}

.coding-rule-scheme-columns {
  display: grid;
  grid-template-columns: repeat(3, minmax(150px, 1fr));
  gap: 9px 14px;
  padding-top: 14px;
}

.coding-rule-scheme-columns label {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 12px;
}

.coding-rule-scheme-panel > footer,
.coding-rule-feature-panel > footer {
  min-height: 54px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 9px;
  padding: 8px 18px;
  border-top: 1px solid #dce1e8;
}

.coding-rule-feature-body {
  min-height: 260px;
  padding: 16px;
  overflow: auto;
}

.coding-rule-feature-filters {
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: 9px;
  margin-bottom: 12px;
}

.coding-rule-feature-filters label,
.coding-breakpoint-form label {
  display: grid;
  gap: 5px;
  color: #596270;
  font-size: 12px;
}

.coding-rule-feature-filters input,
.coding-breakpoint-form input,
.coding-breakpoint-form select {
  height: 30px;
  padding: 0 8px;
  border: 1px solid #ccd3dd;
}

.coding-rule-feature-table-wrap {
  width: 100%;
  max-height: 420px;
  overflow: auto;
}

.coding-rule-feature-table-wrap table {
  min-width: 850px;
}

.coding-rule-feature-empty {
  padding: 35px;
  color: #8b95a3;
  text-align: center;
  font-size: 12px;
}

.coding-rule-advanced-settings,
.coding-breakpoint-form {
  display: grid;
  gap: 16px;
  padding: 18px;
}

.coding-rule-advanced-settings label {
  display: flex;
  align-items: center;
  gap: 8px;
}

.coding-rule-condition-tip {
  margin: 0 0 12px;
  color: #c45d12;
  font-size: 12px;
}

.coding-rule-condition-head {
  grid-template-columns: minmax(130px, 1fr) 145px 150px minmax(110px, 1fr) 86px;
  padding: 7px;
  background: #f3f5f7;
  font-size: 12px;
}

.coding-rule-start-condition {
  grid-template-columns: minmax(130px, 1fr) 145px 150px minmax(110px, 1fr) 86px;
}

@media (max-width: 980px) {
  .coding-rule-list-header { align-items: stretch; flex-direction: column; }
  .coding-rule-list-search { justify-content: space-between; }
  .coding-rule-list-layout { grid-template-columns: 185px 7px minmax(0, 1fr); }
  .coding-rule-form-grid { grid-template-columns: repeat(2, minmax(210px, 1fr)); }
  .coding-rule-pagination { align-items: flex-start; flex-direction: column; }
  .coding-rule-table-scroll { height: calc(100% - 78px); }
}

@media (max-width: 680px) {
  .coding-rule-list-layout { height: auto; min-height: 620px; grid-template-columns: 1fr; }
  .coding-rule-tree-panel { max-height: 230px; border-right: 0; border-bottom: 1px solid #ced5df; }
  .coding-rule-tree-resizer { display: none; }
  .coding-rule-table-panel { min-height: 420px; }
  .coding-rule-form-grid { grid-template-columns: 1fr; padding: 16px; }
  .coding-rule-form-grid fieldset { grid-column: span 1; }
  .coding-rule-scheme-layout { grid-template-columns: 1fr; }
  .coding-rule-scheme-layout > aside { max-height: 150px; border-right: 0; border-bottom: 1px solid #dce1e8; }
  .coding-rule-condition-row { min-width: 710px; }
  .coding-rule-scheme-layout main > section { overflow-x: auto; }
  .coding-rule-scheme-columns { grid-template-columns: 1fr 1fr; }
}

.purchase-request-document-panel {
  min-width: 0;
}

.purchase-request-document-header {
  min-height: 48px;
  padding-top: 6px;
  padding-bottom: 6px;
}

.purchase-request-toolbar {
  padding: 6px 12px;
}

.purchase-request-document-body {
  background: #e9edf3;
}

.purchase-request-basic-section {
  min-height: 292px;
  max-height: 380px;
}

.purchase-request-line-section {
  min-height: 170px;
}

.purchase-request-detail-panel {
  min-height: 0;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
}

.purchase-request-detail-panel.hidden {
  display: none;
}

.purchase-request-detail-table th[data-purchase-line-column],
.purchase-request-detail-table td[data-purchase-line-column] {
  width: 150px;
  min-width: 150px;
}

.purchase-order-detail-table th[data-purchase-order-line-column],
.purchase-order-detail-table td[data-purchase-order-line-column] {
  width: 150px;
  min-width: 150px;
}

.purchase-request-detail-table th[data-purchase-line-column="platformSku"],
.purchase-request-detail-table td[data-purchase-line-column="platformSku"],
.purchase-request-detail-table th[data-purchase-line-column="supplierMaterialCode"],
.purchase-request-detail-table td[data-purchase-line-column="supplierMaterialCode"],
.purchase-request-detail-table th[data-purchase-line-column="supplierMaterialName"],
.purchase-request-detail-table td[data-purchase-line-column="supplierMaterialName"] {
  width: 170px;
  min-width: 170px;
}

.purchase-order-detail-table th[data-purchase-order-line-column="platformSku"],
.purchase-order-detail-table td[data-purchase-order-line-column="platformSku"],
.purchase-order-detail-table th[data-purchase-order-line-column="supplierMaterialCode"],
.purchase-order-detail-table td[data-purchase-order-line-column="supplierMaterialCode"],
.purchase-order-detail-table th[data-purchase-order-line-column="supplierMaterialName"],
.purchase-order-detail-table td[data-purchase-order-line-column="supplierMaterialName"] {
  width: 170px;
  min-width: 170px;
}

.purchase-request-detail-table .sales-line-select-cell {
  width: 42px;
  min-width: 42px;
  position: sticky;
  left: 0;
  z-index: 5;
  background: #f2f3f5;
  text-align: center;
}

.purchase-order-detail-table .sales-line-select-cell {
  width: 42px;
  min-width: 42px;
  position: sticky;
  left: 0;
  z-index: 5;
  background: #f2f3f5;
  text-align: center;
}

.purchase-request-detail-table tbody .sales-line-select-cell {
  background: #fff;
}

.purchase-order-detail-table tbody .sales-line-select-cell {
  background: #fff;
}

.purchase-request-detail-table .purchase-line-sequence {
  width: 32px;
  min-width: 32px;
  position: sticky;
  left: 42px;
  z-index: 4;
  background: #f2f3f5;
  text-align: center;
}

.purchase-order-detail-table .purchase-line-sequence {
  width: 32px;
  min-width: 32px;
  position: sticky;
  left: 42px;
  z-index: 4;
  background: #f2f3f5;
  text-align: center;
}

.purchase-request-detail-table tbody .purchase-line-sequence {
  background: #fff;
}

.purchase-order-detail-table tbody .purchase-line-sequence {
  background: #fff;
}

.purchase-request-detail-table .purchase-detail-settings-spacer {
  width: 28px;
  min-width: 28px;
  background: #f2f3f5;
}

.purchase-order-detail-table .purchase-detail-settings-spacer {
  width: 28px;
  min-width: 28px;
  background: #f2f3f5;
}

.purchase-request-detail-table input:not([type="checkbox"]),
.purchase-request-detail-table select,
.purchase-order-detail-table input:not([type="checkbox"]),
.purchase-order-detail-table select,
.purchase-request-subtable input:not([type="checkbox"]),
.purchase-request-subtable select {
  width: 100%;
  height: 28px;
  padding: 0 6px;
  border: 1px solid transparent;
  border-radius: 0;
  outline: 0;
  color: #303743;
  background: transparent;
  font-size: 12px;
}

.purchase-request-detail-table input:not([type="checkbox"]):focus,
.purchase-request-detail-table select:focus,
.purchase-order-detail-table input:not([type="checkbox"]):focus,
.purchase-order-detail-table select:focus,
.purchase-request-subtable input:not([type="checkbox"]):focus,
.purchase-request-subtable select:focus {
  border-color: #4f82df;
  background: #fff;
}

.purchase-request-detail-table input:disabled {
  color: #626b77;
  background: #f5f6f8;
}

.purchase-order-detail-table input:disabled {
  color: #626b77;
  background: #f5f6f8;
}

.purchase-request-detail-table td:has(input[type="checkbox"]) {
  text-align: center;
}

.purchase-order-detail-table td:has(input[type="checkbox"]) {
  text-align: center;
}

.purchase-order-document-body {
  min-height: 0;
}

.purchase-order-upper-panel {
  min-height: 0;
  flex: 0 1 310px;
  overflow: auto;
}

.purchase-order-upper-panel.is-collapsed:not(.hidden) {
  display: none;
}

.purchase-order-detail-title {
  display: block;
  margin: 0 0 7px;
  color: #3974d4;
  font-size: 13px;
  font-weight: 500;
}

#personnelListPage.personnel-list-page {
  height: calc(100vh - 82px);
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding: 0;
  background: #fff;
}

.workspace.tabs-collapsed #personnelListPage.personnel-list-page { height: calc(100vh - 46px); }

.personnel-list-header {
  min-height: 52px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 7px 18px;
  border-bottom: 1px solid #e5e8ee;
  background: #fff;
}

.personnel-filter-row,
.personnel-search-row {
  display: flex;
  align-items: center;
  gap: 9px;
}

.personnel-filter-row > strong {
  font-size: 15px;
  font-weight: 500;
}

.personnel-filter-row > select {
  min-width: 160px;
  height: 30px;
  border: 1px solid #d7dce5;
  background: #fff;
}

#personnelListPage .personnel-toolbar {
  padding: 7px 18px;
  border-bottom: 7px solid #e9edf4;
}

.personnel-list-layout {
  min-height: 0;
  flex: 1;
  display: grid;
  grid-template-columns: minmax(250px, 380px) minmax(0, 1fr);
  overflow: hidden;
}

#personnelListPage > .filter-summary { min-height: 34px; padding: 0 12px; }

.personnel-department-tree {
  min-height: 0;
  position: relative;
  display: flex;
  flex-direction: column;
  border-right: 1px solid #dfe3ea;
  background: #fff;
}

.personnel-department-tree > label:first-child {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 10px 12px 6px;
  padding: 0 9px;
  border: 1px solid #d8dde6;
}

.personnel-department-tree > label:first-child svg {
  width: 14px;
  color: #8b95a5;
}

.personnel-department-tree > label:first-child input {
  width: 100%;
  height: 30px;
  border: 0;
  outline: 0;
}

#personnelDepartmentTree {
  min-height: 0;
  flex: 1;
  overflow: auto;
  padding: 0 0 42px;
}

#personnelDepartmentTree button {
  width: 100%;
  min-height: 30px;
  display: flex;
  align-items: center;
  gap: 5px;
  border: 0;
  color: #1f2733;
  background: transparent;
  text-align: left;
  cursor: pointer;
}

#personnelDepartmentTree button:hover,
#personnelDepartmentTree button.active {
  color: #3974d4;
  background: #eaf2ff;
}

#personnelDepartmentTree button svg { width: 14px; height: 14px; }
#personnelDepartmentTree .level-0 { padding-left: 16px; }
#personnelDepartmentTree .level-1 { padding-left: 34px; }
#personnelDepartmentTree .level-2 { padding-left: 54px; }
#personnelDepartmentTree .level-3 { padding-left: 82px; }

.personnel-child-toggle {
  position: absolute;
  left: 18px;
  bottom: 10px;
  display: flex;
  align-items: center;
  gap: 6px;
  background: #fff;
}

#personnelListPage .personnel-table-section {
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  border: 0;
  border-radius: 0;
}

.personnel-table-section .table-scroll { flex: 1; }
.currency-table.personnel-table { min-width: 1900px; }
.personnel-table th,
.personnel-table td { min-width: 105px; }
.personnel-table th[data-table-column="sortCode"],
.personnel-table td:nth-child(2) { min-width: 76px; width: 76px; }
.personnel-table th[data-table-column="avatar"] { min-width: 62px; width: 62px; }
.personnel-table th[data-table-column="departmentLongName"] { min-width: 270px; }
.personnel-table th[data-table-column="shrMapping"] { min-width: 210px; }
.personnel-table th[data-table-column="creationTime"],
.personnel-table th[data-table-column="modificationTime"] { min-width: 165px; }

.personnel-avatar-cell { text-align: center; }
.personnel-avatar-cell span,
#personnelAvatarPreview span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  color: #fff;
  background: #2d90e8;
  font-size: 12px;
}

.personnel-name-link {
  border: 0;
  color: #1769cf;
  background: transparent;
  cursor: pointer;
}

.personnel-boolean-cell { text-align: center; }
.personnel-boolean-cell svg { width: 15px; color: #12a66a; }

#personnelFormModal.personnel-form-backdrop {
  z-index: 140;
  padding: 0;
  background: #eef2f7;
}

.personnel-form-panel {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: #fff;
}

.personnel-form-titlebar {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 5px 18px;
  border-bottom: 1px solid #e5e8ee;
}

.personnel-form-titlebar > div {
  display: flex;
  align-items: baseline;
  gap: 9px;
}

.personnel-form-titlebar p,
.personnel-form-titlebar h2 { margin: 0; }
.personnel-form-titlebar p { color: #778397; font-size: 12px; }
.personnel-form-titlebar h2 { font-size: 17px; font-weight: 600; }
.personnel-form-titlebar span { color: #3974d4; font-size: 12px; }

.personnel-form-toolbar {
  min-height: 44px;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 5px 18px;
  border-bottom: 8px solid #e9edf4;
}

.personnel-form-toolbar > button,
.personnel-form-toolbar .split-command > button {
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 0 13px;
  border: 1px solid #4d7fe0;
  color: #fff;
  background: #5687e8;
  cursor: pointer;
}

.personnel-form-toolbar svg { width: 15px; height: 15px; }
.personnel-form-toolbar .split-caret { padding: 0 5px; }

.personnel-form-body {
  min-height: 0;
  flex: 1;
  display: grid;
  grid-template-rows: minmax(360px, 52%) minmax(220px, 48%);
  gap: 8px;
  overflow: hidden;
  background: #e9edf4;
}

.personnel-basic-section,
.personnel-detail-section {
  min-height: 0;
  overflow: auto;
  background: #fff;
}

.personnel-basic-section > header {
  height: 38px;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 0 18px;
  border-bottom: 1px solid #e5e8ee;
  color: #4d5869;
}

.personnel-basic-section > header svg { width: 14px; }

.personnel-info-content {
  display: grid;
  grid-template-columns: 155px minmax(0, 1fr);
  padding: 0 28px 22px;
}

.personnel-avatar-editor {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding-top: 12px;
}

#personnelAvatarPreview {
  width: 58px;
  height: 58px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: #fff;
  background: #dfe6f2;
}

#personnelAvatarPreview svg { width: 38px; height: 38px; }
#personnelAvatarPreview span { width: 58px; height: 58px; font-size: 21px; }
#personnelAvatarPreview img,
.personnel-avatar-cell img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.personnel-avatar-cell img { width: 26px; height: 26px; }
.personnel-avatar-editor button { border: 0; color: #3974d4; background: transparent; cursor: pointer; }

.personnel-form-sections section h3 {
  margin: 0 -8px 12px;
  padding: 6px 9px;
  color: #111820;
  background: #f3f4f6;
  font-size: 13px;
  font-weight: 500;
}

.personnel-form-sections section { padding-top: 4px; }

.personnel-field-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(170px, 1fr));
  gap: 12px 28px;
  padding: 0 46px 10px;
}

.personnel-field-grid.name-grid { grid-template-columns: repeat(2, minmax(250px, 1fr)); padding-right: 45%; }
.personnel-field-grid.account-grid { grid-template-columns: repeat(4, minmax(210px, 1fr)); }

.personnel-field-grid label,
.personnel-contact-panel label {
  display: grid;
  grid-template-columns: 86px minmax(0, 1fr);
  align-items: center;
  gap: 7px;
  font-size: 12px;
}

.personnel-field-grid label > span:first-child,
.personnel-contact-panel label > span:first-child { text-align: right; }
.personnel-field-grid input:not([type="checkbox"]),
.personnel-field-grid select,
.personnel-contact-panel input {
  width: 100%;
  height: 30px;
  border: 1px solid #d6dbe4;
  background: #fff;
}

.personnel-field-grid input:disabled { color: #858e9d; background: #f5f6f8; }
.personnel-field-grid .input-wrap { display: flex; }
.personnel-field-grid .input-wrap svg { right: 7px; width: 15px; }
.phone-input { display: grid; grid-template-columns: 58px minmax(0, 1fr); }
.phone-input select { border-right: 0; }
.personnel-switch-field { grid-template-columns: 110px auto !important; }

.personnel-detail-section > nav {
  height: 44px;
  display: flex;
  align-items: end;
  gap: 8px;
  padding: 0 40px;
  border-bottom: 1px solid #dfe3ea;
}

.personnel-detail-section > nav button {
  height: 36px;
  padding: 0 11px;
  border: 0;
  color: #3d4654;
  background: transparent;
  cursor: pointer;
}

.personnel-detail-section > nav button.active { color: #3974d4; border-bottom: 2px solid #3974d4; }
.personnel-detail-section > nav span { flex: 1; }
.personnel-detail-section > nav button:nth-last-child(-n+2) { color: #1769cf; }

.personnel-department-table-wrap { padding: 12px 40px; overflow: auto; }
.personnel-department-table { width: 100%; min-width: 1250px; border-collapse: collapse; }
.personnel-department-table th,
.personnel-department-table td { height: 34px; padding: 3px 6px; border: 1px solid #d9dee7; font-size: 12px; font-weight: 400; text-align: left; }
.personnel-department-table th { background: #f4f5f7; }
.personnel-department-table input:not([type="checkbox"]) { width: 100%; height: 27px; border: 1px solid #d6dbe4; }
.personnel-department-table td:has(input[type="checkbox"]) { width: 36px; text-align: center; }
.personnel-department-table td:nth-child(2) { width: 34px; text-align: center; }

.personnel-contact-panel {
  display: grid;
  grid-template-columns: repeat(2, minmax(260px, 1fr));
  gap: 16px 40px;
  padding: 26px 60px;
}

@media (max-width: 1050px) {
  .personnel-list-layout { grid-template-columns: 240px minmax(0, 1fr); }
  .personnel-list-header { align-items: flex-start; flex-direction: column; }
  .personnel-field-grid,
  .personnel-field-grid.account-grid { grid-template-columns: repeat(2, minmax(220px, 1fr)); }
  .personnel-field-grid.name-grid { padding-right: 46px; }
}

.purchase-request-finance-grid,
.purchase-request-creation-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px 18px;
}

.purchase-request-finance-grid .field,
.purchase-request-creation-grid .field {
  display: grid;
  grid-template-columns: minmax(70px, max-content) minmax(0, 1fr);
  align-items: center;
  gap: 6px;
  margin: 0;
}

.purchase-request-finance-grid .field > span:first-child,
.purchase-request-creation-grid .field > span:first-child {
  text-align: right;
  white-space: nowrap;
}

.purchase-request-finance-grid .input-wrap,
.purchase-request-creation-grid .input-wrap {
  height: 26px;
  min-height: 26px;
  border-radius: 1px;
}

.purchase-request-subtable-actions {
  min-height: 36px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 18px;
  padding: 0 14px;
}

.purchase-request-subtable-actions button {
  padding: 0;
  border: 0;
  color: #1264d7;
  background: transparent;
  cursor: pointer;
}

.purchase-request-subtable {
  min-width: 900px;
}

.purchase-request-empty-row {
  height: 80px !important;
  color: #8a929d;
  text-align: center;
}

.purchase-request-transfer-panel,
.purchase-request-import-panel {
  width: min(560px, calc(100vw - 32px));
}

.purchase-request-transfer-body {
  display: grid;
  gap: 14px;
}

.purchase-request-transfer-selection {
  margin: 0;
  padding: 10px 12px;
  border-left: 3px solid #4f82df;
  color: #4b5665;
  background: #f4f7fc;
  font-size: 12px;
  line-height: 1.6;
}

.purchase-request-transfer-body .field {
  display: grid;
  grid-template-columns: 88px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  margin: 0;
}

.purchase-request-transfer-body .field > span:first-child {
  text-align: right;
}

.purchase-request-import-body {
  display: grid;
  gap: 14px;
}

.purchase-request-import-body > p {
  margin: 0;
  color: #606a77;
  font-size: 12px;
  line-height: 1.7;
}

@media (max-width: 1100px) {
  .purchase-request-finance-grid,
  .purchase-request-creation-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

* {
  box-sizing: border-box;
}

html,
body {
  min-height: 100%;
  margin: 0;
}

body {
  color: var(--ink);
  background: var(--canvas);
  font-family: "Noto Sans SC", "Microsoft YaHei", sans-serif;
  letter-spacing: 0;
}

button,
input {
  font: inherit;
  letter-spacing: 0;
}

button {
  color: inherit;
}

.hidden {
  display: none !important;
}

.login-shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(430px, 0.8fr);
  background: var(--surface);
}

.brand-scene {
  min-height: 100vh;
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 42px clamp(36px, 5vw, 84px);
  color: #fff;
  background-image: url("assets/login-office.jpg");
  background-position: center;
  background-size: cover;
}

.brand-scene::before {
  position: absolute;
  inset: 0;
  content: "";
  background: rgba(8, 31, 25, 0.54);
}

.brand-scene > * {
  position: relative;
  z-index: 1;
}

.brand-mark,
.mobile-brand,
.workspace-logo {
  display: flex;
  align-items: center;
  gap: 11px;
  font-size: 19px;
  font-weight: 700;
}

.brand-symbol {
  width: 38px;
  height: 38px;
  display: inline-grid;
  place-items: center;
  border-radius: 6px;
  color: #fff;
  background: var(--brand);
  font-size: 21px;
  font-weight: 700;
}

.brand-scene .brand-symbol {
  color: var(--brand-dark);
  background: #fff;
}

.scene-copy {
  max-width: 620px;
  margin-bottom: 5vh;
}

.scene-kicker {
  margin: 0 0 16px;
  color: #f3c66f;
  font-size: 13px;
  font-weight: 700;
}

.scene-copy h1 {
  margin: 0;
  font-size: clamp(42px, 5vw, 76px);
  line-height: 1.08;
}

.scene-copy p:last-child {
  margin: 22px 0 0;
  font-size: 19px;
}

.scene-note {
  margin: 0;
  color: rgba(255, 255, 255, 0.8);
  font-size: 13px;
}

.login-panel {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 34px clamp(30px, 4vw, 70px);
}

.login-card {
  width: min(100%, 430px);
}

.mobile-brand {
  display: none;
  margin-bottom: 32px;
}

.login-header p {
  margin: 0 0 6px;
  color: var(--brand);
  font-size: 14px;
  font-weight: 600;
}

.login-header h2 {
  margin: 0;
  font-size: 28px;
  line-height: 1.35;
}

.login-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 2px;
  margin: 34px 0 26px;
  border-bottom: 1px solid var(--line);
}

.login-tab {
  position: relative;
  min-height: 45px;
  border: 0;
  background: transparent;
  color: var(--muted);
  cursor: pointer;
}

.login-tab::after {
  position: absolute;
  right: 18%;
  bottom: -1px;
  left: 18%;
  height: 2px;
  content: "";
  background: transparent;
}

.login-tab.active {
  color: var(--brand);
  font-weight: 600;
}

.login-tab.active::after {
  background: var(--brand);
}

.field {
  display: block;
  margin-bottom: 18px;
}

.field > span:first-child {
  display: block;
  margin-bottom: 7px;
  font-size: 13px;
  font-weight: 500;
}

.input-wrap {
  min-height: 48px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 13px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  transition: border-color 160ms ease, box-shadow 160ms ease;
}

.input-wrap:focus-within {
  border-color: var(--brand);
  box-shadow: 0 0 0 3px rgba(10, 118, 91, 0.1);
}

.input-wrap.error {
  border-color: var(--danger);
}

.input-wrap svg {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  color: #7a8782;
}

.input-wrap input {
  width: 100%;
  min-width: 0;
  height: 44px;
  padding: 0;
  border: 0;
  outline: 0;
  color: var(--ink);
  background: transparent;
  font-size: 14px;
}

.input-wrap input::placeholder {
  color: #9ba5a1;
}

.field-error {
  min-height: 17px;
  display: block;
  padding-top: 4px;
  color: var(--danger);
  font-size: 12px;
}

.order-required-reminder {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px 14px;
  margin: 8px 14px 0;
  padding: 9px 12px;
  border: 1px solid #e8a0a0;
  border-left: 3px solid #c93636;
  background: #fff7f7;
  color: #7f1d1d;
  font-size: 13px;
}

.order-required-reminder strong,
.order-required-reminder small {
  white-space: nowrap;
}

.order-required-reminder span {
  min-width: 0;
  overflow-wrap: anywhere;
}

.order-required-missing:is(input, select, textarea),
.order-required-missing input,
.order-required-missing select,
.order-required-missing textarea {
  border-color: #d14343 !important;
  background: #fff8f8 !important;
  box-shadow: inset 0 0 0 1px rgba(209, 67, 67, 0.12);
}

.order-required-badge {
  display: inline-flex;
  align-items: center;
  min-height: 18px;
  margin-left: 6px;
  padding: 0 5px;
  border: 1px solid #e7a0a0;
  border-radius: 2px;
  background: #fff1f1;
  color: #b42323;
  font-size: 11px;
  line-height: 16px;
}

@media (max-width: 900px) {
  .order-required-reminder {
    grid-template-columns: 1fr;
  }

  .order-required-reminder strong,
  .order-required-reminder small {
    white-space: normal;
  }
}

.icon-button,
.link-button,
.text-action {
  border: 0;
  background: transparent;
  cursor: pointer;
}

.icon-button {
  width: 36px;
  height: 36px;
  display: inline-grid;
  flex: 0 0 auto;
  place-items: center;
  border-radius: 5px;
  color: var(--muted);
}

.icon-button:hover {
  background: #edf2ef;
  color: var(--brand);
}

.code-wrap input {
  max-width: 150px;
}

.text-action {
  min-width: 94px;
  padding: 5px 0;
  color: var(--brand);
  font-size: 13px;
  font-weight: 600;
}

.text-action:disabled {
  color: #9ba5a1;
  cursor: not-allowed;
}

.form-options {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 2px 0 22px;
  font-size: 13px;
}

.remember-option {
  display: flex;
  align-items: center;
  gap: 7px;
  cursor: pointer;
}

.remember-option input {
  width: 15px;
  height: 15px;
  accent-color: var(--brand);
}

.link-button {
  padding: 0;
  color: var(--brand);
  font-size: inherit;
}

.primary-button,
.secondary-button {
  min-height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border-radius: 6px;
  cursor: pointer;
}

.primary-button {
  width: 100%;
  border: 1px solid var(--brand);
  color: #fff;
  background: var(--brand);
  font-weight: 600;
}

.primary-button:hover {
  border-color: var(--brand-dark);
  background: var(--brand-dark);
}

.primary-button:disabled {
  opacity: 0.72;
  cursor: wait;
}

.primary-button svg,
.secondary-button svg {
  width: 17px;
  height: 17px;
}

.agreement {
  margin: 16px 0 0;
  color: var(--muted);
  text-align: center;
  font-size: 12px;
  line-height: 1.8;
}

.login-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 44px;
  padding-top: 18px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 12px;
}

.login-footer span:first-child {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.login-footer svg {
  width: 15px;
  height: 15px;
  color: var(--brand);
}

.workspace {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 218px minmax(0, 1fr);
}

.workspace-sidebar {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  padding: 22px 14px;
  color: #fff;
  background: #17231f;
}

.workspace-logo {
  padding: 0 10px 25px;
}

.workspace-sidebar nav {
  display: grid;
  gap: 5px;
}

.nav-group {
  display: grid;
  gap: 3px;
}

.nav-item {
  min-height: 44px;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 0 13px;
  border: 0;
  border-radius: 5px;
  color: #c7d1cd;
  background: transparent;
  cursor: pointer;
  text-align: left;
}

.nav-item:hover,
.nav-item.active {
  color: #fff;
  background: #294039;
}

.nav-item.active {
  box-shadow: inset 3px 0 var(--accent);
}

.nav-item svg {
  width: 18px;
  height: 18px;
}

.nav-parent .nav-chevron {
  width: 15px;
  height: 15px;
  margin-left: auto;
  transition: transform 160ms ease;
}

.nav-group.open .nav-chevron {
  transform: rotate(90deg);
}

.subnav {
  display: grid;
  padding-left: 42px;
}

.nav-group:not(.open) .subnav {
  display: none;
}

.subnav-item {
  min-height: 34px;
  padding: 0 10px;
  border: 0;
  border-radius: 4px;
  color: #aebdb7;
  background: transparent;
  cursor: pointer;
  text-align: left;
  font-size: 13px;
}

.subnav-item:hover,
.subnav-item.active {
  color: #fff;
  background: #20342e;
}

.subnav-label {
  display: block;
  padding: 5px 10px 2px;
  color: #7f928a;
  font-size: 10px;
}

.logout-button {
  margin-top: auto;
}

.workspace-main {
  min-width: 0;
}

.workspace-header {
  min-height: 72px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 28px;
  border-bottom: 1px solid var(--line);
  background: var(--surface);
}

.workspace-header p,
.workspace-header h2 {
  margin: 0;
}

.workspace-header p {
  color: var(--muted);
  font-size: 12px;
}

.workspace-header h2 {
  margin-top: 2px;
  font-size: 20px;
}

.user-chip {
  display: flex;
  align-items: center;
  gap: 10px;
}

.user-chip > span {
  width: 35px;
  height: 35px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: var(--brand);
  font-size: 13px;
  font-weight: 700;
}

.user-chip div {
  display: grid;
}

.user-chip strong {
  font-size: 13px;
}

.user-chip small {
  color: var(--muted);
  font-size: 11px;
}

.workspace-content {
  width: min(100%, 1280px);
  margin: 0 auto;
  padding: 28px;
}

.welcome-band {
  min-height: 112px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 2px 22px;
  border-bottom: 1px solid var(--line);
}

.welcome-band p,
.welcome-band h1 {
  margin: 0;
}

.welcome-band p {
  margin-bottom: 7px;
  color: var(--muted);
  font-size: 13px;
}

.welcome-band h1 {
  font-size: 28px;
}

.secondary-button {
  min-height: 38px;
  padding: 0 14px;
  border: 1px solid var(--line);
  background: #fff;
}

.secondary-button:hover {
  border-color: var(--brand);
  color: var(--brand);
}

.metric-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  padding: 24px 0;
}

.metric-item {
  min-width: 0;
  min-height: 148px;
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto auto;
  align-content: center;
  column-gap: 11px;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}

.metric-item > svg {
  width: 22px;
  height: 22px;
  grid-row: 1 / span 3;
  color: var(--brand);
}

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

.metric-item strong {
  margin: 6px 0 1px;
  font-size: 26px;
}

.metric-item small {
  color: #89938f;
  font-size: 11px;
}

.quick-section {
  padding-top: 10px;
}

.section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 13px;
}

.section-heading h3 {
  margin: 0;
  font-size: 17px;
}

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

.quick-grid button {
  min-height: 74px;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 0 18px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  cursor: pointer;
}

.quick-grid button:hover {
  border-color: var(--brand);
  color: var(--brand);
}

.quick-grid svg {
  width: 20px;
  height: 20px;
}

.module-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 28px;
  padding: 8px 0 22px;
  border-bottom: 1px solid var(--line);
}

.breadcrumb {
  display: flex;
  align-items: center;
  gap: 4px;
  color: var(--muted);
  font-size: 12px;
}

.breadcrumb svg {
  width: 14px;
  height: 14px;
}

.breadcrumb strong {
  color: var(--brand);
  font-weight: 600;
}

.module-heading h1 {
  margin: 13px 0 3px;
  font-size: 28px;
}

.module-heading p {
  margin: 0;
  color: var(--muted);
  font-size: 13px;
}

.module-search {
  width: min(100%, 320px);
  min-height: 40px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}

.module-search:focus-within {
  border-color: var(--brand);
  box-shadow: 0 0 0 3px rgba(10, 118, 91, 0.1);
}

.module-search svg {
  width: 17px;
  height: 17px;
  color: var(--muted);
}

.module-search input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  font-size: 13px;
}

.public-data-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  padding: 24px 0;
}

.public-data-item {
  min-width: 0;
  min-height: 108px;
  position: relative;
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  grid-template-rows: auto auto;
  align-content: center;
  column-gap: 11px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  cursor: pointer;
  text-align: left;
}

.public-data-item:hover {
  border-color: var(--brand);
  box-shadow: 0 8px 24px rgba(16, 30, 25, 0.08);
}

.public-data-item > svg:first-child {
  width: 32px;
  height: 32px;
  grid-row: 1 / span 2;
  padding: 7px;
  border-radius: 5px;
  color: var(--brand);
  background: #eaf4f0;
}

.public-data-item > span {
  min-width: 0;
  padding-right: 16px;
  overflow: hidden;
  font-size: 14px;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.public-data-item > small {
  min-width: 0;
  margin-top: 4px;
  color: var(--muted);
  overflow: hidden;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.public-data-item .item-arrow {
  position: absolute;
  top: 15px;
  right: 14px;
  width: 15px;
  height: 15px;
  color: #9aa5a0;
}

.empty-state {
  min-height: 280px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 7px;
  color: var(--muted);
}

.empty-state svg {
  width: 32px;
  height: 32px;
  margin-bottom: 6px;
}

.empty-state strong {
  color: var(--ink);
  font-size: 14px;
}

.empty-state span {
  font-size: 12px;
}

.currency-heading {
  align-items: center;
}

.data-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 0;
  border-bottom: 1px solid var(--line);
}

.toolbar-primary,
.toolbar-secondary {
  display: flex;
  align-items: center;
  gap: 6px;
}

.command-button {
  min-height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  padding: 0 11px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: #fff;
  cursor: pointer;
  font-size: 13px;
}

.command-button:hover:not(:disabled) {
  border-color: var(--brand);
  color: var(--brand);
}

.command-button:disabled {
  color: #a4aca9;
  background: #f2f4f3;
  cursor: not-allowed;
}

.permission-hidden {
  display: none !important;
}

.permission-state {
  min-height: 32px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0 9px;
  border: 1px solid #d7ddda;
  border-radius: 4px;
  color: #65716c;
  background: #f5f7f6;
  font-size: 12px;
}

.permission-state svg {
  width: 14px;
  height: 14px;
}

.command-button svg {
  width: 16px;
  height: 16px;
}

.primary-command {
  border-color: var(--brand);
  color: #fff;
  background: var(--brand);
}

.primary-command:hover:not(:disabled) {
  border-color: var(--brand-dark);
  color: #fff;
  background: var(--brand-dark);
}

.danger-command:hover:not(:disabled) {
  border-color: var(--danger);
  color: var(--danger);
}

.filter-summary {
  min-height: 48px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.filter-chip {
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 9px;
  border: 1px solid #acd5c8;
  border-radius: 4px;
  color: var(--brand-dark);
  background: #edf7f3;
  cursor: pointer;
  font-size: 12px;
}

.filter-chip svg {
  width: 13px;
  height: 13px;
}

.filter-note {
  color: var(--muted);
  font-size: 12px;
}

.data-table-section {
  position: relative;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  overflow: hidden;
}

.table-scroll {
  width: 100%;
  overflow-x: auto;
}

.currency-table {
  width: 100%;
  min-width: 850px;
  border-collapse: collapse;
  table-layout: fixed;
}

.currency-table th,
.currency-table td {
  height: 46px;
  padding: 0 14px;
  border-bottom: 1px solid #e8ecea;
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
}

.currency-table th {
  height: 42px;
  color: #56625d;
  background: #f3f6f4;
  font-size: 12px;
  font-weight: 600;
}

.currency-table tbody tr:hover {
  background: #f6faf8;
}

.currency-table tbody tr.selected {
  background: #edf7f3;
}

.currency-table tbody tr:last-child td {
  border-bottom: 0;
}

.currency-table .selection-column {
  width: 48px;
  padding: 0;
  text-align: center;
}

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

.currency-table th:nth-child(3) {
  width: 300px;
}

.currency-table .number-column {
  width: 130px;
}

.currency-table th:last-child {
  width: 140px;
}

.currency-table input[type="checkbox"] {
  width: 15px;
  height: 15px;
  accent-color: var(--brand);
}

.column-filter-button {
  width: 100%;
  min-height: 36px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 0;
  border: 0;
  color: inherit;
  background: transparent;
  cursor: pointer;
  text-align: left;
}

.column-filter-button svg {
  width: 13px;
  height: 13px;
  color: #8b9692;
}

.column-filter-button.active,
.column-filter-button.active svg {
  color: var(--brand);
}

.column-header-layout {
  width: 100%;
  min-width: 0;
  position: relative;
  display: flex;
  align-items: center;
  gap: 3px;
}

.column-drag-handle {
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
  color: #9aa39f;
  cursor: grab;
  touch-action: none;
}

.column-pointer-dragging,
.column-pointer-dragging * {
  cursor: grabbing !important;
  user-select: none !important;
}

th[data-table-column] {
  user-select: none;
}

th[data-table-column]:active .column-drag-handle {
  cursor: grabbing;
}

th.column-dragging {
  opacity: 0.5;
  background: #e9f3ef;
}

th.column-drag-over-left {
  box-shadow: inset 3px 0 0 var(--brand);
}

th.column-drag-over-right {
  box-shadow: inset -3px 0 0 var(--brand);
}

.column-header-layout .column-filter-button {
  min-width: 0;
  flex: 1;
}

.column-header-layout .column-filter-button span {
  overflow: visible;
  text-overflow: clip;
  flex-shrink: 0;
  white-space: nowrap;
}

.directory-condition-table { width:100%; min-width:1040px; border-collapse:collapse; }
.directory-condition-table th,.directory-condition-table td { padding:8px; border-bottom:1px solid #e6e9ee; white-space:nowrap; text-align:left; }
.directory-condition-table th { background:#f5f7fa; }
.directory-condition-table input { min-width:150px; }
.directory-condition-table select { min-width:65px; padding:7px; }
.directory-condition-table button { color:#276bd1; background:white; border:0; cursor:pointer; }
.directory-condition-table details[open] { position:relative; }
.directory-condition-table details[open] button { display:block; padding:6px 12px; }
.directory-reference-cell { min-width:0; }
.directory-reference-cell > input,.directory-reference-cell > select { flex:1; min-width:0; }

.column-move-controls {
  position: absolute;
  right: 0;
  top: 100%;
  z-index: 2;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 1px;
  padding-left: 3px;
  background: #f3f6f4;
  opacity: 0;
  pointer-events: none;
  transform: none;
  visibility: hidden;
}

.column-header-layout:hover .column-move-controls,
.column-header-layout:focus-within .column-move-controls {
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
}

.column-move-controls button {
  width: 22px;
  height: 24px;
  display: inline-grid;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 3px;
  color: #7f8a86;
  background: transparent;
  cursor: pointer;
}

.column-move-controls button:hover:not(:disabled) {
  color: var(--brand);
  background: #e9f3ef;
}

.column-move-controls button:disabled {
  color: #c4cbc8;
  cursor: not-allowed;
}

.column-move-controls svg {
  width: 13px;
  height: 13px;
}

.currency-table th[data-table-column="code"] {
  width: 160px;
}

.currency-table th[data-table-column="name"] {
  width: 280px;
}

.currency-table th[data-table-column="amountPrecision"],
.currency-table th[data-table-column="pricePrecision"] {
  width: 150px;
}

.currency-table th[data-table-column="status"] {
  width: 150px;
}

.log-table th[data-table-column="sequence"] {
  width: 86px;
}

.log-table th[data-table-column="organization"] {
  width: 250px;
}

.log-table th[data-table-column="object"],
.log-table th[data-table-column="description"] {
  width: 180px;
}

.log-table th[data-table-column="time"] {
  width: 190px;
}

.status-pill {
  min-width: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
}

.status-pill.enabled {
  color: #0b6d54;
  background: #e4f4ee;
}

.status-pill.disabled {
  color: #776c62;
  background: #eeecea;
}

.table-empty {
  min-height: 240px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 7px;
  color: var(--muted);
}

.table-empty svg {
  width: 30px;
  height: 30px;
  margin-bottom: 4px;
}

.table-empty strong {
  color: var(--ink);
  font-size: 14px;
}

.table-empty span {
  font-size: 12px;
}

.table-pagination {
  min-height: 52px;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 12px;
  padding: 0 14px;
  border-top: 1px solid var(--line);
  color: var(--muted);
  font-size: 12px;
}

.table-pagination > div {
  display: flex;
  align-items: center;
  gap: 5px;
}

.table-pagination > label {
  justify-self: end;
}

.table-pagination select {
  min-height: 30px;
  margin: 0 4px;
  border: 1px solid var(--line);
  border-radius: 4px;
  background: #fff;
}

.column-filter-panel {
  width: 250px;
  position: fixed;
  z-index: 35;
  display: grid;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  box-shadow: var(--shadow);
}

.column-filter-panel strong {
  font-size: 13px;
}

.column-filter-panel select,
.column-filter-panel input {
  min-height: 36px;
  width: 100%;
  padding: 0 9px;
  border: 1px solid var(--line);
  border-radius: 5px;
  outline: 0;
  background: #fff;
  font-size: 13px;
}

.column-filter-panel select:focus,
.column-filter-panel input:focus {
  border-color: var(--brand);
}

.column-filter-panel > div {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.column-filter-panel .secondary-button,
.column-filter-panel .compact-primary {
  min-height: 34px;
}

.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 50;
  display: grid;
  place-items: center;
  padding: 24px;
  background: rgba(20, 30, 27, 0.48);
}

.modal-panel {
  width: min(100%, 680px);
  max-height: min(90vh, 760px);
  display: flex;
  flex-direction: column;
  border-radius: 6px;
  background: #fff;
  box-shadow: var(--shadow);
  overflow: hidden;
}

.modal-header,
.modal-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 22px;
}

.modal-header {
  border-bottom: 1px solid var(--line);
}

.modal-header p,
.modal-header h2 {
  margin: 0;
}

.modal-header p {
  margin-bottom: 3px;
  color: var(--brand);
  font-size: 11px;
  font-weight: 600;
}

.modal-header h2 {
  font-size: 19px;
}

.modal-body {
  padding: 22px;
  overflow-y: auto;
}

.modal-footer {
  justify-content: flex-end;
  border-top: 1px solid var(--line);
}

.modal-footer .secondary-button,
.modal-footer .modal-primary {
  width: auto;
  min-width: 90px;
  min-height: 38px;
  padding: 0 15px;
}

.sales-feature-panel {
  width: min(1040px, calc(100vw - 48px));
  max-height: min(88vh, 820px);
}

.sales-feature-body {
  min-height: 320px;
  padding: 0;
}

.sales-feature-note {
  margin: 0;
  padding: 14px 20px;
  border-bottom: 1px solid #e5e9ef;
  color: #52606d;
  background: #f7f9fc;
}

.sales-feature-filter,
.sales-feature-form,
.sales-feature-checks {
  display: flex;
  align-items: end;
  gap: 12px;
  padding: 16px 20px;
  border-bottom: 1px solid #e5e9ef;
}

.sales-feature-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
}

.sales-feature-form label,
.sales-feature-filter label {
  display: grid;
  gap: 6px;
  color: #4b5563;
  font-size: 13px;
}

.sales-feature-form label.wide { grid-column: 1 / -1; }

.sales-feature-form input,
.sales-feature-form select,
.sales-feature-form textarea,
.sales-feature-filter input,
.sales-feature-filter select {
  min-height: 34px;
  padding: 6px 10px;
  border: 1px solid #cfd6df;
  border-radius: 2px;
  background: #fff;
  color: #1f2937;
}

.sales-feature-table-wrap {
  max-height: 430px;
  overflow: auto;
}

.sales-feature-table {
  width: 100%;
  min-width: 760px;
  border-collapse: collapse;
  font-size: 13px;
}

.sales-feature-table th,
.sales-feature-table td {
  height: 38px;
  padding: 7px 12px;
  border-right: 1px solid #e6e9ee;
  border-bottom: 1px solid #e6e9ee;
  text-align: left;
  white-space: nowrap;
}

.sales-feature-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #f5f7fa;
  color: #374151;
  font-weight: 500;
}

.sales-feature-empty {
  height: 180px !important;
  color: #8b95a4;
  text-align: center !important;
}

.sales-feature-tabs {
  display: flex;
  gap: 24px;
  min-height: 44px;
  padding: 0 20px;
  border-bottom: 1px solid #dde3eb;
}

.sales-feature-tabs button {
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: #4b5563;
}

.sales-feature-tabs button.active {
  border-bottom-color: #2f74dc;
  color: #2f74dc;
}

.sales-feature-checks {
  align-items: flex-start;
  flex-direction: column;
}

.sales-feature-filter-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(150px, 1fr));
  align-items: end;
}

.sales-template-mode-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  padding: 16px 20px;
  border-bottom: 1px solid #dde3eb;
}

.sales-template-mode-strip button {
  display: grid;
  gap: 5px;
  min-height: 66px;
  padding: 10px 14px;
  border: 1px solid #cfd6df;
  border-radius: 2px;
  background: #fff;
  color: #4b5563;
  text-align: left;
}

.sales-template-mode-strip button.active {
  border: 2px solid #2f74dc;
  color: #2f74dc;
}

.sales-template-mode-strip button span {
  color: #7b8491;
  font-size: 12px;
}

.sales-template-object {
  display: flex;
  gap: 20px;
  align-items: center;
  min-height: 40px;
  padding: 0 20px;
  border-bottom: 1px solid #e5e9ef;
}

.sales-template-object code {
  color: #52606d;
}

.sales-template-batch-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 6px 20px;
  border-bottom: 1px solid #e5e9ef;
  background: #f8fafc;
}

.sales-template-batch-actions button {
  min-height: 28px;
  padding: 0 12px;
  border: 1px solid #c8d0da;
  border-radius: 2px;
  background: #fff;
  color: #374151;
}

.sales-template-batch-actions span {
  margin-left: auto;
  color: #667085;
  font-size: 12px;
}

.sales-template-priority-note {
  margin: 12px 20px 0;
}

.sales-template-field-table {
  min-width: 920px;
}

.sales-template-field-table input[type="checkbox"] {
  width: 16px;
  height: 16px;
}

.sales-template-width-input {
  width: 110px;
  min-height: 28px;
  border: 1px solid #cfd6df;
}

.sales-template-drag {
  margin-right: 8px;
  color: #9aa3af;
}

.sales-template-group-row td {
  background: #f8fafc;
  font-weight: 500;
}

.sales-template-parameters {
  padding: 12px 20px;
  border-top: 1px solid #e5e9ef;
}

.sales-template-parameters label {
  display: block;
  margin-top: 12px;
}

.sales-template-save-row {
  display: flex;
  justify-content: flex-start;
  padding: 10px 20px;
  border-top: 1px solid #dde3eb;
}

.sales-template-save-row button {
  border: 0;
  background: transparent;
  color: #2f74dc;
}

.credit-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1px;
  background: #e5e9ef;
}

.credit-summary > div {
  display: grid;
  gap: 8px;
  padding: 22px;
  background: #fff;
}

.list-total-table { min-width: 520px; }

.list-options-empty {
  display: grid;
  place-items: center;
  gap: 10px;
  min-height: 260px;
  color: #7b8794;
  text-align: center;
}

.list-options-empty svg { width: 30px; height: 30px; }

#conversionRuleConditionModal {
  z-index: 160;
}

.conversion-list-header {
  min-height: 42px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  border-bottom: 1px solid #e2e6ed;
}

.conversion-list-header > label,
.conversion-list-header > div,
.conversion-list-search {
  display: flex;
  align-items: center;
}

.conversion-list-header > label {
  gap: 14px;
  color: #202630;
  font-size: 14px;
}

.conversion-list-header select {
  width: 164px;
  height: 30px;
  padding: 0 10px;
  border: 1px solid #ccd2dc;
  border-radius: 2px;
  color: #313946;
  background: #fff;
}

.conversion-list-header > div {
  gap: 14px;
}

.conversion-list-search {
  width: 210px;
  height: 30px;
  gap: 6px;
  padding: 0 9px;
  border: 1px solid #d7dce4;
  background: #fff;
}

.conversion-list-search svg,
.conversion-list-header > div > button svg {
  width: 14px;
  height: 14px;
}

.conversion-list-search svg {
  flex: 0 0 auto;
  color: #9aa2ae;
}

.conversion-list-search input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  font-size: 12px;
}

.conversion-list-header > div > button {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 0;
  border: 0;
  color: #4f82df;
  background: transparent;
  cursor: pointer;
  font-size: 12px;
}

.conversion-list-toolbar {
  min-height: 44px;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 6px 4px;
  border-bottom: 7px solid #edf0f5;
}

.conversion-list-toolbar button {
  min-width: 56px;
  height: 30px;
  padding: 0 14px;
  border: 1px solid #4f82df;
  border-radius: 2px;
  color: #fff;
  background: #4f82df;
  cursor: pointer;
  font-size: 12px;
}

.conversion-list-toolbar button:hover:not(:disabled) {
  border-color: #3d70ce;
  background: #3d70ce;
}

.conversion-list-toolbar button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.conversion-list-layout {
  height: calc(100vh - 192px);
  min-height: 480px;
  display: grid;
  grid-template-columns: minmax(190px, 20%) 8px minmax(0, 1fr);
  border: 1px solid #e0e4eb;
  border-top: 0;
  overflow: hidden;
}

.conversion-rule-tree {
  padding: 4px 0 12px;
  border-right: 1px solid #cfd5df;
  background: #fff;
  overflow-y: auto;
}

.conversion-rule-tree button {
  width: 100%;
  min-height: 34px;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 0 24px;
  border: 0;
  color: #202630;
  background: transparent;
  cursor: pointer;
  text-align: left;
  font-size: 13px;
}

.conversion-rule-tree button:hover,
.conversion-rule-tree button.active {
  color: #3d70ce;
  background: #f0f5ff;
}

.conversion-rule-tree svg {
  width: 13px;
  height: 13px;
  flex: 0 0 auto;
  color: #586676;
}

.conversion-rule-resizer {
  position: relative;
  border-right: 1px solid #c3c9d3;
  border-left: 1px solid #e0e4eb;
  background: #f1f3f6;
}

.conversion-rule-resizer span {
  width: 7px;
  height: 34px;
  position: absolute;
  top: 48%;
  left: 0;
  border-radius: 4px;
  background: #9ca6b3;
  transform: translateY(-50%);
}

.conversion-rule-table-panel {
  min-width: 0;
  position: relative;
  background: #fff;
}

.conversion-rule-selection {
  height: 32px;
  display: flex;
  align-items: center;
  padding: 0 9px;
  border-bottom: 1px solid #dfe3e9;
  color: #333b48;
  font-size: 12px;
}

.conversion-rule-table-scroll {
  width: 100%;
  height: calc(100% - 32px);
  overflow: auto;
}

.conversion-rule-table {
  width: 100%;
  min-width: 1780px;
  border-collapse: collapse;
  table-layout: fixed;
}

.conversion-rule-table th,
.conversion-rule-table td {
  height: 37px;
  padding: 0 8px;
  border-right: 1px solid #e1e4e9;
  border-bottom: 1px solid #dfe3e8;
  overflow: hidden;
  color: #252c36;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
}

.conversion-rule-table th {
  height: 32px;
  color: #303844;
  background: #f4f5f7;
  font-weight: 500;
}

.conversion-rule-table tbody tr:hover,
.conversion-rule-table tbody tr.selected {
  background: #eef5ff;
}

.conversion-rule-table th:nth-child(1),
.conversion-rule-table td:nth-child(1) { width: 42px; text-align: center; }
.conversion-rule-table th:nth-child(2),
.conversion-rule-table td:nth-child(2) { width: 42px; text-align: center; }
.conversion-rule-table th:nth-child(3),
.conversion-rule-table td:nth-child(3) { width: 150px; }
.conversion-rule-table th:nth-child(4),
.conversion-rule-table td:nth-child(4) { width: 155px; }
.conversion-rule-table th:nth-child(5),
.conversion-rule-table td:nth-child(5),
.conversion-rule-table th:nth-child(6),
.conversion-rule-table td:nth-child(6),
.conversion-rule-table th:nth-child(8),
.conversion-rule-table td:nth-child(8),
.conversion-rule-table th:nth-child(9),
.conversion-rule-table td:nth-child(9) { width: 100px; }
.conversion-rule-table th:nth-child(7),
.conversion-rule-table td:nth-child(7),
.conversion-rule-table th:nth-child(10),
.conversion-rule-table td:nth-child(10) { width: 130px; }
.conversion-rule-table th:nth-child(11),
.conversion-rule-table td:nth-child(11),
.conversion-rule-table th:nth-child(12),
.conversion-rule-table td:nth-child(12),
.conversion-rule-table th:nth-child(13),
.conversion-rule-table td:nth-child(13),
.conversion-rule-table th:nth-child(14),
.conversion-rule-table td:nth-child(14) { width: 82px; }
.conversion-rule-table th:nth-child(15),
.conversion-rule-table td:nth-child(15) { width: 125px; }
.conversion-rule-table th:nth-child(16),
.conversion-rule-table td:nth-child(16),
.conversion-rule-table th:nth-child(17),
.conversion-rule-table td:nth-child(17) { width: 95px; }
.conversion-rule-table th:nth-child(18),
.conversion-rule-table td:nth-child(18) { width: 156px; }
.conversion-rule-table th:nth-child(19),
.conversion-rule-table td:nth-child(19) { width: 40px; text-align: center; }

.conversion-rule-table .selection-column,
.conversion-rule-table .conversion-rule-sequence {
  width: 42px;
  text-align: center;
}

.conversion-rule-table [data-conversion-column="id"] { width: 150px; }
.conversion-rule-table [data-conversion-column="name"] { width: 160px; }
.conversion-rule-table [data-conversion-column="sourceApplication"],
.conversion-rule-table [data-conversion-column="sourceName"],
.conversion-rule-table [data-conversion-column="targetApplication"],
.conversion-rule-table [data-conversion-column="targetName"] { width: 100px; }
.conversion-rule-table [data-conversion-column="sourceCode"],
.conversion-rule-table [data-conversion-column="targetCode"] { width: 132px; }
.conversion-rule-table [data-conversion-column="factoryStatus"],
.conversion-rule-table [data-conversion-column="enabledStatus"],
.conversion-rule-table [data-conversion-column="isDefault"] { width: 82px; }
.conversion-rule-table [data-conversion-column="extensionStatus"] { width: 90px; }
.conversion-rule-table [data-conversion-column="originalRuleName"] { width: 125px; }
.conversion-rule-table [data-conversion-column="modifiedBy"] { width: 92px; }
.conversion-rule-table [data-conversion-column="developerCode"] { width: 96px; }
.conversion-rule-table [data-conversion-column="modifiedAt"] { width: 158px; }

.conversion-rule-table .conversion-rule-settings-column {
  width: 40px;
  padding: 0;
  text-align: center;
}

.conversion-rule-settings-column .list-settings-button {
  width: 32px;
  height: 30px;
  display: inline-grid;
  place-items: center;
  padding: 0;
  border: 0;
  color: #7e8998;
  background: transparent;
  cursor: pointer;
}

.conversion-detail-page {
  padding: 0;
  background: #f0f3f7;
}

.conversion-detail-topbar {
  min-height: 52px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 28px;
  border-bottom: 9px solid #e8edf4;
  background: #fff;
}

.conversion-detail-topbar button,
.conversion-detail-tree-actions button {
  min-width: 58px;
  height: 30px;
  padding: 0 12px;
  border: 1px solid #4f82df;
  border-radius: 2px;
  color: #fff;
  background: #4f82df;
  cursor: pointer;
  font-size: 12px;
}

.conversion-detail-command-row {
  min-height: 45px;
  display: grid;
  grid-template-columns: 280px minmax(0, 1fr);
  border-bottom: 1px solid #d7dce4;
  background: #fff;
}

.conversion-detail-tree-actions,
.conversion-detail-source-target {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 20px;
}

.conversion-detail-tree-actions {
  gap: 7px;
  padding-right: 7px;
  border-right: 1px solid #d5dae2;
}

.conversion-detail-tree-actions button {
  min-width: 51px;
}

.conversion-detail-tree-actions button:last-child {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
}

.conversion-detail-tree-actions svg {
  width: 13px;
  height: 13px;
}

.conversion-detail-source-target {
  gap: 26px;
}

.conversion-detail-source-target label {
  display: flex;
  align-items: center;
  gap: 14px;
  color: #343b47;
  font-size: 12px;
}

.conversion-detail-source-target input {
  width: 190px;
  height: 29px;
  padding: 0 10px;
  border: 1px solid #cfd5de;
  border-radius: 2px;
  outline: 0;
  background: #f7f7f8;
  font-size: 12px;
}

.conversion-detail-layout {
  height: calc(100vh - 179px);
  min-height: 500px;
  display: grid;
  grid-template-columns: 280px 8px minmax(0, 1fr);
  background: #fff;
}

.conversion-detail-rule-tree {
  padding: 2px 0 12px;
  border-right: 1px solid #ccd2db;
  overflow-y: auto;
}

.conversion-detail-rule-tree button {
  width: 100%;
  min-height: 33px;
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 0 18px;
  border: 0;
  color: #202630;
  background: transparent;
  cursor: pointer;
  text-align: left;
  font-size: 12px;
}

.conversion-detail-rule-tree button:hover,
.conversion-detail-rule-tree button.active {
  color: #3f76d4;
  background: #eaf2ff;
}

.conversion-detail-rule-tree svg {
  width: 13px;
  height: 13px;
  flex: 0 0 auto;
}

.conversion-detail-resizer {
  position: relative;
  border-right: 1px solid #c5ccd7;
  background: #f3f5f8;
}

.conversion-detail-resizer span {
  width: 7px;
  height: 34px;
  position: absolute;
  top: 50%;
  border-radius: 4px;
  background: #98a4b6;
  transform: translateY(-50%);
}

.conversion-detail-main {
  min-width: 0;
  overflow: auto;
}

.conversion-detail-tabs {
  min-width: max-content;
  height: 34px;
  display: flex;
  align-items: stretch;
  border-bottom: 1px solid #d2d7df;
  background: #fff;
}

.conversion-detail-tabs button {
  min-width: max-content;
  padding: 0 13px;
  border: 0;
  border-right: 1px solid #d6dbe2;
  color: #454d5a;
  background: #fff;
  cursor: pointer;
  font-size: 12px;
}

.conversion-detail-tabs button:hover,
.conversion-detail-tabs button.active {
  color: #fff;
  background: #4f82df;
}

.conversion-detail-panel {
  min-width: 760px;
  min-height: calc(100% - 34px);
  padding: 18px 16px;
  background: #fff;
}

.conversion-detail-form-grid,
.conversion-entity-grid {
  max-width: 930px;
  display: grid;
  grid-template-columns: repeat(3, minmax(220px, 1fr));
  gap: 14px 28px;
  padding: 20px 34px;
}

.conversion-detail-form-grid label,
.conversion-entity-grid label {
  min-width: 0;
  display: grid;
  grid-template-columns: 126px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  color: #4b5360;
  font-size: 12px;
}

.conversion-detail-form-grid label > span:first-child,
.conversion-entity-grid label > span:first-child {
  text-align: right;
}

.conversion-detail-form-grid b,
.conversion-entity-grid b,
.conversion-detail-table b,
.conversion-split-grid b {
  color: #e13f3f;
  font-weight: 500;
}

.conversion-detail-form-grid input,
.conversion-entity-grid select,
.conversion-detail-select-button,
.conversion-split-grid select {
  width: 100%;
  height: 30px;
  min-width: 0;
  padding: 0 9px;
  border: 1px solid #cfd5de;
  border-radius: 2px;
  outline: 0;
  color: #242b35;
  background: #fff;
  font-size: 12px;
}

.conversion-detail-form-grid input[readonly] {
  background: #f6f7f8;
}

.conversion-detail-select-button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
  text-align: left;
}

.conversion-detail-select-button svg {
  width: 14px;
  height: 14px;
  color: #6183bd;
}

.conversion-detail-switch-field .kd-switch {
  justify-self: start;
}

.conversion-detail-table-actions {
  min-height: 34px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  color: #7b8490;
  font-size: 12px;
}

.conversion-detail-table-actions > div {
  display: flex;
  gap: 18px;
}

.conversion-detail-table-actions button {
  padding: 0;
  border: 0;
  color: #0962d6;
  background: transparent;
  cursor: pointer;
  font-size: 12px;
}

.conversion-rule-filter-panel {
  display: flex;
  align-items: end;
  gap: 12px;
  padding: 10px 16px;
  border-bottom: 1px solid #e0e4ea;
  background: #fafbfc;
}

.conversion-rule-filter-panel.hidden { display: none; }

.conversion-rule-filter-panel label { display: grid; gap: 4px; color: #68717e; font-size: 12px; }
.conversion-rule-filter-panel input,
.conversion-rule-filter-panel select { height: 30px; min-width: 130px; padding: 0 8px; border: 1px solid #cfd5de; border-radius: 2px; background: #fff; font-size: 12px; }
.conversion-rule-filter-panel button { height: 30px; padding: 0 14px; border: 1px solid #176ee6; border-radius: 2px; color: #176ee6; background: #fff; cursor: pointer; font-size: 12px; }
.conversion-rule-filter-panel button:first-of-type { color: #fff; background: #176ee6; }

.sales-lead-document-panel { width: min(1480px, calc(100vw - 28px)); max-height: calc(100vh - 28px); display: flex; flex-direction: column; overflow: hidden; border-radius: 2px; background: #edf1f7; }
.sales-lead-document-toolbar { display: flex; flex-wrap: wrap; gap: 8px; padding: 10px 18px; border-bottom: 1px solid #d8dee8; background: #fff; }
.sales-lead-document-toolbar button { min-height: 30px; padding: 0 14px; border: 1px solid #176ee6; border-radius: 2px; color: #176ee6; background: #fff; cursor: pointer; font-size: 12px; }
.sales-lead-document-toolbar button:first-child, .sales-lead-document-toolbar button[type="submit"] { color: #fff; background: #176ee6; }
.sales-lead-document-toolbar .split-command { display: inline-flex; gap: 0; }
.sales-lead-document-toolbar .split-command > button:first-child { color: #fff; background: #176ee6; border-top-right-radius: 0; border-bottom-right-radius: 0; }
.sales-lead-document-toolbar .split-command > .split-caret { color: #fff; background: #176ee6; border-left-color: rgba(255,255,255,.45); border-top-left-radius: 0; border-bottom-left-radius: 0; padding: 0 8px; }
.sales-lead-document-toolbar .toolbar-menu button:first-child { color: #333; background: #fff; border: 0; border-radius: 0; }
.sales-lead-document-body { overflow: auto; padding: 10px; }
.sales-lead-document-body > section { margin-bottom: 10px; border: 1px solid #d8dee8; background: #fff; }
.sales-lead-document-body h3 { margin: 0; padding: 11px 16px; border-bottom: 1px solid #e1e6ee; font-size: 14px; }
.sales-lead-form-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px 20px; padding: 16px 24px; }
.sales-lead-form-grid label { display: grid; grid-template-columns: 78px minmax(0, 1fr); align-items: center; gap: 7px; margin: 0; color: #4b5360; font-size: 12px; font-weight: 400; }
.sales-lead-form-grid label > span { text-align: right; }
.sales-lead-form-grid label.full { grid-column: 1 / -1; }
.sales-lead-form-grid b { color: #e13f3f; }
.sales-lead-form-grid input, .sales-lead-form-grid select, .sales-lead-form-grid textarea { width: 100%; min-width: 0; min-height: 30px; padding: 4px 8px; border: 1px solid #cfd5de; border-radius: 2px; outline: 0; background: #fff; font-size: 12px; }
.sales-lead-form-grid textarea { resize: vertical; }
.sales-lead-section-actions { float: right; display: flex; gap: 16px; font-size: 12px; font-weight: 400; }
.sales-lead-section-actions button { padding: 0; border: 0; color: #176ee6; background: transparent; cursor: pointer; }
.sales-lead-detail-table { width: calc(100% - 36px); margin: 14px 18px; border-collapse: collapse; table-layout: fixed; font-size: 12px; }
.sales-lead-detail-table th, .sales-lead-detail-table td { height: 34px; padding: 5px 8px; border: 1px solid #d8dee8; text-align: left; }
.sales-lead-detail-table th { background: #f4f6f9; }
.sales-lead-detail-table input, .sales-lead-detail-table select { width: 100%; min-width: 0; height: 27px; border: 1px solid #cfd5de; font-size: 12px; }
@media (max-width: 900px) { .sales-lead-form-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .sales-lead-form-grid { grid-template-columns: 1fr; } .sales-lead-form-grid label.full { grid-column: auto; } }

.conversion-detail-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}

.conversion-detail-table th,
.conversion-detail-table td {
  height: 36px;
  padding: 0 10px;
  border: 1px solid #d8dce3;
  color: #272e39;
  text-align: left;
  font-size: 12px;
  font-weight: 400;
}

.conversion-detail-table th {
  background: #f4f5f7;
}

.conversion-detail-table th:first-child {
  width: 52px;
  text-align: center;
}

.conversion-field-mapping-panel {
  height: calc(100% - 34px);
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding: 0;
}

.conversion-field-mapping-toolbar {
  min-height: 52px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 0 12px 0 8px;
  border-bottom: 1px solid #d7dce4;
  color: #4b5360;
  font-size: 12px;
}

.conversion-field-mapping-toolbar label,
.conversion-field-mapping-toolbar label > span:first-child,
.conversion-field-mapping-toolbar > div {
  display: flex;
  align-items: center;
}

.conversion-field-mapping-toolbar label {
  gap: 8px;
}

.conversion-field-mapping-toolbar label > span:first-child {
  gap: 3px;
}

.conversion-field-mapping-toolbar svg {
  width: 13px;
  height: 13px;
  color: #9aa3af;
}

.conversion-field-mapping-toolbar > div {
  gap: 22px;
}

.conversion-field-mapping-toolbar button {
  padding: 0;
  border: 0;
  color: #0962d6;
  background: transparent;
  cursor: pointer;
  font-size: 12px;
}

.conversion-field-mapping-scroll {
  min-height: 0;
  flex: 1;
  overflow: auto;
}

.conversion-field-mapping-table {
  width: 100%;
  min-width: 1530px;
  border-collapse: collapse;
  table-layout: fixed;
  color: #252c36;
  font-size: 12px;
}

.conversion-field-mapping-table th,
.conversion-field-mapping-table td {
  height: 29px;
  padding: 0 6px;
  border-bottom: 1px solid #d9dde3;
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.conversion-field-mapping-table th {
  position: sticky;
  z-index: 2;
  top: 0;
  height: 30px;
  color: #313844;
  background: #f2f3f5;
  font-weight: 400;
}

.conversion-field-mapping-table th b {
  color: #e13f3f;
  font-weight: 500;
}

.conversion-field-mapping-table th svg {
  width: 12px;
  height: 12px;
  margin-left: 3px;
  color: #939ca9;
  vertical-align: -2px;
}

.conversion-field-mapping-table th:nth-child(1) { width: 165px; }
.conversion-field-mapping-table th:nth-child(2) { width: 180px; }
.conversion-field-mapping-table th:nth-child(3) { width: 55px; }
.conversion-field-mapping-table th:nth-child(4) { width: 92px; }
.conversion-field-mapping-table th:nth-child(5) { width: 110px; }
.conversion-field-mapping-table th:nth-child(6) { width: 380px; }
.conversion-field-mapping-table th:nth-child(7) { width: 70px; }
.conversion-field-mapping-table th:nth-child(8) { width: 110px; }

.conversion-field-mapping-table tbody tr:hover {
  background: #f4f8ff;
}

.conversion-field-mapping-table.show-identifiers .mapping-field-cell {
  display: flex;
  align-items: center;
  gap: 4px;
}

.conversion-field-mapping-table.show-identifiers .mapping-field-cell::before {
  content: attr(data-field-identifier);
  flex: 0 0 auto;
  padding: 1px 3px;
  color: #66758a;
  background: #edf1f7;
  font-size: 10px;
}

.conversion-field-mapping-table input[type="text"],
.conversion-field-mapping-table select {
  width: 100%;
  height: 25px;
  min-width: 0;
  padding: 0 4px;
  border: 1px solid transparent;
  border-radius: 1px;
  outline: 0;
  color: #232a34;
  background: transparent;
  font: inherit;
}

.conversion-field-mapping-table.show-identifiers .mapping-field-cell input {
  min-width: 0;
  flex: 1;
}

.conversion-field-mapping-table .mapping-target-field > span {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.conversion-field-mapping-table.show-identifiers .mapping-target-field > span {
  min-width: 0;
  flex: 1;
}

.conversion-field-mapping-table .mapping-source-field {
  position: relative;
}

.conversion-field-mapping-table .mapping-source-field input {
  padding-right: 22px;
}

.conversion-field-mapping-table .mapping-source-field > svg {
  position: absolute;
  right: 6px;
  top: 50%;
  width: 13px;
  height: 13px;
  pointer-events: none;
  transform: translateY(-50%);
  color: #66758a;
}

.conversion-field-mapping-table input[type="text"]:focus,
.conversion-field-mapping-table select:focus {
  border-color: #4f82df;
  background: #fff;
}

.conversion-field-clear {
  padding: 0;
  border: 0;
  color: #0962d6;
  background: transparent;
  cursor: pointer;
  font-size: 12px;
}

.conversion-formula-cell {
  display: flex;
  align-items: center;
  gap: 4px;
}

.conversion-formula-cell input {
  flex: 1;
}

.conversion-formula-cell button {
  width: 22px;
  height: 22px;
  flex: 0 0 auto;
  display: inline-grid;
  place-items: center;
  padding: 0;
  border: 0;
  color: #7083a0;
  background: transparent;
  cursor: pointer;
}

.conversion-formula-cell svg {
  width: 13px;
  height: 13px;
}

.conversion-field-mapping-table .kd-switch {
  transform: scale(.78);
  transform-origin: left center;
}

.conversion-field-mapping-note {
  min-height: 47px;
  margin: 5px 6px 6px;
  padding: 5px 8px;
  border: 1px solid #d8dce3;
  color: #262e38;
  background: #fafafa;
  font-size: 12px;
  line-height: 1.5;
}

.conversion-detail-empty {
  min-height: 320px;
  display: grid;
  place-content: center;
  gap: 10px;
  color: #6f7886;
  text-align: center;
  font-size: 12px;
}

.conversion-detail-empty svg,
.conversion-split-empty svg {
  width: 52px;
  height: 52px;
  justify-self: center;
  color: #dfe5ee;
}

.conversion-detail-empty.standalone {
  min-height: 460px;
}

.conversion-plugin-actions {
  justify-content: flex-end;
  padding-right: 2px;
}

.conversion-plugin-actions .conversion-register-script {
  display: inline-flex;
  align-items: center;
  gap: 2px;
}

.conversion-plugin-actions svg {
  width: 13px;
  height: 13px;
}

.conversion-plugin-table th:first-child,
.conversion-plugin-table td:first-child {
  width: 30px;
  text-align: center;
}

.conversion-plugin-table th:nth-child(2),
.conversion-plugin-table td:nth-child(2) {
  width: 42px;
  text-align: center;
}

.conversion-plugin-table th:nth-child(3),
.conversion-plugin-table td:nth-child(3) {
  width: 70px;
}

.conversion-plugin-table th:nth-child(4),
.conversion-plugin-table td:nth-child(4) {
  width: 130px;
}

.conversion-plugin-table th:nth-child(5),
.conversion-plugin-table td:nth-child(5) {
  width: 36%;
}

.conversion-plugin-table th:nth-child(6),
.conversion-plugin-table td:nth-child(6) {
  width: 12%;
}

.conversion-plugin-table td {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.conversion-plugin-table input[type="radio"] {
  margin: 0;
  accent-color: #4f82df;
}

.conversion-plugin-table .kd-switch {
  vertical-align: middle;
}

.attachment-mapping-table th:first-child {
  width: auto;
  text-align: left;
}

.attachment-mapping-table select {
  width: 100%;
  min-height: 28px;
  border: 0;
  color: #303844;
  background: transparent;
  font: inherit;
}

.conversion-split-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(240px, 1fr));
  gap: 10px;
}

.conversion-split-grid > section {
  min-height: 520px;
  display: flex;
  flex-direction: column;
  border: 1px solid #d5dae2;
}

.conversion-split-grid label {
  display: grid;
  gap: 5px;
  padding: 8px;
  color: #424a57;
  font-size: 12px;
}

.conversion-split-grid h4 {
  min-height: 30px;
  margin: 0;
  padding: 7px 8px;
  border-top: 1px solid #d5dae2;
  border-bottom: 1px solid #d5dae2;
  background: #f4f5f7;
  font-size: 12px;
  font-weight: 500;
}

.conversion-split-empty {
  flex: 1;
  display: grid;
  place-content: center;
  gap: 10px;
  color: #68717e;
  text-align: center;
  font-size: 12px;
}

.conversion-split-grid footer {
  display: flex;
  justify-content: flex-end;
  border-top: 1px solid #d5dae2;
}

.conversion-split-grid footer button {
  min-width: 56px;
  height: 30px;
  border: 0;
  border-left: 1px solid #d5dae2;
  color: #8a929d;
  background: #fff;
  cursor: pointer;
}

.conversion-detail-note {
  margin: 12px 0 0;
  padding: 7px 9px;
  border: 1px solid #d8dce3;
  color: #333b46;
  background: #fafafa;
  font-size: 12px;
  line-height: 1.6;
}

.conversion-detail-note b {
  color: #bd7b00;
}

.conversion-data-scope {
  width: 100%;
  padding: 0;
}

.conversion-data-scope-advanced {
  min-height: 38px;
  display: flex;
  align-items: center;
  gap: 10px;
  color: #404854;
  font-size: 12px;
}

.conversion-data-scope-description {
  min-height: 44px;
  display: grid;
  grid-template-columns: 110px minmax(280px, 1fr);
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  border-top: 1px solid #e0e3e8;
  color: #404854;
  font-size: 12px;
}

.conversion-data-scope-description span {
  text-align: right;
}

.conversion-data-scope-description input {
  width: 100%;
  min-height: 30px;
  padding: 0 9px;
  border: 1px solid #d5dae2;
  border-radius: 0;
  outline: 0;
  color: #303844;
  background: #fff;
  font: inherit;
}

.conversion-data-scope-description input:focus {
  border-color: #4f82df;
}

.conversion-data-scope-table {
  min-width: 760px;
  border-top: 1px solid #d8dce3;
  border-left: 1px solid #d8dce3;
}

.conversion-data-scope-head,
.conversion-data-scope-row {
  display: grid;
  grid-template-columns: 140px minmax(150px, 1.2fr) 130px minmax(180px, 1.5fr) 110px 42px;
}

.conversion-data-scope-head {
  min-height: 32px;
  align-items: center;
  color: #313844;
  background: #f2f3f5;
  font-size: 12px;
}

.conversion-data-scope-head span,
.conversion-data-scope-row > * {
  min-width: 0;
  min-height: 32px;
  padding: 0 8px;
  border: 0;
  border-right: 1px solid #d8dce3;
  border-bottom: 1px solid #d8dce3;
  border-radius: 0;
  outline: 0;
  color: #303844;
  background: #fff;
  font-size: 12px;
}

.conversion-data-scope-head span {
  display: flex;
  align-items: center;
  background: #f2f3f5;
}

.conversion-data-scope-row input:focus,
.conversion-data-scope-row select:focus {
  box-shadow: inset 0 0 0 1px #4f82df;
}

.conversion-data-scope-row button {
  color: #176ee6;
  cursor: pointer;
}

.conversion-data-scope-add {
  min-height: 31px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 8px;
  padding: 0;
  border: 0;
  color: #176ee6;
  background: transparent;
  cursor: pointer;
  font-size: 12px;
}

.conversion-data-scope-add svg {
  width: 14px;
  height: 14px;
}

.conversion-field-editor-panel {
  width: min(1120px, calc(100vw - 42px));
  height: min(760px, calc(100vh - 42px));
  display: flex;
  flex-direction: column;
  border-radius: 2px;
}

.conversion-action-panel {
  width: min(720px, calc(100vw - 32px));
  max-height: calc(100vh - 40px);
  display: flex;
  flex-direction: column;
  border-radius: 2px;
}

.conversion-action-body {
  min-height: 160px;
  max-height: min(560px, calc(100vh - 180px));
  overflow: auto;
  padding: 18px;
  background: #fff;
}

.conversion-action-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 18px;
}

.conversion-action-form label {
  display: grid;
  gap: 6px;
  color: #4b5360;
  font-size: 12px;
}

.conversion-action-form label.full {
  grid-column: 1 / -1;
}

.conversion-action-form input,
.conversion-action-form select,
.conversion-action-form textarea {
  width: 100%;
  min-height: 30px;
  padding: 6px 9px;
  border: 1px solid #cfd5de;
  border-radius: 2px;
  outline: 0;
  color: #242b35;
  background: #fff;
  font-size: 12px;
}

.conversion-action-form textarea { min-height: 82px; resize: vertical; }

.conversion-action-check {
  display: flex !important;
  align-items: center;
  grid-template-columns: auto 1fr;
  gap: 8px !important;
}

@media (max-width: 720px) {
  .conversion-action-form { grid-template-columns: 1fr; }
  .conversion-action-form label.full { grid-column: auto; }
}

.conversion-field-editor-body {
  min-height: 0;
  flex: 1;
  overflow: hidden;
  background: #fff;
}

.conversion-condition-header p {
  margin: 3px 0 0;
  color: #7b8491;
  font-size: 12px;
}

.conversion-formula-editor {
  height: 100%;
  display: grid;
  grid-template-columns: 330px minmax(0, 1fr);
}

.conversion-formula-fields {
  min-width: 0;
  display: flex;
  flex-direction: column;
  border-right: 1px solid #d7dce4;
}

.conversion-editor-section-title {
  min-height: 38px;
  display: flex;
  align-items: center;
  padding: 0 14px;
  color: #2d3540;
  background: #f4f5f7;
  font-size: 13px;
}

.conversion-formula-fields > input {
  height: 30px;
  margin: 9px 10px;
  padding: 0 9px;
  border: 1px solid #cdd3dc;
  border-radius: 2px;
  outline: 0;
}

#conversionFormulaFieldList {
  min-height: 0;
  flex: 1;
  overflow: auto;
}

#conversionFormulaFieldList button {
  width: 100%;
  min-height: 29px;
  display: block;
  padding: 0 13px;
  border: 0;
  color: #333b46;
  background: #fff;
  cursor: pointer;
  text-align: left;
  font-size: 12px;
}

#conversionFormulaFieldList button:hover {
  color: #176ee6;
  background: #edf4ff;
}

.conversion-formula-workbench {
  min-width: 0;
  padding: 16px;
  overflow: auto;
}

.conversion-formula-operators {
  display: grid;
  grid-template-columns: repeat(8, 1fr);
  gap: 6px;
}

.conversion-formula-operators button,
.conversion-formula-function,
.conversion-conditional-actions button {
  min-height: 30px;
  border: 1px solid #ccd3dd;
  border-radius: 2px;
  color: #344052;
  background: #fff;
  cursor: pointer;
  font-size: 12px;
}

.conversion-formula-function {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin-top: 8px;
  padding: 0 12px;
  color: #176ee6;
}

.conversion-formula-function svg {
  width: 15px;
  height: 15px;
}

.conversion-formula-workbench label {
  display: grid;
  gap: 5px;
  margin-top: 14px;
  color: #424b58;
  font-size: 12px;
}

.conversion-formula-workbench textarea {
  width: 100%;
  resize: vertical;
  padding: 8px;
  border: 1px solid #cdd3dc;
  border-radius: 2px;
  outline: 0;
  font: 12px/1.55 Consolas, monospace;
}

.conversion-formula-workbench textarea:focus {
  border-color: #4f82df;
}

.conversion-conditional-editor {
  height: 100%;
  display: flex;
  flex-direction: column;
  padding: 12px 16px;
}

.conversion-conditional-actions {
  min-height: 34px;
  display: flex;
  justify-content: flex-end;
  gap: 8px;
}

.conversion-conditional-actions button {
  min-width: 56px;
  color: #176ee6;
}

.conversion-conditional-scroll {
  min-height: 0;
  flex: 1;
  overflow: auto;
  border: 1px solid #d7dce4;
}

.conversion-conditional-scroll table {
  width: 100%;
  min-width: 920px;
  border-collapse: collapse;
  table-layout: fixed;
}

.conversion-conditional-scroll th,
.conversion-conditional-scroll td {
  height: 33px;
  padding: 0 6px;
  border-right: 1px solid #dde1e7;
  border-bottom: 1px solid #dde1e7;
  text-align: left;
  font-size: 12px;
}

.conversion-conditional-scroll th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #f3f4f6;
  font-weight: 400;
}

.conversion-conditional-scroll th:nth-child(1),
.conversion-conditional-scroll td:nth-child(1) { width: 34px; text-align: center; }
.conversion-conditional-scroll th:nth-child(2),
.conversion-conditional-scroll td:nth-child(2) { width: 42px; text-align: center; }
.conversion-conditional-scroll th:nth-child(3) { width: 100px; }
.conversion-conditional-scroll th:nth-child(4) { width: 310px; }
.conversion-conditional-scroll th:nth-child(5) { width: 210px; }

.conversion-conditional-scroll input,
.conversion-conditional-scroll select {
  width: 100%;
  height: 26px;
  border: 1px solid transparent;
  outline: 0;
  background: transparent;
  font-size: 12px;
}

.conversion-conditional-scroll input:focus,
.conversion-conditional-scroll select:focus {
  border-color: #4f82df;
  background: #fff;
}

.conversion-constant-editor {
  max-width: 660px;
  padding: 42px 56px;
}

.conversion-constant-editor label {
  display: grid;
  grid-template-columns: 90px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  color: #424b58;
  font-size: 12px;
}

.conversion-constant-editor input {
  height: 31px;
  padding: 0 9px;
  border: 1px solid #cdd3dc;
  border-radius: 2px;
  outline: 0;
}

.conversion-constant-editor p {
  margin: 12px 0 0 100px;
  color: #7a8492;
  font-size: 12px;
}

.conversion-advanced-options {
  width: 520px;
  max-width: 100%;
  display: grid;
  gap: 0;
  padding: 8px 0 0 130px;
}

.conversion-advanced-options label {
  min-height: 36px;
  display: grid;
  grid-template-columns: 250px 34px;
  align-items: center;
  gap: 8px;
  padding: 0;
  color: #414955;
  background: #fff;
  font-size: 12px;
}

.conversion-advanced-options label > span:first-child {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  gap: 4px;
  text-align: right;
}

.conversion-advanced-options label > span:first-child svg {
  width: 13px;
  height: 13px;
  color: #a6adb8;
}

@media (max-width: 900px) {
  .conversion-detail-command-row {
    grid-template-columns: 220px minmax(0, 1fr);
  }

  .conversion-detail-tree-actions {
    overflow-x: auto;
  }

  .conversion-detail-source-target {
    overflow-x: auto;
  }

  .conversion-detail-layout {
    grid-template-columns: 220px 7px minmax(0, 1fr);
  }
}

.conversion-rule-table input[type="checkbox"] {
  width: 15px;
  height: 15px;
  accent-color: #4f82df;
}

.conversion-rule-link {
  padding: 0;
  border: 0;
  color: #1265d8;
  background: transparent;
  cursor: pointer;
  font-size: inherit;
}

.conversion-rule-default {
  color: #08a36f;
  font-size: 18px;
  font-weight: 700;
}

.conversion-rule-table th svg {
  width: 14px;
  height: 14px;
  color: #7e8998;
}

@media (max-width: 760px) {
  .conversion-list-header {
    align-items: flex-start;
    flex-direction: column;
    padding: 7px 0;
  }

  .conversion-list-header > div {
    width: 100%;
  }

  .conversion-list-search {
    width: min(260px, 70%);
  }

  .conversion-list-layout {
    height: calc(100vh - 236px);
    grid-template-columns: 170px 7px minmax(0, 1fr);
  }
}

.reference-master-table-section {
  min-height: 360px;
}

.reference-master-table {
  min-width: 980px;
}

.reference-master-table td,
.reference-master-table th,
.reference-picker-panel td,
.reference-picker-panel th {
  white-space: nowrap;
}

.reference-master-link {
  border: 0;
  background: transparent;
  color: #2769d8;
  cursor: pointer;
  padding: 0;
}

.reference-master-form-panel {
  width: min(980px, calc(100vw - 40px));
  max-height: calc(100vh - 40px);
  overflow: auto;
}

.reference-master-form-toolbar {
  display: flex;
  align-items: center;
  gap: 2px;
  min-height: 48px;
  padding: 8px 18px;
  border-bottom: 1px solid #e8ebf0;
  background: #fff;
}

.reference-master-form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(190px, 1fr));
  gap: 18px 24px;
  padding: 30px 36px 44px;
}

.reference-master-form-grid .field {
  min-width: 0;
}

.reference-master-form-grid .field.full-width {
  grid-column: 1 / -1;
}

.reference-picker-panel {
  width: min(1050px, calc(100vw - 44px));
  max-height: calc(100vh - 44px);
}

#referencePickerModal {
  z-index: 5000;
}

#referencePickerModal.operation-cover {
  inset: 82px 0 0;
  padding: 8px;
  background: #eef2f7;
}

#referencePickerModal.operation-cover .reference-picker-panel {
  width: 100%;
  height: 100%;
  max-height: none;
  border-radius: 3px;
}

.reference-picker-tools {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 20px;
  border-bottom: 1px solid #e8ebf0;
}

.reference-picker-tools .list-quick-search {
  width: min(420px, 70%);
}

.reference-picker-current {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #5f6673;
  white-space: nowrap;
}

.reference-picker-current select {
  min-width: 210px;
  height: 32px;
  border: 1px solid #d9dee7;
  background: #fff;
}

.reference-picker-table-wrap {
  max-height: 55vh;
  overflow: auto;
}

.material-category-tree-row {
  display: flex;
  align-items: center;
  padding-left: calc(var(--tree-depth, 0) * 12px);
  min-height: 30px;
}
.material-category-tree-row > .icon-button, .material-category-tree-row > .tree-spacer { width: 24px; min-width: 24px; height: 24px; }
.material-category-tree-row > button:not(.icon-button) { min-width: 0; flex: 1; text-align: left; padding: 5px 2px; overflow-wrap: anywhere; }
.material-category-filters { padding: 12px 18px; background: #fff; border-bottom: 1px solid #dce1e8; }
.material-category-filters select, .material-category-filters input { min-height: 30px; border: 1px solid #dce1e8; margin: 4px; }
#classificationPage .table-pagination, #materialCategoryPickerPagination { display: flex; align-items: center; flex-wrap: wrap; min-height: 36px; height: auto; gap: 8px; padding: 6px 10px; flex-shrink: 0; }
#classificationPage .table-pagination > div { margin-left: auto; }
#materialCategoryPickerPagination > span:nth-child(2) { margin-left: auto; }
#materialCategoryPickerPagination > * { flex-shrink: 0; }
#referencePickerModal:not(.crm-geographic-picker) .modal-footer { display: flex; align-items: center; flex-wrap: wrap; }
#referencePickerModal:not(.crm-geographic-picker) .modal-footer button { width: auto; flex: 0 0 auto; white-space: nowrap; min-height: 32px; }
#referencePickerModal:not(.crm-geographic-picker) .modal-footer span { white-space: nowrap; }
@media (max-width: 600px) {
  #referencePickerModal:not(.crm-geographic-picker) .reference-picker-tools { flex-wrap: wrap; padding: 10px 12px; gap: 8px; flex-shrink: 0; }
  #referencePickerModal:not(.crm-geographic-picker) .list-quick-search { width: 100%; flex: 0 0 100%; }
  #referencePickerModal:not(.crm-geographic-picker) .reference-picker-current { width: 100%; min-width: 0; }
  #referencePickerModal:not(.crm-geographic-picker) .reference-picker-current select { flex: 1; min-width: 0; width: 0; }
  #referencePickerModal:not(.crm-geographic-picker) .reference-picker-tools > label:last-child { white-space: nowrap; }
  #referencePickerModal:not(.crm-geographic-picker) .modal-footer { flex-shrink: 0; gap: 8px; padding: 12px; }
  #referencePickerModal:not(.crm-geographic-picker) .reference-picker-table-wrap { min-height: 80px; }
}
#classificationPage .currency-table { table-layout: auto; width: max-content; min-width: 100%; }
#classificationPage .currency-table th, #classificationPage .currency-table td { min-width: 85px; white-space: nowrap; }
#classificationPage .currency-table .selection-column { min-width: 44px; }
#referencePickerModal .currency-table {
  width: max-content;
  min-width: 100%;
  table-layout: auto;
}

#referencePickerModal .currency-table th,
#referencePickerModal .currency-table td {
  width: auto;
  min-width: 112px;
  height: 36px;
  padding: 6px 12px;
  overflow: visible;
  text-overflow: clip;
  white-space: nowrap;
  font-size: 14px;
}

#referencePickerModal .currency-table .selection-column {
  width: 44px;
  min-width: 44px;
  padding: 0;
  text-align: center;
}

#referencePickerModal .currency-table .reference-settings-column {
  width: 38px;
  min-width: 38px;
}

.crm-geographic-picker .reference-picker-panel { width: min(960px, calc(100vw - 32px)); position: relative; border-radius: 0; }
.crm-geographic-picker .modal-header { padding: 12px 18px; min-height: 48px; padding-right: 270px; }
.crm-geographic-picker .modal-header p,
.crm-geographic-picker .reference-picker-current,
.crm-geographic-picker #referencePickerCount { display: none; }
.crm-geographic-picker .modal-header h2 { font-size: 16px; font-weight: 400; }
.crm-geographic-picker .modal-header > .icon-button { position: absolute; right: 12px; top: 10px; }
.crm-geographic-picker .reference-picker-tools { position: absolute; top: 10px; right: 80px; padding: 0; }
.crm-geographic-picker .reference-picker-tools .list-quick-search { width: 204px; min-height: 28px; height: 28px; border: 1px solid #d9d9d9; border-radius: 0; }
.crm-geographic-picker .reference-picker-tools > label:not(.list-quick-search),
.crm-geographic-picker #manageReferencePicker { display: none; }
.crm-geographic-picker .table-pagination { padding: 8px 18px; flex-wrap: wrap; gap: 8px; }
.crm-geographic-picker .currency-table { table-layout: auto; min-width: 620px; width: 100%; }
.crm-division-picker .currency-table { min-width: 1500px; }
.crm-geographic-picker td:nth-child(2) { color: #507ed2; }
.crm-geographic-picker .currency-table th,
.crm-geographic-picker .currency-table td { height: 32px; padding: 5px 12px; font-size: 14px; }
.crm-geographic-picker .currency-table td { white-space: nowrap; }
.crm-geographic-picker .reference-settings-column { min-width: 38px; width: 38px; position: sticky; right: 0; background: #fff; }
.crm-geographic-picker th.reference-settings-column { background: #f3f3f4; }
.crm-geographic-picker .modal-footer { flex-wrap: nowrap; justify-content: center; padding: 10px; }
.crm-geographic-picker .modal-footer #confirmReferencePicker { width: auto; min-width: 60px; min-height: 28px; height: 28px; padding: 0 14px; margin: 0; background: #5b86e5; border: 0; border-radius: 0; }
.crm-geographic-picker .modal-footer .secondary-button { min-width: 60px; min-height: 28px; height: 28px; padding: 0 14px; border-radius: 0; }
.crm-geographic-picker #geographicPickerScope { color: #507ed2; }
.crm-geographic-picker tr:has(input[type="radio"]:checked) td { background: #edf3fd; }
body:has(#referencePickerModal:not(.hidden)) #listSettingsModal { z-index: 5100; }

.demand-page { padding: 12px 16px; }
.demand-list-heading { display: flex; align-items: center; gap: 14px; min-height: 40px; flex-wrap: wrap; }
.demand-list-heading h1 { font-size: 16px; font-weight: 400; margin: 0; }
.demand-list-heading .list-quick-search { margin-left: auto; width: 260px; }
.demand-list-heading select, .demand-list-filters input, .demand-list-filters select { min-height: 28px; border: 1px solid #d9d9d9; padding: 3px 8px; background: white; }
.demand-list-filters { display: flex; flex-wrap: wrap; gap: 12px 20px; padding: 15px 20px; border: 1px solid #ddd; margin: 8px 0; background: #fafafa; }
.demand-list-filters label { display: flex; align-items: center; gap: 10px; font-size: 13px; }
.demand-list-filters input { width: 130px; }
.demand-toolbar { display: flex; flex-wrap: wrap; gap: 8px; padding: 8px 0; }
.demand-toolbar .command-button { background: #5782df; border: 0; border-radius: 0; color: white; min-height: 28px; height: 28px; padding: 0 12px; font-size: 13px; white-space: nowrap; }
.demand-toolbar .command-button svg { width: 14px; height: 14px; }
.demand-toolbar .split-command { display: flex; gap: 0; }
.demand-toolbar .split-caret { width: 22px; padding: 0 3px; border-left: 1px solid #a9c0ef; }
.demand-toolbar .toolbar-menu .command-button { background: white; color: #333; width: 100%; height: 32px; text-align: left; }
.demand-toolbar .toolbar-menu .command-button:hover { background: #edf3fd; }
.demand-pagination { display: flex; align-items: center; gap: 16px; padding: 8px; background: white; font-size: 13px; }
.demand-pagination > div { display: flex; align-items: center; gap: 6px; margin-left: auto; }
.demand-pagination select { height: 28px; border: 1px solid #ddd; }
.demand-table-wrap { max-height: calc(100vh - 300px); background: white; }
.demand-table-wrap .currency-table { min-width: 4000px; table-layout: auto; }
.demand-table-wrap td { height: 32px; padding: 6px 12px; white-space: nowrap; }
.demand-table-wrap .text-button { font-size: 13px; white-space: nowrap; color: #337ac4; }
.demand-settings-column { position: sticky; right: 0; width: 38px; min-width: 38px; background: white; }
.demand-table-wrap th.demand-settings-column { background: #f3f3f4; }
.demand-document-modal { z-index: 4800; padding: 8px; }
.demand-document { width: 100%; max-width: calc(100vw - 16px); min-width: 0; height: calc(100vh - 16px); background: white; display: flex; flex-direction: column; }
.demand-document > header { padding: 8px 12px; background: #eef1f6; }
.demand-document h2 { font-size: 15px; margin: 0 0 4px; font-weight: 400; }
.demand-document-scroll { overflow: auto; flex: 1; padding: 12px 20px; }
.demand-tabs { display: flex; border-bottom: 1px solid #ddd; padding: 0 10px; }
.demand-tabs button { background: white; color: #555; border: 0; padding: 10px 12px; border-bottom: 2px solid transparent; }
.demand-tabs button.active { color: #5782df; border-bottom-color: #5782df; }
.demand-section { padding: 10px 0 22px; border-bottom: 1px solid #eee; }
.demand-section h3, .demand-pictures h3 { display: flex; align-items: center; justify-content: space-between; font-size: 14px; font-weight: 400; margin: 0 0 14px; }
.demand-sales-layout { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 24px; }
.demand-field-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px 20px; }
.demand-sales-layout .demand-field-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.demand-field { display: flex; align-items: center; gap: 8px; min-width: 0; font-size: 14px; }
.demand-field > span { flex: 0 0 130px; text-align: right; overflow-wrap: anywhere; }
.demand-field > div { display: flex; border: 1px solid #d9d9d9; flex: 1; min-width: 0; height: 28px; }
.demand-field input, .demand-field select { width: 100%; min-width: 0; border: 0; background: white; padding: 3px 8px; font-size: 14px; color: #222; }
.demand-field input[readonly] { background: #f5f5f5; }
.demand-field .icon-button { width: 26px; height: 26px; min-height: 26px; padding: 3px; flex: 0 0 26px; border: 0; }
.demand-field .icon-button svg { width: 16px; height: 16px; }
.demand-pictures { border-left: 1px solid #eee; padding-left: 20px; }
.demand-picture-upload, .demand-picture { width: 100%; height: 155px; position: relative; margin-bottom: 22px; border: 1px dashed #ddd; background: #fafafa; }
.demand-picture-upload { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 6px; color: #999; }
.demand-picture img { width: 100%; height: 100%; object-fit: contain; }
.demand-picture > button { position: absolute; right: 0; top: 0; background: white; }
.demand-file { display: flex; gap: 16px; align-items: center; padding: 10px; border-bottom: 1px solid #eee; }
.demand-file a { color: #337ac4; overflow-wrap: anywhere; }
.demand-file span { margin-left: auto; white-space: nowrap; }
.demand-review-modal { z-index: 5200; }
.demand-review-modal .modal-panel { width: min(760px,calc(100vw - 24px)); max-height: 85vh; overflow: auto; border-radius: 0; }
.demand-review-fields { padding: 20px; display: grid; gap: 18px; }
.demand-review-fields label { display: grid; gap: 8px; }
.demand-review-fields select, .demand-review-fields textarea { border: 1px solid #ddd; min-height: 32px; padding: 6px 10px; width: 100%; }
.demand-review-fields textarea { min-height: 100px; }
body:has(#salesDemandModal:not(.hidden)) #listSettingsModal { z-index: 5100; }
body:has(#salesDemandModal:not(.hidden)) #referencePickerModal { z-index: 5150; }
.demand-document .demand-toolbar, .demand-page .demand-toolbar { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 8px; }
.demand-toolbar .command-button { flex: 0 0 auto; }
.demand-document > header { flex-shrink: 0; }
@media (max-width: 1200px) {
  .demand-field-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .demand-sales-layout .demand-field-grid { grid-template-columns: minmax(0,1fr); }
}
@media (max-width: 650px) {
  .demand-page { padding: 8px; }
  .demand-list-heading .list-quick-search { width: 100%; }
  .demand-sales-layout { grid-template-columns: minmax(0,1fr); }
  .demand-field-grid { grid-template-columns: minmax(0,1fr); }
  .demand-field > span { flex-basis: 120px; font-size: 13px; }
  .demand-pictures { border: 0; padding: 0; }
  #salesDemandPictures { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
  .demand-picture-upload, .demand-picture { height: 120px; }
  .demand-document-scroll { padding: 8px; }
  .demand-pagination { flex-wrap: wrap; }
  .demand-pagination > div { width: 100%; justify-content: flex-end; }
}

@media (max-width: 650px) {
  .crm-geographic-picker .reference-picker-panel { width: calc(100vw - 16px); }
  .crm-geographic-picker .modal-header { padding-right: 50px; }
  .crm-geographic-picker .reference-picker-tools { position: static; padding: 8px 12px; }
  .crm-geographic-picker .reference-picker-tools .list-quick-search { width: 100%; }
  .crm-geographic-picker .table-pagination > div { width: 100%; justify-content: flex-end; }
  .crm-geographic-picker .reference-picker-table-wrap { max-height: 48vh; }
  .crm-geographic-picker .modal-footer { flex-wrap: wrap; }
}

.reference-picker-panel .modal-footer {
  gap: 10px;
}

.reference-picker-panel .modal-footer span {
  margin-right: auto;
  color: #6b7280;
}

.reference-input button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: #3974d8;
  cursor: pointer;
}

.reference-input button svg {
  width: 15px;
  height: 15px;
}

.reference-input input[readonly] {
  cursor: pointer;
}

.purchase-line-reference {
  width: 100%;
  min-width: 210px;
  display: flex;
  align-items: center;
  background: #fff;
}

.purchase-line-reference input {
  min-width: 0;
  flex: 1;
  padding-right: 2px;
}

.purchase-line-reference button {
  width: 28px;
  height: 28px;
  flex: 0 0 28px;
}

@media (max-width: 760px) {
  .reference-master-form-grid {
    grid-template-columns: 1fr;
    padding: 22px;
  }
}

.conversion-condition-panel {
  width: min(960px, calc(100vw - 32px));
  min-height: min(560px, calc(100vh - 40px));
  max-height: calc(100vh - 40px);
  border-radius: 2px;
}

.conversion-condition-header {
  min-height: 50px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 0 18px;
  border-bottom: 1px solid #e3e6eb;
}

.conversion-condition-header > div {
  display: flex;
  align-items: center;
  gap: 18px;
}

.conversion-condition-header span {
  color: #242a34;
  font-size: 16px;
}

.conversion-condition-header h2 {
  margin: 0;
  color: #f04b48;
  font-size: 23px;
  font-weight: 500;
}

.conversion-condition-body {
  min-height: 0;
  flex: 1;
  padding: 8px 18px 18px;
  overflow: auto;
}

.conversion-condition-tabs {
  height: 30px;
  display: flex;
  align-items: flex-end;
}

.conversion-condition-tabs button {
  min-width: 58px;
  height: 28px;
  padding: 0 14px;
  border: 1px solid #d8dde6;
  border-bottom: 0;
  color: #505866;
  background: #fff;
  cursor: pointer;
  font-size: 12px;
}

.conversion-condition-tabs button.active {
  border-color: #4f82df;
  color: #fff;
  background: #4f82df;
}

.conversion-condition-tabpanel {
  min-width: 0;
}

.conversion-condition-table-scroll {
  width: 100%;
  overflow-x: auto;
}

.conversion-condition-table {
  min-width: 900px;
}

.conversion-condition-table-head,
.conversion-condition-row {
  display: grid;
  grid-template-columns: 24px 64px 210px 130px minmax(220px, 1fr) 64px 88px 32px;
  align-items: center;
  gap: 8px;
}

.conversion-condition-table-head {
  min-height: 36px;
  color: #222a34;
  background: #f2f3f5;
  font-size: 12px;
  text-align: center;
}

.conversion-condition-row {
  min-height: 40px;
  border-bottom: 1px solid #f0f1f3;
}

.conversion-condition-row select,
.conversion-condition-row input,
.conversion-advanced-field textarea {
  width: 100%;
  min-width: 0;
  border: 1px solid #cfd5df;
  border-radius: 2px;
  outline: 0;
  color: #202833;
  background: #fff;
  font: inherit;
  font-size: 12px;
}

.conversion-condition-row select,
.conversion-condition-row input {
  height: 30px;
  padding: 0 8px;
}

.conversion-condition-row select:focus,
.conversion-condition-row input:focus,
.conversion-advanced-field textarea:focus {
  border-color: #4f82df;
  box-shadow: 0 0 0 2px rgba(79, 130, 223, 0.12);
}

.conversion-condition-row input:disabled {
  color: #8b929e;
  background: #f5f6f8;
}

.conversion-condition-drag,
.conversion-condition-remove {
  width: 28px;
  height: 28px;
  display: inline-grid;
  place-items: center;
  padding: 0;
  border: 0;
  color: #7b8797;
  background: transparent;
}

.conversion-condition-drag {
  width: 24px;
  cursor: grab;
}

.conversion-condition-remove {
  cursor: pointer;
}

.conversion-condition-drag svg,
.conversion-condition-remove svg,
.conversion-add-condition svg {
  width: 14px;
  height: 14px;
}

.conversion-condition-row.dragging {
  opacity: 0.45;
}

.conversion-condition-row.drag-over {
  box-shadow: inset 0 2px 0 #4f82df;
}

.conversion-add-condition {
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-top: 10px;
  padding: 0 8px;
  border: 1px solid #4f82df;
  border-radius: 2px;
  color: #4f82df;
  background: #fff;
  cursor: pointer;
  font-size: 12px;
}

.conversion-advanced-field {
  display: grid;
  gap: 8px;
  padding-top: 12px;
  color: #3e4652;
  font-size: 12px;
}

.conversion-advanced-field textarea {
  min-height: 280px;
  padding: 12px;
  resize: vertical;
}

.conversion-condition-footer {
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 14px;
  padding: 0 24px;
  border-top: 1px solid #e3e6eb;
}

.conversion-condition-footer .secondary-button,
.conversion-condition-footer .primary-button {
  width: auto;
  min-width: 66px;
  min-height: 32px;
  padding: 0 16px;
  border-radius: 2px;
}

.conversion-condition-footer .primary-button {
  border-color: #4f82df;
  color: #fff;
  background: #4f82df;
}

.conversion-condition-footer .primary-button:hover {
  border-color: #3d70ce;
  background: #3d70ce;
}

@media (max-width: 700px) {
  .conversion-condition-panel {
    width: calc(100vw - 16px);
    min-height: calc(100vh - 16px);
    max-height: calc(100vh - 16px);
  }

  .conversion-condition-header,
  .conversion-condition-body {
    padding-right: 12px;
    padding-left: 12px;
  }

  .conversion-condition-header h2 {
    font-size: 19px;
  }
}

.currency-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: 18px;
}

.currency-form-grid .field > span:first-child b {
  color: var(--danger);
  font-weight: 500;
}

.currency-form-grid .full-field {
  grid-column: 1 / -1;
}

.currency-form-grid textarea {
  width: 100%;
  min-height: 100px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 6px;
  outline: 0;
  resize: vertical;
  font: inherit;
  font-size: 13px;
}

.currency-form-grid textarea:focus {
  border-color: var(--brand);
  box-shadow: 0 0 0 3px rgba(10, 118, 91, 0.1);
}

.compare-file-name {
  margin: 0 0 18px;
  color: var(--muted);
  font-size: 12px;
}

.compare-summary {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin-bottom: 20px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}

.compare-summary article {
  min-height: 80px;
  display: grid;
  align-content: center;
  gap: 3px;
  padding: 0 16px;
  border-right: 1px solid var(--line);
}

.compare-summary article:last-child {
  border-right: 0;
}

.compare-summary span {
  color: var(--muted);
  font-size: 11px;
}

.compare-summary strong {
  font-size: 22px;
}

.compare-details {
  max-height: 280px;
  display: grid;
  gap: 6px;
  overflow-y: auto;
}

.compare-detail-row {
  min-height: 38px;
  display: grid;
  grid-template-columns: 70px 120px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  padding: 0 10px;
  border-bottom: 1px solid #edf0ee;
  font-size: 12px;
}

.compare-detail-row span:first-child {
  color: var(--brand);
  font-weight: 600;
}

.compare-detail-row small {
  color: var(--muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.log-query-panel {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  padding: 18px 0;
  border-bottom: 1px solid var(--line);
}

.log-query-panel label {
  display: grid;
  gap: 6px;
  color: var(--muted);
  font-size: 12px;
}

.log-query-panel input,
.log-query-panel select {
  width: 100%;
  min-height: 38px;
  padding: 0 10px;
  border: 1px solid var(--line);
  border-radius: 5px;
  outline: 0;
  background: #fff;
  color: var(--ink);
}

.log-query-panel input:focus,
.log-query-panel select:focus {
  border-color: var(--brand);
  box-shadow: 0 0 0 3px rgba(10, 118, 91, 0.1);
}

.log-query-panel input[readonly] {
  color: #59645f;
  background: #f1f4f2;
  cursor: default;
}

.log-scope-badge {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 10px;
  border: 1px solid #c8ddd6;
  border-radius: 4px;
  color: #385f54;
  background: #eff7f4;
  font-size: 12px;
}

.log-scope-badge svg {
  width: 15px;
  height: 15px;
}

.log-scope-badge b {
  padding-left: 7px;
  border-left: 1px solid #c8ddd6;
  font-weight: 600;
}

.log-scope-summary {
  color: var(--muted);
  font-size: 12px;
}

.log-toolbar {
  margin-bottom: 14px;
}

.log-table-section {
  min-height: 340px;
}

.log-table {
  min-width: 1880px;
}

.log-table th {
  width: 135px;
}

.log-table th:first-child {
  width: 56px;
}

.log-table th:nth-child(2) {
  width: 100px;
}

.log-table th:nth-child(3) {
  width: 240px;
}

.log-table th:nth-child(5) {
  width: 180px;
}

.log-table th:nth-child(6) {
  width: 180px;
}

.log-table th:nth-child(9) {
  width: 175px;
}

.log-table th:nth-child(12) {
  width: 145px;
}

.log-result {
  min-width: 46px;
  display: inline-flex;
  justify-content: center;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
}

.log-result.success {
  color: #0b6d54;
  background: #e4f4ee;
}

.log-result.failure {
  color: #a53333;
  background: #f8e8e8;
}

.log-description-button {
  padding: 0;
  border: 0;
  color: var(--brand);
  background: transparent;
  cursor: pointer;
  font: inherit;
}

.log-description-button:hover {
  text-decoration: underline;
}

.log-description-panel {
  max-width: 560px;
}

.log-description-body dl {
  margin: 0;
  border: 1px solid var(--line);
  border-bottom: 0;
}

.log-description-body dl > div {
  min-height: 44px;
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr);
  border-bottom: 1px solid var(--line);
}

.log-description-body dt,
.log-description-body dd {
  margin: 0;
  padding: 12px 14px;
}

.log-description-body dt {
  color: var(--muted);
  background: #f5f7f6;
  font-size: 12px;
}

.log-description-body dd {
  color: var(--ink);
  font-size: 13px;
}

.log-description-body .description-row dd {
  min-height: 74px;
  white-space: normal;
}

.log-pagination {
  grid-template-columns: 1fr auto 1fr;
}

.toast {
  position: fixed;
  left: 50%;
  bottom: 28px;
  z-index: 20;
  max-width: min(420px, calc(100vw - 32px));
  padding: 11px 16px;
  border-radius: 6px;
  color: #fff;
  background: #1f2b27;
  box-shadow: var(--shadow);
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, 12px);
  transition: opacity 180ms ease, transform 180ms ease;
  font-size: 13px;
}

.toast.show {
  opacity: 1;
  transform: translate(-50%, 0);
}

@media (max-width: 960px) {
  .login-shell {
    grid-template-columns: minmax(0, 0.9fr) minmax(390px, 1.1fr);
  }

  .scene-copy h1 {
    font-size: 42px;
  }

  .metric-grid,
  .quick-grid,
  .public-data-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .data-toolbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .toolbar-primary,
  .toolbar-secondary {
    width: 100%;
    flex-wrap: wrap;
  }
}

@media (max-width: 700px) {
  .login-shell {
    display: block;
  }

  .brand-scene {
    display: none;
  }

  .login-panel {
    min-height: 100svh;
    place-items: start center;
    padding: 28px 22px;
  }

  .login-card {
    margin-top: 3vh;
  }

  .mobile-brand {
    display: flex;
  }

  .login-footer {
    align-items: flex-start;
    gap: 8px;
    flex-direction: column;
  }

  .workspace {
    grid-template-columns: 68px minmax(0, 1fr);
  }

  .workspace-sidebar {
    padding: 18px 10px;
  }

  .workspace-logo span:last-child,
  .nav-item span,
  .subnav-item span,
  .subnav-label,
  .nav-chevron {
    display: none;
  }

  .workspace-logo {
    padding: 0 5px 22px;
  }

  .nav-item {
    justify-content: center;
    padding: 0;
  }

  .subnav {
    padding-left: 0;
  }

  .subnav-item {
    min-height: 8px;
    margin: 0 auto 3px;
    padding: 0;
    width: 28px;
    border-radius: 2px;
  }

  .subnav-item.active {
    background: var(--accent);
  }

  .workspace-header,
  .workspace-content {
    padding-right: 18px;
    padding-left: 18px;
  }

  .user-chip div {
    display: none;
  }

  .welcome-band {
    align-items: flex-start;
    gap: 18px;
    flex-direction: column;
  }

  .module-heading {
    align-items: stretch;
    flex-direction: column;
  }

  .module-search {
    width: 100%;
  }

  .currency-form-grid {
    grid-template-columns: 1fr;
  }

  .currency-form-grid .full-field {
    grid-column: auto;
  }

  .data-toolbar {
    gap: 8px;
  }

  .command-button {
    min-width: 38px;
    padding: 0 9px;
  }

  .command-button span {
    display: none;
  }

  .filter-summary {
    align-items: flex-start;
    flex-direction: column;
    padding: 10px 0;
  }

  .table-pagination {
    grid-template-columns: 1fr auto;
  }

  .table-pagination > label {
    display: none;
  }

  .compare-summary {
    grid-template-columns: repeat(2, 1fr);
  }

  .compare-summary article:nth-child(2) {
    border-right: 0;
  }

  .compare-detail-row {
    grid-template-columns: 58px 88px minmax(0, 1fr);
  }

  .log-query-panel {
    grid-template-columns: 1fr;
  }

  .log-toolbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .metric-grid,
  .quick-grid,
  .public-data-grid {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition: none !important;
  }
}

/* Kingdee-style workspace shell and list density */
.workspace {
  --kd-blue: #4f82df;
  --kd-blue-dark: #3d70ce;
  min-height: 100vh;
  display: block;
  color: #30343b;
  background: #eef1f5;
}

.workspace-header {
  min-height: 46px;
  height: 46px;
  position: sticky;
  top: 0;
  z-index: 60;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 16px;
  border-bottom: 1px solid #d9dde4;
  background: #fff;
}

.workspace-brandbar,
.workspace-actions,
.enterprise-switcher,
.user-chip {
  min-width: 0;
  display: flex;
  align-items: center;
}

.workspace-brandbar {
  gap: 8px;
}

.workspace-actions {
  gap: 5px;
}

.kd-icon-button {
  width: 32px;
  height: 32px;
  position: relative;
  display: inline-grid;
  flex: 0 0 auto;
  place-items: center;
  padding: 0;
  border: 0;
  border-radius: 2px;
  color: #66707e;
  background: transparent;
  cursor: pointer;
}

.kd-icon-button:hover,
.kd-icon-button[aria-expanded="true"] {
  color: var(--kd-blue);
  background: #eef4ff;
}

.kd-icon-button svg {
  width: 18px;
  height: 18px;
}

.app-launcher {
  color: var(--kd-blue);
}

.workspace-brandmark {
  width: 17px;
  height: 20px;
  display: grid;
  grid-template-columns: repeat(2, 6px);
  grid-template-rows: repeat(2, 6px);
  gap: 3px;
  transform: rotate(45deg);
}

.workspace-brandmark span {
  border-radius: 50%;
  background: #36b7ef;
}

.workspace-brandmark span:nth-child(2),
.workspace-brandmark span:nth-child(3) {
  background: #716ce9;
}

.workspace-brandname {
  color: #3280df;
  font-size: 17px;
  white-space: nowrap;
}

.enterprise-switcher {
  max-width: 360px;
  gap: 5px;
  padding: 0 6px;
  border: 0;
  color: #5f73a0;
  background: transparent;
  cursor: pointer;
  font-size: 13px;
}

.enterprise-switcher span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.enterprise-switcher svg {
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
}

.feedback-button {
  min-height: 28px;
  padding: 0 9px;
  border: 0;
  border-radius: 2px;
  color: #5a79bc;
  background: #f1f5ff;
  cursor: pointer;
  font-size: 12px;
}

.notice-badge {
  min-width: 17px;
  height: 15px;
  position: absolute;
  top: 0;
  right: -2px;
  display: grid;
  place-items: center;
  padding: 0 3px;
  border-radius: 8px;
  color: #fff;
  background: #e94d5f;
  font-size: 9px;
  line-height: 1;
}

.workspace .user-chip {
  gap: 7px;
  padding: 0 6px;
}

.workspace .user-chip > span {
  width: 28px;
  height: 28px;
  font-size: 11px;
  background: #ed5b79;
}

.workspace .user-chip strong {
  max-width: 100px;
  overflow: hidden;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workspace-tabbar {
  min-height: 36px;
  height: 36px;
  position: sticky;
  top: 46px;
  z-index: 55;
  display: flex;
  align-items: stretch;
  padding: 0 10px;
  border-bottom: 1px solid #d8dce3;
  background: #f5f6f8;
  overflow-x: auto;
  overflow-y: hidden;
}

.workspace-tabbar button {
  min-width: max-content;
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 14px;
  border: 0;
  color: #63708a;
  background: transparent;
  cursor: pointer;
  font-size: 12px;
}

.workspace-tabbar button::after {
  position: absolute;
  right: 8px;
  bottom: 0;
  left: 8px;
  height: 2px;
  content: "";
  background: transparent;
}

.workspace-tabbar button:hover,
.workspace-tabbar button.active {
  color: #3f6ec8;
}

.workspace-tabbar button.active::after {
  background: var(--kd-blue);
}

.workspace-tabbar .tab-home {
  min-width: 38px;
  padding: 0 8px;
}

.workspace-tabbar .tabbar-close {
  min-width: 36px;
  position: sticky;
  right: 0;
  z-index: 2;
  margin-left: auto;
  padding: 0 8px;
  border-left: 1px solid #d8dce3;
  background: #f5f6f8;
}

.workspace-tabbar .tabbar-close::after {
  display: none;
}

.workspace-tabbar svg {
  width: 16px;
  height: 16px;
}

.workspace-current-title {
  display: none;
}

.workspace-main {
  min-width: 0;
}

.workspace-content {
  width: 100%;
  max-width: none;
  min-height: calc(100vh - 82px);
  margin: 0;
  padding: 10px 16px 18px;
  background: #fff;
}

.workspace.tabs-collapsed .workspace-content {
  min-height: calc(100vh - 46px);
}

.app-menu-backdrop {
  position: fixed;
  inset: 46px 0 0;
  z-index: 80;
  background: rgba(24, 28, 34, 0.46);
}

.app-menu-panel {
  width: min(1360px, calc(100vw - 120px));
  height: calc(100vh - 46px);
  position: fixed;
  top: 46px;
  left: 0;
  z-index: 90;
  border-right: 1px solid #dfe2e8;
  background: #fff;
  box-shadow: 8px 0 30px rgba(29, 42, 64, 0.12);
  overflow: hidden;
}

.app-menu-header {
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 0 16px;
  border-bottom: 1px solid #e3e5e9;
}

.app-menu-header label {
  width: min(335px, 100%);
  height: 30px;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 0 9px;
  border: 1px solid #d9dde4;
}

.app-menu-header label:focus-within {
  border-color: var(--kd-blue);
}

.app-menu-header label svg {
  width: 14px;
  height: 14px;
  color: #86909e;
}

.app-menu-header input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  font-size: 12px;
}

.app-menu-layout {
  height: calc(100% - 48px);
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr) 150px;
}

.cloud-menu {
  padding: 10px 0 22px;
  border-right: 1px solid #eceef2;
  background: #fbfbfc;
  overflow-y: auto;
}

.cloud-menu button {
  width: 100%;
  min-height: 40px;
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr) 16px;
  align-items: center;
  gap: 8px;
  padding: 0 18px;
  border: 0;
  color: #303640;
  background: transparent;
  cursor: pointer;
  text-align: left;
  font-size: 13px;
}

.cloud-menu button:hover,
.cloud-menu button.active {
  color: #3d6fcf;
  background: #edf3ff;
}

.cloud-menu button svg {
  width: 16px;
  height: 16px;
  color: #8e9aae;
}

.cloud-menu button.active > svg:first-child {
  color: var(--kd-blue);
}

.cloud-menu .cloud-subitem {
  min-height: 38px;
  grid-template-columns: minmax(0, 1fr) auto;
  padding-left: 42px;
}

.cloud-menu .cloud-subitem small {
  padding: 3px 6px;
  color: #fff;
  background: var(--kd-blue);
  font-size: 10px;
}

.menu-catalog {
  padding: 22px 28px 48px;
  overflow-y: auto;
  scroll-behavior: smooth;
}

.menu-section {
  scroll-margin-top: 20px;
  margin-bottom: 22px;
}

.menu-section.search-hidden {
  display: none;
}

.enterprise-modeling-groups {
  display: grid;
  gap: 18px;
  padding-top: 14px;
}

.enterprise-modeling-group {
  padding-bottom: 16px;
  border-bottom: 1px solid #eceef2;
}

.enterprise-modeling-group h2 {
  margin: 0 0 10px;
  padding-left: 9px;
  border-left: 3px solid var(--kd-blue);
  font-size: 14px;
  font-weight: 600;
}

.menu-section h3 {
  margin: 0 0 10px;
  padding-left: 9px;
  border-left: 3px solid var(--kd-blue);
  font-size: 14px;
  font-weight: 600;
}

.menu-section-entry {
  padding: 0;
  border: 0;
  color: inherit;
  background: transparent;
  font: inherit;
  cursor: pointer;
}

.menu-section-entry:hover {
  color: var(--kd-blue-dark);
}

.sr-only {
  width: 1px;
  height: 1px;
  position: absolute;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.material-standard-page {
  padding: 0 10px 12px;
}

.material-standard-heading {
  min-height: 38px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.material-standard-filter-row,
.material-standard-search-row {
  display: flex;
  align-items: center;
  gap: 8px;
}

.material-standard-filter-row h1 {
  margin: 0 4px 0 0;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0;
  white-space: nowrap;
}

.material-standard-filter-row select {
  width: 162px;
  height: 28px;
  padding: 0 8px;
  border: 1px solid #d8dce3;
  border-radius: 0;
  background: #fff;
  font-size: 12px;
}

.material-standard-chip {
  min-height: 26px;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 0 7px;
  border: 1px solid #d7dbe2;
  color: #333943;
  background: #fff;
  font-size: 12px;
  white-space: nowrap;
}

button.material-standard-chip {
  cursor: pointer;
}

.material-standard-chip svg {
  width: 12px;
  height: 12px;
}

.material-standard-search-row .list-quick-search {
  width: 175px;
}

.material-standard-toolbar {
  min-height: 35px;
  padding: 2px 0 5px;
}

.material-standard-toolbar .command-button {
  min-width: 54px;
  height: 28px;
  min-height: 28px;
  padding: 0 9px;
}

.material-standard-toolbar .command-button svg:last-child {
  width: 12px;
}

.material-standard-selection-bar {
  min-height: 30px;
  display: flex;
  align-items: center;
  padding: 0 9px;
  border-top: 8px solid #e9edf3;
  border-bottom: 1px solid #d9dde3;
  color: #353b44;
  font-size: 12px;
}

.material-standard-table-section {
  min-height: calc(100vh - 180px);
  display: flex;
  flex-direction: column;
  border-top: 0;
}

.material-standard-table-section .table-scroll {
  flex: 1;
}

.material-standard-table {
  min-width: 1320px;
}

.material-standard-table th,
.material-standard-table td {
  height: 29px;
  padding: 0 8px;
}

.material-standard-table th[data-table-column="sequence"] { width: 54px; }
.material-standard-table th[data-table-column="code"] { width: 126px; }
.material-standard-table th[data-table-column="name"] { width: 175px; }
.material-standard-table th[data-table-column="description"] { width: 175px; }
.material-standard-table th[data-table-column="usageStatus"] { width: 150px; }
.material-standard-table th[data-table-column="isDefault"] { width: 70px; }
.material-standard-table th[data-table-column="systemPreset"] { width: 105px; }
.material-standard-table th[data-table-column="controlStrategy"] { width: 125px; }
.material-standard-table th[data-table-column="creationOrganization"] { width: 320px; }

.material-standard-pagination {
  order: 3;
}

.table-link-button {
  padding: 0;
  border: 0;
  color: #1769d2;
  background: transparent;
  cursor: pointer;
  font: inherit;
}

.table-link-button:hover {
  text-decoration: underline;
}

.material-standard-default-field .input-wrap {
  justify-content: flex-start;
  border: 0;
}

.material-standard-default-field input {
  width: 16px;
  height: 16px;
}

@media (max-width: 900px) {
  .material-standard-heading {
    align-items: flex-start;
    flex-direction: column;
    padding: 8px 0;
  }

  .material-standard-filter-row,
  .material-standard-search-row {
    width: 100%;
    flex-wrap: wrap;
  }

  .material-standard-search-row .list-quick-search {
    flex: 1;
  }
}

.menu-link-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: 20px;
  row-gap: 2px;
}

.menu-link-grid button {
  min-width: 0;
  min-height: 34px;
  padding: 0 10px;
  border: 0;
  color: #2d333c;
  background: transparent;
  cursor: pointer;
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
}

.menu-link-grid button:hover {
  color: var(--kd-blue-dark);
  background: #f2f6ff;
}

.menu-index {
  padding: 12px 0;
  border-left: 1px solid #eceef2;
  overflow-y: auto;
}

.menu-index button {
  width: 100%;
  min-height: 36px;
  padding: 0 18px;
  border: 0;
  color: #444b55;
  background: transparent;
  cursor: pointer;
  text-align: left;
  font-size: 12px;
}

.menu-index button:hover,
.menu-index button.active {
  color: var(--kd-blue-dark);
  background: #f2f6ff;
}

.module-heading {
  min-height: 44px;
  align-items: center;
  padding: 0 2px;
  border-bottom: 0;
}

.module-heading .breadcrumb,
.module-heading p {
  display: none;
}

.module-heading h1 {
  margin: 0;
  font-size: 16px;
  font-weight: 500;
}

.list-quick-search,
.module-search {
  width: 240px;
  min-height: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 0 9px;
  border: 1px solid #d9dde3;
  border-radius: 0;
  background: #fff;
}

.list-quick-search:focus-within,
.module-search:focus-within {
  border-color: var(--kd-blue);
  box-shadow: none;
}

.list-quick-search svg,
.module-search svg {
  width: 14px;
  height: 14px;
  color: #87909c;
}

.list-quick-search input,
.module-search input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  font-size: 12px;
}

.list-filter-strip {
  min-height: 46px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 7px 0;
  border: 1px solid #e0e2e6;
  border-right: 0;
  border-left: 0;
}

.list-filter-strip label {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 12px;
}

.list-filter-strip select {
  width: 180px;
  min-height: 30px;
  padding: 0 9px;
  border: 1px solid #d6dae0;
  outline: 0;
  background: #fff;
  font-size: 12px;
}

.filter-collapse-button,
.select-all-action {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 0;
  border: 0;
  color: #4f75bd;
  background: transparent;
  cursor: pointer;
  font-size: 12px;
}

.filter-collapse-button svg {
  width: 13px;
  height: 13px;
}

.data-toolbar {
  min-height: 44px;
  justify-content: flex-start;
  gap: 7px;
  padding: 6px 0;
  border-bottom: 0;
}

.toolbar-primary,
.toolbar-secondary {
  gap: 6px;
  flex-wrap: wrap;
}

.command-button {
  min-height: 30px;
  height: 30px;
  gap: 5px;
  padding: 0 11px;
  border: 1px solid var(--kd-blue);
  border-radius: 1px;
  color: #fff;
  background: var(--kd-blue);
  font-size: 12px;
}

.command-button:hover:not(:disabled),
.primary-command:hover:not(:disabled),
.danger-command:hover:not(:disabled) {
  border-color: var(--kd-blue-dark);
  color: #fff;
  background: var(--kd-blue-dark);
}

.command-button:disabled {
  border-color: #bfcce3;
  color: #f5f7fb;
  background: #9fb5da;
}

.command-button svg {
  width: 14px;
  height: 14px;
}

.unified-split-command {
  --kd-blue: #4f82df;
  display: inline-flex;
  align-items: stretch;
  gap: 0;
  position: relative;
  flex-shrink: 0;
}

.unified-split-command > button:first-child {
  display: inline-flex;
  align-items: center;
  height: 30px;
  min-height: 30px;
  padding: 0 11px;
  border: 1px solid var(--kd-blue);
  border-radius: 1px 0 0 1px;
  color: #fff;
  background: var(--kd-blue);
  font-size: 12px;
}

.unified-split-command > .split-caret {
  height: 30px;
  min-height: 30px;
  width: 23px;
  min-width: 23px;
  padding: 0;
  justify-content: center;
  border-left: 1px solid rgba(255, 255, 255, .25);
  background: var(--kd-blue);
  color: #fff;
}

.unified-split-command > button:first-child > svg {
  display: none;
}

.unified-split-command > button:first-child > span,
#currencyPage .command-button > span {
  display: inline !important;
}

#currencyPage .command-button > svg {
  display: none;
}

#currencyPage .split-caret > svg,
#currencyMoreButton > svg:last-child {
  display: block;
}

.unified-split-command .toolbar-menu {
  min-width: 76px;
}

.unified-split-command .toolbar-menu button {
  padding: 7px 12px;
}

.unified-split-command .toolbar-menu button > svg {
  display: none;
}

.more-trigger[aria-expanded="true"] > svg:last-child,
#toggleCurrencyFilters[aria-expanded="true"] > svg {
  transform: rotate(180deg);
}

#currencyPage .toolbar-primary {
  flex: 0 1 auto;
}

#currencyPage .toolbar-secondary {
  margin-left: 0;
}

.currency-sort-panel {
  --kd-blue: #4f82df;
  width: min(860px, calc(100vw - 32px));
  height: min(600px, calc(100vh - 48px));
  display: flex;
  flex-direction: column;
  border-radius: 2px;
  background: #fff;
  overflow: hidden;
}

.currency-sort-panel > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 46px;
  padding: 0 14px;
  border-bottom: 1px solid #ddd;
}

.currency-sort-panel h2 {
  font-size: 14px;
  font-weight: 400;
  margin: 0;
}

.currency-sort-panel > nav {
  display: flex;
  justify-content: flex-end;
  gap: 22px;
  padding: 14px 18px;
}

.currency-sort-panel .link-button {
  color: #1682ff;
  font-size: 13px;
}

.currency-sort-scroll {
  flex: 1;
  overflow: auto;
  min-height: 0;
}

.currency-sort-scroll table {
  width: 100%;
  min-width: 620px;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 12px;
}

.currency-sort-scroll th,
.currency-sort-scroll td {
  height: 28px;
  padding: 3px 10px;
  border-bottom: 1px solid #ddd;
  text-align: left;
  overflow-wrap: anywhere;
}

.currency-sort-scroll th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #f3f3f3;
  font-weight: 400;
}

.currency-sort-scroll th:first-child { width: 38px; }
.currency-sort-scroll th:nth-child(2) { width: 48px; }
.currency-sort-scroll td:nth-child(2) { white-space: nowrap; }
.currency-sort-scroll th:nth-child(3) { width: 110px; }
.currency-sort-scroll th:nth-child(4) { width: 240px; }
.currency-sort-scroll td:nth-child(3),
.currency-sort-scroll td:nth-child(4) { color: #005d9c; }
.currency-sort-scroll tr.selected { background: #e8f3ff; }
.currency-sort-scroll .icon-button { width: 22px; height: 20px; display: inline-flex; vertical-align: middle; }
#currencySortSearch { width: 100%; height: 28px; border: 1px solid #c7d2df; }

.currency-sort-panel > footer {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  border-top: 1px solid #ddd;
  font-size: 12px;
}

#currencySortCount { flex: 1; min-width: 0; }
.currency-sort-panel > footer > button { flex: none; width: auto; min-width: 64px; min-height: 30px; height: 30px; padding: 0 16px; border-radius: 2px; font-size: 12px; }
.currency-sort-panel > footer > .primary-button { background: var(--kd-blue); border: 1px solid var(--kd-blue); color: #fff; }
.currency-filter-actions > button { width: auto; min-height: 30px; height: 30px; font-size: 12px; }
.currency-filter-actions > .primary-button { background: var(--kd-blue); border: 1px solid var(--kd-blue); color: #fff; padding: 0 16px; border-radius: 2px; }
.currency-filter-panel { padding: 12px 0; border-bottom: 1px solid #ddd; }
.currency-filter-row { display: grid; grid-template-columns: 80px 150px 130px minmax(140px, 1fr) 30px; gap: 10px; max-width: 850px; margin-bottom: 8px; }
.currency-filter-row input,
.currency-filter-row select { width: 100%; min-width: 0; height: 30px; border: 1px solid #d7dce3; padding: 0 8px; background: #fff; font-size: 12px; }
.currency-filter-row input:disabled { background: #f2f3f5; }
.currency-filter-actions { display: flex; align-items: center; gap: 12px; }
.currency-filter-actions .link-button { display: inline-flex; align-items: center; gap: 4px; }
.currency-filter-actions svg { width: 14px; height: 14px; }

@media (max-width: 640px) {
  .currency-filter-row { grid-template-columns: 75px minmax(0, 1fr) 110px; }
  .currency-filter-row input { grid-column: 1 / 3; }
  .currency-sort-panel > nav { gap: 18px; }
}

.log-query-panel {
  grid-template-columns: repeat(6, minmax(130px, 1fr));
  gap: 14px;
  padding: 12px 2px;
  border: 1px solid #e0e2e6;
  border-right: 0;
  border-left: 0;
}

.log-query-panel label {
  grid-template-columns: max-content minmax(0, 1fr);
  align-items: center;
  gap: 7px;
  color: #4d535d;
  font-size: 12px;
}

.log-query-panel input,
.log-query-panel select {
  min-height: 30px;
  height: 30px;
  padding: 0 8px;
  border-color: #d7dbe1;
  border-radius: 0;
  font-size: 12px;
}

.log-query-panel input:focus,
.log-query-panel select:focus {
  border-color: var(--kd-blue);
  box-shadow: none;
}

.log-toolbar {
  margin-bottom: 0;
}

.data-table-section {
  border: 8px solid #e9edf3;
  border-radius: 0;
  background: #fff;
}

.table-pagination {
  min-height: 34px;
  display: grid;
  grid-template-columns: auto auto minmax(180px, 1fr) auto;
  gap: 14px;
  padding: 0 8px;
  border-top: 0;
  border-bottom: 1px solid #d8dce2;
  color: #474d56;
  font-size: 12px;
}

.table-pagination > div {
  justify-self: end;
  gap: 2px;
}

.table-pagination > label {
  justify-self: end;
}

.table-pagination .icon-button {
  width: 26px;
  height: 26px;
  border-radius: 0;
}

.table-pagination select {
  min-height: 26px;
  margin: 0;
  padding: 0 5px;
  border-color: #d5d9df;
  border-radius: 0;
  font-size: 12px;
}

.currency-table {
  min-width: 850px;
  table-layout: fixed;
}

.currency-table th,
.currency-table td {
  height: 36px;
  padding: 0 10px;
  border-bottom: 1px solid #dfe2e6;
  color: #2f343b;
  font-size: 12px;
}

.currency-table th {
  height: 34px;
  color: #333943;
  background: #f3f3f4;
  font-weight: 500;
}

.currency-table tbody tr:hover,
.currency-table tbody tr.selected {
  background: #eef5ff;
}

.currency-table tbody td:nth-child(2) {
  color: #1670b7;
}

.status-pill,
.log-result {
  min-width: 0;
  display: inline;
  padding: 0;
  border-radius: 0;
  color: inherit;
  background: transparent;
  font-size: 12px;
  font-weight: 400;
}

.status-pill.enabled,
.log-result.success {
  color: #30343b;
  background: transparent;
}

.status-pill.disabled,
.log-result.failure {
  color: #30343b;
  background: transparent;
}

.log-table {
  min-width: 1780px;
}

.log-table th,
.log-table td {
  height: 36px;
}

.log-table td:nth-child(10) {
  color: #1670b7;
}

.public-data-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 2px 18px;
  padding: 14px 2px;
}

.public-data-item {
  min-height: 40px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 10px;
  border: 0;
  border-radius: 0;
  background: #fff;
}

.public-data-item:hover {
  border-color: transparent;
  color: var(--kd-blue-dark);
  background: #f2f6ff;
  box-shadow: none;
}

.public-data-item > svg:first-child {
  width: 17px;
  height: 17px;
  padding: 0;
  border-radius: 0;
  color: #7b8eae;
  background: transparent;
}

.public-data-item > span {
  padding-right: 0;
  font-size: 12px;
  font-weight: 400;
}

.public-data-item > small,
.public-data-item .item-arrow {
  display: none;
}

@media (max-width: 1100px) {
  .app-menu-panel {
    width: calc(100vw - 40px);
  }

  .app-menu-layout {
    grid-template-columns: 180px minmax(0, 1fr) 120px;
  }

  .menu-link-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .log-query-panel {
    grid-template-columns: repeat(3, minmax(180px, 1fr));
  }
}

@media (max-width: 700px) {
  .workspace-header {
    padding: 0 8px;
  }

  .workspace-brandname,
  .feedback-button,
  .workspace-actions > .kd-icon-button:not(#logoutButton):not(#toggleWorkspaceTabsButton) {
    display: none;
  }

  .enterprise-switcher {
    max-width: 190px;
    font-size: 11px;
  }

  .workspace .user-chip strong {
    display: none;
  }

  .workspace-tabbar {
    padding: 0 4px;
  }

  .workspace-content {
    padding: 8px;
  }

  .app-menu-panel {
    width: 100vw;
  }

  .app-menu-layout {
    grid-template-columns: 104px minmax(0, 1fr);
  }

  .cloud-menu button {
    grid-template-columns: 16px minmax(0, 1fr);
    gap: 5px;
    padding: 0 8px;
    font-size: 11px;
  }

  .cloud-menu button > svg:last-child,
  .cloud-menu .cloud-subitem small,
  .menu-index {
    display: none;
  }

  .cloud-menu .cloud-subitem {
    grid-template-columns: 1fr;
    padding-left: 28px;
  }

  .menu-catalog {
    padding: 16px 10px 36px;
  }

  .menu-link-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 2px;
  }

  .module-heading {
    min-height: 42px;
    flex-direction: row;
  }

  .list-quick-search,
  .module-search {
    width: min(58vw, 230px);
  }

  .list-filter-strip select {
    width: 120px;
  }

  .data-toolbar {
    align-items: flex-start;
    flex-direction: column;
  }

  .toolbar-primary,
  .toolbar-secondary {
    width: 100%;
  }

  .command-button {
    min-width: 32px;
    padding: 0 8px;
  }

  .command-button span {
    display: none;
  }

  .log-query-panel {
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }

  .log-query-panel label {
    grid-template-columns: 1fr;
    gap: 4px;
  }

  .table-pagination {
    grid-template-columns: auto 1fr;
  }

  .table-pagination .select-all-action,
  .table-pagination > label {
    display: none;
  }

  .public-data-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Column widths follow field identity so reordering never changes a column's layout. */
.currency-table th[data-table-column="code"] { width: 160px; }
.currency-table th[data-table-column="name"] { width: 280px; }
.currency-table th[data-table-column="amountPrecision"],
.currency-table th[data-table-column="pricePrecision"] { width: 150px; }
.currency-table th[data-table-column="status"] { width: 150px; }

.log-table th[data-table-column="sequence"] { width: 86px; }
.log-table th[data-table-column="operator"] { width: 125px; }
.log-table th[data-table-column="organization"] { width: 240px; }
.log-table th[data-table-column="application"] { width: 145px; }
.log-table th[data-table-column="object"] { width: 160px; }
.log-table th[data-table-column="code"] { width: 180px; }
.log-table th[data-table-column="operation"] { width: 150px; }
.log-table th[data-table-column="result"] { width: 125px; }
.log-table th[data-table-column="time"] { width: 180px; }
.log-table th[data-table-column="description"] { width: 140px; }
.log-table th[data-table-column="clientType"] { width: 135px; }
.log-table th[data-table-column="clientAddress"] { width: 150px; }

.settlement-toolbar-primary {
  flex-wrap: wrap;
}

.toolbar-menu-wrap {
  position: relative;
}

.toolbar-menu {
  width: 238px;
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 24;
  padding: 5px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  box-shadow: var(--shadow);
}

.toolbar-menu button {
  width: 100%;
  min-height: 38px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 0 10px;
  border: 0;
  border-radius: 4px;
  color: var(--ink);
  background: transparent;
  cursor: pointer;
  text-align: left;
  font-size: 13px;
}

.toolbar-menu button:hover {
  color: var(--brand-dark);
  background: #edf5f2;
}

.toolbar-menu button:disabled {
  color: #a4aca9;
  cursor: not-allowed;
}

.toolbar-menu svg {
  width: 15px;
  height: 15px;
}

.original-order-more-menu {
  width: 260px;
  max-height: min(520px, calc(100vh - 160px));
  overflow-y: auto;
}

.linkage-toolbar-menu {
  width: 178px;
}

.document-linkage-backdrop {
  z-index: 135;
  padding: 18px;
  background: rgba(18, 24, 34, 0.48);
}

.document-linkage-panel {
  width: min(1120px, calc(100vw - 36px));
  height: min(720px, calc(100vh - 36px));
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid #cfd5df;
  border-radius: 3px;
  background: #f5f7fa;
  box-shadow: 0 18px 52px rgba(21, 31, 48, 0.28);
}

.document-linkage-header {
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 16px 0 22px;
  border-bottom: 1px solid #dce1e8;
  background: #fff;
}

.document-linkage-header p,
.document-linkage-header h2 {
  margin: 0;
  letter-spacing: 0;
}

.document-linkage-header p {
  margin-bottom: 2px;
  color: #788393;
  font-size: 11px;
}

.document-linkage-header h2 {
  color: #202936;
  font-size: 16px;
  font-weight: 500;
}

.document-linkage-tabs {
  min-height: 42px;
  display: flex;
  align-items: stretch;
  gap: 8px;
  padding: 0 20px;
  border-bottom: 1px solid #dce1e8;
  background: #fff;
}

.document-linkage-tabs button {
  min-width: 88px;
  position: relative;
  border: 0;
  color: #586373;
  background: transparent;
  cursor: pointer;
  font-size: 13px;
}

.document-linkage-tabs button.active {
  color: #2f6edb;
  font-weight: 600;
}

.document-linkage-tabs button.active::after {
  height: 2px;
  position: absolute;
  right: 12px;
  bottom: 0;
  left: 12px;
  content: "";
  background: #2f72e2;
}

.document-linkage-body {
  min-height: 0;
  flex: 1;
  padding: 24px;
  overflow: auto;
}

.document-linkage-footer {
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 22px;
  border-top: 1px solid #dce1e8;
  background: #fff;
}

.document-linkage-footer span {
  color: #687485;
  font-size: 12px;
}

.document-linkage-footer .primary-button {
  width: auto;
  min-width: 72px;
  min-height: 30px;
  border-radius: 2px;
  background: #4f7fe8;
}

.document-chain-view {
  min-height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
}

.document-link-node {
  width: 230px;
  min-height: 84px;
  display: grid;
  align-content: center;
  gap: 5px;
  padding: 11px 14px;
  border: 1px solid #cfd6e1;
  border-radius: 4px;
  color: #273140;
  background: #fff;
  text-align: left;
}

button.document-link-node.available {
  cursor: pointer;
}

button.document-link-node.available:hover {
  border-color: #78a1ee;
  box-shadow: 0 3px 12px rgba(47, 114, 226, 0.12);
}

.document-link-node.selected {
  border-color: #4f82df;
  background: #edf4ff;
}

.document-link-node .document-link-type {
  color: #647184;
  font-size: 11px;
}

.document-link-node strong {
  overflow-wrap: anywhere;
  color: #245fbe;
  font-size: 13px;
  font-weight: 600;
}

.document-link-node small {
  color: #6f7a89;
  font-size: 11px;
}

.document-chain-arrow {
  width: 17px;
  height: 17px;
  margin: 7px 0;
  color: #8da0ba;
}

.document-link-empty {
  margin: 18px 0 0;
  color: #7b8695;
  font-size: 12px;
}

.document-linkage-list-view {
  min-height: 100%;
  display: flex;
  flex-direction: column;
  border: 1px solid #dfe4eb;
  background: #fff;
}

.document-linkage-list-toolbar {
  min-height: 42px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  border-bottom: 1px solid #dfe4eb;
  background: #f8fafc;
}

.document-linkage-list-toolbar button {
  height: 28px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 0 10px;
  border: 1px solid #4f7fe8;
  border-radius: 2px;
  color: #fff;
  background: #4f7fe8;
  cursor: pointer;
  font-size: 12px;
}

.document-linkage-list-toolbar button:disabled {
  border-color: #cbd3de;
  color: #98a2af;
  background: #eef1f5;
  cursor: not-allowed;
}

.document-linkage-list-toolbar svg {
  width: 14px;
  height: 14px;
}

.document-linkage-list-toolbar > span {
  margin-left: auto;
  color: #3568c7;
  font-size: 12px;
}

.document-linkage-list-toolbar > b {
  max-width: 280px;
  overflow: hidden;
  color: #657184;
  font-size: 12px;
  font-weight: 400;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.document-linkage-result-tabs,
.document-linkage-root-tabs {
  min-height: 38px;
  display: flex;
  align-items: stretch;
  gap: 2px;
  overflow-x: auto;
  border-bottom: 1px solid #dfe4eb;
  background: #fff;
}

.document-linkage-result-tabs button,
.document-linkage-root-tabs button {
  min-width: 126px;
  position: relative;
  flex: 0 0 auto;
  padding: 0 14px;
  border: 0;
  color: #586576;
  background: transparent;
  cursor: pointer;
  font-size: 12px;
}

.document-linkage-result-tabs button.active,
.document-linkage-root-tabs button.active {
  color: #2f6edb;
  font-weight: 600;
}

.document-linkage-result-tabs button.active::after,
.document-linkage-root-tabs button.active::after {
  height: 2px;
  position: absolute;
  right: 12px;
  bottom: 0;
  left: 12px;
  content: "";
  background: #2f72e2;
}

.document-linkage-result-tabs span {
  margin-left: 4px;
  color: #8793a3;
  font-weight: 400;
}

.document-linkage-result-table {
  min-height: 0;
  flex: 1;
  overflow: auto;
}

.document-linkage-result-table table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 12px;
}

.document-linkage-result-table th,
.document-linkage-result-table td {
  height: 34px;
  overflow: hidden;
  padding: 0 9px;
  border-right: 1px solid #edf0f4;
  border-bottom: 1px solid #e5e9ef;
  color: #3f4957;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.document-linkage-result-table th {
  position: sticky;
  z-index: 2;
  top: 0;
  color: #4d5968;
  background: #f5f7fa;
  font-weight: 500;
}

.document-linkage-result-table :is(th, td):first-child { width: 38px; text-align: center; }
.document-linkage-result-table :is(th, td):nth-child(2) { width: 44px; text-align: center; }
.document-linkage-result-table :is(th, td):nth-child(3) { width: 190px; }
.document-linkage-result-table :is(th, td):nth-child(4) { width: 190px; }
.document-linkage-result-table :is(th, td):nth-child(5) { width: 92px; }
.document-linkage-result-table tr.selected td { background: #edf4ff; }

.document-linkage-list-empty {
  height: 150px !important;
  color: #84909f !important;
  text-align: center !important;
}

.document-linkage-list-status {
  min-height: 34px;
  display: flex;
  align-items: center;
  padding: 0 12px;
  border-top: 1px solid #dfe4eb;
  color: #657184;
  background: #fafbfc;
  font-size: 12px;
}

.document-linkage-multi-focus {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.document-linkage-focus-content {
  min-height: 0;
  flex: 1;
  overflow: auto;
}

.document-linkage-focus-content > .kingdee-relation-view {
  height: 100%;
}

#documentLinkageModal.document-linkage-template-mode {
  padding: 4px;
  background: rgba(18, 24, 34, 0.24);
}

#documentLinkageModal.document-linkage-template-mode .document-linkage-panel {
  width: calc(100vw - 8px);
  height: calc(100vh - 8px);
  border-color: #d6dce5;
  border-radius: 0;
  background: #f3f6fa;
  box-shadow: none;
}

#documentLinkageModal.document-linkage-template-mode :is(.document-linkage-header, .document-linkage-tabs, .document-linkage-footer) {
  display: none;
}

#documentLinkageModal.document-linkage-template-mode .document-linkage-body {
  padding: 0;
  overflow: hidden;
}

.kingdee-relation-view {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: #f5f7fa;
}

.kingdee-relation-toolbar {
  min-height: 38px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 16px;
  border-bottom: 8px solid #e3e8f0;
  background: #fff;
}

.kingdee-relation-toolbar button {
  min-width: 56px;
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 0 10px;
  border: 1px solid #4d7be3;
  border-radius: 2px;
  color: #fff;
  background: #4f7fe8;
  cursor: pointer;
  font-size: 12px;
}

.kingdee-relation-toolbar button:hover {
  border-color: #2f65cf;
  background: #3e70dc;
}

.kingdee-relation-toolbar svg {
  width: 14px;
  height: 14px;
}

.kingdee-relation-stage {
  min-height: 0;
  position: relative;
  flex: 1;
  overflow: hidden;
  border: 1px solid #dfe5ed;
  border-top: 0;
  background: #f6f8fb;
}

.kingdee-relation-scroll {
  width: 100%;
  height: 100%;
  overflow: auto;
  scrollbar-color: #9aa2ad transparent;
  scrollbar-width: thin;
}

.kingdee-relation-canvas {
  min-width: 100%;
  min-height: 100%;
  position: relative;
  background: #f6f8fb;
}

.kingdee-relation-layout-switch {
  position: absolute;
  z-index: 5;
  top: 18px;
  right: 22px;
  display: flex;
  border: 1px solid #4f7fe8;
  border-radius: 2px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 1px 3px rgba(40, 72, 125, 0.12);
}

.kingdee-relation-layout-switch button {
  width: 26px;
  height: 26px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  border-right: 1px solid #4f7fe8;
  color: #4f7fe8;
  background: #fff;
  cursor: pointer;
}

.kingdee-relation-layout-switch button:last-child {
  border-right: 0;
}

.kingdee-relation-layout-switch button.active {
  color: #fff;
  background: #4f7fe8;
}

.kingdee-relation-layout-switch svg {
  width: 15px;
  height: 15px;
}

.kingdee-relation-connectors {
  position: absolute;
  z-index: 0;
  inset: 0;
  overflow: visible;
  pointer-events: none;
}

.kingdee-relation-connectors marker path {
  fill: #8ec4ff;
}

.kingdee-relation-line {
  fill: none;
  stroke: #8ec4ff;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2;
}

.kingdee-relation-status circle {
  fill: #fff;
  stroke-width: 1.5;
}

.kingdee-relation-status path {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.6;
}

.kingdee-relation-status.complete circle,
.kingdee-relation-status.complete path {
  stroke: #18a963;
}

.kingdee-relation-status.pending circle,
.kingdee-relation-status.pending path {
  stroke: #d89021;
}

.kingdee-relation-card {
  position: absolute;
  z-index: 2;
  display: flex;
  flex-direction: column;
  padding: 12px 12px 10px;
  border: 1px solid #e2e6ec;
  border-radius: 3px;
  color: #333d4a;
  background: #fff;
  box-shadow: 0 2px 8px rgba(28, 43, 64, 0.14);
}

.kingdee-relation-card.selected {
  border-color: #6ea8ef;
  box-shadow: 0 0 0 2px rgba(79, 127, 232, 0.12), 0 2px 8px rgba(28, 43, 64, 0.14);
}

.kingdee-relation-card-title {
  height: 20px;
  overflow: hidden;
  color: #202935;
  font-size: 13px;
  font-weight: 500;
  line-height: 20px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kingdee-relation-number {
  width: 100%;
  height: 20px;
  overflow: hidden;
  padding: 0;
  border: 0;
  color: #0767d8;
  background: transparent;
  cursor: pointer;
  font-size: 12px;
  line-height: 20px;
  text-align: left;
  text-decoration: underline;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kingdee-relation-number:hover {
  color: #004ca8;
}

.kingdee-relation-number.unavailable {
  display: block;
  color: #788494;
  cursor: default;
  text-decoration: none;
}

.kingdee-relation-divider {
  height: 0;
  margin: 3px 0 5px;
  border-top: 1px dashed #e5e8ed;
}

.kingdee-relation-detail {
  min-width: 0;
  height: 18px;
  display: flex;
  align-items: center;
  color: #596473;
  font-size: 11px;
  line-height: 18px;
}

.kingdee-relation-detail > span {
  flex: 0 0 auto;
}

.kingdee-relation-detail > b {
  min-width: 0;
  overflow: hidden;
  font-weight: 400;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kingdee-relation-root-pin {
  width: 24px;
  height: 24px;
  position: absolute;
  z-index: 3;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: #ff9418;
  box-shadow: 0 1px 3px rgba(118, 66, 8, 0.24);
}

.kingdee-relation-root-pin svg {
  width: 15px;
  height: 15px;
}

.business-flow-view {
  display: grid;
  gap: 18px;
}

.business-flow-view > section {
  border-top: 1px solid #dce2ea;
  border-bottom: 1px solid #dce2ea;
  background: #fff;
}

.business-flow-view > section > header {
  min-height: 52px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 16px;
  border-bottom: 1px solid #e1e5eb;
}

.business-flow-view > section > header svg {
  width: 20px;
  color: #3975d5;
}

.business-flow-view > section > header div {
  display: grid;
  gap: 2px;
}

.business-flow-view > section > header strong {
  color: #27313e;
  font-size: 13px;
}

.business-flow-view > section > header span {
  color: #7a8594;
  font-size: 11px;
}

.business-flow-track {
  min-width: max-content;
  display: flex;
  align-items: center;
  padding: 20px 16px;
  overflow-x: auto;
}

.business-flow-stage {
  width: 142px;
  min-height: 98px;
  display: grid;
  align-content: center;
  gap: 6px;
  padding: 9px;
  border: 1px solid #d1d8e2;
  border-radius: 4px;
  background: #fff;
}

.business-flow-stage > span {
  color: #5d6978;
  font-size: 12px;
  font-weight: 600;
}

.business-flow-stage > strong,
.business-flow-stage > small {
  color: #7a8594;
  font-size: 11px;
}

.business-flow-stage.completed {
  border-color: #75b99f;
  background: #f1faf6;
}

.business-flow-stage.pending {
  border-style: dashed;
  background: #f8f9fb;
}

.business-flow-stage .document-link-node {
  width: 100%;
  min-height: 58px;
  padding: 0;
  border: 0;
  background: transparent;
}

.business-flow-arrow {
  width: 17px;
  height: 17px;
  margin: 0 7px;
  flex: 0 0 auto;
  color: #8498b4;
}

@media (max-width: 760px) {
  .document-linkage-backdrop { padding: 8px; }
  .document-linkage-panel { width: calc(100vw - 16px); height: calc(100vh - 16px); }
  .document-linkage-tabs { overflow-x: auto; }
  .document-linkage-tabs button { min-width: 76px; }
  .document-linkage-body { padding: 14px; }
}

.more-trigger svg:last-child {
  width: 13px;
  height: 13px;
  margin-left: 1px;
}

.list-settings-button {
  margin-left: 3px;
  border-left: 1px solid var(--line);
}

.list-settings-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
}

.list-settings-actions .secondary-button {
  width: auto;
  min-height: 32px;
  padding: 0 12px;
}

.list-settings-actions span {
  margin-left: auto;
  color: var(--muted);
  font-size: 12px;
}

.global-template-control {
  display: grid;
  gap: 5px;
  margin-bottom: 14px;
  padding: 12px;
  border: 1px solid #bdd8cf;
  border-radius: 5px;
  background: #f2f8f6;
}

.global-template-control label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
}

.global-template-control input {
  width: 16px;
  height: 16px;
  accent-color: var(--brand);
}

.global-template-control small {
  padding-left: 24px;
  color: var(--muted);
  font-size: 11px;
}

.list-control-panel {
  width: min(702px, calc(100vw - 28px));
  height: min(520px, calc(100vh - 28px));
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid #cfd3da;
  border-radius: 2px;
  background: #fff;
  box-shadow: 0 16px 44px rgba(24, 31, 43, 0.24);
}

#listSettingsModal {
  z-index: 100;
}

#originalOrderTemplateManagerModal,
#originalOrderTemplateEditorModal,
#originalOrderTransferResultsModal,
#universalTemplateManagerModal,
#universalTemplateEditorModal,
#templatePersonalizationModal {
  z-index: 100;
}

.universal-template-manager-panel {
  width: min(1240px, calc(100vw - 36px));
}

.universal-template-manager-panel .template-manager-table {
  min-width: 1120px;
}

.universal-template-manager-panel tr.is-system td {
  background: #f8fafc;
}

.universal-template-manager-panel tr.is-selected td {
  background: #eef5ff;
}

.universal-template-type-filter {
  display: inline-flex;
  gap: 4px;
}

.universal-template-type-filter button {
  min-height: 26px;
  padding: 0 10px;
  border: 1px solid #d5dae2;
  border-radius: 2px;
  color: #4f5968;
  background: #fff;
  cursor: pointer;
}

.universal-template-type-filter button.active {
  border-color: #5a86e8;
  color: #245fc8;
  background: #eef4ff;
}

.template-system-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: #5c6674;
  font-size: 11px;
}

.template-row-action {
  padding: 2px 7px;
  border: 0;
  color: #2468d7;
  background: transparent;
  cursor: pointer;
}

.universal-template-parameters {
  flex-wrap: wrap;
}

.universal-template-parameters label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.universal-template-fields-table {
  min-width: 1180px;
}

.universal-template-fields-table th:nth-child(5),
.universal-template-fields-table td:nth-child(5) {
  width: 90px;
  text-align: center;
}

.template-personalization-panel {
  width: min(680px, calc(100vw - 32px));
}

.template-personalization-tabs {
  display: flex;
  gap: 20px;
  padding: 0 24px;
  border-bottom: 1px solid #dbe0e8;
}

.template-personalization-tabs button {
  height: 38px;
  border: 0;
  border-bottom: 2px solid transparent;
  color: #697484;
  background: transparent;
  cursor: pointer;
}

.template-personalization-tabs button.active {
  border-bottom-color: #4f7fe8;
  color: #2567d6;
}

.template-personalization-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 13px 22px;
}

.template-personalization-options strong {
  grid-column: 1 / -1;
  padding-top: 4px;
  color: #364152;
  font-size: 12px;
}

.template-personalization-options label {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #4c5665;
  font-size: 12px;
}

.template-personalization-options select {
  min-width: 110px;
  height: 29px;
  border: 1px solid #ccd3de;
}

.template-editor-backdrop {
  padding: 10px;
}

.original-order-template-editor {
  width: min(1500px, calc(100vw - 20px));
  height: min(900px, calc(100vh - 20px));
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid #cfd3da;
  border-radius: 2px;
  background: #eef1f6;
  box-shadow: 0 16px 44px rgba(24, 31, 43, 0.24);
}

.template-editor-titlebar {
  min-height: 46px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 12px 0 20px;
  border-bottom: 1px solid #d8dce3;
  background: #fff;
}

.template-editor-titlebar h2 {
  margin: 0;
  color: #202733;
  font-size: 16px;
  font-weight: 500;
}

.template-editor-toolbar {
  min-height: 48px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 0 20px;
  border-bottom: 1px solid #dbe0e8;
  background: #fff;
}

.template-editor-toolbar .primary-button {
  min-width: 54px;
  width: auto;
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 0 12px;
  border-radius: 1px;
  background: #4f7fe8;
}

.template-editor-toolbar svg {
  width: 14px;
  height: 14px;
}

.template-editor-body {
  min-height: 0;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 9px;
  padding: 9px;
  overflow: auto;
}

.template-editor-section {
  background: #fff;
}

.template-editor-section > h3,
.template-editor-fields-section > header h3 {
  height: 31px;
  display: flex;
  align-items: center;
  gap: 4px;
  margin: 0;
  padding: 0 10px;
  color: #252d38;
  font-size: 13px;
  font-weight: 500;
}

.template-editor-section h3 svg {
  width: 13px;
  height: 13px;
}

.template-editor-basic-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(150px, 1fr));
  gap: 7px 20px;
  padding: 2px 28px 10px;
}

.template-editor-basic-grid > label,
.template-readonly-field,
.template-scope-field {
  min-width: 0;
  display: grid;
  grid-template-columns: 86px minmax(0, 1fr);
  align-items: center;
  gap: 7px;
  position: relative;
  color: #586170;
  font-size: 12px;
}

.template-editor-basic-grid input,
.template-editor-basic-grid select,
.template-scope-field > button {
  min-width: 0;
  width: 100%;
  height: 29px;
  padding: 0 9px;
  border: 1px solid #cdd3dc;
  border-radius: 1px;
  color: #252d38;
  background: #fff;
  font-size: 12px;
}

.template-scope-field > button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  cursor: pointer;
}

.template-scope-field > button svg {
  width: 13px;
  height: 13px;
}

.template-readonly-field strong {
  color: #252d38;
  font-weight: 500;
}

.template-scope-menu {
  position: absolute;
  top: 33px;
  right: 0;
  z-index: 12;
  width: calc(100% - 93px);
  min-width: 170px;
  border: 1px solid #d2d6dd;
  background: #fff;
  box-shadow: 0 6px 18px rgba(31, 42, 60, 0.18);
}

.template-scope-menu > label,
.template-scope-menu footer {
  min-height: 31px;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 0 12px;
  color: #333c48;
}

.template-scope-menu > label:hover {
  background: #eef4ff;
}

.template-scope-menu input {
  width: 14px;
  height: 14px;
  accent-color: #5284ec;
}

.template-scope-menu footer {
  justify-content: space-between;
  border-top: 1px solid #d8dce3;
  color: #697382;
}

.template-scope-menu footer label {
  display: flex;
  align-items: center;
  gap: 7px;
}

.template-editor-parameter > div {
  min-height: 42px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 40px;
  color: #4f5865;
  font-size: 12px;
}

.template-editor-fields-section {
  min-height: 330px;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.template-editor-fields-section > header {
  min-height: 34px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-right: 14px;
}

.template-editor-fields-section > header > div {
  display: flex;
  align-items: center;
  gap: 14px;
}

.template-editor-fields-section > header button {
  padding: 2px 0;
  border: 0;
  color: #1f67d8;
  background: transparent;
  cursor: pointer;
  font-size: 12px;
}

.template-editor-tabs {
  min-height: 36px;
  display: flex;
  align-items: end;
  gap: 18px;
  margin: 0 30px;
  border-bottom: 1px solid #d8dce3;
}

.template-editor-tabs button {
  height: 36px;
  padding: 0 10px;
  border: 0;
  border-bottom: 2px solid transparent;
  color: #707988;
  background: transparent;
  font-size: 12px;
}

.template-editor-tabs button.active {
  border-bottom-color: #4f7fe8;
  color: #2f6fe4;
}

.template-editor-table-wrap {
  min-height: 0;
  flex: 1;
  margin: 7px 30px 12px;
  overflow: auto;
  border: 1px solid #d6dae1;
}

.template-editor-table {
  width: 100%;
  min-width: 980px;
  border-collapse: collapse;
  table-layout: fixed;
}

.template-editor-table th,
.template-editor-table td {
  height: 28px;
  padding: 0 8px;
  border-bottom: 1px solid #dfe2e7;
  color: #3b4450;
  font-size: 12px;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.template-editor-table th {
  position: sticky;
  top: 0;
  z-index: 3;
  background: #f4f5f7;
  font-weight: 500;
}

.template-editor-table th:first-child,
.template-editor-table td:first-child { width: 42px; text-align: center; }
.template-editor-table th:nth-child(2),
.template-editor-table td:nth-child(2) { width: 210px; }
.template-editor-table th:nth-child(3),
.template-editor-table td:nth-child(3) { width: 240px; }
.template-editor-table th:nth-child(4),
.template-editor-table td:nth-child(4) { width: 100px; text-align: center; }
.template-editor-table th:nth-child(5),
.template-editor-table td:nth-child(5) { width: 115px; }
.template-editor-table th:nth-child(6),
.template-editor-table td:nth-child(6) { width: 210px; }

.template-editor-table .template-group-row td {
  background: #f7f9fc;
  color: #273142;
  font-weight: 500;
}

.template-group-name {
  display: flex;
  align-items: center;
  gap: 7px;
}

.template-group-toggle {
  width: 16px;
  height: 16px;
  padding: 0;
  border: 1px solid #7f8997;
  color: #4e5b6c;
  background: #fff;
  line-height: 12px;
  cursor: pointer;
}

.template-field-name {
  padding-left: 30px !important;
  color: #243b60 !important;
}

.template-editor-table tr.is-selected td {
  background: #eef4ff;
}

.template-field-width,
.template-field-format {
  width: 100%;
  height: 23px;
  border: 1px solid #d3d8e0;
  color: #3d4652;
  background: #fff;
  font-size: 11px;
}

.template-editor-table input[type="checkbox"] {
  accent-color: #4f7fe8;
}

.original-order-template-editor.is-expanded {
  width: 100vw;
  height: 100vh;
}

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

@media (max-width: 680px) {
  .template-editor-backdrop { padding: 0; }
  .original-order-template-editor { width: 100vw; height: 100vh; }
  .template-editor-basic-grid { grid-template-columns: 1fr; padding: 3px 14px 12px; }
  .template-editor-basic-grid > label,
  .template-readonly-field,
  .template-scope-field { grid-template-columns: 92px minmax(0, 1fr); }
  .template-editor-table-wrap,
  .template-editor-tabs { margin-left: 12px; margin-right: 12px; }
}

.template-manager-panel {
  width: min(685px, calc(100vw - 28px));
  height: min(470px, calc(100vh - 28px));
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid #cfd3da;
  border-radius: 2px;
  background: #fff;
  box-shadow: 0 16px 44px rgba(24, 31, 43, 0.24);
}

.template-manager-header,
.transfer-results-panel > header {
  min-height: 43px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 12px 0 14px;
  border-bottom: 1px solid #d9dce2;
}

.template-manager-header h2,
.transfer-results-panel h2 {
  margin: 0;
  color: #202733;
  font-size: 16px;
  font-weight: 500;
}

.template-manager-notice {
  min-height: 38px;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 0 14px;
  color: #16233b;
  background: #edf7ff;
  font-size: 12px;
}

.template-manager-notice svg {
  width: 14px;
  color: #2878ed;
}

.template-manager-create {
  display: flex;
  justify-content: flex-end;
  padding: 7px 24px 4px;
}

.template-manager-create button {
  padding: 0 0 2px;
  border: 0;
  border-bottom: 1px solid #1970e8;
  color: #1970e8;
  background: transparent;
  cursor: pointer;
  font-size: 12px;
}

.template-manager-summary {
  min-height: 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 13px;
  color: #3f4855;
  font-size: 12px;
}

.template-manager-summary > span:last-child {
  display: flex;
  align-items: center;
  gap: 7px;
}

.template-manager-summary button {
  width: 22px;
  height: 24px;
  padding: 0;
  border: 0;
  color: #adb4bd;
  background: transparent;
}

.template-manager-summary b {
  min-width: 38px;
  padding: 3px 9px;
  border: 1px solid #d7dbe2;
  text-align: center;
  font-weight: 400;
}

.template-manager-table-wrap {
  min-height: 0;
  flex: 1;
  margin: 0 13px;
  overflow: auto;
  border: 1px solid #d6dae0;
}

.template-manager-table {
  min-width: 810px;
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}

.template-manager-table th,
.template-manager-table td {
  height: 28px;
  padding: 0 8px;
  border-bottom: 1px solid #dfe2e7;
  color: #353d49;
  font-size: 12px;
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.template-manager-table th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #f3f4f6;
  font-weight: 500;
}

.template-manager-table th:first-child,
.template-manager-table td:first-child { width: 38px; text-align: center; }
.template-manager-table th:nth-child(2),
.template-manager-table td:nth-child(2) { width: 170px; }
.template-manager-table th:nth-child(3),
.template-manager-table td:nth-child(3) { width: 125px; }
.template-manager-table th:nth-child(4),
.template-manager-table td:nth-child(4) { width: 105px; }
.template-manager-table th:last-child,
.template-manager-table td:last-child { width: 36px; text-align: center; }

.template-manager-table tr.selected td {
  background: #edf4ff;
}

.template-manager-table a {
  color: #176ee6;
  text-decoration: none;
}

.system-template-tag {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 4px;
  border: 1px solid #9dbbf0;
  border-radius: 2px;
  color: #3974d7;
  font-size: 10px;
  line-height: 15px;
}

.template-row-edit {
  width: 24px;
  height: 24px;
  padding: 0;
  border: 0;
  color: #5a6676;
  background: transparent;
  cursor: pointer;
}

.template-row-edit svg,
.template-manager-table td:last-child > svg {
  width: 13px;
  height: 13px;
}

.template-manager-panel > footer,
.transfer-results-panel > footer {
  min-height: 61px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  border-top: 1px solid #e0e3e8;
}

.template-manager-panel > footer button,
.transfer-results-panel > footer button {
  width: auto;
  min-width: 56px;
  min-height: 28px;
  padding: 0 15px;
  border-radius: 1px;
}

.transfer-results-panel {
  width: min(620px, calc(100vw - 28px));
  max-height: min(520px, calc(100vh - 28px));
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid #cfd3da;
  border-radius: 2px;
  background: #fff;
  box-shadow: 0 16px 44px rgba(24, 31, 43, 0.24);
}

.transfer-results-body {
  min-height: 220px;
  padding: 12px 16px;
  overflow-y: auto;
}

.transfer-result-row {
  display: grid;
  grid-template-columns: 132px 52px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  min-height: 38px;
  border-bottom: 1px solid #e4e7eb;
  font-size: 12px;
}

.transfer-result-row strong.success { color: #21845d; }
.transfer-result-row strong.failed { color: #d34848; }
.transfer-result-row span:last-child { overflow-wrap: anywhere; }

.transfer-results-empty {
  min-height: 210px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 7px;
  color: #8a929d;
  font-size: 12px;
}

.transfer-results-empty svg {
  width: 30px;
  height: 30px;
  color: #b1b8c2;
}

.transfer-results-empty strong {
  color: #515a67;
  font-size: 13px;
  font-weight: 500;
}

.list-control-header {
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 13px 0 17px;
  border-bottom: 1px solid #d9dce2;
}

.list-control-header h2 {
  margin: 0;
  color: #202733;
  font-size: 16px;
  font-weight: 500;
}

.list-control-tabs {
  min-height: 43px;
  display: flex;
  align-items: end;
  gap: 28px;
  margin: 0 22px;
  border-bottom: 1px solid #d5d9df;
}

.list-control-tabs button {
  height: 42px;
  padding: 0 10px;
  border: 0;
  border-bottom: 2px solid transparent;
  color: #4f5763;
  background: transparent;
  font-size: 13px;
  cursor: pointer;
}

.list-control-tabs button.active {
  border-bottom-color: #4d7fe7;
  color: #3475df;
}

.list-control-body {
  min-height: 0;
  flex: 1;
  padding: 7px 22px 0;
  overflow: hidden;
}

.list-control-body > section[data-list-control-panel="table"] {
  height: 100%;
  display: flex;
  flex-direction: column;
}

.list-control-summary {
  min-height: 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: #515a67;
  font-size: 12px;
}

.list-control-summary b {
  font-weight: 400;
}

.list-control-summary #listSettingsOwner {
  color: #8b929c;
}

.list-control-actions {
  min-height: 31px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 22px;
  overflow-x: auto;
  white-space: nowrap;
}

.list-control-actions button {
  padding: 0;
  border: 0;
  color: #176ee6;
  background: transparent;
  font-size: 12px;
  cursor: pointer;
}

.list-control-actions button:first-child {
  color: #ff3333;
}

.list-control-actions button:disabled {
  color: #aeb4bd;
  cursor: not-allowed;
}

.list-control-table-wrap {
  min-height: 0;
  flex: 1;
  overflow: auto;
  border: 1px solid #d6dae0;
}

.list-control-table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
}

.list-control-table th,
.list-control-table td {
  height: 28px;
  padding: 0 7px;
  border-right: 1px solid #e0e3e8;
  border-bottom: 1px solid #dfe2e7;
  color: #353d49;
  font-size: 12px;
  text-align: left;
}

.list-control-table th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #f2f3f5;
  font-weight: 500;
}

.list-control-table th:nth-child(1), .list-control-table td:nth-child(1) { width: 38px; text-align: center; }
.list-control-table th:nth-child(2), .list-control-table td:nth-child(2) { width: 42px; text-align: center; }
.list-control-table th:nth-child(3), .list-control-table td:nth-child(3) { width: 154px; color: #1c4c87; }
.list-control-table th:nth-child(4), .list-control-table td:nth-child(4) { width: 118px; }
.list-control-table th:nth-child(5), .list-control-table td:nth-child(5),
.list-control-table th:nth-child(6), .list-control-table td:nth-child(6) { width: 66px; text-align: center; }
.list-control-table th:nth-child(7), .list-control-table td:nth-child(7) { width: 116px; }

.list-control-table tr.is-selected td {
  background: #eef5ff;
}

.list-control-secondary-panel {
  height: 100%;
  display: grid;
  place-content: center;
  gap: 8px;
  color: #818995;
  text-align: center;
}

.list-control-secondary-panel span {
  color: #3b4451;
  font-size: 14px;
}

.list-control-footer {
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  border-top: 1px solid #e0e3e8;
}

.list-control-footer button {
  width: auto;
  min-width: 56px;
  min-height: 28px;
  padding: 0 15px;
  border-radius: 1px;
}

.list-control-footer .primary-button {
  border-color: #4d7fe7;
  background: #4d7fe7;
}

.currency-table .table-frozen-column {
  position: sticky;
  z-index: 3;
  background: #fff;
  box-shadow: 1px 0 0 #d9dde3;
}

.currency-table thead .table-frozen-column {
  z-index: 5;
  background: #f5f6f8;
}

.currency-table tr.selected .table-frozen-column {
  background: #edf5ff;
}

@media (max-width: 700px) {
  .list-control-panel { width: 100vw; height: 100vh; border: 0; }
  .list-control-tabs { gap: 12px; margin: 0 12px; }
  .list-control-body { padding-inline: 12px; }
  .list-control-actions { justify-content: flex-start; }
}

.import-mode-panel {
  width: min(100%, 780px);
  border-radius: 3px;
}

.import-mode-header {
  min-height: 112px;
  justify-content: center;
  position: relative;
  border-bottom: 0;
  color: #fff;
  background: linear-gradient(135deg, #39b9bd 0%, #31b679 100%);
}

.import-mode-header > div {
  text-align: center;
}

.import-mode-header p {
  color: rgba(255, 255, 255, 0.82);
}

.import-mode-header h2 {
  font-size: 19px;
  font-weight: 500;
}

.import-mode-header .icon-button {
  position: absolute;
  top: 12px;
  right: 12px;
  color: rgba(255, 255, 255, 0.86);
}

.import-mode-body {
  padding: 0 20px 28px;
  overflow: visible;
}

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

.import-workflow-grid > section {
  min-width: 0;
}

.import-workflow-grid h3 {
  min-height: 28px;
  margin: 0;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
}

.import-workflow-grid > section > div,
.import-workflow-grid > section > .unique-field-note {
  min-height: 162px;
  margin: 0;
  border: 1px solid #dce4e5;
  border-radius: 0;
  background: #fff;
}

.unique-field-note {
  min-height: 44px;
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: #f6f8f7;
  font-size: 12px;
}

.import-workflow-grid .unique-field-note {
  align-content: center;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  padding: 18px;
  text-align: center;
}

.import-workflow-grid .unique-field-note strong {
  margin: 8px 0 0;
  color: #2d775f;
  font-size: 15px;
}

.import-workflow-grid .template-help {
  margin: 8px 2px 0;
  line-height: 1.55;
}

.unique-field-note svg {
  width: 16px;
  height: 16px;
  color: var(--brand);
}

.unique-field-note strong {
  margin-left: auto;
  color: var(--brand-dark);
}

.import-mode-options {
  display: grid;
  align-content: center;
  gap: 0;
  margin-bottom: 15px;
}

.import-mode-options label {
  min-height: 48px;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 9px 12px;
  border: 0;
  border-bottom: 1px solid #edf0f2;
  border-radius: 0;
  cursor: pointer;
}

.import-mode-options label:has(input:checked) {
  color: #315fd1;
  background: #f4f7ff;
}

.import-mode-options input {
  width: 16px;
  height: 16px;
  accent-color: #4d7cf2;
}

.import-mode-options span {
  display: grid;
  gap: 3px;
}

.import-mode-options strong {
  font-size: 13px;
}

.import-mode-options small {
  color: var(--muted);
  font-size: 11px;
}

.import-upload-card {
  display: grid;
  place-items: center;
  align-content: center;
  gap: 5px;
  padding: 18px;
  color: #59626f;
  text-align: center;
}

.import-upload-card > svg {
  width: 38px;
  height: 38px;
  color: #57b98b;
}

.import-upload-card strong {
  font-size: 12px;
  font-weight: 500;
}

.import-upload-card span {
  color: #87909c;
  font-size: 11px;
}

.import-upload-card .link-button {
  min-height: 24px;
  padding: 0;
  color: #4775ed;
}

.import-mode-footer {
  justify-content: flex-end;
  min-height: 64px;
  padding: 12px 24px;
}

.import-mode-footer .import-custom-template {
  margin-right: auto;
  color: #1769d2;
}

@media (max-width: 760px) {
  .import-mode-panel {
    max-height: calc(100vh - 24px);
  }

  .import-mode-header {
    min-height: 86px;
  }

  .import-mode-body {
    overflow-y: auto;
  }

  .import-workflow-grid {
    grid-template-columns: 1fr;
    margin-top: 0;
  }

  .import-workflow-grid h3 {
    min-height: 26px;
    display: flex;
    align-items: end;
    color: #303640;
  }
}

.settlement-table {
  min-width: 1380px;
}

.settlement-table th[data-table-column="sequence"] { width: 86px; }
.settlement-table th[data-table-column="code"] { width: 150px; }
.settlement-table th[data-table-column="name"] { width: 200px; }
.settlement-table th[data-table-column="category"] { width: 180px; }
.settlement-table th[data-table-column="isDefault"] { width: 110px; }
.settlement-table th[data-table-column="description"] { width: 250px; }
.settlement-table th[data-table-column="usageStatus"] { width: 130px; }
.settlement-table th[data-table-column="dataStatus"] { width: 130px; }
.settlement-table th[data-table-column="systemPreset"] { width: 130px; }

.boolean-check {
  display: inline-flex;
  align-items: center;
  color: var(--brand-dark);
}

.boolean-check svg {
  width: 18px;
  height: 18px;
  stroke-width: 2.4;
}

.boolean-empty {
  color: #aeb6b2;
}

.data-state-pill {
  min-width: 52px;
  display: inline-flex;
  justify-content: center;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
}

.data-state-pill.draft {
  color: #665f55;
  background: #efede9;
}

.data-state-pill.submitted {
  color: #8a5a12;
  background: #fff2d9;
}

.data-state-pill.audited {
  color: #0b6d54;
  background: #e4f4ee;
}

.settlement-form-panel {
  width: min(100%, 760px);
}

.input-wrap select {
  width: 100%;
  min-width: 0;
  height: 44px;
  padding: 0;
  border: 0;
  outline: 0;
  color: var(--ink);
  background: transparent;
  font-size: 14px;
}

.input-wrap input:disabled {
  color: #6c7772;
  cursor: not-allowed;
}

.settlement-switches {
  display: flex;
  gap: 30px;
  padding: 15px 0 2px;
  border-top: 1px solid var(--line);
}

.settlement-switches label {
  display: grid;
  grid-template-columns: auto auto;
  align-items: center;
  column-gap: 8px;
  cursor: pointer;
}

.settlement-switches input,
.template-field-grid input {
  width: 16px;
  height: 16px;
  accent-color: var(--brand);
}

.settlement-switches span {
  font-size: 13px;
  font-weight: 600;
}

.settlement-switches small {
  grid-column: 2;
  margin-top: 2px;
  color: var(--muted);
  font-size: 11px;
}

.template-panel {
  width: min(100%, 620px);
}

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

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

.template-field-grid label {
  min-height: 42px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 0 12px;
  border: 1px solid var(--line);
  border-radius: 5px;
  cursor: pointer;
  font-size: 13px;
}

.template-field-grid label:hover {
  border-color: #a9c9bf;
  background: #f5faf8;
}

@media (max-width: 760px) {
  .settlement-switches {
    align-items: flex-start;
    flex-direction: column;
    gap: 14px;
  }

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

@media (max-width: 900px) {
  .material-standard-toolbar {
    flex-direction: row;
  }

  .material-standard-toolbar .toolbar-primary {
    display: flex;
    flex-wrap: wrap;
  }

  .material-standard-toolbar .command-button {
    min-width: auto;
    padding: 0 8px;
  }

  .material-standard-toolbar .command-button span {
    display: inline;
  }
}

.auxiliary-data-page {
  padding: 0 10px 12px;
}

.auxiliary-data-heading {
  min-height: 38px;
}

.auxiliary-data-layout {
  min-height: calc(100vh - 132px);
  display: grid;
  grid-template-columns: 210px minmax(0, 1fr);
  border-top: 8px solid #e9edf3;
}

.auxiliary-category-panel {
  min-width: 0;
  padding: 7px 0;
  border-right: 1px solid #d9dde3;
  background: #fff;
}

.auxiliary-category-search {
  height: 30px;
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 8px 9px;
  padding: 0 8px;
  border: 1px solid #d8dce3;
}

.auxiliary-category-search svg {
  width: 14px;
  color: #8b94a2;
}

.auxiliary-category-search input {
  width: 100%;
  min-width: 0;
  border: 0;
  outline: 0;
  font-size: 12px;
}

.auxiliary-category-title {
  min-height: 32px;
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 0 14px;
  font-size: 12px;
  font-weight: 600;
}

.auxiliary-category-title svg {
  width: 13px;
  height: 13px;
}

.auxiliary-category-list {
  display: grid;
}

.auxiliary-category-list button {
  min-height: 31px;
  padding: 0 28px;
  border: 0;
  color: #262c35;
  background: transparent;
  cursor: pointer;
  text-align: left;
  font-size: 12px;
}

.auxiliary-category-list button:hover,
.auxiliary-category-list button.active {
  color: #3169c6;
  background: #dfeaff;
}

.auxiliary-data-table-section {
  min-width: 0;
  min-height: calc(100vh - 132px);
  display: flex;
  flex-direction: column;
  border: 0;
}

.auxiliary-data-pagination {
  order: 0;
}

.auxiliary-data-table-section .table-scroll {
  flex: 1;
}

.auxiliary-data-table {
  min-width: 1480px;
}

.auxiliary-data-table th,
.auxiliary-data-table td {
  height: 29px;
  padding: 0 8px;
}

.auxiliary-data-table th[data-table-column="sequence"] { width: 54px; }
.auxiliary-data-table th[data-table-column="categoryName"] { width: 105px; }
.auxiliary-data-table th[data-table-column="code"] { width: 145px; }
.auxiliary-data-table th[data-table-column="name"] { width: 110px; }
.auxiliary-data-table th[data-table-column="longName"] { width: 110px; }
.auxiliary-data-table th[data-table-column="usageStatus"] { width: 90px; }
.auxiliary-data-table th[data-table-column="systemPreset"] { width: 95px; }
.auxiliary-data-table th[data-table-column="description"] { width: 100px; }
.auxiliary-data-table th[data-table-column="creationOrganization"] { width: 250px; }
.auxiliary-data-table th[data-table-column="longCode"] { width: 165px; }
.auxiliary-data-table th[data-table-column="level"] { width: 70px; }
.auxiliary-data-table th[data-table-column="isLeaf"] { width: 90px; }
.auxiliary-data-table th[data-table-column="controlStrategy"] { width: 120px; }

.auxiliary-data-form-panel {
  width: min(700px, calc(100vw - 32px));
  min-height: 432px;
}

.auxiliary-data-modal-header {
  min-height: 48px;
}

.auxiliary-data-modal-header h2 {
  font-size: 16px;
  font-weight: 500;
}

.auxiliary-data-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: start;
  gap: 13px 80px;
  padding: 34px 88px 24px;
}

.auxiliary-data-form-grid .field {
  min-width: 0;
}

.auxiliary-data-form-grid .field > span:first-child b {
  color: #f5222d;
  font-weight: 500;
}

.auxiliary-data-form-grid .input-wrap,
.auxiliary-data-form-grid input {
  border-radius: 0;
}

.auxiliary-data-form-grid .input-wrap {
  position: relative;
  padding-right: 34px;
}

.auxiliary-data-form-grid .input-reference-button {
  position: absolute;
  top: 0;
  right: 0;
  width: 34px;
  height: 100%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  color: #52606d;
  background: transparent;
  cursor: pointer;
}

.auxiliary-data-form-grid .input-reference-button:hover {
  color: var(--kd-blue);
}

.auxiliary-data-form-grid .input-reference-button svg {
  width: 16px;
  height: 16px;
}

.auxiliary-readonly-value {
  min-height: 28px;
  display: flex;
  align-items: center;
  color: #111820;
  font-size: 13px;
}

.auxiliary-data-modal-footer {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 74px;
  flex: 0 0 auto;
}

.auxiliary-data-modal-footer button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-width: 90px;
  min-height: 28px;
  padding: 0 15px;
  border-radius: 0;
}

.auxiliary-data-modal-footer #saveAuxiliaryDataButton,
.auxiliary-data-modal-footer #saveAndNewAuxiliaryDataButton:not(.hidden) {
  display: inline-flex !important;
  color: #fff;
  background: var(--kd-blue);
  border: 1px solid var(--kd-blue);
}

.auxiliary-data-modal-footer .primary-button {
  border-color: var(--kd-blue);
  background: var(--kd-blue);
}

.auxiliary-data-modal-footer .primary-button:hover {
  border-color: var(--kd-blue-dark);
  background: var(--kd-blue-dark);
}

@media (max-width: 760px) {
  .auxiliary-data-layout {
    grid-template-columns: 160px minmax(0, 1fr);
  }

  .auxiliary-category-list button {
    padding: 0 18px;
  }

  .auxiliary-data-form-grid {
    grid-template-columns: 1fr 1fr;
    gap: 12px 24px;
    padding: 26px 28px 20px;
  }
}

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

  .auxiliary-category-panel {
    border-right: 0;
    border-bottom: 1px solid #d9dde3;
  }

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

  .auxiliary-data-form-grid {
    grid-template-columns: 1fr;
  }
}

.workspace-open-tabs {
  min-width: 0;
  display: flex;
  align-items: stretch;
  flex: 0 0 auto;
}

.workspace-page-tab {
  min-width: 0;
  display: flex;
  align-items: stretch;
  flex: 0 0 auto;
  border-right: 1px solid #e1e4e9;
}

.workspace-page-tab.active {
  background: #fff;
}

.workspace-page-tab .workspace-tab-target {
  max-width: 190px;
  padding: 0 5px 0 13px;
}

.workspace-page-tab .workspace-tab-target span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.workspace-page-tab .workspace-tab-close {
  min-width: 24px;
  padding: 0 7px 0 3px;
  color: #8a94a5;
}

.workspace-page-tab .workspace-tab-close::after {
  display: none;
}

.workspace-page-tab .workspace-tab-close svg {
  width: 13px;
  height: 13px;
}

.workspace-page-tab .workspace-tab-close:hover {
  color: #d43b47;
  background: #fff1f2;
}

.sales-toolbar {
  align-items: flex-start;
  justify-content: space-between;
}

#purchase-requestPage .sales-toolbar {
  flex: 0 0 auto;
  align-items: flex-start;
  overflow: visible;
  padding: 6px 20px;
}

#purchase-requestPage .toolbar-primary {
  min-width: 0;
  flex: 1 1 auto;
  flex-wrap: wrap;
}

#purchase-requestPage .toolbar-secondary {
  flex: 0 0 auto;
  flex-wrap: nowrap;
}

#purchase-requestPage .command-button {
  white-space: nowrap;
}

.split-command {
  display: inline-flex;
  align-items: center;
  gap: 1px;
}

.split-command > .command-button:first-child {
  border-radius: 1px 0 0 1px;
}

.split-command .split-caret {
  width: 27px;
  min-width: 27px;
  padding: 0;
  border-radius: 0 1px 1px 0;
}

.split-command .toolbar-menu {
  right: auto;
  left: 0;
}

.sales-filter-strip {
  gap: 28px;
}

.sales-execution-table {
  min-width: 1780px;
}

.salesOrder-table {
  min-width: 3180px;
}

.sales-execution-table tbody tr[data-document-number] td:not(.selection-column) {
  cursor: pointer;
}

.sales-execution-table tbody tr[data-document-number]:focus-visible {
  outline: none;
  box-shadow: inset 0 0 0 2px #2f72e2;
}

.sales-document-link {
  max-width: 100%;
  padding: 0;
  border: 0;
  color: #2767d9;
  background: transparent;
  cursor: pointer;
  overflow: hidden;
  text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
  font: inherit;
}

.sales-document-link:hover,
.sales-document-link:focus-visible {
  color: #174fae;
  text-decoration: underline;
}

.sales-document-link:focus-visible {
  outline: 1px solid #2767d9;
  outline-offset: 2px;
}

.sales-execution-table th[data-table-column="sequence"] { width: 78px; }
.sales-execution-table th[data-table-column="documentNumber"] { width: 190px; }
.sales-execution-table th[data-table-column="businessDate"] { width: 130px; }
.sales-execution-table th[data-table-column="dataStatus"],
.sales-execution-table th[data-table-column="auditStatus"],
.sales-execution-table th[data-table-column="inventoryStatus"] { width: 120px; }
.sales-execution-table th[data-table-column="customer"] { width: 220px; }
.sales-execution-table th[data-table-column="salesOrganization"],
.sales-execution-table th[data-table-column="deliveryOrganization"] { width: 230px; }
.sales-execution-table th[data-table-column="salesDepartment"],
.sales-execution-table th[data-table-column="sourcePlatform"],
.sales-execution-table th[data-table-column="store"],
.sales-execution-table th[data-table-column="warehouse"] { width: 160px; }
.sales-execution-table th[data-table-column="platformOrderNumber"],
.sales-execution-table th[data-table-column="sourceOrder"] { width: 190px; }
.sales-execution-table th[data-table-column="gyDocumentType"],
.sales-execution-table th[data-table-column="orderType"],
.sales-execution-table th[data-table-column="orderStatus"],
.sales-execution-table th[data-table-column="salesperson"] { width: 140px; }
.sales-execution-table th[data-table-column="totalQuantity"],
.sales-execution-table th[data-table-column="totalAmount"],
.sales-execution-table th[data-table-column="taxIncludedAmount"] { width: 130px; }
.sales-execution-table th[data-table-column="creationTime"] { width: 180px; }
.sales-execution-table th[data-table-column="relatedPurchaseQuantity"],
.sales-execution-table th[data-table-column="relatedQuantity"] { width: 132px; }
.sales-execution-table th[data-table-column="account"] { width: 145px; }
.sales-execution-table th[data-table-column="gyNumber"] { width: 185px; }
.sales-execution-table th[data-table-column="salesGroup"],
.sales-execution-table th[data-table-column="deliveryPerson"],
.sales-execution-table th[data-table-column="closeStatus"] { width: 120px; }
.sales-execution-table th[data-table-column="sellerRemark"] { width: 260px; }
.sales-execution-table th[data-table-column="materialCode"] { width: 205px; }
.sales-execution-table th[data-table-column="materialName"] { width: 280px; }

.sales-amount {
  text-align: right !important;
  font-variant-numeric: tabular-nums;
}

.sales-document-backdrop {
  z-index: 120;
  inset: 82px 0 0;
  padding: 8px;
  background: rgba(18, 24, 34, 0.5);
}

.sales-document-panel {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  border-radius: 3px;
  background: #fff;
  box-shadow: 0 14px 50px rgba(15, 26, 45, 0.24);
  overflow: hidden;
}

.sales-line-settings-backdrop {
  position: absolute;
  inset: 0;
  z-index: 12;
  display: grid;
  place-items: center;
  padding: 18px;
  background: rgba(22, 29, 40, 0.42);
}

.sales-line-settings-panel {
  width: min(760px, 100%);
  height: min(620px, calc(100vh - 36px));
  display: flex;
  flex-direction: column;
  border: 1px solid #cfd4dc;
  background: #fff;
  box-shadow: 0 14px 42px rgba(18, 28, 44, 0.24);
}

.sales-line-settings-panel > header {
  min-height: 52px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 12px 0 18px;
  border-bottom: 1px solid #dde1e7;
}

.sales-line-settings-panel > header h3 {
  margin: 0;
  font-size: 16px;
  font-weight: 500;
}

.sales-line-settings-tabs {
  min-height: 42px;
  display: flex;
  align-items: stretch;
  gap: 4px;
  padding: 0 26px;
  border-bottom: 1px solid #dde1e7;
}

.sales-line-settings-tabs button {
  min-width: 64px;
  position: relative;
  border: 0;
  color: #68717d;
  background: transparent;
  cursor: pointer;
}

.sales-line-settings-tabs button.active {
  color: #4f82df;
}

.sales-line-settings-tabs button.active::after {
  height: 2px;
  position: absolute;
  right: 8px;
  bottom: 0;
  left: 8px;
  content: "";
  background: #4f82df;
}

.sales-line-settings-actions {
  min-height: 42px;
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: flex-end;
  gap: 18px;
  padding: 0 28px;
  white-space: nowrap;
  overflow-x: auto;
}

.sales-line-settings-actions button {
  padding: 0;
  border: 0;
  color: #3974d4;
  background: transparent;
  cursor: pointer;
  font-size: 12px;
}

.sales-line-settings-actions button:first-child {
  color: #ff3e3e;
}

.sales-line-settings-table-wrap {
  min-height: 0;
  flex: 1;
  margin: 0 26px;
  border: 1px solid #d6dbe2;
  overflow: auto;
}

.sales-line-settings-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}

.sales-line-settings-table th,
.sales-line-settings-table td {
  height: 30px;
  padding: 0 7px;
  border-bottom: 1px solid #dde1e7;
  color: #333c48;
  font-size: 12px;
  text-align: left;
}

.sales-line-settings-table th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #f3f4f6;
  font-weight: 500;
}

.sales-line-settings-table th:nth-child(1),
.sales-line-settings-table td:nth-child(1) { width: 40px; text-align: center; }
.sales-line-settings-table th:nth-child(2),
.sales-line-settings-table td:nth-child(2) { width: 44px; text-align: center; }
.sales-line-settings-table th:nth-child(3),
.sales-line-settings-table td:nth-child(3) { width: 180px; }
.sales-line-settings-table th:nth-child(4),
.sales-line-settings-table td:nth-child(4) { width: 120px; }
.sales-line-settings-table th:nth-child(n+5),
.sales-line-settings-table td:nth-child(n+5) { width: 74px; text-align: center; }

.sales-line-settings-table select {
  width: 100%;
  height: 26px;
  border: 0;
  color: #434b56;
  background: transparent;
  font-size: 12px;
}

.kd-switch {
  width: 30px;
  height: 16px;
  position: relative;
  display: inline-block;
}

.kd-switch input {
  position: absolute;
  opacity: 0;
}

.kd-switch span {
  position: absolute;
  inset: 0;
  border-radius: 9px;
  background: #c7cbd0;
  cursor: pointer;
}

.kd-switch span::after {
  width: 12px;
  height: 12px;
  position: absolute;
  top: 2px;
  left: 2px;
  border-radius: 50%;
  content: "";
  background: #fff;
  transition: transform 120ms ease;
}

.kd-switch input:checked + span {
  background: #4f82df;
}

.kd-switch input:checked + span::after {
  transform: translateX(14px);
}

.sales-line-settings-panel > footer {
  min-height: 64px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-top: 1px solid #dde1e7;
}

.sales-line-settings-panel > footer button {
  width: auto;
  min-width: 64px;
  min-height: 30px;
  padding: 0 16px;
  border-radius: 1px;
}

.sales-line-settings-panel > footer .primary-button {
  border-color: #4f82df;
  background: #4f82df;
}

.sales-document-header,
.sales-document-footer {
  min-height: 58px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 9px 18px;
  border-bottom: 1px solid #d9dde3;
}

.sales-document-header p,
.sales-document-header h2 {
  margin: 0;
}

.sales-document-header p {
  color: #6e7580;
  font-size: 11px;
}

.sales-document-header h2 {
  display: inline;
  margin-right: 10px;
  font-size: 18px;
}

.sales-document-header > div > span {
  color: #5275af;
  font-size: 12px;
}

.sales-document-header-actions {
  display: flex;
  align-items: center;
  gap: 12px;
}

.sales-linkage-view-toolbar {
  flex: 0 0 auto;
  padding: 8px 12px;
  border-bottom: 1px solid #d9e1ec;
  background: #fff;
  overflow: visible;
}

.sales-linkage-view-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
}

.sales-linkage-view-actions > button,
.sales-linkage-view-actions > .toolbar-menu-wrap > button {
  min-height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 0 10px;
  border: 1px solid #4f82e8;
  border-radius: 2px;
  color: #fff;
  background: #4f82e8;
  cursor: pointer;
  font-size: 12px;
  white-space: nowrap;
}

.sales-linkage-view-actions > button:hover,
.sales-linkage-view-actions > button.is-emphasis,
.sales-linkage-view-actions > .toolbar-menu-wrap > button:hover {
  border-color: #2f6fd7;
  background: #2f6fd7;
}

.sales-linkage-view-actions > button:disabled,
.sales-linkage-view-actions > .toolbar-menu-wrap > button:disabled {
  border-color: #a9c1ef;
  background: #a9c1ef;
  cursor: not-allowed;
}

.sales-linkage-view-actions > button svg,
.sales-linkage-view-actions > .toolbar-menu-wrap > button svg {
  width: 14px;
  height: 14px;
}

.sales-linkage-view-actions > .toolbar-menu-wrap {
  display: inline-flex;
}

.sales-linkage-view-actions .split-caret {
  width: 27px;
  min-width: 27px;
  padding: 0;
}

.sales-linkage-view-actions .toolbar-menu {
  right: auto;
  left: 0;
}

.sales-document-panel.existing-view-mode .sales-document-footer {
  display: none;
}

.sales-document-panel.linkage-view-mode .sales-document-body input:not([type="checkbox"]),
.sales-document-panel.linkage-view-mode .sales-document-body select,
.sales-document-panel.linkage-view-mode .sales-document-body textarea {
  pointer-events: none;
}

.sales-document-panel.linkage-view-mode .sales-line-actions #addSalesLine,
.sales-document-panel.linkage-view-mode .sales-line-actions #deleteSalesLine {
  display: none;
}

.sales-document-tabs {
  min-height: 42px;
  display: flex;
  flex: 0 0 auto;
  align-items: stretch;
  padding: 0 18px;
  border-bottom: 1px solid #d9dde3;
  background: #f7f8fa;
  overflow-x: auto;
}

.sales-document-tabs button {
  min-width: max-content;
  position: relative;
  padding: 0 22px;
  border: 0;
  color: #606976;
  background: transparent;
  cursor: pointer;
  font-size: 13px;
}

.sales-document-tabs button::after {
  height: 2px;
  position: absolute;
  right: 16px;
  bottom: 0;
  left: 16px;
  content: "";
  background: transparent;
}

.sales-document-tabs button:hover,
.sales-document-tabs button.active {
  color: #3d70ce;
}

.sales-document-tabs button.active::after {
  background: #4f82df;
}

.document-state-label {
  padding: 3px 9px;
  border: 1px solid #d7dce4;
  color: #676e78 !important;
  background: #f5f6f8;
}

.sales-document-body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  background: #f2f4f7;
}

.visually-hidden {
  width: 1px !important;
  height: 1px !important;
  position: absolute !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
}

.sales-document-section {
  padding: 12px 18px 14px;
  border-bottom: 1px solid #dde1e7;
  background: #fff;
}

.sales-document-section + .sales-document-section {
  margin-top: 8px;
}

.sales-document-section h3 {
  margin: 0 0 10px;
  color: #343a44;
  font-size: 13px;
  font-weight: 600;
}

.sales-document-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  column-gap: 18px;
}

.sales-basic-document-panel {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.sales-basic-section {
  min-height: 218px;
  max-height: 360px;
  position: relative;
  flex: 0 0 auto;
  padding: 13px 20px 12px;
  overflow-y: auto;
  transition: min-height 140ms ease, height 140ms ease, padding 140ms ease;
}

.sales-basic-section.is-collapsed {
  height: 0 !important;
  min-height: 0;
  padding-top: 0;
  padding-bottom: 0;
  overflow: hidden;
}

.sales-basic-document-panel.basic-focus-mode .sales-basic-section {
  height: 100% !important;
  min-height: 0;
  max-height: none;
  flex: 1 1 auto;
}

.sales-basic-document-panel.basic-focus-mode .sales-basic-resize-handle,
.sales-basic-document-panel.basic-focus-mode .sales-line-section {
  display: none;
}

.sales-section-expand {
  width: 26px;
  height: 26px;
  position: absolute;
  top: 2px;
  right: 4px;
  z-index: 2;
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  color: #3f72d8;
  background: transparent;
  cursor: pointer;
}

.sales-section-expand svg {
  width: 14px;
  height: 14px;
}

.sales-basic-grid {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px 16px;
}

.sales-outbound-basic-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px 18px;
}

.contents {
  display: contents;
}

.sales-line-actions {
  max-width: 76%;
  overflow-x: auto;
}

.sales-outbound-basic-grid .sales-full-width-field {
  grid-column: span 2;
}

.sales-document-grid .field {
  margin-bottom: 9px;
}

.sales-document-grid .field > span:first-child {
  font-size: 12px;
}

.sales-document-grid .input-wrap {
  height: 34px;
  min-height: 34px;
  border-radius: 1px;
}

.sales-basic-grid .field {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(62px, max-content) minmax(0, 1fr);
  align-items: center;
  gap: 6px;
  margin: 0;
}

.sales-basic-grid .field > span:first-child {
  margin: 0;
  color: #555d68;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.2;
  text-align: right;
  white-space: nowrap;
}

.sales-basic-grid .required-mark,
.sales-document-grid .field > span:first-child b {
  margin-left: 2px;
  color: #f5222d;
  font-weight: 600;
}

.sales-basic-grid .input-wrap {
  height: 26px;
  min-height: 26px;
  gap: 4px;
  padding: 0 7px;
  border-color: #d4d8de;
  border-radius: 1px;
  box-shadow: none;
}

.sales-basic-grid .input-wrap:focus-within {
  border-color: #4f82df;
  box-shadow: none;
}

.sales-basic-grid .input-wrap input,
.sales-basic-grid .input-wrap select {
  width: 100%;
  min-width: 0;
  height: 24px;
  padding: 0;
  border: 0;
  outline: 0;
  color: #313842;
  background: transparent;
  font-size: 12px;
}

.sales-basic-grid .input-wrap svg {
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
  color: #3f72d8;
  stroke-width: 1.6;
}

.sales-basic-grid .input-wrap-disabled {
  background: #f3f3f3;
}

.sales-basic-grid .input-wrap input:disabled {
  color: #7f8792;
  opacity: 1;
}

.sales-basic-grid input[type="date"]::-webkit-calendar-picker-indicator,
.sales-basic-grid input[type="datetime-local"]::-webkit-calendar-picker-indicator {
  width: 0;
  margin: 0;
  opacity: 0;
}

.sales-basic-grid .sales-switch-field {
  grid-template-columns: max-content 32px;
  justify-content: start;
}

.sales-switch-field > span:last-child {
  display: flex;
  align-items: center;
}

.sales-switch-field input[type="checkbox"] {
  width: 30px;
  height: 16px;
  position: relative;
  margin: 0;
  appearance: none;
  border-radius: 10px;
  background: #bfc3c8;
  cursor: pointer;
}

.sales-switch-field input[type="checkbox"]::after {
  width: 12px;
  height: 12px;
  position: absolute;
  top: 2px;
  left: 2px;
  border-radius: 50%;
  content: "";
  background: #fff;
  transition: transform 120ms ease;
}

.sales-switch-field input[type="checkbox"]:checked {
  background: #4f82df;
}

.sales-switch-field input[type="checkbox"]:checked::after {
  transform: translateX(14px);
}

.sales-basic-grid .sales-full-width-field {
  grid-column: 1 / -1;
  grid-template-columns: 58px minmax(0, 1fr);
}

.sales-basic-resize-handle {
  width: 100%;
  height: 10px;
  min-height: 10px;
  position: relative;
  z-index: 4;
  display: block;
  padding: 0;
  border: 0;
  border-top: 1px solid #dbe0e7;
  border-bottom: 1px solid #dbe0e7;
  color: #7293c9;
  background: #e8ecf2;
  cursor: row-resize;
}

.sales-basic-resize-handle svg {
  width: 10px;
  height: 10px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  pointer-events: none;
}

.sales-basic-resize-handle svg:first-child { top: -3px; }
.sales-basic-resize-handle svg:last-child { bottom: -3px; }

.sales-address-field {
  grid-column: span 2;
}

.sales-line-heading {
  min-height: 42px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 14px;
  border-bottom: 1px solid #d9dde3;
}

.sales-line-heading h3 {
  margin: 0;
  padding: 11px 4px 9px;
  border-bottom: 2px solid #4f82df;
  color: #3f72d8;
  font-size: 12px;
  font-weight: 500;
}

.sales-line-heading small {
  display: block;
  margin-top: 3px;
  color: #858d98;
  font-size: 11px;
}

.sales-line-heading > div {
  display: flex;
  gap: 4px;
}

.sales-line-section {
  min-height: 0;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  padding: 0 0 8px;
  margin-top: 0 !important;
}

.sales-line-view-tabs {
  height: 42px;
  align-items: stretch;
}

.sales-line-view-tabs button {
  padding: 0 12px;
  border: 0;
  color: #555d68;
  background: transparent;
  font-size: 12px;
  cursor: pointer;
}

.sales-line-actions {
  align-items: center;
  gap: 2px !important;
}

.sales-line-actions .command-button {
  min-height: 30px;
  padding: 0 7px;
  border: 0;
  color: #1264d7;
  background: transparent;
  font-size: 12px;
}

.sales-line-actions .command-button span {
  display: inline;
}

.sales-line-actions .command-button:hover {
  color: #0b55bd;
  background: #eef5ff;
}

.sales-line-actions svg {
  width: 14px;
  height: 14px;
  color: currentColor;
}

.sales-order-detail-shell {
  min-height: 130px;
  position: relative;
  flex: 1 1 auto;
  overflow: hidden;
}

.sales-line-table {
  width: 100%;
  min-width: 1900px;
  border-collapse: collapse;
  table-layout: fixed;
}

.sales-line-table th:nth-child(2),
.sales-line-table td:nth-child(2) { width: 145px; }
.sales-line-table th:nth-child(3),
.sales-line-table td:nth-child(3) { width: 190px; }
.sales-line-table th:nth-child(4),
.sales-line-table td:nth-child(4) { width: 150px; }
.sales-line-table th:nth-child(5),
.sales-line-table td:nth-child(5) { width: 130px; }
.sales-line-table th:nth-child(6),
.sales-line-table td:nth-child(6) { width: 140px; }
.sales-line-table th:nth-child(13),
.sales-line-table td:nth-child(13) { width: 135px; }
.sales-line-table th:nth-child(15),
.sales-line-table td:nth-child(15) { width: 180px; }

.sales-order-detail-scroll {
  width: 100%;
  height: 100%;
  overflow-x: scroll;
  overflow-y: scroll;
  padding-bottom: 2px;
  scrollbar-color: #9ca5b1 #eef0f3;
  scrollbar-width: auto;
}

.sales-order-detail-scroll::-webkit-scrollbar {
  width: 14px;
  height: 13px;
}

.sales-order-detail-scroll::-webkit-scrollbar-thumb {
  border: 3px solid #eef0f3;
  border-radius: 7px;
  background: #9ca5b1;
}

.sales-order-detail-scroll::-webkit-scrollbar-track {
  background: #eef0f3;
}

.sales-order-detail-scroll::-webkit-scrollbar-corner {
  background: #eef0f3;
}

.sales-order-detail-table thead th {
  position: sticky;
  top: 0;
  z-index: 3;
}

.sales-detail-settings-button {
  width: 28px;
  height: 34px;
  position: absolute;
  top: 0;
  right: 14px;
  z-index: 8;
  display: grid;
  place-items: center;
  border-left: 1px solid #dfe2e7;
  border-bottom: 1px solid #dfe2e7;
  color: #3f72d8;
  background: #f2f3f5;
}

.sales-detail-settings-button svg {
  width: 14px;
  height: 14px;
}

.sales-line-table th,
.sales-line-table td {
  height: 36px;
  padding: 0 5px;
  border: 1px solid #dfe2e7;
  font-size: 12px;
}

.sales-line-table th {
  color: #454b55;
  background: #f2f3f5;
  font-weight: 500;
}

.sales-line-table .required-mark {
  margin-right: 1px;
  color: #f5222d;
  font-weight: 600;
}

.sales-line-table th:first-child,
.sales-line-table td:first-child {
  width: 42px;
  text-align: center;
}

.sales-order-detail-table th[data-sales-line-column],
.sales-order-detail-table td[data-sales-line-column] {
  width: 150px;
  min-width: 150px;
}

.sales-order-detail-table .sales-line-select-cell {
  width: 42px;
  min-width: 42px;
  position: sticky;
  left: 0;
  z-index: 3;
  background: #f2f3f5;
}

.sales-order-detail-table tbody .sales-line-select-cell {
  background: #fff;
}

.sales-line-frozen {
  position: sticky;
  z-index: 2;
  background: #fff;
  box-shadow: 1px 0 #dfe2e7;
}

.sales-order-detail-table th.sales-line-frozen {
  z-index: 4;
  background: #f2f3f5;
}

.sales-line-table input:not([type="checkbox"]) {
  width: 100%;
  height: 30px;
  padding: 0 7px;
  border: 0;
  outline: 0;
  background: transparent;
  font-size: 12px;
}

.sales-line-amount {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.sales-document-totals {
  display: flex;
  justify-content: flex-end;
  gap: 34px;
  padding: 10px 4px 0;
  color: #565d67;
  font-size: 12px;
}

.sales-document-totals strong {
  color: #1f5fa6;
  font-size: 14px;
}

.sales-document-section textarea {
  width: 100%;
  min-height: 64px;
  padding: 8px 10px;
  border: 1px solid #d9dde3;
  outline: 0;
  resize: vertical;
  font: inherit;
  font-size: 12px;
}


.sales-attachment-area {
  min-height: 320px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 9px;
  border: 1px dashed #b8c1cf;
  color: #737d8a;
  background: #fafbfc;
  text-align: center;
}

.sales-attachment-area.is-dragging {
  border-color: #2f6fd6;
  background: #eef5ff;
  color: #234f98;
}

.sales-attachment-area > svg {
  width: 34px;
  height: 34px;
  color: #5a85d4;
}

.sales-attachment-area strong {
  color: #3f4752;
  font-size: 14px;
}

.sales-attachment-area > span {
  font-size: 12px;
}

.sales-attachment-area .command-button {
  margin-top: 8px;
}

.sales-attachment-area .command-button span {
  display: inline;
}

.sales-attachment-list {
  width: min(520px, calc(100% - 32px));
  display: grid;
  gap: 5px;
  margin-top: 8px;
}

.sales-attachment-list > span {
  min-height: 34px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 10px;
  border: 1px solid #e0e3e8;
  color: #59626e;
  background: #fff;
  text-align: left;
  font-size: 12px;
}

.sales-attachment-list small {
  margin-left: auto;
  color: #8b929c;
}

.sales-document-footer {
  min-height: 54px;
  justify-content: flex-end;
  border-top: 1px solid #d9dde3;
  border-bottom: 0;
}

.sales-document-footer button {
  width: auto;
  min-width: 88px;
  min-height: 34px;
  padding: 0 15px;
}

.sales-document-footer .primary-button {
  border-color: var(--kd-blue, #4f82df);
  background: var(--kd-blue, #4f82df);
}

.sales-document-footer .primary-button:hover {
  border-color: var(--kd-blue-dark, #3d70ce);
  background: var(--kd-blue-dark, #3d70ce);
}

@media (max-width: 900px) {
  .sales-toolbar {
    flex-direction: column;
  }

  .sales-toolbar .command-button span {
    display: inline;
  }

  .sales-document-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 560px) {
  .sales-document-backdrop {
    padding: 0;
  }

  .sales-document-panel {
    height: 100vh;
    border-radius: 0;
  }

  .sales-document-grid {
    grid-template-columns: 1fr;
  }

  .sales-address-field {
    grid-column: auto;
  }

  .sales-document-tabs {
    padding: 0 6px;
  }

  .sales-document-tabs button {
    padding: 0 13px;
  }

  .sales-line-settings-backdrop {
    padding: 0;
  }

  .sales-line-settings-panel {
    height: 100vh;
    border: 0;
  }

  .sales-line-settings-actions {
    justify-content: flex-start;
    padding: 8px 14px;
    overflow-x: auto;
  }

  .sales-line-settings-table-wrap {
    margin: 0 10px;
  }
}

.country-table {
  min-width: 900px;
}

.crm-customer-table {
  min-width: 1780px;
}

.original-order-backdrop {
  z-index: 128;
  inset: 82px 0 0;
  padding: 0;
  background: #fff;
  overflow: auto;
}

.original-order-document-panel {
  width: max(100%, 1366px);
  min-width: 1366px;
  height: max(100%, 680px);
  min-height: 680px;
  display: flex;
  flex-direction: column;
  border: 0;
  background: #fff;
  overflow: hidden;
}

.original-order-toolbar {
  min-height: 42px;
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 10px;
  padding: 4px 16px;
  border-bottom: 8px solid #e7ebf1;
  background: #fff;
  overflow-x: auto;
}

.original-order-split {
  display: flex;
  align-items: center;
  gap: 1px;
}

.original-order-action {
  min-height: 28px;
  height: 28px;
  min-width: 54px;
  min-width: max-content;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 0 12px;
  border: 1px solid #4f82df;
  border-radius: 1px;
  color: #fff;
  background: #4f82df;
  cursor: pointer;
  font-size: 12px;
}

.original-order-action:hover {
  border-color: #3d70ce;
  background: #3d70ce;
}

.original-order-action.muted {
  border-color: #8eace8;
  background: #8eace8;
}

.original-order-action svg {
  width: 14px;
  height: 14px;
}

.original-order-caret {
  width: 18px;
  min-width: 18px;
  padding: 0;
}

.original-order-split .original-order-action:not(.original-order-caret) {
  min-width: 38px;
  padding: 0 8px;
}

.original-order-tabs {
  min-height: 34px;
  position: relative;
  display: flex;
  flex: 0 0 auto;
  align-items: stretch;
  gap: 4px;
  padding: 0 10px;
  border-bottom: 1px solid #d8dce2;
}

.original-order-tabs > button:not(.original-order-expand-button) {
  min-width: 72px;
  position: relative;
  padding: 0 8px;
  border: 0;
  color: #4f5761;
  background: transparent;
  cursor: pointer;
  font-size: 12px;
}

.original-order-tabs > button:not(.original-order-expand-button)::after {
  height: 2px;
  position: absolute;
  right: 5px;
  bottom: -1px;
  left: 5px;
  content: "";
  background: transparent;
}

.original-order-tabs > button.active {
  color: #2f70df;
}

.original-order-tabs > button.active::after {
  background: #4f82df;
}

.original-order-expand-button {
  width: 28px;
  height: 28px;
  position: absolute;
  top: 2px;
  right: 3px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 0;
  color: #3f72d8;
  background: transparent;
  cursor: pointer;
}

.original-order-expand-button svg {
  width: 13px;
  height: 13px;
}

.original-order-info-pane {
  height: 380px;
  min-height: 120px;
  max-height: 560px;
  flex: 0 0 auto;
  overflow: auto;
  background: #fff;
}

.original-order-info-pane.is-collapsed {
  height: 0 !important;
  min-height: 0;
  overflow: hidden;
}

.original-order-tab-panel {
  min-height: 100%;
  padding: 14px 20px;
}

.original-order-basic-grid,
.original-order-delivery-grid,
.original-order-other-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  align-content: start;
  gap: 9px 30px;
}

.original-order-delivery-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.original-order-field {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(72px, max-content) minmax(0, 1fr);
  align-items: center;
  gap: 6px;
}

.original-order-field > span:first-child {
  color: #505862;
  font-size: 12px;
  line-height: 1.2;
  text-align: right;
  white-space: nowrap;
}

.original-order-required {
  margin-left: 1px;
  color: #f5222d;
  font-weight: 600;
}

.original-order-input {
  height: 26px;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 0 7px;
  border: 1px solid #d3d8df;
  background: #fff;
}

.original-order-input:focus-within {
  border-color: #4f82df;
}

.original-order-input.disabled {
  background: #f3f3f3;
}

.original-order-input input,
.original-order-input select {
  width: 100%;
  min-width: 0;
  height: 24px;
  padding: 0;
  border: 0;
  outline: 0;
  color: #303741;
  background: transparent;
  font-size: 12px;
}

.original-order-input input:disabled {
  color: #6f7782;
  opacity: 1;
}

.original-order-input svg {
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
  color: #3f72d8;
  stroke-width: 1.6;
}

.original-order-input input[type="date"]::-webkit-calendar-picker-indicator,
.original-order-input input[type="datetime-local"]::-webkit-calendar-picker-indicator {
  width: 0;
  margin: 0;
  opacity: 0;
}

.original-order-full-field {
  grid-column: 1 / -1;
  grid-template-columns: 100px minmax(0, 1fr);
}

.original-order-attachment-actions {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 8px;
  color: #8a929d;
  font-size: 12px;
}

.original-order-upload-button {
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 0 10px;
  border: 1px solid #cfd5dd;
  color: #4f5761;
  background: #fff;
  cursor: pointer;
}

.original-order-upload-button svg {
  width: 14px;
  height: 14px;
  color: #3f72d8;
}

.original-order-dropzone {
  min-height: 72px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  border: 1px dashed #d9dde3;
  color: #9097a1;
  cursor: pointer;
  font-size: 12px;
}

.original-order-dropzone svg {
  width: 20px;
  height: 20px;
  color: #5c6570;
}

.original-order-attachment-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
  font-size: 12px;
}

.original-order-attachment-list span {
  padding: 4px 8px;
  border: 1px solid #d9dde3;
  background: #f7f8fa;
}

.original-order-resize-handle {
  width: 100%;
  height: 10px;
  min-height: 10px;
  position: relative;
  z-index: 4;
  display: block;
  flex: 0 0 auto;
  padding: 0;
  border: 0;
  border-top: 1px solid #dbe0e7;
  border-bottom: 1px solid #dbe0e7;
  color: #7293c9;
  background: #e8ecf2;
  cursor: row-resize;
}

.original-order-resize-handle svg {
  width: 10px;
  height: 10px;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  pointer-events: none;
}

.original-order-resize-handle svg:first-child { top: -3px; }
.original-order-resize-handle svg:last-child { bottom: -3px; }

.original-order-detail-section {
  min-height: 135px;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  overflow: hidden;
}

.original-order-document-panel.original-order-info-expanded .original-order-detail-section,
.original-order-document-panel.original-order-info-expanded .original-order-resize-handle {
  display: none;
}

.original-order-document-panel.original-order-info-expanded .original-order-info-pane {
  flex: 1 1 auto;
  height: auto !important;
  min-height: 0 !important;
  max-height: none;
}

.original-order-document-panel.original-order-lines-expanded .original-order-tabs,
.original-order-document-panel.original-order-lines-expanded .original-order-info-pane,
.original-order-document-panel.original-order-lines-expanded .original-order-resize-handle {
  display: none;
}

.original-order-document-panel.original-order-lines-expanded .original-order-detail-section {
  flex: 1 1 auto;
  min-height: 0;
}

.original-order-document-panel.original-order-lines-expanded .original-order-detail-scroll {
  flex: 1 1 auto;
  max-height: none;
}

.original-order-detail-header {
  min-height: 38px;
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: space-between;
  padding: 0 10px;
  border-bottom: 1px solid #d9dde3;
}

.original-order-detail-header > div {
  display: flex;
  align-items: stretch;
  height: 38px;
}

.original-order-detail-tabs button,
.original-order-detail-header > div:last-child button {
  min-width: max-content;
  padding: 0 9px;
  border: 0;
  color: #1264d7;
  background: transparent;
  cursor: pointer;
  font-size: 12px;
}

.original-order-detail-tabs button {
  position: relative;
  color: #4f5761;
}

.original-order-detail-tabs button.active {
  color: #2f70df;
}

.original-order-detail-tabs button.active::after {
  height: 2px;
  position: absolute;
  right: 5px;
  bottom: 0;
  left: 5px;
  content: "";
  background: #4f82df;
}

.original-order-detail-header svg {
  width: 14px;
  height: 14px;
  vertical-align: middle;
}

.original-order-detail-scroll {
  width: 100%;
  min-height: 0;
  flex: 1 1 auto;
  overflow-x: scroll;
  overflow-y: scroll;
  scrollbar-color: #9ca5b1 #eef0f3;
}

.original-order-detail-scroll::-webkit-scrollbar {
  width: 14px;
  height: 13px;
}

.original-order-detail-scroll::-webkit-scrollbar-thumb {
  border: 3px solid #eef0f3;
  border-radius: 7px;
  background: #9ca5b1;
}

.original-order-detail-scroll::-webkit-scrollbar-track,
.original-order-detail-scroll::-webkit-scrollbar-corner {
  background: #eef0f3;
}

.original-order-detail-table {
  width: 100%;
  min-width: 2200px;
  border-collapse: collapse;
  table-layout: fixed;
}

.original-order-detail-table th,
.original-order-detail-table td {
  width: 118px;
  height: 29px;
  padding: 0 5px;
  border: 1px solid #dfe2e7;
  color: #323943;
  background: #fff;
  font-size: 12px;
  text-align: left;
}

.original-order-detail-table th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #f2f3f5;
  font-weight: 500;
}

.original-order-detail-table th:nth-child(2),
.original-order-detail-table td:nth-child(2) {
  width: 36px;
  text-align: center;
}

.original-order-detail-table th:nth-child(3),
.original-order-detail-table td:nth-child(3),
.original-order-detail-table th:nth-child(4),
.original-order-detail-table td:nth-child(4),
.original-order-detail-table th:last-child,
.original-order-detail-table td:last-child {
  width: 165px;
}

.original-order-detail-table th:nth-child(5),
.original-order-detail-table td:nth-child(5) {
  width: 205px;
}

.original-order-detail-table input:not([type="checkbox"]) {
  width: 100%;
  height: 22px;
  padding: 0 5px;
  border: 1px solid #ccd2da;
  outline: 0;
  background: #fff;
  font-size: 12px;
}

.original-order-detail-table .original-order-material-reference {
  display: flex;
  align-items: center;
  width: 100%;
  min-width: 0;
}

.original-order-detail-table .original-order-material-reference input {
  min-width: 0;
  flex: 1;
}

.original-order-detail-table .original-order-material-reference button {
  height: 22px;
  width: 26px;
  flex: 0 0 26px;
}

.original-order-detail-table input:focus {
  border-color: #4f82df;
}

@media (max-width: 650px) {
  .original-order-backdrop {
    padding: 0;
  }
}

.crm-customer-table th,
.crm-customer-table td {
  width: 145px;
}

.crm-customer-table th[data-table-column="companyName"],
.crm-customer-table td[data-table-column="companyName"],
.crm-customer-table th[data-table-column="groupName"],
.crm-customer-table td[data-table-column="groupName"] {
  width: 220px;
}

.crm-customer-table th[data-table-column="modificationTime"],
.crm-customer-table td[data-table-column="modificationTime"],
.crm-customer-table th[data-table-column="nextVisitTime"],
.crm-customer-table td[data-table-column="nextVisitTime"] {
  width: 175px;
}

.crm-customer-backdrop {
  z-index: 130;
  inset: 82px 0 0;
  padding: 7px;
  background: rgba(18, 24, 34, 0.5);
}

.crm-customer-panel {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  border: 1px solid #cfd5dd;
  background: #fff;
  overflow: hidden;
}

.crm-form-toolbar {
  min-height: 40px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 12px;
  border-bottom: 8px solid #e8ecf2;
  background: #fff;
  overflow-x: auto;
}

.crm-customer-tabs {
  overflow-x: auto;
  scrollbar-width: thin;
}

.crm-customer-tabs button {
  flex: 0 0 auto;
  white-space: nowrap;
}

.workspace.tabs-collapsed .sales-document-backdrop,
.workspace.tabs-collapsed .original-order-backdrop,
.workspace.tabs-collapsed .crm-customer-backdrop {
  inset-block-start: 46px;
}

.crm-form-split {
  display: flex;
  align-items: center;
  gap: 1px;
}

.crm-toolbar-button {
  min-height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 0 12px;
  border: 1px solid #4f82df;
  border-radius: 1px;
  color: #fff;
  background: #4f82df;
  cursor: pointer;
  font-size: 12px;
}

.crm-toolbar-button:hover {
  border-color: #3d70ce;
  background: #3d70ce;
}

.crm-toolbar-button svg {
  width: 14px;
  height: 14px;
}

.crm-toolbar-caret {
  width: 22px;
  padding: 0;
}

.crm-customer-form-body {
  min-height: 0;
  flex: 1;
  overflow: auto;
  background: #fff;
}

.reference-master-list-layout.has-reference-tree {
  display: grid;
  grid-template-columns: 224px minmax(0, 1fr);
  border-top: 1px solid #e3e6eb;
}

.reference-master-tree {
  min-width: 0;
  border-right: 1px solid #e3e6eb;
  background: #fff;
  padding: 10px 8px;
}

.reference-tree-search {
  display: flex;
  align-items: center;
  gap: 5px;
  border: 1px solid #d4d8de;
  padding: 5px;
  margin-bottom: 8px;
}

.reference-tree-search svg { width: 14px; height: 14px; color: #818a96; }
.reference-tree-search input { width: 100%; min-width: 0; border: 0; outline: 0; font-size: 12px; }
.reference-tree-content { max-height: 560px; overflow: auto; }
.reference-master-tree summary { display: list-item; cursor: pointer; color: #7d8794; font-size: 12px; }
.reference-master-tree details { padding-left: 12px; }
.reference-tree-children { padding-left: 3px; }
.reference-master-tree button {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  max-width: calc(100% - 5px);
  min-height: 28px;
  border: 0;
  background: transparent;
  color: #46505d;
  font-size: 12px;
  padding: 3px 5px;
  text-align: left;
  white-space: normal;
  overflow-wrap: anywhere;
  cursor: pointer;
}
.reference-master-tree button:hover { background: #f2f6fc; }
.reference-master-tree button.active { background: #edf3fd; color: #507ed2; }
.reference-master-tree small { color: #919aa6; font-size: 10px; flex-shrink: 0; }
.reference-tree-leaf { padding-left: 12px; }
.reference-tree-root { width: 100%; }
.reference-master-table-section { min-width: 0; }
.reference-settings-column { width: 38px; min-width: 38px; }
.administrative-division-page .module-heading { margin-bottom: 0; padding-bottom: 10px; }
.administrative-division-page .module-heading h1 { font-size: 18px; }
.administrative-division-page .module-heading p,
.administrative-division-page .module-heading .breadcrumb { display: none; }
.administrative-division-page .data-toolbar { flex-wrap: wrap; align-items: center; }
.administrative-division-page .reference-master-special-actions { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.administrative-division-page .toolbar-primary { align-items: center; }
.aligned-master-page .toolbar-primary { align-items: center; }
.aligned-master-page .toolbar-secondary:empty { display: none; }
#settlementPage .currency-table { width: max-content; min-width: 100%; table-layout: auto; }
#settlementPage .currency-table th:not(.selection-column),
#settlementPage .currency-table td:not(.selection-column) { min-width: 110px; max-width: none; }
#settlementPage [data-table-column="name"], #settlementPage [data-table-column="category"] { min-width: 210px; }
#settlementPage .currency-table td { overflow: visible; text-overflow: clip; }
.settlement-form-grid .settlement-channel-field { grid-column: 1; grid-row: 3; }
.settlement-form-grid .settlement-default-channel-field { grid-column: 2; grid-row: 3; }
.settlement-form-grid > label:has(#settlementDescription) { grid-column: 2; grid-row: 2; }
.settlement-form-grid > label:has(#settlementCategory) { grid-column: 1; grid-row: 2; }
.settlement-form-grid .settlement-switches { flex-direction: row-reverse; justify-content: space-between; }
.settlement-channel-picker { position: relative; min-height: 32px; border: 1px solid #d9dde3; background: #fff; }
.settlement-channel-picker summary { cursor: pointer; padding: 7px 10px; }
.settlement-channel-picker > div { position: absolute; left: 0; right: 0; z-index: 20; padding: 8px; background: #fff; box-shadow: 0 4px 12px #0002; }
.settlement-channel-picker label { display: flex; align-items: center; gap: 8px; padding: 6px; }
#settlementForm [hidden] { display: none !important; }
.master-maintenance-panel { width: min(800px, 95vw); }
.master-maintenance-panel table { width: 100%; border-collapse: collapse; }
.master-maintenance-panel th,.master-maintenance-panel td { padding: 10px; border-bottom: 1px solid #e4e8ee; text-align: left; }
.maintenance-toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.maintenance-toolbar select { margin-left: 8px; max-width: 170px; }
.maintenance-scroll { overflow: auto; max-height: 55vh; }
#administrativeMaintenanceModal { z-index: 185; }
body:has(#administrativeMaintenanceModal) #referencePickerModal { z-index: 5100; }
.administrative-division-page .table-pagination { gap: 8px; flex-wrap: wrap; }
.administrative-division-page .table-scroll { max-height: 610px; }
.administrative-division-page .reference-master-table { width: max-content; min-width: 1600px; table-layout: auto; }
.administrative-division-page .reference-master-table th,
.administrative-division-page .reference-master-table td { min-width: 100px; }
.administrative-division-page .reference-master-table .selection-column,
.administrative-division-page .reference-master-table .reference-settings-column { min-width: 38px; width: 38px; }
.administrative-division-page .reference-settings-column { position: sticky; right: 0; background: #fff; z-index: 2; }
.administrative-division-page th.reference-settings-column { background: #f3f3f4; z-index: 4; }

@media (max-width: 650px) {
  .reference-master-list-layout.has-reference-tree { grid-template-columns: minmax(0, 1fr); }
  .reference-master-tree { border-right: 0; border-bottom: 1px solid #e3e6eb; }
  .reference-tree-content { max-height: 160px; }
}

.crm-customer-summary {
  min-height: 144px;
  display: grid;
  grid-template-columns: 108px minmax(0, 1fr);
  gap: 42px;
  padding: 10px 52px 16px;
}

.crm-customer-image {
  width: 108px;
  height: 108px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 4px;
  border: 1px dashed #cfd5dd;
  color: #858d98;
  cursor: pointer;
  overflow: hidden;
}

.crm-customer-image:hover {
  border-color: #4f82df;
  color: #3f72d8;
}

.crm-customer-image > svg {
  width: 22px;
  height: 22px;
}

.crm-customer-image img {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0;
  object-fit: cover;
}

.crm-customer-image span {
  font-size: 12px;
}

.crm-customer-summary-grid,
.crm-customer-basic-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  align-content: start;
  gap: 8px 34px;
}

.crm-inline-field {
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(74px, max-content) minmax(0, 1fr);
  align-items: center;
  gap: 6px;
}

.crm-inline-field > span:first-child {
  color: #505862;
  font-size: 12px;
  line-height: 1.2;
  text-align: right;
}

.crm-required {
  margin-left: 1px;
  color: #f5222d;
  font-weight: 600;
}

.crm-input {
  height: 26px;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 0 7px;
  border: 1px solid #d4d8de;
  background: #fff;
}

.crm-input:focus-within {
  border-color: #4f82df;
}

.crm-input.disabled {
  background: #f3f3f3;
}

.crm-input input,
.crm-input select {
  width: 100%;
  min-width: 0;
  height: 24px;
  padding: 0;
  border: 0;
  outline: 0;
  color: #303741;
  background: transparent;
  font-size: 12px;
}

.crm-input input:disabled {
  color: #6f7782;
  opacity: 1;
}

.crm-input svg {
  width: 14px;
  height: 14px;
  flex: 0 0 auto;
  color: #3f72d8;
  stroke-width: 1.6;
}

.crm-contact-input b {
  min-width: max-content;
  color: #555d68;
  font-size: 12px;
  font-weight: 400;
}

.crm-customer-tabs {
  min-height: 42px;
  display: flex;
  align-items: stretch;
  gap: 4px;
  padding: 0 52px;
  border-bottom: 1px solid #d9dde3;
}

.crm-customer-tabs button {
  min-width: 78px;
  position: relative;
  padding: 0 10px;
  border: 0;
  color: #555d68;
  background: transparent;
  cursor: pointer;
  font-size: 12px;
}

.crm-customer-tabs button::after {
  height: 2px;
  position: absolute;
  right: 6px;
  bottom: -1px;
  left: 6px;
  content: "";
  background: transparent;
}

.crm-customer-tabs button.active {
  color: #3f72d8;
}

.crm-customer-tabs button.active::after {
  background: #4f82df;
}

.crm-customer-tab-panel {
  min-height: 330px;
  padding: 17px 52px;
}

.crm-customer-basic-grid {
  gap: 9px 34px;
}

.crm-customer-basic-grid .crm-wide-field {
  grid-column: span 1;
}

.crm-customer-basic-grid .crm-full-field {
  grid-column: 1 / -1;
  grid-template-columns: 74px minmax(0, 1fr);
}

.crm-transfer-table-wrap {
  border: 1px solid #d7dbe1;
  overflow: auto;
}

.crm-transfer-table {
  width: 100%;
  min-width: 760px;
  border-collapse: collapse;
  table-layout: fixed;
}

.crm-transfer-table th,
.crm-transfer-table td {
  height: 29px;
  padding: 0 10px;
  border-right: 1px solid #e1e4e8;
  border-bottom: 1px solid #d9dde3;
  color: #3e4650;
  font-size: 12px;
  text-align: left;
}

.crm-transfer-table th {
  background: #f3f3f3;
  font-weight: 500;
}

.crm-transfer-table th:first-child,
.crm-transfer-table td:first-child {
  width: 34px;
  text-align: center;
}

.crm-transfer-table th:last-child,
.crm-transfer-table td:last-child {
  width: 34px;
  padding: 0;
  text-align: center;
}

.crm-transfer-table .icon-button {
  width: 28px;
  height: 28px;
  color: #3f72d8;
}

.crm-transfer-empty td {
  height: 160px;
  color: #8b929c;
  text-align: center !important;
}

@media (max-width: 1100px) {
  .crm-customer-summary {
    grid-template-columns: 90px minmax(0, 1fr);
    gap: 18px;
    padding-right: 24px;
    padding-left: 24px;
  }

  .crm-customer-image {
    width: 90px;
    height: 90px;
  }

  .crm-customer-summary-grid,
  .crm-customer-basic-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .crm-customer-tabs,
  .crm-customer-tab-panel {
    padding-right: 24px;
    padding-left: 24px;
  }
}

@media (max-width: 650px) {
  .crm-customer-backdrop {
    padding: 0;
  }

  .crm-form-toolbar {
    overflow-x: auto;
  }

  .crm-toolbar-button {
    min-width: max-content;
  }

  .crm-customer-summary {
    grid-template-columns: 1fr;
  }

  .crm-customer-image {
    margin: 0 auto;
  }

  .crm-customer-summary-grid,
  .crm-customer-basic-grid {
    grid-template-columns: 1fr;
  }

  .crm-customer-basic-grid .crm-full-field {
    grid-column: auto;
  }
}

.country-table th[data-table-column="code"] { width: 150px; }
.country-table th[data-table-column="name"] { width: 220px; }
.country-table th[data-table-column="fullName"] { width: 390px; }
.country-table th[data-table-column="usageStatus"] { width: 130px; }

.measurement-layout {
  min-height: 420px;
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
}

.measurement-groups {
  min-height: 420px;
  padding: 8px 0;
  border: 1px solid #d9dde3;
  background: #fff;
}

.measurement-groups strong,
.measurement-groups span {
  display: block;
  padding: 7px 14px;
  color: #555c66;
  font-size: 12px;
}

.measurement-groups strong {
  color: #2f343b;
  font-weight: 600;
}

.measurement-groups span {
  margin-top: 5px;
  color: #8a919c;
  font-size: 11px;
}

.measurement-groups button {
  width: 100%;
  min-height: 34px;
  padding: 0 14px 0 24px;
  border: 0;
  color: #40464f;
  background: transparent;
  cursor: pointer;
  text-align: left;
  font-size: 12px;
}

.measurement-groups button:hover,
.measurement-groups button.active {
  color: #1b66ae;
  background: #eaf3ff;
}

.measurement-table-section {
  min-width: 0;
}

.measurement-unit-table {
  min-width: 1240px;
}

.measurement-unit-table th[data-table-column="code"] { width: 130px; }
.measurement-unit-table th[data-table-column="name"] { width: 180px; }
.measurement-unit-table th[data-table-column="precision"] { width: 120px; }
.measurement-unit-table th[data-table-column="rounding"] { width: 150px; }
.measurement-unit-table th[data-table-column="group"] { width: 160px; }
.measurement-unit-table th[data-table-column="baseUnit"],
.measurement-unit-table th[data-table-column="systemPreset"],
.measurement-unit-table th[data-table-column="usageStatus"] { width: 130px; }

.measurement-base-option > label {
  min-height: 44px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 12px;
  border: 1px solid #d9dde3;
  background: #fff;
  font-size: 13px;
}

.measurement-base-option input {
  width: 16px;
  height: 16px;
  accent-color: var(--kd-blue);
}

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

  .measurement-groups {
    min-height: 0;
    display: flex;
    gap: 2px;
    overflow-x: auto;
    padding: 4px;
  }

  .measurement-groups strong,
  .measurement-groups span {
    display: none;
  }

  .measurement-groups button {
    width: auto;
    flex: 0 0 auto;
    padding: 0 12px;
  }
}

.classification-layout {
  grid-template-columns: 380px minmax(0, 1fr);
}

.classification-standard-select {
  min-height: 32px;
  display: flex;
  align-items: center;
  margin: 0 8px 7px;
  padding: 0 10px;
  border: 1px solid #d7dce4;
  color: #272d36;
  background: #fff;
  font-size: 12px;
}

.classification-tree {
  max-height: calc(100vh - 240px);
  overflow: auto;
}

.classification-tree button {
  display: flex;
  align-items: center;
  gap: 4px;
  padding-left: calc(18px + var(--tree-depth, 0) * 20px);
  white-space: nowrap;
}

.classification-tree button svg,
.classification-tree .tree-spacer {
  width: 13px;
  min-width: 13px;
  height: 13px;
}

.classification-tree-root {
  color: #3169c6 !important;
}

.classification-include-children {
  min-height: 34px;
  display: flex;
  align-items: center;
  gap: 7px;
  position: sticky;
  bottom: 0;
  padding: 0 20px;
  color: #2f3540;
  background: #fff;
  font-size: 12px;
}

.classification-include-children input {
  width: 15px;
  height: 15px;
  accent-color: #4d7cf2;
}

.classification-table {
  min-width: 1380px;
}

.classification-table th,
.classification-table td,
.additional-standard-table th,
.additional-standard-table td {
  height: 29px;
  padding: 0 8px;
}

.classification-table th[data-table-column="sequence"],
.additional-standard-table th[data-table-column="sequence"] { width: 54px; }
.classification-table th[data-table-column="code"],
.additional-standard-table th[data-table-column="code"] { width: 130px; }
.classification-table th[data-table-column="name"],
.additional-standard-table th[data-table-column="name"] { width: 230px; }
.classification-table th[data-table-column="parentName"] { width: 150px; }
.classification-table th[data-table-column="usageStatus"],
.additional-standard-table th[data-table-column="usageStatus"] { width: 105px; }
.classification-table th[data-table-column="creationOrganization"],
.additional-standard-table th[data-table-column="creationOrganization"] { width: 280px; }
.classification-table th[data-table-column="description"],
.additional-standard-table th[data-table-column="description"] { width: 210px; }

.additional-standard-table {
  min-width: 980px;
}

#purchase-requestPage {
  height: calc(100vh - 82px);
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
  background: #fff;
}

.workspace.tabs-collapsed #purchase-requestPage { height: calc(100vh - 46px); }

#purchase-requestPage .purchase-request-list-heading,
#purchase-requestPage .purchase-request-filter-panel,
#purchase-requestPage .filter-summary {
  flex: 0 0 auto;
}

#purchase-requestPage .filter-summary {
  min-height: 30px;
  padding: 6px 20px;
}

#purchase-requestPage .sales-table-section {
  min-height: 0;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  border-width: 8px 8px 0;
}

#purchase-requestPage .sales-table-section .table-pagination { flex: 0 0 34px; }

#purchase-requestPage .sales-table-section .table-scroll {
  min-height: 0;
  flex: 1 1 auto;
  overflow: auto;
}

.procurement-table {
  width: max-content;
  min-width: 100%;
  table-layout: fixed;
}

.procurement-table th,
.procurement-table td {
  width: 142px;
  min-width: 142px;
  max-width: 142px;
}

.procurement-table .selection-column {
  width: 42px;
  min-width: 42px;
  max-width: 42px;
}

#purchase-orderPage {
  height: calc(100vh - 82px);
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
  background: #fff;
}

.workspace.tabs-collapsed #purchase-orderPage { height: calc(100vh - 46px); }

.purchase-order-list-heading {
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 7px 20px;
  border-bottom: 1px solid #e2e5e9;
  background: #fff;
}

.purchase-request-list-heading {
  min-height: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 7px 20px;
  border-bottom: 1px solid #e2e5e9;
  background: #fff;
}

.purchase-request-list-heading > div {
  display: flex;
  align-items: center;
  gap: 12px;
}

.purchase-request-list-heading h1 { margin: 4px 0 0; font-size: 18px; font-weight: 600; }
.purchase-request-list-heading p { margin: 2px 0 0; color: #737b85; font-size: 12px; }
.purchase-request-list-heading .list-quick-search { width: 270px; }
.purchase-request-filter-panel {
  display: grid;
  grid-template-columns: repeat(3, minmax(180px, 1fr)) auto;
  align-items: center;
  gap: 12px 20px;
  padding: 10px 20px;
  border-bottom: 1px solid #dfe3e8;
  background: #fff;
}
.purchase-request-filter-panel label { display: grid; gap: 4px; color: #59636e; font-size: 12px; }
.purchase-request-filter-panel input,
.purchase-request-filter-panel select { height: 30px; min-width: 0; padding: 0 8px; border: 1px solid #d6dae0; border-radius: 0; background: #fff; font-size: 12px; }

@media (max-width: 1050px) {
  .purchase-request-list-heading { align-items: flex-start; flex-direction: column; }
  .purchase-request-list-heading > div:last-child { width: 100%; }
  .purchase-request-list-heading .list-quick-search { flex: 1 1 auto; width: auto; }
  .purchase-request-filter-panel { grid-template-columns: 1fr; }
}

.purchase-order-list-heading > div {
  display: flex;
  align-items: center;
  gap: 12px;
}

.purchase-order-list-heading strong {
  font-size: 14px;
  font-weight: 500;
}

.purchase-order-list-heading select {
  width: 162px;
  height: 30px;
  padding: 0 9px;
  border: 1px solid #d6dae0;
  border-radius: 0;
  background: #fff;
  font-size: 12px;
}

.purchase-order-filter-panel {
  min-height: 52px;
  display: grid;
  grid-template-columns: repeat(3, minmax(250px, 1fr)) 34px;
  align-items: center;
  gap: 28px;
  padding: 8px 20px;
  border-bottom: 1px solid #dfe3e8;
  background: #fff;
}

.purchase-order-filter-panel > label {
  min-width: 0;
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr);
  align-items: center;
  gap: 8px;
  color: #454b55;
  font-size: 12px;
}

.purchase-order-filter-panel input,
.purchase-order-filter-panel select {
  width: 100%;
  height: 30px;
  padding: 0 9px;
  border: 1px solid #d6dae0;
  border-radius: 0;
  outline: 0;
  background: #fff;
  font-size: 12px;
}

.purchase-order-filter-panel input:focus,
.purchase-order-filter-panel select:focus { border-color: #4d7cf2; }

#purchase-orderPage .purchase-order-toolbar {
  min-height: 42px;
  flex: 0 0 auto;
  align-items: center;
  margin: 0;
  padding: 6px 20px;
  overflow: visible;
  border-bottom: 1px solid #dce1e8;
  background: #fff;
}

#purchase-orderPage .purchase-order-toolbar .toolbar-primary {
  min-width: max-content;
  flex-wrap: nowrap;
  gap: 4px;
}

#purchase-orderPage .purchase-order-toolbar .command-button {
  min-height: 28px;
  height: 28px;
  padding: 0 11px;
  border-color: #4d78dc;
  border-radius: 1px;
  color: #fff;
  background: #4f7bea;
  white-space: nowrap;
}

#purchase-orderPage .purchase-order-toolbar .command-button:hover:not(:disabled) {
  border-color: #3868da;
  color: #fff;
  background: #3868da;
}

#purchase-orderPage .purchase-order-toolbar .command-button svg { color: currentColor; }

.purchase-order-filter-summary {
  min-height: 0;
  padding: 0 20px;
  border: 0;
}

.purchase-order-filter-summary:has(.filter-note:empty) { display: none; }

.purchase-order-table-section {
  min-height: 0;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  border-width: 8px 8px 0;
}

.purchase-order-table-section .table-pagination { flex: 0 0 34px; }

.purchase-order-table-section .table-scroll {
  min-height: 0;
  flex: 1 1 auto;
}

.purchase-order-list-table {
  width: max-content;
  min-width: 2300px;
  table-layout: fixed;
}

.purchase-order-list-table th,
.purchase-order-list-table td {
  width: 142px;
  min-width: 142px;
  max-width: 142px;
  height: 30px;
  padding: 0 8px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.purchase-order-list-table .selection-column {
  width: 42px;
  min-width: 42px;
  max-width: 42px;
  position: sticky;
  left: 0;
  z-index: 7;
  background: #f3f3f4;
  text-align: center;
}

.purchase-order-list-table tbody .selection-column { background: #fff; }
.purchase-order-list-table tbody tr:hover .selection-column,
.purchase-order-list-table tbody tr.selected .selection-column { background: #eef5ff; }

.purchase-order-list-table .purchase-order-sequence-column {
  width: 46px;
  min-width: 46px;
  max-width: 46px;
  position: sticky;
  left: 42px;
  z-index: 6;
  background: #f3f3f4;
  text-align: center;
}

.purchase-order-list-table tbody .purchase-order-sequence-column { background: #fff; }
.purchase-order-list-table tbody tr:hover .purchase-order-sequence-column,
.purchase-order-list-table tbody tr.selected .purchase-order-sequence-column { background: #eef5ff; }

.purchase-order-list-table th[data-table-column$="007"],
.purchase-order-list-table td:has(.purchase-order-document-link) {
  width: 170px;
  min-width: 170px;
  max-width: 170px;
}

.purchase-order-list-table tbody tr { cursor: default; }
.purchase-order-document-link { font-size: 12px; }

@media (max-width: 1050px) {
  .purchase-order-list-heading { align-items: flex-start; flex-direction: column; }
  .purchase-order-list-heading > div:last-child { width: 100%; }
  .purchase-order-list-heading .list-quick-search { flex: 1 1 auto; }
  .purchase-order-filter-panel { grid-template-columns: 1fr; gap: 8px; }
  #purchase-orderPage .purchase-order-toolbar { overflow-x: auto; }
}

.classification-form-panel,
.classification-standard-form-panel {
  width: min(630px, calc(100vw - 32px));
  border-radius: 0;
}

#classificationModal { z-index: 5000; }

.classification-form-panel .modal-header,
.classification-standard-form-panel .modal-header {
  min-height: 48px;
  padding: 0 18px;
}

.classification-form-panel .modal-header h2,
.classification-standard-form-panel .modal-header h2 {
  font-size: 16px;
  font-weight: 500;
}

.classification-control-notice {
  padding: 8px 16px 10px;
  color: #171717;
  background: #fff3c4;
  font-size: 12px;
  line-height: 1.65;
}

.classification-control-notice strong,
.classification-control-notice span {
  display: block;
}

.classification-control-notice strong::before {
  content: "!";
  width: 15px;
  height: 15px;
  display: inline-grid;
  place-items: center;
  margin-right: 5px;
  border-radius: 50%;
  color: #fff;
  background: #f3c449;
  font-size: 10px;
}

.classification-form-grid,
.classification-standard-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: start;
  gap: 13px 28px;
  padding: 28px 46px 24px;
}

.classification-form-grid .field > span:first-child b,
.classification-standard-form-grid .field > span:first-child b {
  color: #f5222d;
  font-weight: 500;
}

.classification-readonly-value {
  min-height: 28px;
  display: flex;
  align-items: center;
  padding: 0 8px;
  border: 1px solid #d7dce4;
  color: #151a21;
  background: #f5f5f5;
  font-size: 12px;
}

.classification-switch-field {
  min-height: 52px;
  display: grid;
  align-content: center;
  gap: 8px;
  font-size: 12px;
}

.classification-switch-field input {
  width: 30px;
  height: 16px;
  accent-color: #4d7cf2;
}

.classification-modal-footer {
  min-height: 54px;
  justify-content: center;
  gap: 10px;
  padding: 10px 18px;
}

.classification-modal-footer button {
  min-width: 54px;
  min-height: 28px;
  padding: 0 13px;
  border-radius: 0;
  flex: 0 0 auto;
  width: auto;
  white-space: nowrap;
}

.classification-form-panel .modal-header,
.classification-form-panel .classification-control-notice,
.classification-form-panel .classification-modal-footer { flex-shrink: 0; }
.classification-form-panel .classification-form-grid { min-height: 0; overflow-y: auto; }

.classification-modal-footer .primary-button {
  border-color: #4d7cf2;
  background: #4d7cf2;
}

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

  .classification-form-grid,
  .classification-standard-form-grid {
    grid-template-columns: 1fr;
    padding: 22px 26px;
  }
}
.crm-contact-toolbar { display: flex; align-items: center; gap: 20px; margin-bottom: 10px; color: #333; }
.crm-contact-table { min-width: 680px; table-layout: fixed; }
.crm-contact-table th:first-child, .crm-contact-table th:last-child { width: 48px; }
.crm-contact-table input { width: 100%; min-width: 0; height: 30px; border: 1px solid #d9dee5; padding: 4px 8px; background: #fff; }
.crm-contact-table input:disabled { background: #f3f4f6; color: #666; }
.crm-input.reference-input button, .input-wrap.reference-input button { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; flex: 0 0 28px; border: 0; background: transparent; color: #2768c6; cursor: pointer; padding: 4px; }
.crm-input.reference-input button svg, .input-wrap.reference-input button svg { width: 16px; height: 16px; }
.original-push-fields { display: flex; flex-direction: column; gap: 22px; }
.original-push-fields select { width: 100%; height: 34px; border: 1px solid #d9dee5; background: #fff; padding: 4px 8px; }
.original-push-fields input[type="checkbox"] { appearance: none; position: relative; width: 34px; height: 18px; border: 0; border-radius: 9px; background: #c8cacc; cursor: pointer; }
.original-push-fields input[type="checkbox"]::after { content: ""; position: absolute; left: 2px; top: 2px; width: 14px; height: 14px; border-radius: 50%; background: #fff; }
.original-push-fields input[type="checkbox"]:checked { background: #5783e5; }
.original-push-fields input[type="checkbox"]:checked::after { left: 18px; }
.original-push-fields input[type="checkbox"]:focus-visible { outline: 2px solid #2768c6; outline-offset: 2px; }
body:has(#referencePickerModal:not(.hidden)) #auxiliaryDataModal { z-index: 180; }
#originalOrderPushModal { z-index: 140; }
#originalOrderPushModal .modal-header, #originalOrderPushModal .modal-footer { flex: 0 0 auto; }
#originalOrderPushModal .modal-panel { width: min(100%, 800px); }
#originalOrderPushModal .primary-button { width: auto; min-width: 90px; min-height: 38px; padding: 0 15px; background: #5783e5; border-radius: 4px; }
#originalOrderPushModal .primary-button:disabled { opacity: .6; }
#originalOrderPushModal .field { flex: 0 0 auto; }
/* Approval design and task surfaces remain independently scrollable. */
.workflow-toolbar { display:flex; align-items:center; flex-wrap:wrap; gap:8px; padding:10px 0; }
.workflow-toolbar button,.workflow-toolbar summary { display:inline-flex; align-items:center; gap:6px; min-height:32px; padding:5px 10px; border:1px solid #b9cde5; background:#347cce; color:#fff; border-radius:3px; cursor:pointer; font:inherit; }
.workflow-toolbar svg { width:16px; height:16px; }
.workflow-toolbar details { position:relative; }
.workflow-toolbar summary { list-style:none; }
.workflow-toolbar summary::-webkit-details-marker { display:none; }
.workflow-toolbar details > div { position:absolute; top:100%; left:0; z-index:12; min-width:130px; padding:4px; background:#fff; border:1px solid #d6dde6; box-shadow:0 3px 10px #0002; }
.workflow-toolbar details > div button { width:100%; background:#fff; color:#2465ac; border:0; justify-content:flex-start; }
.workflow-split { display:flex; }
.workflow-split > button { border-radius:3px 0 0 3px; }
.workflow-split summary { border-radius:0 3px 3px 0; padding:5px; }
.workflow-page .currency-table { min-width:850px; }
.workflow-modal { z-index:180; padding:20px; }
.workflow-editor { display:flex; flex-direction:column; width:min(1080px,100%); height:min(850px,calc(100dvh - 40px)); overflow:hidden; background:#fff; border-radius:4px; box-shadow:0 10px 35px #0003; }
.workflow-editor > header,.workflow-editor > footer { flex-shrink:0; }
.workflow-modal .modal-footer .primary-button,.workflow-modal .modal-footer .secondary-button { width:auto; flex:none; min-width:80px; }
.workflow-editor .currency-table { min-width:900px; }
.workflow-editor-scroll { min-height:0; flex:1; overflow:auto; padding:16px; }
.workflow-editor .demand-section { padding:12px 0; border-bottom:1px solid #e0e5ea; }
.workflow-editor h3 { font-size:15px; margin:0 0 12px; }
.workflow-editor label { display:flex; flex-direction:column; gap:6px; font-size:13px; min-width:0; }
.workflow-editor label:has(> input[type=checkbox]) { flex-direction:row; align-items:center; }
.workflow-editor input:not([type=checkbox]),.workflow-editor select,.workflow-editor textarea { width:100%; min-width:0; padding:7px; border:1px solid #c9d1da; border-radius:2px; font:inherit; color:#253646; background:#fff; }
.workflow-editor textarea { min-height:80px; resize:vertical; }
.workflow-required { display:flex; gap:12px; flex-wrap:wrap; }
.workflow-required label,.workflow-checks label { flex-direction:row; align-items:center; }
.workflow-checks { display:grid; gap:10px; margin:16px 0; }
.workflow-node { padding:12px 0; border-top:1px solid #d9e0e8; }
.workflow-node > header { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.workflow-node > header strong { min-width:0; overflow-wrap:anywhere; }
.workflow-node > header > div { flex-shrink:0; }
.workflow-node header button { width:30px; height:30px; padding:5px; margin-left:5px; border:1px solid #cbd4df; background:white; cursor:pointer; }
.workflow-node header svg { width:16px; height:16px; }
.workflow-wide { grid-column:1 / -1; }
.workflow-business-fields { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; font-size:13px; }
.workflow-business-fields dt { color:#647382; }
.workflow-business-fields dd { margin:4px 0 0; overflow-wrap:anywhere; }
.workflow-steps { padding-left:24px; display:grid; gap:10px; }
.workflow-steps li { color:#596771; padding:8px 0; border-bottom:1px solid #e2e7eb; }
.workflow-steps li span { margin-left:16px; font-size:12px; }
.workflow-steps li.current { color:#1b65bb; font-weight:600; }
.workflow-steps li.complete { color:#258354; }
.workflow-editor p,.workflow-editor a { overflow-wrap:anywhere; }
.workflow-review-header { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; }
.workflow-review-header > div { min-width:0; }
.workflow-review-actions { padding:7px 0 0; }
.workflow-review-actions .workflow-split { align-items:stretch; }
.workflow-assignee-panel { width:min(520px,calc(100vw - 24px)); }
.workflow-circulation-panel { width:min(800px,calc(100vw - 24px)); max-height:85dvh; display:flex; flex-direction:column; }
.workflow-circulation-panel .modal-body { min-height:180px; overflow:auto; }
.workflow-assignee-body { display:grid; gap:14px; }
.workflow-assignee-body label { display:grid; gap:6px; min-width:0; font-size:13px; }
.workflow-assignee-body input:not([type=checkbox]),.workflow-assignee-body select,.workflow-assignee-body textarea { width:100%; min-width:0; padding:8px; border:1px solid #c9d1da; border-radius:3px; font:inherit; }
.workflow-assignee-body textarea { min-height:90px; resize:vertical; }
.workflow-addsign-options { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.workflow-addsign-options .workflow-inline-check { grid-column:1 / -1; }
.workflow-assignee-body .workflow-inline-check { display:flex; align-items:center; gap:8px; }
.workflow-assignee-help { margin:0; color:#526170; font-size:12px; }
.workflow-flow-chart { display:flex; align-items:center; flex-direction:column; padding:10px; }
.workflow-flow-node { width:min(240px,100%); padding:12px; border:1px solid #b8c9db; background:#fff; text-align:center; border-radius:4px; overflow-wrap:anywhere; }
.workflow-flow-node small { color:#647382; }
.workflow-flow-node.complete { border-color:#6ba78c; }
.workflow-flow-node.current { background:#2877c8; border-color:#2877c8; color:white; }
.workflow-flow-node.current small { color:white; }
.workflow-flow-node.future { color:#73818e; }
.workflow-flow-arrow { height:26px; width:2px; background:#5c8bc0; position:relative; }
.workflow-flow-arrow::after { content:""; position:absolute; bottom:0; left:-4px; border:5px solid transparent; border-top-color:#5c8bc0; transform:translateY(9px); }
.workflow-flow-arrow.future { background:#c3cbd3; }
.workflow-flow-arrow.future::after { border-top-color:#c3cbd3; }
.workflow-flow-view.predicting .workflow-flow-node.future { border-style:dashed; background:#f4f9ff; }
.workflow-flow-view.predicting .workflow-flow-arrow.future { background:#2877c8; }
.workflow-flow-view.predicting .workflow-flow-arrow.future::after { border-top-color:#2877c8; }
.notice-badge[hidden] { display:none; }
#workflowTasksPage,#workflowTaskDetailPage { padding:0; }
.message-center-layout { display:grid; grid-template-columns:180px 165px minmax(0,1fr); min-height:calc(100dvh - 90px); background:#fff; }
.message-center-nav { background:#393e49; color:#fff; padding:12px 8px; display:flex; flex-direction:column; gap:3px; }
.message-center-nav h2 { margin:0 10px 8px; font-size:15px; font-weight:600; }
.message-center-nav button { display:flex; align-items:center; gap:10px; width:100%; min-height:38px; padding:7px 10px; border:0; border-radius:4px; text-align:left; color:#fff; background:transparent; cursor:pointer; white-space:nowrap; }
.message-center-nav button:hover,.message-center-nav button[aria-current="page"] { background:#686f80; }
.message-center-nav button svg { width:17px; height:17px; flex:none; }
.message-center-nav button span { margin-left:auto; font-size:12px; }
.message-center-types { border-right:1px solid #dce3ec; padding:12px 8px; min-width:0; }
.message-center-type-search,.message-center-search { display:flex; align-items:center; gap:6px; min-width:0; border:1px solid #d9e1ec; border-radius:3px; padding:0 8px; background:#fff; }
.message-center-type-search svg,.message-center-search svg { width:16px; height:16px; color:#8190a0; flex:none; }
.message-center-type-search input,.message-center-search input { width:100%; min-width:0; height:32px; border:0; outline:0; font:inherit; }
.message-center-types > button { border:0; background:transparent; width:100%; padding:10px 5px; text-align:left; color:#172736; cursor:pointer; white-space:normal; }
.message-center-types > button:hover { color:#146cbf; }
.message-center-main { min-width:0; padding:14px 12px; background:#f5f7fb; }
.message-center-heading { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; }
.message-center-heading h1 { margin:0; font-size:17px; font-weight:600; }
.message-center-search { width:min(350px,100%); }
.message-center-toolbar { padding:10px 0; }
.message-center-toolbar button[hidden] { display:none; }
.message-center-summary { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:36px; padding:5px 9px; border:1px solid #dce3ed; border-bottom:0; background:#fff; font-size:12px; }
.message-center-summary > div { display:flex; align-items:center; gap:8px; }
.message-center-summary button { width:27px; height:27px; display:grid; place-items:center; border:0; background:transparent; cursor:pointer; }
.message-center-summary button:disabled { opacity:.35; cursor:default; }
.message-center-summary svg { width:15px; height:15px; }
.message-center-summary select { border:1px solid #d4dce6; background:#fff; min-height:27px; }
.message-center-table { max-height:calc(100dvh - 245px); overflow:auto; background:#fff; border:1px solid #dce3ed; }
.message-center-table .currency-table { width:max-content; min-width:100%; table-layout:auto; }
.message-center-table td,.message-center-table th { width:auto; overflow:visible; text-overflow:clip; white-space:nowrap; }
.message-center-table th:nth-child(2),.message-center-table th:nth-child(3),.message-center-table th:last-child { width:auto; }
.message-center-table .text-button { padding:0; border:0; background:transparent; color:#1266b4; font:inherit; white-space:nowrap; cursor:pointer; }
.message-center-table .text-button:hover { text-decoration:underline; }
.message-center-table .text-button:focus-visible { outline:2px solid #1266b4; outline-offset:2px; }
.message-center-empty { padding:80px 12px !important; text-align:center; color:#748294; }
.workflow-task-detail { background:#f1f4fa; min-height:calc(100dvh - 90px); }
.message-detail-toolbar { padding:10px 14px; background:#fff; border-bottom:1px solid #dce3ed; }
.message-detail-toolbar button[hidden] { display:none; }
.message-detail-layout { display:grid; grid-template-columns:minmax(0,2fr) minmax(285px,1fr); gap:10px; padding:10px; align-items:stretch; }
.message-detail-document,.message-detail-decision { min-width:0; min-height:calc(100dvh - 165px); background:#fff; padding:12px; }
.message-detail-tabs { display:flex; align-items:center; gap:15px; border-bottom:1px solid #d7e0ec; margin-bottom:16px; }
.message-detail-tabs button { border:0; border-bottom:2px solid transparent; background:transparent; padding:8px 3px; cursor:pointer; color:#405062; white-space:nowrap; }
.message-detail-tabs button[aria-selected="true"] { color:#176bc5; border-bottom-color:#347cce; }
.message-detail-tabs strong { color:#176bc5; font-size:14px; padding:8px 0; }
.message-detail-document h2 { margin:0 0 6px; font-size:18px; }
.message-detail-document h3 { font-size:14px; margin:18px 0 10px; }
.message-detail-document p { margin:7px 0; overflow-wrap:anywhere; }
.message-detail-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px 22px; padding:12px; }
.message-detail-fields > div { display:grid; grid-template-columns:110px minmax(0,1fr); gap:8px; font-size:13px; }
.message-detail-fields dt { color:#647382; }
.message-detail-fields dd { margin:0; overflow-wrap:anywhere; }
.message-detail-document .currency-table { width:max-content; min-width:100%; table-layout:auto; }
.message-detail-document .currency-table th,.message-detail-document .currency-table td { width:auto; overflow:visible; text-overflow:clip; }
.message-detail-decision label { display:grid; gap:6px; margin:12px 0; font-size:13px; }
.message-detail-decision select,.message-detail-decision textarea { width:100%; min-width:0; padding:8px; border:1px solid #cbd5e0; border-radius:3px; font:inherit; }
.message-detail-decision textarea { min-height:130px; resize:vertical; }
.message-detail-decision .workflow-checks label { display:flex; margin:0; }
.message-detail-decision .primary-button { position:sticky; bottom:8px; width:auto; min-width:85px; margin-top:12px; }
.workflow-task-detail .workflow-flow-chart { padding:15px 0; }
@media(max-width:900px) { .message-center-layout { grid-template-columns:145px minmax(0,1fr); } .message-center-types { grid-column:1 / -1; grid-row:1; display:flex; align-items:center; gap:12px; border-bottom:1px solid #dce3ec; } .message-center-types > button { width:auto; } .message-center-nav { grid-column:1; grid-row:2; } .message-center-main { grid-column:2; grid-row:2; } .message-detail-layout { grid-template-columns:1fr; } .message-detail-document,.message-detail-decision { min-height:0; } }
@media(max-width:560px) { .message-center-layout { display:block; } .message-center-nav { flex-direction:row; overflow:auto; padding:7px; } .message-center-nav h2 { display:none; } .message-center-nav button { width:auto; flex:none; } .message-center-nav button span { display:none; } .message-center-types { padding:6px 8px; } .message-center-type-search { max-width:120px; } .message-center-main { padding:8px; } .message-center-table { max-height:calc(100dvh - 330px); } .message-center-heading h1 { font-size:16px; } .message-detail-fields { grid-template-columns:1fr; padding:6px 0; } .message-detail-tabs { gap:9px; overflow:auto; } .message-detail-toolbar { padding:8px; } }
@media(max-width:640px) { .workflow-modal { padding:8px; } .workflow-editor { height:calc(100dvh - 16px); } .workflow-editor .demand-field-grid,.workflow-business-fields,.workflow-addsign-options { grid-template-columns:1fr; } .workflow-editor .modal-header { flex-wrap:wrap; } .workflow-review-header { align-items:flex-start; } .workflow-review-actions { gap:5px; } .workflow-review-actions button,.workflow-review-actions summary { font-size:12px; padding:5px 7px; } }
/* Procurement and finance surfaces keep dropdowns outside table scrollers. */
.finance-page { min-width: 0; }
.finance-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 10px 0; }
.finance-toolbar .command-button, .finance-toolbar summary { color: #1674ce; background: #fff; border: 1px solid #d8e0e8; border-radius: 3px; min-height: 32px; padding: 5px 9px; display: inline-flex; align-items: center; gap: 4px; font-size: 13px; white-space: nowrap; cursor: pointer; }
.finance-toolbar button:disabled { color: #89939c; cursor: not-allowed; }
.finance-toolbar .command-button:hover:not(:disabled) { color: #1674ce; background: #eef6ff; border-color: #b8d4ef; }
.finance-toolbar svg { width: 15px; height: 15px; }
.finance-split { display: flex; align-items: center; }
.finance-split > button { border-radius: 3px 0 0 3px; }
.finance-split summary { border-radius: 0 3px 3px 0; border-left: 0; padding-inline: 5px; }
.finance-toolbar details { position: relative; }
.finance-toolbar summary { list-style: none; }
.finance-toolbar summary::-webkit-details-marker { display: none; }
.finance-menu { position: absolute; top: calc(100% + 4px); left: 0; z-index: 30; min-width: 200px; max-height: 360px; overflow-y: auto; background: #fff; border: 1px solid #d8e0e8; box-shadow: 0 4px 14px #0002; padding: 4px; }
.finance-menu button { display: block !important; width: 100%; text-align: left; border: 0 !important; padding: 8px !important; border-radius: 0 !important; color: #1674ce; background: #fff; font-size: 13px; }
.finance-menu button:hover { background: #eef6ff; }
.finance-filter, .finance-field-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(190px,1fr)); gap: 12px 18px; padding: 14px 0; }
.finance-field-grid label, .finance-filter label, .finance-source-picker > label { display: grid; gap: 6px; color: #58616a; font-size: 13px; min-width: 0; }
.finance-field-grid input, .finance-field-grid select, .finance-filter input, .finance-filter select { min-width: 0; width: 100%; height: 32px; border: 1px solid #d4dce4; border-radius: 3px; padding: 5px 8px; color: #21282e; background: #fff; box-sizing: border-box; }
.finance-field-grid input:read-only, .finance-editor td input:read-only { background: #f5f7f8; color: #697580; }
.finance-field-grid .finance-checkbox input { width: 18px; height: 18px; }
.finance-page .demand-pagination > div { flex-wrap: wrap; }
.finance-page .table-scroll { max-width: 100%; max-height: 60vh; overflow: auto; }
.finance-page table, .finance-editor table { width: max-content; min-width: 100%; }
.finance-page th, .finance-page td, .finance-editor th, .finance-editor td { white-space: nowrap; padding: 8px 12px; }
.finance-modal { z-index: 110; padding: 12px; box-sizing: border-box; }
body:has(#purchaseFinanceEditor:not(.hidden)) :is(#listSettingsModal, #documentLinkageModal, #universalTemplateManagerModal, #templatePersonalizationModal) { z-index: 130; }
body:has(#purchaseFinanceEditor:not(.hidden)) #universalTemplateEditorModal { z-index: 140; }
.finance-editor { display: flex; flex-direction: column; width: min(1440px,96vw); max-height: 96vh; min-width: 0; background: #fff; border-radius: 4px; padding: 0 18px 14px; box-sizing: border-box; }
.finance-editor > .finance-toolbar { flex-shrink: 0; }
.finance-editor .modal-header { flex-wrap: wrap; gap: 10px; }
.finance-editor .modal-header h2 { font-size: 18px; }
#purchaseFinanceState { color: #697580; font-size: 13px; overflow-wrap: anywhere; }
.finance-editor .sales-document-tabs { flex-wrap: wrap; flex-shrink: 0; }
.finance-editor-scroll { overflow: auto; min-height: 0; }
.finance-lines { border-top: 1px solid #dce2e8; padding-top: 10px; }
.finance-lines h3 { font-size: 15px; }
.finance-lines .table-scroll { width: 100%; max-height: 300px; overflow: auto; }
.finance-editor td input:not([type="radio"]) { width: 130px; height: 30px; padding: 4px 6px; border: 1px solid #d8e0e8; border-radius: 2px; box-sizing: border-box; }
#purchaseFinanceUpload { display: block; max-width: 100%; }
#purchaseFinanceAttachmentList { padding: 10px 0; }
#purchaseFinanceAttachmentList > div { display: flex; gap: 8px; align-items: center; }
#purchaseFinanceAttachmentList a { color: #1674ce; overflow-wrap: anywhere; }
#purchaseFinanceTotals { padding: 14px 0; font-size: 13px; overflow-wrap: anywhere; }
.finance-source-picker { width: min(850px,94vw); max-height: 90vh; overflow: auto; background: #fff; border-radius: 4px; padding: 18px; box-sizing: border-box; }
.finance-source-picker > label { margin-bottom: 16px; }
#financeImportResult { white-space: pre-wrap; overflow-wrap: anywhere; margin-top: 15px; }
.finance-print-output { display: none; }
.material-master-page .toolbar-primary, .material-master-editor .reference-master-form-toolbar { flex-wrap: wrap; overflow: visible; }
.material-master-page .reference-master-special-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 5px; }
.material-master-page .reference-master-table { width: max-content; min-width: 100%; }
.material-master-page th[data-table-column] { min-width: 150px; }
.material-master-page th[data-table-column="organizationName"], .material-master-page th[data-table-column="creationOrganization"] { min-width: 225px; }
.material-master-page th[data-table-column="materialName"], .material-master-page th[data-table-column="name"] { min-width: 300px; }
.material-master-editor .reference-master-form-panel { width: min(1120px,96vw); max-height: 94vh; overflow: auto; }
.material-master-editor { box-sizing: border-box; padding: 12px; z-index: 110; }
.material-master-editor .reference-master-form-toolbar { flex: none; padding: 8px 18px; }
.material-master-editor .reference-master-form-toolbar > .primary-button { width: auto; min-height: 32px; height: 32px; padding: 4px 12px; background: #4f82df; border-color: #4f82df; border-radius: 3px; }
.material-master-editor .command-button { display: inline-flex; align-items: center; gap: 5px; color: #286bc8; background: #fff; border: 1px solid #d8e0e8; border-radius: 3px; min-height: 32px; padding: 4px 9px; white-space: nowrap; }
.material-master-editor .command-button:hover:not(:disabled) { color: #286bc8; background: #edf4fc; }
.material-master-editor .split-caret :is(svg,i) { color: inherit; }
.material-master-editor .split-caret { padding: 0; width: 26px; min-width: 26px; }
.material-master-editor .split-caret > svg { width: 14px; height: 14px; flex: none; }
.material-master-editor .toolbar-menu .command-button { width: 100%; border: 0; justify-content: flex-start; }
.material-master-editor .modal-header, .material-master-editor .original-order-tabs { flex: none; }
.material-master-editor .modal-header h2 { font-size: 18px; }
.material-master-editor .reference-master-form-grid { flex: none; padding: 18px 24px; }
.material-master-editor .reference-master-form-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
.material-form-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.material-related-table { grid-column: 1 / -1; min-width: 0; }
.material-master-editor .field, .material-master-editor .input-wrap { min-width: 0; }
.material-master-editor input, .material-master-editor select { max-width: 100%; box-sizing: border-box; }
body:has(.material-master-editor:not(.hidden)) #referencePickerModal { z-index: 150; }
body:has(.material-master-editor:not(.hidden)) #listSettingsModal { z-index: 150; }
.material-master-editor .original-order-tabs { flex-wrap: wrap; }
.material-master-page .reference-master-list-layout.has-reference-tree {
  grid-template-columns: 220px minmax(0, 1fr);
}
.material-master-page .reference-master-tree {
  min-height: 0;
  max-height: calc(100dvh - 285px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-right: 1px solid #dfe4ea;
  background: #fff;
}
.material-tree-title {
  min-height: 38px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 12px;
  border-bottom: 1px solid #e5e8ec;
  font-size: 13px;
}
.material-tree-title svg { width: 14px; height: 14px; }
.material-category-tree-list {
  min-height: 0;
  flex: 1;
  overflow: auto;
}
.material-category-tree-row {
  min-height: 30px;
  display: grid;
  grid-template-columns: 22px minmax(0, 1fr);
  align-items: center;
  padding-left: calc(4px + var(--tree-depth, 0) * 15px);
}
.material-category-tree-row > .icon-button,
.material-category-tree-row > .tree-spacer {
  width: 22px;
  height: 28px;
  min-height: 28px;
  padding: 0;
}
.material-category-tree-list button,
.material-master-page .reference-tree-root {
  width: 100%;
  min-height: 30px;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 4px 8px 4px calc(10px + var(--tree-depth, 0) * 15px);
  border: 0;
  border-radius: 0;
  color: #252a30;
  background: #fff;
  text-align: left;
  font-size: 12px;
}
.material-category-tree-row > .material-category-tree-name {
  min-width: 0;
  padding-left: 2px;
}
.material-category-tree-list button:hover,
.material-category-tree-list button.active,
.material-master-page .reference-tree-root.active { color: #286bc8; background: #eaf2ff; }
.material-category-tree-list svg { width: 13px; height: 13px; flex: 0 0 13px; }
.material-category-tree-list span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.material-tree-include {
  min-height: 36px;
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 0 12px;
  border-top: 1px solid #e5e8ec;
  font-size: 12px;
}
.material-master-editor .reference-master-form-panel {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.material-master-editor #referenceMasterFormFields {
  min-height: 0;
  display: block;
  overflow: auto;
  padding: 14px 20px 26px;
}
.material-form-section,
.material-maker-section {
  margin-bottom: 14px;
  border-top: 1px solid #dce2e9;
  background: #fff;
}
.material-form-section > h3,
.material-maker-section > summary {
  margin: 0;
  padding: 10px 2px;
  color: #252b33;
  font-size: 14px;
  font-weight: 600;
}
.material-form-section-grid,
.material-identity {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 13px 24px;
}
.material-identity { padding-bottom: 16px; border-top: 0; }
.material-image-field {
  grid-row: span 2;
  min-height: 108px;
  display: grid;
  place-items: center;
  align-content: center;
  gap: 6px;
  border: 1px dashed #c8d1dd;
  color: #697586;
  background: #fafbfc;
}
.material-image-field svg { width: 28px; height: 28px; }
.material-image-field input { width: min(180px, 100%); font-size: 11px; }
.material-table-section .material-form-section-grid { display: block; }
.material-table-section table { width: max-content; min-width: 100%; }
.material-line-toolbar { display: flex; gap: 10px; margin-bottom: 8px; }
.material-line-toolbar button {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  min-height: 28px;
  padding: 3px 9px;
  border: 1px solid #d4dbe4;
  color: #286bc8;
  background: #fff;
}
.material-line-toolbar svg { width: 14px; height: 14px; }
.material-unit-table :is(input, select),
.material-category-standard-table select { min-width: 125px; height: 28px; border: 1px solid #d5dce5; background: #fff; }
.material-maker-section { padding-bottom: 12px; }
.material-maker-section > summary { cursor: pointer; }
.material-batch-panel { width: min(560px, calc(100vw - 28px)); }
.material-batch-panel .modal-body { display: grid; gap: 14px; padding: 20px; }
.material-form-actions-before { order: -1; }
.material-master-editor .reference-master-form-toolbar { display: flex; align-items: center; }
.material-master-editor .reference-master-form-toolbar > * { flex: 0 0 auto; }
@media (max-width: 760px) {
  .material-master-page .reference-master-list-layout.has-reference-tree { grid-template-columns: 155px minmax(0, 1fr); }
  .material-form-section-grid, .material-identity { grid-template-columns: minmax(0, 1fr); }
  .material-image-field { grid-row: auto; }
}
@media (max-width: 650px) {
  .material-master-editor .reference-master-form-grid { grid-template-columns: minmax(0,1fr); }
  .material-master-page .data-toolbar { flex-wrap: wrap; }
  .material-master-page .list-filter-strip {
    width: 100%;
    grid-template-columns: minmax(0, 1fr);
    display: grid;
    gap: 7px;
  }
  .material-master-page .list-filter-strip label {
    width: 100%;
    display: grid;
    grid-template-columns: minmax(96px, auto) minmax(0, 1fr);
  }
  .material-master-page .list-filter-strip :is(input, select) {
    width: 100%;
    min-width: 0;
  }
  .material-master-editor .modal-header h2 { font-size: 16px; overflow-wrap: anywhere; }
}
@media (max-width: 650px) {
  .finance-editor { padding-inline: 10px; }
  .finance-editor .finance-toolbar { gap: 4px; overflow: visible; }
  .finance-editor .command-button, .finance-editor summary { min-height: 30px; padding: 4px 6px; font-size: 12px; }
  .finance-field-grid, .finance-filter { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
  .finance-menu { min-width: 180px; max-width: 70vw; }
}
/* Development workspace: application list, entity outline and page properties. */
.development-platform { padding: 20px; background: #f5f7fb; min-height: calc(100vh - 130px); color: #263445; }
.dev-heading,.dev-toolbar,.dev-filter { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.dev-heading { justify-content:space-between; margin-bottom:16px; }
.dev-heading h2 { margin:6px 0; font-size:20px; }
.development-platform button { cursor:pointer; border:1px solid #dce3ed; color:#2769c5; background:#fff; border-radius:4px; padding:8px 12px; }
.development-platform button:disabled { opacity:.45; cursor:not-allowed; }
.development-platform button.active { color:#1365d6; border-color:#5d9aee; background:#edf5ff; }
.development-platform input:not([type=checkbox]),.development-platform select,.development-platform textarea { border:1px solid #ccd6e3; border-radius:3px; padding:7px; min-width:0; background:white; color:#263445; }
.development-platform input[type=checkbox] { accent-color:#2875dd; width:16px; height:16px; }
.dev-catalog-layout { display:grid; grid-template-columns:180px minmax(0,1fr); gap:20px; }
.dev-catalog-layout aside,.dev-designer aside { padding:14px; background:#fff; border:1px solid #e2e7ef; }
.dev-catalog-layout aside button { display:block; margin:8px 0; width:100%; text-align:left; }
.dev-filter { margin-bottom:14px; }
.dev-filter label { display:flex; gap:8px; align-items:center; }
.dev-catalog { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:16px; }
.dev-catalog.list { grid-template-columns:1fr; }
.dev-catalog article { padding:18px; border:1px solid #dce3ed; border-radius:5px; background:white; }
.dev-catalog article[hidden] { display:none; }
.dev-catalog h3 { margin:0 0 12px; }
.dev-catalog h3 button { border:0; font-weight:600; padding:0; }
.dev-catalog dl { display:grid; grid-template-columns:90px minmax(0,1fr); gap:10px; font-size:13px; }
.dev-catalog dt { color:#7b8797; }.dev-catalog dd { margin:0; overflow-wrap:anywhere; }
.dev-catalog footer { display:flex; gap:10px; border-top:1px solid #edf0f5; padding-top:14px; }
.dev-toolbar { padding:10px; background:#fff; border:1px solid #e0e6ee; margin-bottom:14px; gap:8px; }
.dev-designer { display:grid; grid-template-columns:190px minmax(300px,1fr) 250px; gap:12px; align-items:start; }
.dev-designer main { padding:16px; background:white; min-width:0; }
.dev-outline { max-height:65vh; overflow:auto; }.dev-outline button { display:block; width:100%; margin:4px 0; text-align:left; font-size:12px; }
.dev-designer aside > input { width:100%; box-sizing:border-box; }
.dev-outline button[hidden] { display:none; }
.dev-properties { max-height:76vh; overflow:auto; }.dev-properties > label { display:flex; flex-direction:column; gap:6px; margin:12px 0; }
.dev-properties > label.dev-check,.dev-check { display:flex; flex-direction:row; align-items:center; gap:8px; margin:8px 0; }
.dev-properties h4 { margin:16px 0 8px; }.dev-properties h3 { margin-top:0; }
.dev-preview-grid { display:grid; grid-template-columns:repeat(var(--dev-columns,3),minmax(0,1fr)); gap:12px; }
.development-platform .dev-preview-field { text-align:left; color:#34445a; min-width:0; padding:10px; }
.dev-preview-field > span { display:block; font-size:12px; }.dev-preview-field b { color:#d63b42; margin-left:4px; }
.dev-preview-value { border-bottom:1px solid #cbd7e6; padding:9px 0; margin-top:4px; color:#9ba5b4; }.dev-preview-value.locked { background:#f0f2f5; }
.dev-preview-field small { display:block; color:#7b8797; margin-top:5px; overflow-wrap:anywhere; }
.dev-scroll { max-height:70vh; overflow:auto; background:white; }.development-platform table { width:100%; border-collapse:collapse; font-size:13px; }
.development-platform th,.development-platform td { border:1px solid #e1e6ed; padding:8px 12px; white-space:nowrap; text-align:left; }
.development-platform th { background:#f1f5fb; position:sticky; top:0; z-index:1; }
.dev-options { display:grid; grid-template-columns:repeat(2,minmax(230px,1fr)); gap:24px; padding:24px; background:white; }.dev-options label { display:flex; align-items:center; gap:12px; }
.dev-code { width:100%; height:60vh; font:13px/1.7 monospace; white-space:pre; }
.dev-notice { color:#637187; font-size:13px; }.dev-field-hidden { display:none!important; }
.dev-configured-form :is(.original-order-basic-grid,.original-order-delivery-grid,.original-order-other-grid) { grid-template-columns:repeat(var(--dev-columns,4),minmax(0,1fr)); }
.originalOrder-table.dev-zebra tbody tr:nth-child(even):not(.selected) td { background:#f1f6fc; }
.originalOrder-table .dev-range-selected { background:#dcecff!important; box-shadow:inset 0 0 0 1px #68a0e7; }
@media(max-width:1000px) { .dev-designer { grid-template-columns:160px minmax(260px,1fr); }.dev-properties { grid-column:1/-1; }.dev-preview-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media print {
  body.finance-printing > :not(.finance-print-output) { display: none !important; }
  body.finance-printing .finance-print-output { display: block; }
  .finance-print-output section { break-after: page; }
}
/* Shared directory member editing */
.directory-member-editor { grid-column: 1 / -1; min-width: 0; }
.directory-actions { display: flex; gap: 20px; margin: 10px 0; }
.directory-table-scroll { overflow: auto; max-height: 380px; border: 1px solid #e3e8ef; }
.directory-table-scroll table { width: 100%; border-collapse: collapse; white-space: nowrap; }
.directory-table-scroll th, .directory-table-scroll td { padding: 8px; border-bottom: 1px solid #e3e8ef; }
.directory-table-scroll th { position: sticky; top: 0; background: #f5f8fc; z-index: 1; }
.directory-table-scroll select { min-width: 230px; max-width: 360px; }
.directory-message { color: #996000; }
.directory-role-editor { margin-top: 20px; border: 1px solid #dce3ed; background: #fff; padding: 12px; min-width: 0; }
.directory-tabs { display: flex; gap: 4px; margin-bottom: 12px; border-bottom: 1px solid #dce3ed; }
.directory-tabs button { color: #3479dc; padding: 9px 16px; border: 0; background: transparent; cursor: pointer; }
.directory-tabs button.active { color: #fff; background: #5289e8; }
.directory-role-layout { display: grid; grid-template-columns: 170px 190px minmax(320px, 1fr); gap: 0; min-height: 360px; }
.directory-role-layout nav { border-right: 1px solid #dce3ed; padding: 8px 0; overflow: auto; }
.directory-role-layout nav button { display: block; width: 100%; border: 0; background: transparent; color: #333; text-align: left; padding: 9px 14px 9px 28px; font-size: 13px; cursor: pointer; }
.directory-role-layout nav button.active { background: #e7f0ff; color: #3874d3; }
.directory-role-layout nav summary { padding: 9px 12px; font-size: 13px; cursor: pointer; }
.directory-tree-title { padding: 8px 14px; font-size: 13px; font-weight: 600; }
.directory-role-filter { display: flex; align-items: center; gap: 16px; width: 360px; max-width: 100%; padding: 5px 8px; border-bottom: 1px solid #dce3ed; }
.directory-role-filter input[type=search] { width: 170px; min-width: 0; height: 30px; border: 1px solid #dce3ed; padding: 5px 8px; }
.directory-role-filter label { display: flex; align-items: center; white-space: nowrap; font-size: 12px; color: #666; }
.directory-role-layout [data-role-content] { min-width: 0; max-height: 470px; overflow: auto; padding: 0 10px 12px; }
.directory-panel-title { color: #437bda; padding: 9px 4px; border-bottom: 2px solid #5289e8; font-size: 13px; }
.directory-empty { padding: 20px; color: #777; }
.directory-role-page { inset: 82px 0 0; padding: 0; background: #fff; }
.directory-role-page .reference-master-form-panel { width: 100%; height: 100%; max-height: 100%; border-radius: 0; }
.directory-role-page .modal-header { display: none; }
.directory-role-page .modal-header p { display: none; }
.directory-role-page .modal-header h2 { font-size: 16px; }
.directory-role-page .reference-master-form-toolbar { padding: 6px 18px; gap: 16px; background: #fff; }
.directory-role-page .reference-master-form-toolbar button { color: #3479dc; border: 0; background: transparent; min-height: 30px; width: auto; padding: 4px 8px; }
.directory-role-page .reference-master-form-toolbar button span { display: inline; }
.directory-role-page .reference-master-form-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px 40px; padding: 18px 24px; overflow: auto; }
.directory-role-page .reference-master-form-grid > label.field { display: grid; grid-template-columns: 100px minmax(0,1fr); align-items: center; gap: 8px; margin: 0; }
.directory-role-page .reference-master-form-grid .input-wrap { height: 32px; min-height: 32px; padding: 0 8px; border-radius: 0; min-width: 0; }
.directory-role-page .reference-master-form-grid > label.field.full-width { grid-column: auto; }
.directory-role-page .reference-master-form-grid > label.field > span:first-child { text-align: right; font-size: 13px; }
.directory-role-page .input-wrap input, .directory-role-page .input-wrap select { min-height: 32px; height: 32px; border-radius: 0; }
.directory-role-page .directory-role-editor { grid-column: 1/-1; padding: 0; margin: 12px -12px 0; border-top: 8px solid #edf0f5; overflow: auto; }
.directory-role-page .directory-tabs { margin-bottom: 0; }
.directory-role-page .directory-message { padding: 6px 12px; margin: 0; background: #fafbfd; }
.directory-role-layout > label { display: flex; flex-direction: column; gap: 8px; }
.directory-role-layout select { max-width: 100%; min-height: 32px; }
.directory-config-table { width: 100%; border-collapse: collapse; font-size: 13px; table-layout: auto; }
.directory-config-table th, .directory-config-table td { border: 1px solid #e1e6ed; padding: 7px; text-align: left; white-space: nowrap; height: 34px; }
.directory-config-table select { height: 28px; min-height: 28px; max-width: 340px; border: 1px solid #dce3ed; background: #fff; }
.directory-config-table th { background: #f5f7fa; font-weight: 500; }
.directory-binding-table td { padding: 0 7px; }
.directory-reference-cell { display: flex; align-items: center; min-width: 140px; width:100%; height: 30px; border: 1px solid transparent; }
.directory-reference-cell:focus-within, .directory-reference-cell:hover { border-color: #5585dd; }
.directory-multi-select { position:relative; width:100%; min-width:0; }
.directory-multi-select > summary { display:flex; align-items:center; cursor:pointer; list-style:none; }
.directory-multi-select > summary::after { content:'⌄'; color:#666; margin:0 6px; }
.directory-multi-select > summary input { width:100%; min-width:0; cursor:pointer; }
.directory-multi-options { position:absolute; top:100%; left:0; right:0; z-index:20; display:grid; gap:7px; padding:12px; background:white; border:1px solid #ddd; box-shadow:0 3px 12px #0002; }
.directory-multi-options > label { display:flex; align-items:center; gap:8px; color:#333; }
.directory-multi-options input[type=checkbox] { width:15px!important; height:15px!important; min-height:0!important; }
.stock-editor { position:fixed; inset:82px 0 0; z-index:250; background:white; display:flex; flex-direction:column; color:#333; font-size:13px; }
.stock-editor[hidden],.stock-editor [hidden],.inventory-query [hidden] { display:none!important; }
.login-tab[hidden] { display:none!important; }
.stock-toolbar,.stock-tabs,.stock-lines nav { display:flex; align-items:center; gap:12px; padding:10px 20px; border-bottom:1px solid #e5e8ef; background:#f8faff; }
.stock-toolbar button,.stock-lines nav button { color:#3475dd; border:0; background:transparent; padding:5px 8px; cursor:pointer; white-space:nowrap; }
.stock-toolbar button:disabled,.stock-lines button:disabled { color:#aaa; cursor:default; }
.stock-toolbar { gap:10px; }
.stock-toolbar>button,.stock-toolbar>.stock-split { background:#5588e6; color:white; min-height:30px; }
.stock-toolbar>.stock-split>button,.stock-toolbar>.stock-split summary { color:white; }
.stock-toolbar button:disabled { opacity:.55; color:white; }
.stock-toolbar>.stock-split details>button { color:#3475dd; }
.stock-split { display:flex; position:relative; }
.stock-split details>button { position:absolute; z-index:5; top:30px; left:0; background:white; border:1px solid #ddd; box-shadow:0 3px 12px #0002; }
.stock-split summary { color:#3475dd; cursor:pointer; padding:4px; list-style:none; }
.stock-tabs button { border:0; padding:7px 14px; background:transparent; cursor:pointer; }
.stock-tabs .active { color:#3475dd; border-bottom:2px solid #3475dd; }
.stock-body { overflow:auto; flex:1; min-height:0; }
.stock-header,.inventory-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 40px; padding:20px 32px; }
.stock-field,.inventory-fields>label { display:grid; grid-template-columns:116px minmax(0,1fr); gap:10px; align-items:center; }
.stock-field>span:first-child,.inventory-fields>label>span:first-child { text-align:right; }
.stock-field b { color:#e34242; margin-left:5px; }
.stock-input { display:flex; min-width:0; border:1px solid #d9dfe8; min-height:30px; background:white; }
.stock-input input { border:0!important; outline:0; min-width:0; width:100%; padding:5px 8px; background:transparent; }
.stock-input button { flex:none; width:28px; color:#4a78c4; background:white; border:0; border-left:1px solid #eee; cursor:pointer; }
.stock-header input,.stock-header select { min-height:30px; }
.stock-field>select { border:1px solid #d9dfe8; background:white; width:100%; }
.stock-lines { padding:8px 20px 16px; }
.stock-lines h3 { font-size:14px; margin:8px 0; }
.stock-table-scroll { overflow:auto; max-height:300px; border:1px solid #e3e7ee; }
.stock-lines table { border-collapse:collapse; width:max-content; min-width:100%; }
.stock-lines th,.stock-lines td { padding:6px; border-bottom:1px solid #e5e8ef; border-right:1px solid #eee; white-space:nowrap; }
.stock-lines th { background:#f4f6f9; position:sticky; top:0; z-index:2; min-width:115px; }
.stock-lines th:nth-child(-n+2) { min-width:28px; }
.stock-lines td .stock-input { width:165px; }
.stock-lines td:has([data-stock-line-field="materialName"]) .stock-input { width:250px; }
.stock-lines select { min-width:110px; border:1px solid #d9dfe8; min-height:30px; background:white; }
.stock-message { margin:0; min-height:32px; padding:8px 20px; color:#b13b30; border-top:1px solid #eee; }
.stock-body>section:not(.stock-header):not(.stock-lines) { padding:20px 30px; }
.stock-body dl { display:grid; grid-template-columns:100px 1fr 100px 1fr; gap:15px; }
.stock-upload { color:#3475dd; }
.inventory-query { border:1px solid #e4e8ef; margin:10px 0; background:white; }
.inventory-fields { grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px 25px; padding:16px; }
.inventory-fields>label { grid-template-columns:105px minmax(0,1fr); }
@media(max-width:900px){.inventory-fields{grid-template-columns:repeat(2,minmax(0,1fr));}.stock-toolbar{gap:4px;flex-wrap:wrap;}}
.customer-details { grid-column:1/-1; border-top:1px solid #e2e6ee; padding-top:16px; }
.customer-details [hidden] { display:none!important; }
.customer-detail-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px 40px; }
.customer-detail-fields>label { display:grid; grid-template-columns:125px minmax(0,1fr); align-items:center; gap:8px; margin:0; }
.customer-detail-fields>label>span:first-child { text-align:right; }
.customer-entry-section h3 { font-size:14px; margin:6px 0; }
.customer-entry-section nav { padding:8px 0; display:flex; gap:16px; }
.customer-entry-section nav button { border:0; color:#3475dd; background:transparent; cursor:pointer; }
.customer-entry-section table { width:max-content; min-width:100%; border-collapse:collapse; }
.customer-entry-section th,.customer-entry-section td { border:1px solid #e3e7ee; padding:6px; white-space:nowrap; }
.customer-entry-section th { background:#f6f8fb; }
.customer-entry-section .stock-input { width:175px; }
.customer-entry-section .stock-input input { min-width:0; }
.warehouse-editor-page { inset:82px 0 0; padding:0; background:#eef1f6; }
.warehouse-editor-page .reference-master-form-panel { width:100%; height:100%; max-height:100%; border-radius:0; }
.warehouse-editor-page .modal-header { display:none; }
.warehouse-editor-page .reference-master-form-toolbar { gap:10px; padding:10px 18px; background:#f8faff; }
.warehouse-editor-page .reference-master-form-toolbar button { background:#5582eb; color:white; border:0; border-radius:0; padding:5px 15px; min-height:28px; width:auto; flex:none; white-space:nowrap; font-size:13px; }
.warehouse-editor-page .reference-master-form-toolbar button span { display:inline; }
.warehouse-editor-page .reference-master-form-toolbar svg { display:none; }
.warehouse-editor-page .reference-master-form-toolbar .split-caret svg { display:block; width:12px; height:12px; }
.warehouse-form-actions { display:flex; gap:0; align-items:center; }
.warehouse-form-actions > button:not(:first-child) { margin-left:10px; }
.warehouse-form-actions details { position:relative; background:#5582eb; color:#fff; }
.warehouse-form-actions summary { list-style:none; cursor:pointer; padding:5px; }
.warehouse-form-actions details button { position:absolute; z-index:30; top:100%; left:0; white-space:nowrap; box-shadow:0 2px 6px #0002; }
.warehouse-editor-page .reference-master-form-grid { flex:1; min-height:0; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px 45px; padding:16px 24px; align-content:start; }
.warehouse-editor-page .reference-master-form-grid > label.field { display:grid; grid-template-columns:120px minmax(0,1fr); align-items:center; gap:8px; margin:0; grid-column:auto; }
.warehouse-editor-page .reference-master-form-grid > label.field[hidden] { display:none; }
.warehouse-editor-page .reference-master-form-grid > label.field > span:first-child { text-align:right; font-size:13px; }
.warehouse-editor-page .input-wrap { min-height:30px; height:30px; border-radius:0; padding:0 6px; }
.warehouse-editor-page .input-wrap:has(.kd-switch) { border:0; background:transparent; padding-left:0; }
.warehouse-editor-page .input-wrap input { height:28px; min-height:28px; }
.warehouse-editor-page .input-wrap:has(input[readonly]):not(:has(.directory-reference-cell)):not(:has(.directory-multi-select)) { background:#f5f5f5; }
.warehouse-entries { grid-column:1/-1; min-width:0; margin:28px -12px 0; border-top:8px solid #eef1f6; min-height:240px; }
.warehouse-entries nav { display:flex; align-items:center; border-bottom:1px solid #ddd; margin-bottom:16px; }
.warehouse-entries nav > span { flex:1; }
.warehouse-entries nav button { border:0; background:white; padding:12px; color:#5482cc; cursor:pointer; }
.warehouse-entries nav button.active { border-bottom:2px solid #5482cc; }
.warehouse-entries nav button:disabled { color:#aaa; cursor:default; }
.warehouse-entries table { min-width:850px; }
.warehouse-editor-page .input-wrap.directory-address-control:not(:has(.directory-reference-cell)) { display:flex; padding:0; overflow:visible; background:white; }
.directory-address-control details { position:relative; min-width:0; }
.directory-address-country { flex:0 0 70px; }
.directory-address-region { flex:1; }
.directory-address-control summary { display:flex; align-items:center; cursor:pointer; list-style:none; padding:0 7px; }
.directory-address-control summary::-webkit-details-marker { display:none; }
.directory-address-control summary:after { content:'⌄'; color:#666; }
.directory-address-control summary input { width:100%; min-width:0; padding:0; cursor:pointer; border:0; background:transparent; }
.directory-address-options { position:absolute; top:calc(100% + 5px); left:0; width:320px; padding:8px 20px; background:white; box-shadow:0 2px 8px #0003; z-index:60; font-size:13px; }
.directory-address-options button { border:0; background:white; padding:5px 7px; cursor:pointer; color:#222; font-size:13px; text-align:left; }
.directory-address-options button:hover,.directory-address-options button.active { color:#5582eb; background:#eef4ff; }
.directory-address-country .directory-address-options { width:220px; max-height:300px; overflow:auto; padding:4px 0; }
.directory-address-country .directory-address-options button { display:block; width:100%; }
.directory-address-region .directory-address-options { left:-70px; }
.directory-address-options nav { display:flex; justify-content:center; margin-bottom:12px; }
.directory-address-options nav button { width:60px; border:1px solid #ddd; text-align:center; padding:3px 0; }
.directory-address-options nav button[aria-selected="true"] { color:white; background:#5582eb; }
.directory-address-options nav button:disabled { color:#aaa; cursor:default; }
.directory-address-choices { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); min-height:260px; max-height:390px; overflow:auto; align-content:start; }
.directory-address-choices > section { grid-column:1/-1; display:grid; grid-template-columns:40px minmax(0,1fr); align-items:start; }
.directory-address-choices > section > span { padding-top:5px; color:#888; }
.directory-address-choices > section > div { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
.directory-address-choices button { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.directory-address-choices > p { grid-column:1/-1; color:#777; }
.directory-reference-cell input { width: 100%; min-width: 0; border: 0; background: transparent; outline: 0; padding: 3px 5px; font-size: 13px; text-overflow: ellipsis; }
.directory-reference-cell button { flex: none; border: 0; color: #477dcc; background: transparent; height: 26px; padding: 3px 5px; cursor: pointer; }
.directory-reference-cell button[title="F7"] { font-size:0; width:28px; position:relative; }
.directory-reference-cell button[title="F7"]::before { content:''; display:block; width:11px; height:11px; border:1px solid currentColor; border-radius:50%; position:absolute; left:7px; top:5px; }
.directory-reference-cell button[title="F7"]::after { content:''; display:block; width:6px; height:1px; background:currentColor; transform:rotate(48deg); position:absolute; left:17px; top:17px; }
.directory-reference-cell select { min-width:0; width:100%; }
.directory-reference-picker { width: min(1000px,94vw); max-height: 88vh; padding: 0; border: 1px solid #d9dde4; border-radius: 0; color: #333; font-size: 13px; box-shadow: 0 12px 40px #0003; }
.directory-reference-picker::backdrop { background: #0005; }
.directory-reference-picker header { display: flex; align-items: center; gap: 16px; padding: 12px 18px; border-bottom: 1px solid #ddd; }
.directory-reference-picker h3 { margin: 0; font-size: 16px; font-weight: 500; }
.directory-reference-picker header input { margin-left: auto; width: 240px; max-width: 55%; height: 30px; border: 1px solid #ddd; padding: 4px 10px; }
.directory-reference-picker button { cursor: pointer; }
.directory-reference-picker header button { border: 0; background: transparent; font-size: 22px; color: #999; }
.directory-reference-layout { display: grid; grid-template-columns: minmax(0,1fr); }
.directory-reference-layout.with-selection { grid-template-columns: minmax(0,1fr) 190px; }
.directory-reference-layout section { min-width: 0; }
.directory-reference-layout aside { border-left: 1px solid #ddd; padding: 8px 12px; max-height: 430px; overflow: auto; }
.directory-reference-layout aside > div { display: flex; justify-content: space-between; color: #888; }
.directory-reference-layout aside button { border: 0; background: transparent; color: #4d80d9; }
.directory-reference-layout aside ul { list-style: none; padding: 0; }
.directory-reference-layout aside li { display: flex; align-items: center; justify-content: space-between; margin: 8px 0; padding: 6px; background: #edf3ff; }
.directory-reference-pagination { display: flex; align-items: center; justify-content: flex-end; gap: 10px; padding: 6px 12px; }
.directory-reference-pagination span { margin-right: auto; color: #888; }
.directory-reference-pagination button, .directory-reference-pagination select { border: 0; background: transparent; height: 26px; }
.directory-reference-pagination button:disabled { opacity: .3; cursor: default; }
.directory-reference-scroll { overflow: auto; height: min(420px,55vh); }
.directory-reference-picker table { width: 100%; border-collapse: collapse; table-layout: auto; }
.directory-reference-picker th,.directory-reference-picker td { border-bottom: 1px solid #eee; padding: 7px 12px; text-align: left; white-space: nowrap; height: 32px; }
.directory-reference-picker th { background: #f5f5f5; position: sticky; top: 0; z-index: 1; font-weight: 500; }
.directory-reference-picker tbody button { border: 0; background: transparent; color: #3479cd; padding: 0; }
.directory-reference-picker tr.selected { background: #eaf2ff; }
.directory-reference-picker footer { display: flex; justify-content: center; gap: 12px; border-top: 1px solid #ddd; padding: 10px; }
.directory-reference-picker footer button { padding: 5px 20px; border: 1px solid #ddd; background: white; color: #666; }
.directory-reference-picker footer [data-ref-confirm] { background: #5585df; border-color: #5585df; color: white; }
.directory-reference-picker [data-ref-message] { color: #c74747; align-self: center; }
.directory-reference-layout.with-tree { grid-template-columns:180px minmax(0,1fr); }
.directory-reference-layout.with-tree.with-selection { grid-template-columns:160px minmax(0,1fr) 160px; }
.directory-reference-tree { max-height:58vh; overflow:auto; border-right:1px solid #ddd; padding:8px 0; }
.directory-reference-tree button { display:block; text-align:left; width:100%; padding:8px 12px; background:white; border:0; color:#444; }
.directory-reference-tree button.active { background:#e6f0ff; color:#2865bd; }
@media(max-width:650px) { .directory-reference-layout.with-selection { grid-template-columns: minmax(0,1fr) 130px; } }
.directory-field-picker { width: min(860px, 90vw); max-height: 82vh; overflow: auto; padding: 20px; border: 1px solid #d7e0eb; border-radius: 4px; }
.directory-field-picker::backdrop { background: #152c4d55; }
.directory-field-picker > input[type=search] { width: 100%; padding: 8px; margin: 10px 0; }
.directory-field-choices { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; max-height: 52vh; overflow: auto; }
.directory-field-choices label { display: flex; align-items: center; gap: 7px; padding: 5px; }
.directory-field-choices small { color: #708098; }
@media (max-width: 760px) { .directory-field-choices { grid-template-columns: 1fr; } .directory-role-page .reference-master-form-grid { gap: 10px 12px; padding: 12px; } .directory-role-page .reference-master-form-grid > label.field { grid-template-columns: 84px minmax(0,1fr); gap: 4px; } .directory-role-layout { grid-template-columns: 125px 155px minmax(300px,1fr); min-width: 580px; } }