:root{--ink:#1b2b24;--muted:#60736a;--line:#d9e3dd;--bg:#f4f7f5;--panel:#fff;--green:#2f6b52;--green2:#e8f2ec;--amber:#a66c1f;--red:#b7433c}
html,body{font-family:"Microsoft YaHei UI","Microsoft YaHei","PingFang SC","Noto Sans SC",Arial,sans-serif;font-size:15px;line-height:1.55;color:var(--ink);-webkit-font-smoothing:antialiased}
button,input,select,textarea{font:inherit;font-size:14px;line-height:1.4}
header{height:68px;padding:0 32px}.brand strong{font-size:15px}.brand small{font-size:11px}.nav-item{height:44px;font-size:14px}.sidebar nav p{font-size:12px;margin-top:20px}.usage div{font-size:12px}.usage small{font-size:11px}
.page{padding:30px 34px 52px}.page-head{margin-bottom:24px}.page-head h1{font-size:25px;font-weight:700;line-height:1.3}.page-head p,.panel-head p{font-size:13px;line-height:1.6}.actions{gap:9px}.primary,.secondary,.full-btn{height:40px;padding:0 16px;font-size:14px}
.metrics{gap:16px}.metrics article{padding:20px}.metrics span{font-size:13px}.metrics strong{font-size:27px;margin:13px 0 9px}.metrics p{font-size:12px}.panel{padding:20px}.panel-head h2{font-size:16px}.task-item b{font-size:14px}.task-item small,.task-item time{font-size:12px}
.tabs{gap:30px}.tabs button{font-size:14px;padding-bottom:13px}.table-tools{gap:11px}.search.compact{width:320px}.table-tools select{height:40px;font-size:14px}.table-wrap{border-radius:8px}th{font-size:12px;padding:13px 16px}td{font-size:13px;padding:15px 16px}.customer small{font-size:11px}.tag{font-size:11px;padding:4px 8px}
.settings-grid{gap:16px}.settings-grid button{padding:22px;min-height:150px}.settings-grid span{font-size:25px;margin-bottom:28px}.settings-grid b{font-size:15px}.settings-grid small{font-size:12px;line-height:1.5}
.modal{padding:24px}.modal-card{width:min(680px,calc(100vw - 48px));max-height:88vh;overflow:auto;padding:26px;border-radius:10px}.modal-head{margin-bottom:22px}.modal-head h2{font-size:20px}.modal-head p{font-size:12px}.modal label{font-size:13px}.modal input,.modal select,.modal textarea{font-size:14px;padding:10px 11px}.modal-actions{margin-top:22px}.toast{font-size:14px;padding:13px 18px}
.permission-card{width:min(1080px,calc(100vw - 48px));padding:26px}.permission-note{padding:14px 16px}.permission-note b{font-size:14px}.permission-note small{font-size:12px}.permission-head{font-size:12px}.permission-row{font-size:13px}.permission-row select{font-size:13px}.permission-user b{font-size:14px}.permission-user small{font-size:11px}.operation-picks label{font-size:12px;padding:8px 10px}
@media(max-width:900px){.page{padding:24px 20px 40px}.metrics{grid-template-columns:repeat(2,1fr)}.settings-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){header{padding:0 16px}.page{padding:20px 14px 34px}.page-head{display:block}.page-head .actions{margin-top:16px;display:flex;flex-wrap:wrap;flex-direction:row}.metrics,.settings-grid{grid-template-columns:1fr}.modal-card,.permission-card{width:calc(100vw - 24px);padding:18px}.table-tools{overflow:auto}.search.compact{min-width:260px}}
#permissionModal .permission-card{width:min(1120px,calc(100vw - 56px));max-height:90vh;padding:28px 30px;border-radius:12px}
#permissionModal .permission-head{display:none}
#permissionModal .permission-rows{display:grid;gap:14px}
#permissionModal .permission-row{display:grid;grid-template-columns:190px 260px minmax(360px,1fr)!important;gap:22px!important;align-items:start;padding:20px!important;border:1px solid #dce7e0;border-radius:10px;background:#fbfdfc;box-shadow:0 2px 8px rgba(26,57,43,.04)}
#permissionModal .permission-user{padding-top:7px}
#permissionModal .permission-user b{font-size:15px;color:#1b3327}
#permissionModal .permission-user small{display:block;margin-top:6px;color:#6a7b72;font-size:12px}
#permissionModal .permission-role-select{display:block;width:100%;height:34px;margin-top:10px;border:1px solid #d5e2da;border-radius:6px;background:#fff;padding:0 8px;font-size:12px;color:#2d4739}
#permissionModal .permission-scope{display:block}
#permissionModal .permission-scope>span{display:block;margin-bottom:8px;color:#60736a;font-size:12px;font-weight:600}
#permissionModal .permission-scope select{width:100%;height:40px;font-size:14px;border:1px solid #cfded5;border-radius:6px;background:#fff;padding:0 10px}
#permissionModal [data-owner-picks]{display:flex!important;flex-wrap:wrap;gap:7px!important;margin-top:10px!important;padding:10px;background:#f1f7f3;border:1px solid #d7e6dc;border-radius:7px}
#permissionModal [data-owner-picks]:empty{display:none!important}
#permissionModal [data-owner-picks] label{padding:6px 9px!important;border:1px solid #d5e2da;border-radius:5px;background:#fff;font-size:12px!important;color:#2d4739}
#permissionModal .operation-picks{display:flex;flex-wrap:wrap;gap:8px!important;align-content:flex-start;padding-top:7px}
#permissionModal .operation-picks label{display:inline-flex;align-items:center;min-height:36px;padding:7px 10px!important;border:1px solid #d5e2da;border-radius:6px;background:#f5faf7;font-size:12px!important;color:#2d4739}
#permissionModal .modal-actions{margin-top:24px;padding-top:18px;border-top:1px solid #e2eae5}
@media(max-width:900px){#permissionModal .permission-row{grid-template-columns:1fr!important;gap:14px!important}#permissionModal .permission-user{padding-top:0}}

/* Business dialogs use their own dimensions so generic modal styles cannot crop fields. */
#salesRecordModal.modal-underlay{background:transparent;pointer-events:none}
#salesOcrModal{z-index:72;padding:20px}
#salesOcrModal .sales-ocr-card{width:min(1060px,calc(100vw - 40px));height:min(88vh,780px);max-height:calc(100vh - 40px);overflow:hidden;padding:0;border-radius:10px;display:flex;flex-direction:column}
#salesOcrModal .sales-ocr-card>.modal-head{flex:0 0 auto;margin:0;padding:22px 26px 17px;border-bottom:1px solid #e1e8e4;background:#fff}
#salesOcrModal .sales-ocr-workspace{flex:1 1 auto;min-height:0;grid-template-columns:minmax(330px,.92fr) minmax(380px,1.08fr);gap:18px;overflow:auto;padding:20px 26px 16px;background:#fff}
#salesOcrModal .sales-ocr-preview{min-height:320px;margin-top:12px}
#salesOcrModal .sales-ocr-preview img{height:350px}
#salesOcrModal .sales-ocr-status,#salesOcrModal .sales-ocr-unresolved{min-height:116px;padding:17px}
#salesOcrModal .sales-ocr-integration{flex:0 0 auto;grid-template-columns:minmax(310px,.82fr) minmax(0,1.18fr);gap:14px;margin:0;padding:0 26px 16px;background:#fff}
#salesOcrModal .sales-ocr-guide{max-height:124px}
#salesOcrModal .sales-ocr-guide ol{max-height:75px;overflow:auto;margin:8px 12px}
#salesOcrModal .sales-ocr-guide-actions{padding:0 12px 9px}
#salesOcrModal .modal-actions{flex:0 0 auto;margin:0;padding:14px 26px;border-top:1px solid #e1e8e4;background:#fff;box-shadow:0 -5px 14px rgba(24,54,40,.05)}
#purchaseOrderModal .purchase-card{width:min(1100px,calc(100vw - 40px));max-height:calc(100vh - 40px);padding:26px 28px;border-radius:10px}
#purchaseOrderModal .purchase-form{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:18px;background:#f4f8f5}
#purchaseOrderModal .purchase-form>label{display:grid;gap:6px;margin:0;color:#53645b;font-size:12px;font-weight:650}
#purchaseOrderModal .purchase-form input,#purchaseOrderModal .purchase-form select{width:100%;height:40px;margin:0;padding:0 11px;font-size:14px}
#purchaseOrderModal .purchase-form button{grid-column:1/-1;justify-self:end;min-width:140px}
#purchaseOrderModal .purchase-summary{margin:18px 0 14px}
@media(max-width:760px){#salesOcrModal{padding:12px}#salesOcrModal .sales-ocr-card{width:calc(100vw - 24px);height:calc(100vh - 24px);max-height:calc(100vh - 24px)}#salesOcrModal .sales-ocr-card>.modal-head{padding:16px 18px 13px}#salesOcrModal .sales-ocr-workspace{grid-template-columns:1fr;gap:12px;padding:14px 18px 12px}#salesOcrModal .sales-ocr-preview{min-height:190px}#salesOcrModal .sales-ocr-preview img{height:230px}#salesOcrModal .sales-ocr-integration{grid-template-columns:1fr;padding:0 18px 12px}#salesOcrModal .modal-actions{padding:12px 18px}#salesOcrModal .modal-actions button{flex:1;padding:0 10px}#purchaseOrderModal .purchase-card{width:calc(100vw - 24px);padding:20px 18px}#purchaseOrderModal .purchase-form{grid-template-columns:1fr;padding:14px}#purchaseOrderModal .purchase-form button{width:100%;justify-self:stretch}}

/* Override legacy purchase-form child rules: labels are field wrappers, not inputs. */
#purchaseOrderModal .purchase-form > label {
  display: block;
  min-width: 0;
  height: auto;
  min-height: 72px;
  border: 0;
  border-radius: 0;
  background: transparent;
  padding: 0;
  color: #53645b;
  font-size: 12px;
  font-weight: 650;
}
#purchaseOrderModal .purchase-form > label > input,
#purchaseOrderModal .purchase-form > label > select {
  display: block;
  width: 100%;
  height: 40px;
  min-width: 0;
  margin-top: 6px;
  padding: 0 11px;
  border: 1px solid #d6e1db;
  border-radius: 5px;
  background: #fff;
  color: #1b2b24;
}
#purchaseOrderModal .purchase-form > button.primary {
  grid-column: 1 / -1;
  height: 40px;
  min-width: 140px;
  justify-self: end;
  border: 1px solid #2f6b52;
  border-radius: 5px;
  background: #2f6b52;
  color: #fff;
  padding: 0 16px;
  cursor: pointer;
}
@media(max-width:760px){
  #purchaseOrderModal .purchase-form > label { min-height: 0; }
  #purchaseOrderModal .purchase-form > button.primary { width: 100%; justify-self: stretch; }
}

/* Organization settings has five live fields per member. Keep that business grid
   independent from the generic dialog width and let only the member list scroll. */
#orgModal { padding: 16px; overflow: hidden; }
#orgModal .org-card {
  width: min(1080px, calc(100vw - 32px));
  max-height: calc(100dvh - 32px);
  height: min(1040px, calc(100dvh - 32px));
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
}
#orgModal .modal-head,
#orgModal .org-overview,
#orgModal .org-section,
#orgModal .org-actions { min-width: 0; }
#orgModal .modal-head,
#orgModal .org-overview,
#orgModal .org-section:not(.members),
#orgModal .org-safety-note,
#orgModal .org-actions { flex: 0 0 auto; }
#orgModal .org-section { padding-left: 22px; padding-right: 22px; }
#orgModal .org-section.members {
  display: flex;
  min-height: 0;
  flex: 1 1 auto;
  flex-direction: column;
}
#orgModal .org-member-columns,
#orgModal .org-member {
  display: grid;
  grid-template-columns: minmax(170px, 1.35fr) minmax(120px, .9fr) minmax(120px, .9fr) minmax(132px, 1fr) 34px;
  gap: 10px;
  min-width: 0;
}
#orgModal .org-member-columns > *,
#orgModal .org-member > * { min-width: 0; }
#orgModal .org-members {
  min-width: 0;
  max-height: none;
  flex: 1 1 auto;
  overflow-x: hidden;
  overflow-y: auto;
}
#orgModal .org-member select,
#orgModal .org-member > input,
#orgModal .org-member .org-role-input { width: 100%; min-width: 0; }
#orgModal .org-password-action {
  display: grid;
  min-width: 0;
  gap: 3px;
}
#orgModal .org-password-action button {
  width: max-content;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
#orgModal .org-actions { flex: 0 0 auto; }
@media(max-width:1100px){
  #orgModal .org-card { width: min(760px, calc(100vw - 24px)); }
  #orgModal .org-member-columns { display: none; }
  #orgModal .org-member-add { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  #orgModal .org-member-add button { grid-column: 1 / -1; justify-self: start; }
  #orgModal .org-member {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 9px 12px;
  }
  #orgModal .org-member > div:first-child { grid-column: 1 / -1; }
  #orgModal .org-member-delete { justify-self: end; }
}
@media(max-width:620px){
  #orgModal { padding: 10px; }
  #orgModal .org-card { width: calc(100vw - 20px); max-height: calc(100dvh - 20px); height: calc(100dvh - 20px); }
  #orgModal .modal-head,
  #orgModal .org-section,
  #orgModal .org-actions { padding-left: 16px; padding-right: 16px; }
  #orgModal .org-overview { grid-template-columns: 1fr 1fr; }
  #orgModal .org-member-add,
  #orgModal .org-member { grid-template-columns: minmax(0, 1fr); }
  #orgModal .org-member > div:first-child { grid-column: auto; }
  #orgModal .org-member-search { width: 100%; }
}

/* Organization modal v3: keep the header and actions visible while the member list scrolls. */
#orgModal {
  align-items: center;
  justify-content: center;
  padding: 12px;
}
#orgModal .org-card {
  width: min(1180px, calc(100vw - 24px));
  height: min(960px, calc(100dvh - 24px));
  max-height: calc(100dvh - 24px);
  border-radius: 12px;
  box-shadow: 0 24px 70px rgba(21, 44, 32, .24);
}
#orgModal .org-card > .modal-head {
  padding: 22px 28px 16px;
}
#orgModal .org-card > .modal-head h2 { font-size: 22px; line-height: 1.25; }
#orgModal .org-card > .modal-head p { font-size: 12px; }
#orgModal .org-overview article { padding: 15px 22px; }
#orgModal .org-overview span { font-size: 11px; }
#orgModal .org-overview b { font-size: 23px; }
#orgModal .org-section { padding: 19px 28px; }
#orgModal .org-section.members { padding-bottom: 14px; }
#orgModal .org-member-columns,
#orgModal .org-member {
  grid-template-columns: minmax(250px, 1.5fr) minmax(180px, 1fr) minmax(180px, 1fr) minmax(160px, .9fr) 34px;
  gap: 14px;
}
#orgModal .org-member-columns { padding-left: 14px; padding-right: 14px; font-size: 11px; }
#orgModal .org-member { min-height: 72px; padding: 12px 14px; }
#orgModal .org-member b { font-size: 13px; }
#orgModal .org-member .org-role-input { height: 30px; margin-top: 4px; font-size: 12px; }
#orgModal .org-member select,
#orgModal .org-member > input { height: 40px; font-size: 13px; padding-left: 10px; padding-right: 10px; }
#orgModal .org-password-action button { height: 36px; font-size: 12px; }
#orgModal .org-password-action small { font-size: 10px; }
#orgModal .org-safety-note { margin: 16px 28px 0; font-size: 11px; }
#orgModal .org-actions { padding: 16px 28px 20px; }
#orgModal .org-actions > span { font-size: 11px; }
@media (max-width: 1000px) {
  #orgModal .org-card { width: min(900px, calc(100vw - 24px)); }
  #orgModal .org-member-columns { display: none; }
  #orgModal .org-member {
    grid-template-columns: minmax(0, 1fr) minmax(170px, 1fr);
    gap: 10px 14px;
  }
  #orgModal .org-member > div:first-child { grid-column: 1 / -1; }
  #orgModal .org-member-delete { justify-self: end; }
  #orgModal .org-section,
  #orgModal .org-card > .modal-head,
  #orgModal .org-actions { padding-left: 20px; padding-right: 20px; }
  #orgModal .org-safety-note { margin-left: 20px; margin-right: 20px; }
}
@media (max-width: 620px) {
  #orgModal { padding: 8px; }
  #orgModal .org-card {
    width: calc(100vw - 16px);
    height: calc(100dvh - 16px);
    max-height: calc(100dvh - 16px);
    border-radius: 10px;
  }
  #orgModal .org-card > .modal-head { padding: 17px 16px 13px; }
  #orgModal .org-card > .modal-head h2 { font-size: 19px; }
  #orgModal .org-overview article { padding: 12px 14px; }
  #orgModal .org-section,
  #orgModal .org-actions { padding-left: 16px; padding-right: 16px; }
  #orgModal .org-member-add,
  #orgModal .org-member { grid-template-columns: minmax(0, 1fr); }
  #orgModal .org-member > div:first-child { grid-column: auto; }
  #orgModal .org-safety-note { margin-left: 16px; margin-right: 16px; }
  #orgModal .org-actions { gap: 9px; }
  #orgModal .org-actions button { min-width: 0; flex: 1 1 0; }
}

/* Sales catalog: keep relation selectors in the same visible row. */
#salesCatalogModal { padding: 16px; }
#salesCatalogModal .catalog-card {
  width: min(660px, calc(100vw - 32px));
  border-radius: 8px;
  padding: 18px 18px 14px;
}
#salesCatalogModal .catalog-card .modal-head h2 { font-size: 18px; color: #18241e; margin: 0; }
#salesCatalogModal .catalog-card .modal-head p { color: #76837c; font-size: 12px; margin-top: 6px; }
#salesCatalogModal .catalog-tabs { gap: 8px; margin: 8px 0 14px; }
#salesCatalogModal .catalog-tabs button { min-width: 66px; padding: 10px 14px; border-radius: 7px 7px 0 0; }
#salesCatalogModal .catalog-tabs button.active { border: 1px solid #2d7658; border-bottom: 2px solid #fff; background: #f7fbf8; color: #236447; }
#salesCatalogModal .catalog-add { grid-template-columns: 1fr 74px; gap: 10px; }
#salesCatalogModal .catalog-add > input, #salesCatalogModal .catalog-add > select { height: 38px; }
#salesCatalogModal .catalog-add > button { width: 74px; border-radius: 7px; }
#salesCatalogModal .catalog-list { max-height: 390px; margin-top: 12px; }
#salesCatalogModal .catalog-flat-editor .catalog-row { min-height: 42px; border: 1px solid #e1e8e4; border-radius: 7px; padding: 6px 10px; background: #fff; }
#salesCatalogModal .catalog-flat-editor .catalog-row + .catalog-row { margin-top: 8px; }
#salesCatalogModal .catalog-flat-editor .catalog-row > input { border: 0; background: transparent; font-size: 14px; }
#salesCatalogModal .catalog-flat-editor .catalog-row > span:first-child { font-size: 12px; }
  width: min(980px, calc(100vw - 32px));
  height: min(760px, calc(100vh - 32px));
  max-height: calc(100vh - 32px);
  padding: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
#salesCatalogModal .catalog-card > .modal-head {
  flex: 0 0 auto;
  margin: 0;
  padding: 24px 28px 16px;
  border-bottom: 1px solid #e4eae6;
}
#salesCatalogModal .catalog-tabs {
  flex: 0 0 auto;
  margin: 0;
  padding: 0 28px;
  gap: 8px;
  overflow-x: auto;
  white-space: nowrap;
}
#salesCatalogModal .catalog-tabs button { padding: 12px 16px 11px; }
#salesCatalogModal .catalog-add {
  flex: 0 0 auto;
  display: grid;
  grid-template-columns: minmax(150px, 0.85fr) minmax(150px, 0.85fr) minmax(0, 1fr) 112px;
  gap: 10px;
  align-items: end;
  padding: 16px 28px 0;
}
#salesCatalogModal .catalog-add > input { min-width: 0; }
#salesCatalogModal .catalog-add > button { width: 100%; }
#salesCatalogModal .catalog-add > select[hidden] { display: none; }
#salesCatalogModal .catalog-list {
  flex: 1 1 auto;
  min-height: 0;
  max-height: none;
  margin: 14px 0 0;
  padding: 0 28px 14px;
  overflow-y: auto;
  overflow-x: hidden;
}

/* Five-level catalog tree */
#salesCatalogModal .catalog-tree { margin: 12px 0 16px; padding: 10px 12px; border: 1px solid #e1e8e4; border-radius: 6px; background: #fbfcfb; max-height: 300px; overflow: auto; }
#salesCatalogModal .catalog-tree-node { min-height: 34px; display: flex; align-items: center; gap: 7px; padding: 4px 6px; border-bottom: 1px solid #eef2ef; cursor: pointer; }
#salesCatalogModal .catalog-tree-node:hover { background: #eef7f1; }
#salesCatalogModal .catalog-tree-node.depth-1 { padding-left: 28px; }
#salesCatalogModal .catalog-tree-node.depth-2 { padding-left: 50px; }
#salesCatalogModal .catalog-tree-node.depth-3 { padding-left: 72px; }
#salesCatalogModal .catalog-tree-node.depth-4 { padding-left: 94px; }
#salesCatalogModal .catalog-tree-toggle { width: 18px; border: 0; background: transparent; color: #4b8067; font-size: 15px; cursor: pointer; }
#salesCatalogModal .catalog-tree-label { flex: 1; display: flex; gap: 8px; align-items: center; color: #26332d; }
#salesCatalogModal .catalog-tree-label b { min-width: 34px; color: #718078; font-size: 11px; font-weight: 600; }
#salesCatalogModal .catalog-tree-edit { border: 0; background: transparent; color: #39745b; font-size: 12px; cursor: pointer; }
#salesCatalogModal .catalog-tree-children { display: block; }
#salesCatalogModal .catalog-flat-editor { border-top: 1px dashed #dfe7e2; padding-top: 8px; }
#salesCatalogModal .catalog-tabs { display: flex; }
#salesCatalogModal .catalog-center-layout { display: grid !important; }
#salesCatalogModal .catalog-tree-pane, #salesCatalogModal .catalog-detail-pane { display: block !important; }
#salesCatalogModal .catalog-flat-editor { display: none !important; }
#salesCatalogModal .catalog-flat-editor .catalog-row { display: grid; grid-template-columns: 30px minmax(140px, 1fr) auto 34px; align-items: center; gap: 8px; }
#salesCatalogModal .catalog-flat-editor .catalog-row.type-brand { grid-template-columns: 30px minmax(120px, 1fr) 150px 150px auto 34px; }
#salesCatalogModal .catalog-flat-editor .catalog-row.product { grid-template-columns: 30px minmax(140px, 1fr) 150px auto 34px; }
#salesCatalogModal .catalog-flat-editor .catalog-row-actions { grid-column: auto; }
#salesCatalogModal .catalog-flat-editor .catalog-row > button[data-remove-catalog] { display: none; }
#salesCatalogModal .catalog-flat-editor .catalog-row { grid-template-columns: 28px minmax(120px, 1fr) 150px minmax(235px, auto); }
#salesCatalogModal .catalog-flat-editor .catalog-row.type-brand { grid-template-columns: 28px minmax(120px, 1fr) 140px 140px minmax(235px, auto); }
#salesCatalogModal .catalog-flat-editor .catalog-row.product { grid-template-columns: 28px minmax(120px, 1fr) 150px minmax(235px, auto); }
#salesCatalogModal .catalog-row-actions { overflow: visible; }
#salesCatalogModal .catalog-center-layout { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(220px, .65fr); gap: 16px; margin: 14px 0 18px; }
#salesCatalogModal .catalog-tree-pane, #salesCatalogModal .catalog-detail-pane { min-width: 0; }
#salesCatalogModal .catalog-pane-title { font-size: 12px; font-weight: 700; color: #496256; margin: 0 0 7px; }
#salesCatalogModal .catalog-detail-card { min-height: 150px; border: 1px solid #e1e8e4; border-radius: 6px; padding: 16px; display: flex; flex-direction: column; gap: 9px; background: #fff; }
#salesCatalogModal .catalog-detail-card b { color: #718078; font-size: 11px; }
#salesCatalogModal .catalog-detail-card strong { font-size: 18px; color: #24352c; }
#salesCatalogModal .catalog-detail-card small, #salesCatalogModal .catalog-detail-card span { color: #78857f; font-size: 12px; line-height: 1.5; }
@media (max-width: 700px) { #salesCatalogModal .catalog-center-layout { grid-template-columns: 1fr; } }
#salesCatalogModal .catalog-row {
  min-height: 44px;
  grid-template-columns: 32px minmax(0, 1fr) 32px;
  gap: 8px;
}
#salesCatalogModal .catalog-row.bound {
  grid-template-columns: 32px minmax(0, 1fr) minmax(150px, 190px) 32px;
}
#salesCatalogModal .catalog-row.type-brand {
  grid-template-columns: 32px minmax(220px, 1fr) minmax(130px, 170px) minmax(130px, 170px) 32px;
}
#salesCatalogModal .catalog-row.product {
  grid-template-columns: 32px minmax(220px, 1fr) minmax(190px, 280px) 32px;
}
#salesCatalogModal .catalog-row > input,
#salesCatalogModal .catalog-row > select { min-width: 0; width: 100%; }
#salesCatalogModal .catalog-row > button { width: 32px; height: 32px; }
#salesCatalogModal .catalog-row-actions { display:flex; align-items:center; justify-content:flex-end; gap:6px; white-space:nowrap; }
#salesCatalogModal .catalog-row-actions em { background:#edf6f0; color:#39745b; border-radius:12px; padding:4px 8px; font-size:11px; font-style:normal; }
#salesCatalogModal .catalog-row-actions button { border:1px solid #d7e1db; border-radius:6px; background:#fff; color:#365547; font-size:12px; padding:5px 8px; width:auto; height:auto; }
#salesCatalogModal .catalog-row-actions button:last-child { color:#b74b42; }
#salesCatalogModal .catalog-endpoint {
  flex: 0 0 auto;
  margin: 0 28px;
  padding: 14px 0 0;
}
#salesCatalogModal .modal-actions {
  flex: 0 0 auto;
  margin: 0;
  padding: 14px 28px 20px;
  border-top: 1px solid #e4eae6;
  background: #fff;
}
@media (max-width: 820px) {
  #salesCatalogModal .catalog-add {
    grid-template-columns: minmax(140px, 1fr) minmax(140px, 1fr);
  }
  #salesCatalogModal .catalog-add > input,
  #salesCatalogModal .catalog-add > button { grid-column: 1 / -1; }
  #salesCatalogModal .catalog-row.type-brand {
    grid-template-columns: 30px minmax(170px, 1fr) minmax(120px, 150px) 30px;
  }
  #salesCatalogModal .catalog-row.type-brand > input { grid-column: 2; }
  #salesCatalogModal .catalog-row.type-brand > select:first-of-type { grid-column: 3; }
  #salesCatalogModal .catalog-row.type-brand > select:last-of-type { grid-column: 2; grid-row: 2; }
  #salesCatalogModal .catalog-row.type-brand > button { grid-column: 4; grid-row: 1; }
  #salesCatalogModal .catalog-row.product {
    grid-template-columns: 30px minmax(0, 1fr) minmax(160px, 210px) 30px;
  }
}
@media (max-width: 620px) {
  #salesCatalogModal { padding: 8px; }
  #salesCatalogModal .catalog-card {
    width: calc(100vw - 16px);
    height: calc(100dvh - 16px);
    max-height: calc(100dvh - 16px);
    border-radius: 10px;
  }
  #salesCatalogModal .catalog-card > .modal-head { padding: 18px 16px 13px; }
  #salesCatalogModal .catalog-tabs { padding: 0 16px; }
  #salesCatalogModal .catalog-add { padding: 12px 16px 0; }
  #salesCatalogModal .catalog-list { padding: 0 16px 12px; }
  #salesCatalogModal .catalog-row,
  #salesCatalogModal .catalog-row.bound,
  #salesCatalogModal .catalog-row.type-brand,
  #salesCatalogModal .catalog-row.product {
    grid-template-columns: 28px minmax(0, 1fr) 30px;
  }
  #salesCatalogModal .catalog-row.type-brand > input,
  #salesCatalogModal .catalog-row.type-brand > select:first-of-type,
  #salesCatalogModal .catalog-row.type-brand > select:last-of-type,
  #salesCatalogModal .catalog-row.product > input,
  #salesCatalogModal .catalog-row.product > select {
    grid-column: 2;
    grid-row: auto;
  }
  #salesCatalogModal .catalog-row.type-brand > button,
  #salesCatalogModal .catalog-row.product > button { grid-column: 3; grid-row: 1; }
  #salesCatalogModal .catalog-endpoint { margin: 0 16px; }
  #salesCatalogModal .modal-actions { padding: 12px 16px 16px; }
  #salesCatalogModal .modal-actions button { flex: 1 1 0; min-width: 0; }
}