/* iOS-style theme layer (loaded last, overrides the legacy look) */
:root {
  --ios-blue: #007AFF;
  --ios-blue-deep: #0062CC;
  --ios-red: #FF3B30;
  --ios-green: #34C759;
  --ios-bg: #F2F2F7;
  --ios-card: #FFFFFF;
  --ios-fill: #EFEFF4;
  --ios-fill-strong: #E5E5EA;
  --ios-sep: #E5E5EA;
  --ios-label: #1C1C1E;
  --ios-secondary: #8E8E93;
  --ios-radius: 14px;
  --ios-radius-sm: 10px;
}

html body {
  background: var(--ios-bg) !important;
  color: var(--ios-label);
  font-family: -apple-system, "SF Pro Text", "SF Pro Display", "Helvetica Neue", "PingFang SC", "Microsoft YaHei", Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}

/* ---------- shell ---------- */
html body .shell > aside {
  background: var(--ios-card) !important;
  border-right: 1px solid var(--ios-sep) !important;
}
html body .shell > aside nav button {
  border-radius: 10px !important;
  color: var(--ios-label) !important;
  font-weight: 500 !important;
}
html body .shell > aside nav button.active {
  background: var(--ios-fill) !important;
  color: var(--ios-label) !important;
  font-weight: 600 !important;
}
html body .brand > div {
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
}

/* ---------- page headers ---------- */
html body h1 {
  font-size: 26px !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  color: var(--ios-label) !important;
}
html body .breadcrumb { color: var(--ios-secondary) !important; }
html body .private {
  background: var(--ios-fill) !important;
  border: 0 !important;
  border-radius: 999px !important;
  color: var(--ios-secondary) !important;
  font-weight: 500 !important;
}

/* ---------- cards / panels ---------- */
html body .panel {
  background: var(--ios-card) !important;
  border: 1px solid var(--ios-sep) !important;
  border-radius: var(--ios-radius) !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .04) !important;
}
html body .paneltitle {
  border-bottom: 1px solid var(--ios-sep) !important;
  padding-bottom: 12px !important;
}
html body .paneltitle h2 {
  font-size: 20px !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
}

/* ---------- buttons ---------- */
html body button.primary,
html body button[data-function-color="save"] {
  background: var(--ios-blue) !important;
  border: 0 !important;
  color: #fff !important;
  border-radius: 12px !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}
html body button.primary:hover,
html body button[data-function-color="save"]:hover { background: var(--ios-blue-deep) !important; }

html body button.secondary,
html body button.quiet,
html body button[data-function-color="edit"],
html body button[data-function-color="move"],
html body button[data-function-color="excel"],
html body button[data-function-color="upload"] {
  background: var(--ios-fill) !important;
  border: 0 !important;
  color: var(--ios-blue) !important;
  border-radius: 12px !important;
  font-weight: 600 !important;
}
html body button.secondary:hover { background: var(--ios-fill-strong) !important; }

html body button[data-function-color="delete"],
html body .customerdeletebtn {
  background: transparent !important;
  border: 0 !important;
  color: var(--ios-red) !important;
  font-weight: 600 !important;
}
html body button[data-function-color="delete"]:hover { background: rgba(255, 59, 48, .08) !important; }

/* keep the round close / back buttons */
html body button[data-act="close"][data-act][data-act],
html body button[data-act="back"][data-act][data-act] {
  background: var(--ios-red) !important;
  border: 0 !important;
}

/* ---------- segmented tabs ---------- */
html body .subtabs,
html body .inboundtabs,
html body .fileviewbuttons {
  background: var(--ios-fill) !important;
  border: 0 !important;
  border-radius: 10px !important;
  padding: 2px !important;
  gap: 2px !important;
}
html body .subtabs button,
html body .inboundtabs button,
html body .fileviewbuttons button {
  background: transparent !important;
  border: 0 !important;
  color: var(--ios-label) !important;
  border-radius: 8px !important;
  font-weight: 600 !important;
}
html body .subtabs button.active,
html body .inboundtabs button.active,
html body .fileviewbuttons button.active {
  background: var(--ios-card) !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, .12) !important;
}

/* ---------- tables: hairline separators, no grid ---------- */
html body table thead th {
  background: var(--ios-card) !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ios-sep) !important;
  color: var(--ios-secondary) !important;
  font-weight: 600 !important;
  font-size: 12px !important;
  letter-spacing: .01em !important;
}
html body table tbody td {
  background: var(--ios-card) !important;
  border: 0 !important;
  border-bottom: 1px solid #F2F2F7 !important;
  color: var(--ios-label) !important;
}
html body table tbody tr:hover > td { background: #F7F7FA !important; }
html body .tablewrap,
html body .sitablewrap,
html body .customertablearea { border-radius: var(--ios-radius) !important; }

/* toolbars */
html body .toolbar.standardtoolbar { background: transparent !important; border: 0 !important; }

/* ---- iOS palette for the legacy function-colour system ---- */
:root{--function-bg:#EFEFF4;--function-fg:#007AFF;--function-border:transparent}
[data-function-color="save"]{--function-bg:#007AFF;--function-fg:#FFFFFF;--function-border:transparent}
[data-function-color="pdf"]{--function-bg:#EAF3FF;--function-fg:#007AFF;--function-border:transparent}
[data-function-color="excel"]{--function-bg:#EAF7EF;--function-fg:#1C8F4A;--function-border:transparent}
[data-function-color="delete"]{--function-bg:transparent;--function-fg:#FF3B30;--function-border:transparent}
[data-function-color="edit"],[data-function-color="move"],[data-function-color="upload"],[data-function-color="back"]{--function-bg:#EFEFF4;--function-fg:#007AFF;--function-border:transparent}
[data-function-color]{border-radius:12px!important}
html body button.primary,html body button.pricemanual,html body button.pricelinked,html body button.priceagent{background:#007AFF!important;color:#fff!important;border:0!important;border-radius:12px!important;font-weight:600!important}
html body button.primary:hover{background:#0062CC!important}
html body input:not([type="checkbox"]):not([type="radio"]),html body select,html body textarea{background:#fff!important;border:1px solid #E5E5EA!important;border-radius:10px!important;box-shadow:none!important;font-size:14px!important;color:#1C1C1E!important}
html body input:focus,html body select:focus,html body textarea:focus{border-color:#007AFF!important;box-shadow:0 0 0 3px rgba(0,122,255,.15)!important;outline:none!important}
html body table tbody td{padding-top:13px!important;padding-bottom:13px!important}
html body aside nav button{height:40px!important;min-height:40px!important;border-radius:12px!important;font-size:15px!important}
html body .shell>aside{padding-left:8px!important;padding-right:8px!important}
html body .sisectiontitle h3,html body .orderdetailtitle h2{font-weight:700!important;letter-spacing:-.01em!important}

/* ---- iOS palette, high specificity ---- */
html body :root,html body{--function-bg:#EFEFF4;--function-fg:#007AFF;--function-border:transparent}
html body [data-function-color="save"]{--function-bg:#007AFF!important;--function-fg:#FFFFFF!important;--function-border:#007AFF!important}
html body [data-function-color="pdf"]{--function-bg:#EAF3FF!important;--function-fg:#007AFF!important;--function-border:transparent!important}
html body [data-function-color="excel"]{--function-bg:#EAF7EF!important;--function-fg:#1C8F4A!important;--function-border:transparent!important}
html body [data-function-color="delete"]{--function-bg:transparent!important;--function-fg:#FF3B30!important;--function-border:transparent!important}
html body [data-function-color="edit"],html body [data-function-color="move"],html body [data-function-color="upload"],html body [data-function-color="back"]{--function-bg:#EFEFF4!important;--function-fg:#007AFF!important;--function-border:transparent!important}

/* ---- iOS palette: wins over the legacy theme selector ---- */
html body [data-function-color="save"][data-function-color]{--function-bg:#007AFF!important;--function-fg:#FFFFFF!important;--function-border:#007AFF!important}
html body [data-function-color="pdf"][data-function-color]{--function-bg:#EAF3FF!important;--function-fg:#007AFF!important;--function-border:transparent!important}
html body [data-function-color="excel"][data-function-color]{--function-bg:#EAF7EF!important;--function-fg:#1C8F4A!important;--function-border:transparent!important}
html body [data-function-color="delete"][data-function-color]{--function-bg:transparent!important;--function-fg:#FF3B30!important;--function-border:transparent!important}
html body [data-function-color="edit"][data-function-color],html body [data-function-color="move"][data-function-color],html body [data-function-color="upload"][data-function-color],html body [data-function-color="back"][data-function-color]{--function-bg:#EFEFF4!important;--function-fg:#007AFF!important;--function-border:transparent!important}
html body button.primary[class]{background:#007AFF!important;color:#fff!important;border:0!important;border-radius:12px!important;font-weight:600!important}
html body button.primary[class]:hover{background:#0062CC!important}
html body button.secondary[class],html body button.quiet[class]{background:#EFEFF4!important;color:#007AFF!important;border:0!important;border-radius:12px!important;font-weight:600!important}
html body button.secondary[class]:hover{background:#E5E5EA!important}

/* ---- iOS: save buttons and pressed segments are blue ---- */
html body button[data-function-color="save"][class]{background:#007AFF!important;color:#fff!important;border:0!important;border-radius:12px!important;font-weight:600!important}
html body button[data-function-color="save"][class]:hover{background:#0062CC!important}
html body .orderpricemodes button[aria-pressed="true"]{background:#007AFF!important;color:#fff!important;border:0!important;border-radius:999px!important}
html body .orderpricemodes button{border-radius:999px!important;background:#EFEFF4!important;color:#007AFF!important;border:0!important}
html body .subtabs button,html body .fileviewbuttons button{border-radius:999px!important}
html body .subtabs button.active,html body .fileviewbuttons button.active{background:#fff!important;color:#1C1C1E!important}

/* ---- iOS: purge the legacy green/teal accents ---- */
html body .rowactionsbtn{background:#EFEFF4!important;color:#007AFF!important;border:0!important;border-radius:12px!important;font-weight:600!important}
html body .rowactionsbtn[aria-expanded="true"]{background:#E5E5EA!important}
html body .rowactionslist{background:#fff!important;border:1px solid #E5E5EA!important;border-radius:14px!important;box-shadow:0 12px 30px rgba(0,0,0,.12)!important}
html body .rowactionslist button{color:#007AFF!important;border-radius:10px!important;background:transparent!important}
html body .rowactionslist button:hover{background:#F2F2F7!important}
html body .rowactionslist button[data-function-color="delete"]{color:#FF3B30!important}
html body .private{background:#E9E9EE!important;color:#6B6B70!important;border:0!important}
html body .workspacepagetabs{background:#E9E9EE!important;border-radius:12px!important;padding:3px!important;gap:3px!important}
html body .workspacepagetabs button,html body .workspacepagetab{background:transparent!important;border:0!important;color:#6B6B70!important;border-radius:9px!important;font-weight:600!important}
html body .workspacepagetabs button.active,html body .workspacepagetab.active{background:#fff!important;color:#1C1C1E!important;box-shadow:0 1px 2px rgba(0,0,0,.10)!important}
html body .workspacepagetab .workspaceclose{color:#8E8E93!important}
html body .languageswitcher{background:#E9E9EE!important;border-radius:999px!important;padding:2px!important;border:0!important}
html body .languageswitcher button{background:transparent!important;border:0!important;border-radius:999px!important;color:#1C1C1E!important;font-weight:600!important}
html body .languageswitcher button[aria-pressed="true"],html body .languageswitcher button.active{background:#fff!important;box-shadow:0 1px 2px rgba(0,0,0,.12)!important}
html body .accountactions{background:transparent!important;border:0!important}
html body .accountaction{background:transparent!important;border:0!important;color:#007AFF!important;font-weight:500!important}
html body .accountaction.accountlogout{color:#FF3B30!important}
html body .accountchip{background:#E9E9EE!important;border:0!important;border-radius:999px!important}
html body .inboundtabs{background:#E9E9EE!important;border-radius:12px!important;padding:3px!important;gap:3px!important}
html body .inboundtabs button{background:transparent!important;border:0!important;color:#6B6B70!important;border-radius:9px!important;font-weight:600!important}
html body .inboundtabs button.active{background:#fff!important;color:#1C1C1E!important;box-shadow:0 1px 2px rgba(0,0,0,.10)!important}
html body .productpackagingbadge.confirmed,html body .intag{background:#E7F7EC!important;color:#1C8F4A!important;border:0!important}
html body .productpackagingbadge.pending,html body .orderpendingtag{background:#FFF4E5!important;color:#B26A00!important;border:0!important}
html body .productpackagingbadge.estimated{background:#EEF2FF!important;color:#3B5BDB!important;border:0!important}

/* ---- iOS: separators that stay visible on white ---- */
html body table tbody td{border-bottom:1px solid #E0E0E6!important}
html body table tbody tr:last-child td{border-bottom:1px solid #E0E0E6!important}
html body table thead th{border-bottom:1px solid #D6D6DC!important}
html body table tfoot td{border-top:1px solid #D6D6DC!important}
html body .tablewrap,html body .sitablewrap{border:1px solid #E0E0E6!important}
html body .orderlinesgrid td,html body .orderlinesgrid th{border-left:0!important;border-right:0!important}

/* ---- iOS: canvas gray, cards float on top ---- */
html body{background:#F2F2F7!important}
html body main,html body .workspacepage,html body .workspacepages,html body section.content,html body .shell{background:transparent!important}
html body .workspacepage>.content,html body .workspacepages>div{background:transparent!important}
html body .workspacetabs,html body .pagetabs,html body .workspacepagetabs{background:#E8E8ED!important}
html body .panel,html body .customerpanel,html body .orderpanel{background:#fff!important}

/* ---- iOS tiles: every button is a gray tile with blue content ---- */
html body button[class]:not(nav button):not([data-act="close"]):not([data-act="back"]){background:#EFEFF4!important;color:#007AFF!important;border:0!important;border-radius:12px!important;font-weight:600!important;box-shadow:none!important}
html body button[class]:not(nav button):not([data-act="close"]):not([data-act="back"]):hover{background:#E5E5EA!important}
html body button[class] svg,html body button[class] span,html body button[class] strong,html body button[class] small{color:inherit!important;stroke:inherit!important}
html body button[aria-pressed="true"][class],html body button.active[class]{background:#007AFF!important;color:#FFFFFF!important}
html body button[aria-pressed="true"][class] svg,html body button.active[class] svg{stroke:#FFFFFF!important;color:#FFFFFF!important}
html body button[data-function-color="delete"][class]{color:#FF3B30!important}
html body button[data-act="close"][data-act][data-act],html body button[data-act="back"][data-act][data-act]{background:#FF3B30!important;color:#fff!important;border-radius:50%!important}

/* ---- palette sampled from the reference screenshot ---- */
html body{background:#F7F7F7!important}
html body .panel,html body .customerpanel,html body .orderpanel,html body .workspacepage>.panel{background:#F8F7F5!important;border-color:#E7E6E3!important}
html body table,html body table thead th,html body table tbody td,html body table tfoot td{background:#F8F7F5!important}
html body table thead th{border-bottom:1px solid #DEDDD9!important;color:#8A8984!important}
html body table tbody td{border-bottom:1px solid #E3E2DE!important}
html body .tablewrap,html body .sitablewrap{border-color:#E3E2DE!important;background:#F8F7F5!important}
html body button[class]:not(nav button):not([data-act="close"]):not([data-act="back"]){background:#E8E8E6!important;color:#007AFF!important}
html body button[class]:not(nav button):not([data-act="close"]):not([data-act="back"]):hover{background:#DEDEDB!important}
html body button[aria-pressed="true"][class],html body button.active[class]{background:#007AFF!important;color:#fff!important}
html body input:not([type="checkbox"]):not([type="radio"]),html body select,html body textarea{background:#FFFFFF!important;border-color:#E0DFDB!important}
html body .workspacepagetabs,html body .inboundtabs,html body .languageswitcher{background:#E8E8E6!important}
html body .private,html body .accountchip{background:#E8E8E6!important;color:#6C6B66!important}
html body .workspacepagetabs button.active,html body .inboundtabs button.active,html body .languageswitcher button[aria-pressed="true"]{background:#F8F7F5!important;color:#1C1C1E!important}

/* ---- final pass: every in-panel button uses the sampled tile gray ---- */
html body .panel button:not(nav button):not([data-act]):not([aria-pressed="true"]):not(.active){background:#E8E8E6!important;color:#007AFF!important;border:0!important;border-radius:12px!important}
html body .panel button:not(nav button):not([data-act]):not([aria-pressed="true"]):not(.active):hover{background:#DEDEDB!important}
html body .panel button[aria-pressed="true"],html body .panel button.active{background:#007AFF!important;color:#FFFFFF!important}
html body{background:#F7F7F7!important}
html body .panel{background:#F8F7F5!important;border:1px solid #E7E6E2!important;box-shadow:0 1px 2px rgba(28,28,30,.05)!important}

/* ---- visible grid: horizontal + vertical hairlines in the sampled palette ---- */
html body table{border-collapse:collapse!important}
html body table thead th{border-bottom:1px solid #D6D5D1!important;border-right:1px solid #E6E5E1!important;background:#F3F2EF!important;color:#7C7B76!important}
html body table tbody td{border-bottom:1px solid #E2E1DD!important;border-right:1px solid #E6E5E1!important;background:#F8F7F5!important}
html body table tbody tr:hover>td{background:#F1F0ED!important}
html body table thead th:last-child,html body table tbody td:last-child{border-right:0!important}
html body table tfoot td{border-top:1px solid #D6D5D1!important;border-right:1px solid #E6E5E1!important;background:#F3F2EF!important}
html body table tfoot td:last-child{border-right:0!important}
html body .tablewrap,html body .sitablewrap{border:1px solid #DEDDD9!important;border-radius:12px!important;overflow:hidden}

/* ---- grid overrides the earlier "no vertical lines" rule ---- */
html body .orderlinesgrid td,html body .orderlinesgrid th{border-left:0!important;border-right:1px solid #E4E3DF!important}
html body .orderlinesgrid td:last-child,html body .orderlinesgrid th:last-child{border-right:0!important}
html body .orderlinesgrid td{border-bottom:1px solid #DFDEDA!important;background:#F8F7F5!important}
html body .orderlinesgrid thead th{border-bottom:1px solid #D3D2CE!important;background:#F3F2EF!important}
html body table td,html body table th{border-left:1px solid #E6E5E1!important}
html body table td:first-child,html body table th:first-child{border-left:0!important}

/* ---- iOS: PI / Invoice modal ---- */
html body .invoiceoverlay .invoicebody{padding:16px 18px!important}
html body .invoiceoverlay .invoicenumber{align-items:stretch!important;gap:10px!important}
html body .invoiceoverlay .invoicenumber label{position:static!important;display:flex!important;flex-direction:column!important;gap:6px!important;margin:0!important;padding:0!important}
html body .invoiceoverlay .invoicebankcards{gap:12px!important;margin:12px 0!important}
html body .invoiceoverlay .invoicebankcard{border:1px solid #E4E3DF!important;border-radius:14px!important;background:#F8F7F5!important;overflow:hidden!important}
html body .invoiceoverlay .invoicebankcard.selected{border-color:#007AFF!important;background:#F3F7FF!important;box-shadow:0 0 0 2px rgba(0,122,255,.12)!important}
html body .invoiceoverlay .invoicebankcard h3,html body .invoiceoverlay .invoicebankcard.bankcard1 h3{background:#F1F0ED!important;color:#1C1C1E!important;font-size:13px!important;font-weight:600!important;padding:10px 12px!important}
html body .invoiceoverlay .invoicebankcard.selected h3{background:#E6F0FF!important;color:#0058CC!important}
html body .invoiceoverlay .bankcardbody{padding:12px!important}
html body .invoiceoverlay .invoicetotal{align-items:center!important;gap:16px!important}
html body .invoiceoverlay .invoicetotallabel strong{font-size:18px!important;color:#1C1C1E!important;font-weight:700!important}
html body .invoiceoverlay .invoicetotallabel small{font-size:11px!important;color:#8A8984!important;letter-spacing:.06em!important}
html body .invoiceoverlay .invoicetotalvalue strong{font-size:26px!important;color:#1C1C1E!important;font-weight:700!important}
html body .invoiceoverlay .invoicetotalvalue span{background:#E8E8E6!important;color:#5C5B57!important;font-size:11px!important;padding:3px 10px!important}
html body .invoiceoverlay .hint{color:#8A8984!important}
html body .invoiceoverlay .invoicefields{gap:14px!important}
html body .invoiceoverlay .invoicefields label{gap:6px!important}

/* ---- white content surfaces on a gray canvas ---- */
html body .panel,html body .customerpanel,html body .orderpanel,html body .workspacepage>.panel{background:#FFFFFF!important;border:1px solid #E7E6E2!important}
html body table,html body table thead th,html body table tbody td,html body table tfoot td,html body .orderlinesgrid td{background:#FFFFFF!important}
html body table thead th{background:#FFFFFF!important;color:#8A8984!important}
html body table tbody tr:hover>td,html body .orderlinesgrid tr:hover>td{background:#F6F6F4!important}
html body table tfoot td{background:#FFFFFF!important}
html body .tablewrap,html body .sitablewrap,html body .customertablearea{background:#FFFFFF!important}
html body .invoicebankcard{background:#FFFFFF!important}
html body .invoicebankcard h3,html body .invoicebankcard.bankcard1 h3{background:#F7F7F5!important}
html body .invoicebankcard.selected{background:#F5F9FF!important}
html body .freightcard,html body .freightcardbody{background:#FFFFFF!important}
html body .cgsuppliergroup,html body .cgtablewrap{background:#FFFFFF!important}
html body .customerattachmentpanel,html body .customerfilecard{background:#FFFFFF!important}

/* ---- sidebar selection uses the same neutral gray family ---- */
html body .shell>aside nav button.active,html body aside nav button.active{background:#ECEBE8!important;color:#1C1C1E!important;font-weight:600!important;box-shadow:none!important}
html body .shell>aside nav button:hover{background:#F1F0ED!important}
html body .shell>aside,html body aside{background:#FFFFFF!important;border-right:1px solid #E7E6E2!important}

/* ---- one gray for nav pill, tab strip and table header (#ECEBE8) ---- */
html body .workspacepagetabs{background:#ECEBE8!important}
html body .workspacepagetabs button.active{background:#FFFFFF!important;color:#1C1C1E!important}
html body .inboundtabs,html body .languageswitcher,html body .fileviewbuttons,html body .subtabs{background:#ECEBE8!important}
html body table thead th{background:#ECEBE8!important;color:#5F5E5A!important;border-bottom:1px solid #D9D8D3!important;border-right:1px solid #E0DFDA!important}
html body .orderlinesgrid thead th{background:#ECEBE8!important}
html body table tfoot td{background:#ECEBE8!important;color:#5F5E5A!important}

/* ---- iOS: freight calculator + order summary panels ---- */
html body .orderfreightcalculator{border:1px solid #E7E6E2!important;border-radius:14px!important;background:#FFFFFF!important;padding:14px 16px!important}
html body .orderfreightcalculator>h3{background:#ECEBE8!important;color:#1C1C1E!important;border-radius:10px!important;padding:9px 12px!important;font-size:14px!important;font-weight:600!important;margin:0 0 12px!important}
html body .orderfreightcalculator h4{color:#1C1C1E!important;font-size:13px!important;font-weight:600!important}
html body .orderfreightcalculator label{color:#6C6B66!important;font-size:12.5px!important}
html body .orderfreightmetrics{border:1px solid #E7E6E2!important;border-radius:10px!important;overflow:hidden!important}
html body .orderfreightmetrics>div{border-right:1px solid #E7E6E2!important;background:#FFFFFF!important;padding:10px 12px!important}
html body .orderfreightmetrics>div:last-child{border-right:0!important;background:#FFFFFF!important}
html body .orderfreightmetrics>div>span,html body .orderfreightmetrics>div>small{color:#8A8984!important}
html body .orderfreightcalculator .hint{color:#8A8984!important;font-size:11.5px!important}
html body .freightresultfield input{background:#FFFFFF!important}
html body .freightbluefield input,html body .freightbluefield select{background:#FFFFFF!important}
html body .orderfreightcalculator input[aria-label="客户运费利润率"]{background:#FFFFFF!important;border-color:#E0DFDB!important;color:#1C1C1E!important}
html body .orderfinancialsummary{border:1px solid #E7E6E2!important;border-radius:12px!important;overflow:hidden!important;background:#fff!important}
html body .orderfinancialsummary table{width:100%!important}
html body .orderfinancialsummary th{background:#FFFFFF!important;color:#5F5E5A!important;font-weight:600!important;text-align:left!important;padding:12px 14px!important;border-bottom:1px solid #EFEEEB!important}
html body .orderfinancialsummary td{background:#FFFFFF!important;color:#1C1C1E!important;font-weight:600!important;text-align:right!important;padding:12px 14px!important;border-bottom:1px solid #EFEEEB!important}
html body .orderfinancialsummary tr:last-child th,html body .orderfinancialsummary tr:last-child td{border-bottom:0!important;background:#F7F7F5!important}
html body .orderfinancialsummary tr:last-child th{font-weight:700!important;color:#1C1C1E!important}
html body .orderfinancialsummary input{background:#FFFFFF!important}

/* ---- iOS: summary numbers read as plain dark text ---- */
html body .orderfinancialsummary input,html body .orderfinancialsummary .freightresultfield input{background:transparent!important;border:0!important;color:#1C1C1E!important;font-weight:600!important;text-align:right!important;padding:0!important;box-shadow:none!important}
html body .orderfinancialsummary td button{background:#E8E8E6!important;color:#007AFF!important}
html body .orderfinancialsummary .freightresultfield{background:transparent!important}
html body .orderfinancialsummary tr:last-child td{color:#1C1C1E!important;font-weight:700!important;font-size:15px!important}

/* ---- money values read as plain text, not tiles ---- */
html body button.moneyplain{background:transparent!important;color:#1C1C1E!important;border:0!important;border-radius:0!important;padding:0!important;height:auto!important;min-height:0!important;font-weight:600!important;box-shadow:none!important}
html body button.moneyplain:disabled{opacity:1!important;color:#1C1C1E!important}
html body button.moneyplain:hover{background:transparent!important}
html body .orderfinancialsummary button.moneyplain{text-align:right!important;width:100%!important}

/* ---- moneyplain with matching specificity ---- */
html body button.moneyplain[class]{background:transparent!important;color:#1C1C1E!important;border:0!important;border-radius:0!important;padding:0!important;height:auto!important;min-height:0!important;font-weight:600!important;box-shadow:none!important}
html body button.moneyplain[class][disabled]{color:#1C1C1E!important;opacity:1!important}

/* ---- moneyplain beats the in-panel tile rule ---- */
html body .panel button.moneyplain[class][class][aria-label],html body button.moneyplain[class][class][aria-label]{background:transparent!important;color:#1C1C1E!important;border:0!important;border-radius:0!important;padding:0!important;height:auto!important;min-height:0!important;font-weight:600!important;box-shadow:none!important;opacity:1!important}
html body .panel button.moneyplain[class][class][aria-label]:disabled{color:#1C1C1E!important}

/* ---- iOS: SI sheet + notice panels + leftover tints ---- */
html body .simodal .sisummary{background:#F7F7F5!important;border:1px solid #E7E6E2!important;border-radius:12px!important}
html body .simodal .siwarnings{background:#FFF8E6!important;border:1px solid #F0E2BC!important;border-radius:12px!important;color:#7A5B00!important}
html body .simodal .sisectiontitle{color:#1C1C1E!important}
html body .simodal .sisectiontitle h3{color:#1C1C1E!important;font-weight:600!important;font-size:14px!important}
html body .simodal .sisectiontitle::before,html body .simodal .sisectiontitle>span:first-child{background:#D9D8D3!important}
html body .simodal .siheaders label,html body .simodal .sibody label{color:#6C6B66!important}
html body .simodal .siheaders small,html body .simodal .sibody small{background:#ECEBE8!important;color:#5F5E5A!important;border-radius:999px!important;padding:1px 6px!important}
html body .simodal .siheaders input,html body .simodal .siheaders select,html body .simodal .sibody input,html body .simodal .sibody select{background:#FFFFFF!important;border-color:#E0DFDB!important;color:#1C1C1E!important}
html body .simodal .sisection{background:#FFFFFF!important;border:1px solid #E7E6E2!important;border-radius:12px!important}
html body .simodal .sitablewrap{border-color:#E7E6E2!important}
html body .noticecontrols{background:#F7F7F5!important;border:1px solid #E7E6E2!important;border-radius:12px!important}
html body .noticecontrols>label>span:first-child{color:#6C6B66!important}
html body .noticecontrols>button{background:#E8E8E6!important;color:#007AFF!important;border:0!important;border-radius:12px!important}
html body .noticecontrols input,html body .noticecontrols select{background:#FFFFFF!important;border-color:#E0DFDB!important;color:#1C1C1E!important}
html body .noticepaper{background:#FFFFFF!important;border:1px solid #E7E6E2!important}
html body .noticeextract{background:#E8E8E6!important;color:#007AFF!important}
html body .hint,html body small.hint{color:#8A8984!important}
html body .sisummary strong{color:#1C1C1E!important}

/* ---- segmented tabs: one gray track, white active pill ---- */
html body .inboundtabs[class],html body .subtabs[class],html body .fileviewbuttons[class]{background:#ECEBE8!important;border:0!important;border-radius:999px!important;padding:3px!important;gap:2px!important}
html body .inboundtabs[class]>button,html body .subtabs[class]>button,html body .fileviewbuttons[class]>button{background:transparent!important;color:#5F5E5A!important;border:0!important;border-radius:999px!important;box-shadow:none!important;font-weight:600!important}
html body .inboundtabs[class]>button.active,html body .subtabs[class]>button.active,html body .fileviewbuttons[class]>button.active,html body .inboundtabs[class]>button[aria-selected="true"]{background:#FFFFFF!important;color:#1C1C1E!important;box-shadow:0 1px 2px rgba(0,0,0,.10)!important}

/* ---- order summary keeps its original compact bordered table ---- */
html body .orderfinancialsummary{border:0!important;border-radius:0!important;background:transparent!important;overflow:visible!important;display:block!important;width:auto!important}
html body .orderfinancialsummary table{width:auto!important;min-width:0!important;border-collapse:collapse!important;display:table!important;margin:8px 0 0!important;background:#fff!important;border:1px solid #E0DFDA!important;border-radius:8px!important;overflow:hidden!important}
html body .orderfinancialsummary th,html body .orderfinancialsummary td{border:1px solid #E0DFDA!important;background:#FFFFFF!important;padding:9px 14px!important;font-size:13px!important;font-weight:600!important;white-space:nowrap!important}
html body .orderfinancialsummary th{color:#5F5E5A!important;text-align:left!important;min-width:240px!important}
html body .orderfinancialsummary td{color:#1C1C1E!important;text-align:right!important;min-width:120px!important}
html body .orderfinancialsummary tr:last-child th,html body .orderfinancialsummary tr:last-child td{background:#ECEBE8!important;font-weight:700!important;color:#1C1C1E!important}
html body .orderfinancialsummary button.moneyplain[class][class][aria-label]{color:#1C1C1E!important;background:transparent!important}

/* supplier badges keep their original per-supplier colours, only shape is unified */
html body .cgsupplierbadge,html body .freightcardheading h3{border-radius:10px!important}
html body .cgsupplierbadge small,html body .freightcardheading h3 small{background:#FFFFFF!important;color:#5F5E5A!important;border-radius:999px!important}

/* ---- summary box: full visible border, separate model ---- */
html body .orderfinancialsummary table{border-collapse:separate!important;border-spacing:0!important;border:1px solid #CFCEC9!important;border-radius:10px!important;overflow:hidden!important;background:#fff!important;width:auto!important}
html body .orderfinancialsummary th,html body .orderfinancialsummary td{border:0!important;border-right:1px solid #CFCEC9!important;border-bottom:1px solid #CFCEC9!important;padding:11px 16px!important}
html body .orderfinancialsummary th:last-child{border-right:0!important}
html body .orderfinancialsummary tr:last-child th,html body .orderfinancialsummary tr:last-child td{border-bottom:0!important;background:#ECEBE8!important}
html body .orderfinancialsummary tr:first-child th{border-top:0!important}
html body .orderfinancialsummary{background:transparent!important;border:0!important;padding:0!important}

/* ---- product search row: refresh button matches the field height ---- */
html body .customerorderadd{align-items:center!important;gap:8px!important}
html body .ordercatalogrefresh{width:36px!important;min-width:36px!important;height:36px!important;min-height:36px!important;padding:0!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;background:#E8E8E6!important;color:#007AFF!important;border:0!important;border-radius:10px!important}
html body .ordercatalogrefresh svg{width:18px!important;height:18px!important;stroke:currentColor!important;color:inherit!important;display:block!important}
html body .orderinlinepicker .orderpickerinput{height:36px!important}
html body .orderinlinepicker .orderpickerinput>button{height:26px!important;min-height:26px!important;width:26px!important;min-width:26px!important;padding:0!important;border-radius:8px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important}

/* ---- refresh button: high-specificity square tile ---- */
html body .customerorderadd button.ordercatalogrefresh[class][class]{width:36px!important;min-width:36px!important;height:36px!important;min-height:36px!important;padding:0!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;background:#E8E8E6!important;color:#007AFF!important;border:0!important;border-radius:10px!important;align-self:center!important;margin:0!important}
html body .customerorderadd button.ordercatalogrefresh[class][class] svg{width:18px!important;height:18px!important;stroke:currentColor!important;color:#007AFF!important;display:block!important}

/* ---- product-label modal: width follows the number of cards (max 3 per row) ---- */
html body .orderlabelmodal:has(.orderlabelgrid){width:fit-content!important;min-width:460px!important;max-width:min(1080px,95vw)!important}
html body .orderlabelmodal .orderlabelgrid{display:grid!important;grid-template-columns:repeat(3,320px)!important;justify-content:start!important;gap:14px!important;margin:0!important}
html body .orderlabelmodal .orderlabelgrid section{background:#FFFFFF!important;border:1px solid #E0DFDA!important;border-radius:12px!important;padding:12px!important;min-width:0!important}
html body .orderlabelmodal .orderlabelgrid header{background:transparent!important;border:0!important;padding:0 2px 8px!important;margin:0!important;font-size:13px!important;color:#1C1C1E!important}
html body .orderlabelmodal .orderlabelgrid header strong,html body .orderlabelmodal .orderlabelgrid header h3{color:#1C1C1E!important;font-weight:600!important}
html body .orderlabelmodal .orderlabelgrid textarea{background:#FFFFFF!important;border:1px solid #E0DFDA!important;border-radius:10px!important;color:#1C1C1E!important;font:15px/1.5 -apple-system,"PingFang SC","Microsoft YaHei",Arial,sans-serif!important;padding:12px!important;min-height:200px!important;height:200px!important}
html body .orderlabelmodal .orderlabelbody{background:#FFFFFF!important}
html body .orderlabelmodal .orderlabelcontrols>div{background:#F7F7F5!important;border:1px solid #E7E6E2!important;border-radius:12px!important}
html body .orderlabelmodal .orderlabelcontrols strong{color:#1C1C1E!important}
html body .orderlabelmodal .orderlabelcontrols>div>span{color:#6C6B66!important}
html body .orderlabelmodal .hint{color:#8A8984!important}
html body .orderlabelmodal .invoiceactions{display:flex!important;justify-content:flex-end!important;gap:8px!important}

/* ---- label cards: flex wrap, width follows the card count ---- */
html body .orderlabelmodal .orderlabelgrid{display:flex!important;flex-wrap:wrap!important;align-items:flex-start!important;gap:14px!important;margin:0!important}
html body .orderlabelmodal .orderlabelgrid>section{flex:0 0 320px!important;width:320px!important;max-width:320px!important}

/* ---- one caption colour for every field label ---- */
html body label,html body .invoicebody label,html body .sibody label,html body .orderlabelbody label,html body .noticecontrols label,html body .freightcalc label{color:#6C6B66!important}
html body label>strong,html body label>b,html body label[data-required] strong{color:#1C1C1E!important}
html body .invoicetotallabel,html body .invoicetotallabel small{color:#8A8984!important}
html body .orderlabelcontrols>div>span,html body .labelnumberlabel{color:#6C6B66!important}
html body .orderfreightcalculator label,html body .orderfreightcalculator label>span{color:#6C6B66!important}
html body .customercontactgroup label,html body .customercontactgrid label{color:#6C6B66!important}

/* ---- profit report: neutral KPI cards and section bars ---- */
html body .profitsummary{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:12px!important;margin:14px 0!important}
html body .profitsummary>div{background:#FFFFFF!important;border:1px solid #E0DFDA!important;border-radius:12px!important;padding:14px 16px!important;display:grid!important;gap:6px!important}
html body .profitsummary>div>span,html body .profitsummary>div>label{color:#6C6B66!important;font-size:12.5px!important}
html body .profitsummary strong{color:#1C1C1E!important;font-size:22px!important;font-weight:700!important}
html body .profitsummary .profittotal{background:#F7F7F5!important;border-color:#D9D8D3!important}
html body .profitmodal .agentprofitgrid>div{background:#FFFFFF!important;border:1px solid #E0DFDA!important;border-radius:10px!important}
html body .profitmodal .agentprofitgrid span{color:#6C6B66!important}
html body .profitmodal .agentprofitgrid strong{color:#1C1C1E!important}
html body .profitmodal .agentprofitbreak{background:#F7F7F5!important;border:1px solid #E0DFDA!important;border-radius:10px!important}
html body .profitmodal .agentprofitbreak span{color:#6C6B66!important}
html body .profitmodal .agentprofitbreak strong{color:#1C1C1E!important}
html body .profitmodal .sisummary{background:#F7F7F5!important;border:1px solid #E7E6E2!important;border-radius:12px!important}
html body .profitmodal .sisectiontitle h3,html body .profitmodal .sisectiontitle h3 small{color:#1C1C1E!important}
html body .profitmodal .sisectiontitle::before,html body .profitmodal .sisectiontitle>span:first-child{background:#7C7B76!important}
html body .profitbutton{background:#E8E8E6!important;color:#007AFF!important}

/* ---- profit section badges: neutral chips ---- */
html body .profitbadge{background:#F7F7F5!important;color:#1C1C1E!important;border:1px solid #E0DFDA!important;border-radius:8px!important;font-weight:600!important}
html body .profitbadge::before,html body .profitbadge>i{background:#7C7B76!important}
html body .profitbadge small{color:#6C6B66!important}

/* ---- label modal: controls centred over the cards, cards centred too ---- */
html body .orderlabelmodal .orderlabelbody{align-items:center!important}
html body .orderlabelmodal .orderlabelcontrols{justify-content:center!important;align-items:center!important;margin:0 auto!important}
html body .orderlabelmodal .orderlabelcontrols>label{min-width:280px!important;max-width:380px!important}
html body .orderlabelmodal .orderlabelgrid{justify-content:center!important;margin:0 auto!important}
html body .orderlabelmodal .orderlabelbody>.hint,html body .orderlabelmodal .orderlabelbody>p[role="status"]{text-align:center!important}

/* ---- SI declaration table: horizontal scrolling ---- */
html body .simodal .sitablewrap{overflow-x:auto!important;overflow-y:auto!important;max-width:100%!important;border:1px solid #E0DFDA!important;border-radius:12px!important}
html body .simodal .sitablewrap table{min-width:0!important;border-collapse:collapse!important}
html body .simodal .sitablewrap::-webkit-scrollbar{height:10px!important;width:10px!important}
html body .simodal .sitablewrap::-webkit-scrollbar-thumb{background:#CFCEC9!important;border-radius:999px!important}
html body .simodal .sitablewrap::-webkit-scrollbar-track{background:#F2F1EE!important;border-radius:999px!important}

/* ---- SDA grand total band: neutral gray ---- */
html body .freightgrandtotal{background:#ECEBE8!important;color:#1C1C1E!important;border:1px solid #E0DFDA!important;border-radius:12px!important;padding:14px 16px!important}
html body .freightgrandtotal strong,html body .freightgrandtotal b{color:#1C1C1E!important}
html body .freightgrandtotal span,html body .freightgrandtotal small{color:#5F5E5A!important}
html body .freightdetailsmodal .freightcard,html body .freightdetailsmodal .freightcardbody{background:#FFFFFF!important;border-color:#E7E6E2!important}
html body .freightdetailsmodal thead th{background:#ECEBE8!important;color:#5F5E5A!important}
html body .freightdetailsmodal tfoot td{background:#FFFFFF!important}
html body .freightdetailsmodal .freightsubtotallabel{color:#6C6B66!important}

/* ---- freight management: equal KPI cards ---- */
html body .freightmanagementsummary{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px!important;align-items:stretch!important}
html body .freightmanagementsummary>div{background:#FFFFFF!important;border:1px solid #E0DFDA!important;border-radius:12px!important;padding:16px 18px!important;display:flex!important;flex-direction:column!important;gap:8px!important;min-height:150px!important;justify-content:flex-start!important}
html body .freightmanagementsummary strong{color:#1C1C1E!important;font-size:26px!important;line-height:1.2!important}
html body .freightmanagementsummary span,html body .freightmanagementsummary small,html body .freightmanagementsummary p{color:#6C6B66!important;font-size:12.5px!important;margin:auto 0 0!important}
html body .freightmanagementbody{background:#FFFFFF!important}
html body .freightmanagementtools{background:#F7F7F5!important;border:1px solid #E7E6E2!important;border-radius:12px!important;padding:8px 10px!important}

/* ---- every delete action is a red filled button ---- */
html body button[data-function-color="delete"][class][class],html body .customerdeletebtn[class],html body button[data-action-tone="red"][class][class],html body button.danger[class],html body .rowactionslist button.danger,html body button[aria-label*="删除"][class]{background:#FF3B30!important;color:#FFFFFF!important;border:0!important;border-radius:12px!important;font-weight:600!important;box-shadow:none!important}
html body button[data-function-color="delete"][class][class]:hover,html body button[data-action-tone="red"][class][class]:hover,html body button[aria-label*="删除"][class]:hover{background:#E0332A!important}
html body button[data-function-color="delete"][class][class] svg,html body button[data-action-tone="red"][class][class] svg{stroke:#FFFFFF!important;color:#FFFFFF!important}
html body .rowactionslist button[data-function-color="delete"]{background:#FF3B30!important;color:#FFFFFF!important}

/* ---- delete buttons: maximum specificity red fill ---- */
html body button.customerdeletebtn[class][class][class],html body .panel button.customerdeletebtn[class][class][class],html body button[data-function-color="delete"][class][class][class],html body button[data-action-tone="red"][class][class][class],html body button.danger[class][class][class],html body .rowactionslist button[data-function-color="delete"][data-function-color]{background:#FF3B30!important;color:#FFFFFF!important;border:0!important;border-radius:12px!important;font-weight:600!important;box-shadow:none!important}
html body .rowactionslist button.danger,html body .rowactionslist button[data-function-color="delete"]{background:#FF3B30!important;color:#FFFFFF!important}

/* ---- unsaved-changes dialog: compact and fully centred ---- */
html body .workspacecloseoverlay .modal{width:min(460px,92vw)!important;max-width:460px!important;border-radius:16px!important;overflow:hidden!important}
html body .workspacecloseoverlay .paneltitle{justify-content:center!important;text-align:center!important;padding:16px 18px!important;border-bottom:1px solid #E7E6E2!important}
html body .workspacecloseoverlay .paneltitle h2,html body .workspacecloseoverlay .paneltitle strong{text-align:center!important;font-size:16px!important;color:#1C1C1E!important}
html body .workspaceclosebody{padding:18px 20px 16px!important;text-align:center!important;gap:14px!important;display:flex!important;flex-direction:column!important;align-items:center!important}
html body .workspaceclosebody>p,html body .workspaceclosebody>div:not(.actions){text-align:center!important;margin:0!important;color:#4A4A46!important;font-size:13px!important;line-height:1.5!important}
html body .workspaceclosebody .actions,html body .workspaceclosebody>div:last-child{display:flex!important;justify-content:center!important;gap:8px!important;flex-wrap:wrap!important;width:100%!important;margin-top:4px!important}
html body .workspaceclosebody button{height:26px!important;min-height:26px!important;padding:0 12px!important;font-size:12.5px!important;border-radius:10px!important}

/* ---- purple accent for agent-pricing controls ---- */
:root{--ios-purple:#6B4FD3;--ios-purple-soft:#F3EDFF;--ios-purple-line:#DDD0FB}
html body .orderpricemodes button[aria-pressed="true"][class]{background:#F3EDFF!important;color:#6B4FD3!important;border:1px solid #DDD0FB!important;border-radius:10px!important;box-shadow:none!important;font-weight:600!important}
html body .orderpricemodes button[aria-pressed="true"][class] svg{stroke:#6B4FD3!important;color:#6B4FD3!important}
html body .orderpricemodes button[aria-pressed="false"][class]{background:#E8E8E6!important;color:#007AFF!important;border:0!important;border-radius:10px!important;box-shadow:none!important}
html body .agentratecell .agentrateadd,html body .agentratecell .agentrateclear,html body .agentratecell button{background:#F3EDFF!important;color:#6B4FD3!important;border:1px solid #DDD0FB!important;border-radius:8px!important}
html body .agentratecell .agentrateinput,html body .agentratefield input,html body input[aria-label^="客户利润率"],html body input[aria-label^="客户运费利润率"]{background:#F3EDFF!important;border:1px solid #DDD0FB!important;color:#4B34A6!important;border-radius:8px!important}
html body .agentratecell .agentrateinput:focus,html body input[aria-label^="客户利润率"]:focus{box-shadow:0 0 0 3px rgba(107,79,211,.15)!important}
html body .agentratecell,html body .agentratefield{color:#6B4FD3!important}
html body .agentratecell .agentratesign{color:#6B4FD3!important}

/* ---- purple accent: maximal specificity ---- */
html body .orderpricemodes button[aria-pressed="true"][class][class][class]{background:#F3EDFF!important;color:#6B4FD3!important;border:1px solid #DDD0FB!important;border-radius:10px!important;box-shadow:none!important;font-weight:600!important}
html body .orderpricemodes button[aria-pressed="true"][class][class][class] svg{stroke:#6B4FD3!important;color:#6B4FD3!important}
html body .orderlinesgrid input.agentrateinput[class][class],html body .agentratecell input[class][class][aria-label]{background:#F3EDFF!important;border:1px solid #DDD0FB!important;color:#4B34A6!important;border-radius:8px!important;min-height:26px!important;height:26px!important}
html body .agentratecell button[class][class][class]{background:#F3EDFF!important;color:#6B4FD3!important;border:1px solid #DDD0FB!important;border-radius:8px!important}
html body .agentratecell button[class][class][class] svg{stroke:#6B4FD3!important;color:#6B4FD3!important}
html body .orderfreightcalculator input[aria-label="客户运费利润率"][class][class]{background:#F3EDFF!important;border:1px solid #DDD0FB!important;color:#4B34A6!important}

/* ---- price modes: one colour per mode, filled when selected ---- */
html body .orderpricemodes button.pricemanual[aria-pressed="false"][class][class]{background:#FFF3E2!important;color:#B26A00!important;border:1px solid #F0D8B4!important;border-radius:10px!important;box-shadow:none!important}
html body .orderpricemodes button.pricemanual[aria-pressed="true"][class][class]{background:#E08A00!important;color:#FFFFFF!important;border:1px solid #E08A00!important;border-radius:10px!important;box-shadow:none!important}
html body .orderpricemodes button.pricelinked[aria-pressed="false"][class][class]{background:#EAF2FF!important;color:#1F5FAE!important;border:1px solid #CFE0F8!important;border-radius:10px!important;box-shadow:none!important}
html body .orderpricemodes button.pricelinked[aria-pressed="true"][class][class]{background:#007AFF!important;color:#FFFFFF!important;border:1px solid #007AFF!important;border-radius:10px!important;box-shadow:none!important}
html body .orderpricemodes button.priceagent[aria-pressed="false"][class][class]{background:#F3EDFF!important;color:#6B4FD3!important;border:1px solid #DDD0FB!important;border-radius:10px!important;box-shadow:none!important}
html body .orderpricemodes button.priceagent[aria-pressed="true"][class][class]{background:#6B4FD3!important;color:#FFFFFF!important;border:1px solid #6B4FD3!important;border-radius:10px!important;box-shadow:none!important}
html body .orderpricemodes button[aria-pressed="true"][class][class] svg,html body .orderpricemodes button[aria-pressed="false"][class][class] svg{stroke:currentColor!important;color:currentColor!important}

/* ---- freight calculator: three tinted key fields ---- */
html body select[name="shippingMode"]{background:#EAF2FF!important;border:1px solid #CFE0F8!important;color:#1F5FAE!important;border-radius:10px!important;font-weight:600!important}
html body select[name="logistics_company"]{background:#FFF3E2!important;border:1px solid #F0D8B4!important;color:#B26A00!important;border-radius:10px!important;font-weight:600!important}
html body .orderfreightinputs>label:nth-of-type(3) input,html body .orderfreightinputs>label:nth-child(3) input{background:#F3EDFF!important;border:1px solid #DDD0FB!important;color:#4B34A6!important;border-radius:10px!important;font-weight:600!important}
html body .orderfreightcalculator select[name="shippingMode"]:focus{box-shadow:0 0 0 3px rgba(0,122,255,.15)!important}
html body .orderfreightcalculator select[name="logistics_company"]:focus{box-shadow:0 0 0 3px rgba(224,138,0,.15)!important}

/* ---- delete buttons: back to the standard gray tile ---- */
html body button.customerdeletebtn[class][class][class],html body .panel button.customerdeletebtn[class][class][class],html body button[data-function-color="delete"][class][class][class],html body button[data-action-tone="red"][class][class][class],html body button.danger[class][class][class],html body .rowactionslist button[data-function-color="delete"][data-function-color],html body .rowactionslist button.danger{background:#E8E8E6!important;color:#007AFF!important;border:0!important;border-radius:12px!important;font-weight:600!important;box-shadow:none!important}
html body button.customerdeletebtn[class][class][class]:hover,html body button[data-function-color="delete"][class][class][class]:hover,html body .rowactionslist button[data-function-color="delete"]:hover{background:#DEDEDB!important}
html body button[data-function-color="delete"] svg,html body button.customerdeletebtn svg{stroke:currentColor!important;color:inherit!important}

/* ---- freight tints: purple moves to profit rate, price field goes green ---- */
html body .orderfreightinputs>label:nth-of-type(3) input,html body .orderfreightinputs>label:nth-child(3) input{background:#E9F6EE!important;border:1px solid #C9E8D5!important;color:#1C8F4A!important;border-radius:10px!important;font-weight:600!important}
html body .orderfreightinputs>label:nth-of-type(3) input:focus{box-shadow:0 0 0 3px rgba(28,143,74,.15)!important}
html body input[aria-label^="客户利润率"][class][class],html body input[aria-label="客户运费利润率"][class][class]{background:#F3EDFF!important;border:1px solid #DDD0FB!important;color:#4B34A6!important;border-radius:10px!important;font-weight:600!important}
html body input[aria-label^="客户利润率"][class][class]:focus,html body input[aria-label="客户运费利润率"][class][class]:focus{box-shadow:0 0 0 3px rgba(107,79,211,.15)!important}
html body .agentratecell input.agentrateinput[class][class]{background:#F3EDFF!important;border:1px solid #DDD0FB!important;color:#4B34A6!important}

/* ---- customer profit-rate inputs: purple without needing a class attribute ---- */
html body input[aria-label^="客户利润率"][aria-label],html body input[aria-label="客户运费利润率"][aria-label],html body .orderfreightcalculator input[aria-label^="客户利润率"][aria-label]{background:#F3EDFF!important;border:1px solid #DDD0FB!important;color:#4B34A6!important;border-radius:10px!important;font-weight:600!important}
html body input[aria-label^="客户利润率"][aria-label]:focus{box-shadow:0 0 0 3px rgba(107,79,211,.15)!important}

/* ---- freight tints: one step lighter ---- */
html body select[name="shippingMode"]{background:#F4F8FF!important;border-color:#DCE8FA!important;color:#3C6FB0!important}
html body select[name="logistics_company"]{background:#FFFAF2!important;border-color:#F4E3CB!important;color:#A9773A!important}
html body .orderfreightinputs>label:nth-of-type(3) input,html body .orderfreightinputs>label:nth-child(3) input{background:#F3FBF6!important;border-color:#D6EDDF!important;color:#2E8B57!important}
html body input[aria-label^="客户利润率"][aria-label],html body input[aria-label="客户运费利润率"][aria-label],html body .agentratecell input.agentrateinput[class][class]{background:#F8F3FF!important;border-color:#E7DDFB!important;color:#6B4FD3!important}
html body .agentratecell button[class][class][class]{background:#F8F3FF!important;border-color:#E7DDFB!important;color:#6B4FD3!important}

/* ---- freight metrics: unit sits after the value ---- */
html body .orderfreightmetrics>div>strong{display:inline-flex!important;align-items:baseline!important;gap:4px!important;color:#1C1C1E!important;font-weight:700!important}
html body .orderfreightmetrics>div>strong small{font-size:11.5px!important;font-weight:500!important;color:#8A8984!important;letter-spacing:.02em!important}
html body .orderfreightmetrics>div>span{color:#6C6B66!important;font-size:12.5px!important}

/* ---- profit freight block: one value size ---- */
html body .profitfreight strong,html body .profitfreight b{font-size:18px!important;font-weight:700!important;color:#1C1C1E!important;line-height:1.2!important}
html body .profitfreight input{font-size:18px!important;font-weight:600!important;height:38px!important;min-height:38px!important;color:#1C1C1E!important}
html body .profitfreight .profitfreightprofit,html body .profitfreight .profitfreightvalue{font-size:18px!important;font-weight:700!important;color:#1C1C1E!important}

/* ---- profit freight input value matches the other numbers ---- */
html body .profitfreight input[class][class],html body .profitfreight label input,html body .profitfreight input[type="number"][class]{font-size:18px!important;font-weight:600!important;height:38px!important;min-height:38px!important;color:#1C1C1E!important}
html body .profitfreight label{font-size:12.5px!important;color:#6C6B66!important}

/* ---- profit freight input: max-specificity size ---- */
html body .profitfreight input[type="number"][type][type][type]{font-size:18px!important;font-weight:600!important;height:38px!important;min-height:38px!important;color:#1C1C1E!important;padding:0 12px!important}
html body .profitmodal .profitfreight input[type][type][type]{font-size:18px!important;font-weight:600!important}

/* ---- supplier dropdown: plain native-style list, no pill buttons ---- */
html body .productcombomenu{background:#FFFFFF!important;border:1px solid #D9D8D3!important;border-radius:10px!important;box-shadow:0 12px 26px rgba(0,0,0,.12)!important;padding:4px!important;max-height:320px!important;overflow:auto!important}
html body .productcombochoices{display:flex!important;flex-direction:column!important;gap:0!important;margin:0!important;padding:0!important}
html body .productcombochoice{display:flex!important;align-items:center!important;gap:8px!important;background:transparent!important;border:0!important;border-radius:0!important;padding:0 8px!important;margin:0!important;min-height:30px!important;color:#1C1C1E!important;font-size:13px!important;text-align:left!important;justify-content:flex-start!important;box-shadow:none!important}
html body .productcombochoice:hover{background:#EAF2FF!important}
html body .productcombochoice[aria-selected="true"],html body .productcombochoice.active{background:#007AFF!important;color:#FFFFFF!important}
html body .productcombochoice[aria-selected="true"] *{color:#FFFFFF!important}
html body .productcomboedit,html body .productcombodelete{background:transparent!important;border:0!important;border-radius:0!important;padding:0 4px!important;height:auto!important;min-height:0!important;color:#007AFF!important;font-size:12.5px!important;box-shadow:none!important;margin-left:0!important}
html body .productcombochoice[aria-selected="true"] .productcomboedit,html body .productcombochoice[aria-selected="true"] .productcombodelete{color:#FFFFFF!important}
html body .productcomboedit:hover,html body .productcombodelete:hover{text-decoration:underline!important;background:transparent!important}
html body .candidateorderbuttons{gap:6px!important;margin-left:auto!important;display:flex!important;align-items:center!important}
html body .productcombomenu .selectionsearch,html body .productcombomenu>button{background:transparent!important;border:0!important;color:#007AFF!important;font-size:12.5px!important;padding:8px!important;min-height:32px!important;border-radius:8px!important}

/* ---- supplier menu rows: max specificity plain rows ---- */
html body .productcombomenu .productcombochoice[class][class][class]{background:transparent!important;color:#1C1C1E!important;border:0!important;border-radius:0!important;min-height:30px!important;height:30px!important;padding:0 8px!important;font-size:13px!important;font-weight:400!important;justify-content:flex-start!important;box-shadow:none!important;display:flex!important;align-items:center!important}
html body .productcombomenu .productcombochoice[class][class][class]:hover{background:#EAF2FF!important}
html body .productcombomenu .productcombochoice[class][class][class] .productcomboedit,html body .productcombomenu .productcombochoice[class][class][class] .productcombodelete{background:transparent!important;border:0!important;height:auto!important;min-height:0!important;padding:0 4px!important;color:#007AFF!important;font-size:12.5px!important;font-weight:500!important}
html body .productcombomenu .productcombochoice[class][class][class] .candidateorderbuttons{margin-left:auto!important;display:flex!important;gap:6px!important}
html body .productcombomenu .productcombochoice[class][class][class] .productcomboedit:hover,html body .productcombomenu .productcombochoice[class][class][class] .productcombodelete:hover{text-decoration:underline!important;background:transparent!important}

/* ---- supplier / candidate rows become a plain list ---- */
html body .productcombomenu{background:#FFFFFF!important;border:1px solid #D9D8D3!important;border-radius:10px!important;box-shadow:0 12px 26px rgba(0,0,0,.12)!important;padding:4px 0!important;max-height:320px!important;overflow:auto!important}
html body .productcombomenu .productcomborow{display:flex!important;align-items:center!important;gap:8px!important;border:0!important;border-bottom:1px solid #F0EFEC!important;border-radius:0!important;background:transparent!important;margin:0!important;padding:0 10px!important;min-height:32px!important}
html body .productcombomenu .productcomborow:last-child{border-bottom:0!important}
html body .productcombomenu .productcomborow:hover{background:#EAF2FF!important}
html body .productcombomenu .productcombochoice{flex:1 1 auto!important;justify-content:flex-start!important;text-align:left!important;background:transparent!important;border:0!important;border-radius:0!important;height:auto!important;min-height:0!important;padding:6px 0!important;margin:0!important;color:#1C1C1E!important;font-size:13px!important;font-weight:400!important;box-shadow:none!important;white-space:normal!important}
html body .productcombomenu .productcomboedit,html body .productcombomenu .productcombodelete,html body .productcombomenu .candidateorderbuttons button{background:transparent!important;border:0!important;color:#007AFF!important;font-size:12.5px!important;font-weight:500!important;padding:0 2px!important;height:auto!important;min-height:0!important;border-radius:0!important;box-shadow:none!important}
html body .productcombomenu .productcomboedit:hover,html body .productcombomenu .productcombodelete:hover,html body .productcombomenu .candidateorderbuttons button:hover{text-decoration:underline!important;background:transparent!important}
html body .productcombomenu .candidateorderbuttons{display:flex!important;align-items:center!important;gap:8px!important;margin:0 0 0 auto!important;padding:0!important}
html body .productcombomenu>.selectionsearch,html body .productcombomenu>button{background:transparent!important;border:0!important;color:#007AFF!important;font-size:12.5px!important;padding:8px 10px!important;height:auto!important;min-height:32px!important;border-radius:0!important}

/* ---- supplier row actions: text links, high specificity ---- */
html body .productcombomenu .productcomborow button.productcomboedit[class][class][class],html body .productcombomenu .productcomborow button.productcombodelete[class][class][class],html body .productcombomenu .productcomborow .candidateorderbuttons button[class][class][class]{background:transparent!important;border:0!important;border-radius:0!important;color:#007AFF!important;font-size:12.5px!important;font-weight:500!important;padding:0 2px!important;height:auto!important;min-height:0!important;box-shadow:none!important;line-height:1.2!important}
html body .productcombomenu .productcomborow button.productcomboedit[class][class][class]:hover,html body .productcombomenu .productcomborow button.productcombodelete[class][class][class]:hover{text-decoration:underline!important;background:transparent!important}

/* ---- product toolbar: owner select sits right of the search box ---- */
html body div:has(>select[aria-label="所属客户"]){display:flex!important;align-items:center!important;gap:8px!important;flex-wrap:nowrap!important}
html body div:has(>select[aria-label="所属客户"])>.search{order:1!important;flex:0 1 360px!important;margin:0!important}
html body div:has(>select[aria-label="所属客户"])>select[aria-label="所属客户"]{order:2!important;height:36px!important;min-height:36px!important;width:auto!important;min-width:150px!important;border-radius:10px!important;border:1px solid #E0DFDB!important;background:#FFFFFF!important;font-size:13px!important;padding:0 10px!important;margin:0!important}
html body div:has(>select[aria-label="所属客户"])>select[aria-label="所属客户"]+*{margin-left:0!important}

/* ---- owner select matches the search field height exactly ---- */
html body div:has(>select[aria-label="所属客户"])>select[aria-label="所属客户"]{height:38px!important;min-height:38px!important;line-height:36px!important;box-sizing:border-box!important}

/* ---- table header height is draggable again (border-box) ---- */
html body table thead th{box-sizing:border-box!important;line-height:1.25!important;padding-top:4px!important;padding-bottom:4px!important}
html body .customerdragtable thead th{box-sizing:border-box!important}
html body table tbody td{box-sizing:border-box!important}

/* ---- compact header cells so the height can shrink ---- */
html body table thead th{padding-top:2px!important;padding-bottom:2px!important;line-height:1.2!important}
html body table thead th select{height:28px!important;min-height:28px!important;font-size:12.5px!important;padding:0 6px!important}
html body table thead th button{height:24px!important;min-height:24px!important;padding:0 8px!important;font-size:12px!important}
html body table thead th input{height:26px!important;min-height:26px!important;font-size:12.5px!important}
html body table thead th .orderexcelfilter{height:22px!important;min-height:22px!important;width:22px!important;padding:0!important}

/* ---- header filter controls shrink so the header height can be reduced ---- */
html body table thead th>label{display:flex!important;flex-direction:row!important;align-items:center!important;gap:6px!important;font-size:11.5px!important;line-height:1!important;margin:0!important;height:auto!important;min-height:0!important}
html body table thead th select{height:24px!important;min-height:24px!important;font-size:12px!important;margin:0!important}
html body table thead th .categoryfilter{height:24px!important;min-height:24px!important;font-size:12px!important;padding:0 4px!important}

/* ---- primary buttons: light blue tint instead of gray ---- */
html body button.primary[class][class],html body .panel button.primary[class][class],html body button[data-function-color="save"][class][class][class]{background:#E6F0FF!important;color:#0058CC!important;border:1px solid #CFE0F8!important;border-radius:12px!important;font-weight:600!important;box-shadow:none!important}
html body button.primary[class][class]:hover,html body .panel button.primary[class][class]:hover{background:#D8E7FF!important}
html body button.primary[class][class] svg{stroke:#0058CC!important;color:#0058CC!important}

/* ---- primary buttons: light blue tint, max specificity ---- */
html body .panel button.primary[class][class][class],html body button.primary[class][class][class],html body button[data-function-color="save"][class][class][class][class]{background:#E6F0FF!important;color:#0058CC!important;border:1px solid #CFE0F8!important;border-radius:12px!important;font-weight:600!important;box-shadow:none!important}
html body .panel button.primary[class][class][class]:hover,html body button.primary[class][class][class]:hover{background:#D8E7FF!important}
html body .panel button.primary[class][class][class] svg,html body button.primary[class][class][class] svg{stroke:#0058CC!important;color:#0058CC!important}

/* ---- candidate add action becomes a top list row ---- */
html body .productcombomenu{display:flex!important;flex-direction:column!important;padding:0!important}
html body .productcombomenu .productcombochoices{order:2!important}
html body .productcombomenu .productcombofooter{order:1!important;margin:0!important;padding:0!important;border:0!important;border-bottom:1px solid #F0EFEC!important;background:transparent!important}
html body .productcombomenu .productcombofooter button{width:100%!important;text-align:left!important;justify-content:flex-start!important;display:flex!important;align-items:center!important;background:transparent!important;border:0!important;border-radius:0!important;color:#007AFF!important;font-size:12.5px!important;font-weight:500!important;height:32px!important;min-height:32px!important;padding:0 10px!important;box-shadow:none!important}
html body .productcombomenu .productcombofooter button:hover{background:#EAF2FF!important}
html body .productcombomenu .productcombofooter button:disabled{color:#B9C6C0!important;background:transparent!important}
html body .productcombomenu .productcomboempty{order:2!important;margin:0!important;padding:12px 10px!important;color:#8A8984!important;font-size:12.5px!important}

/* ---- product editor panels: white surfaces, neutral chrome ---- */
html body .producttemplatetools{background:#FFFFFF!important;border:1px solid #E7E6E2!important;border-radius:12px!important}
html body .templateentry{background:#F7F7F5!important;border:1px solid #E7E6E2!important;border-radius:12px!important;color:#1C1C1E!important}
html body .templateentrytitle{color:#1C1C1E!important}
html body .templateentryicon{background:#ECEBE8!important;color:#5F5E5A!important;border-radius:8px!important}
html body .productimagefield{background:#FFFFFF!important;border:1px solid #E7E6E2!important;border-radius:12px!important}
html body .productimageempty{background:#F7F7F5!important;border:1px dashed #D9D8D3!important;border-radius:10px!important;color:#8A8984!important}
html body .selectedproductimage{background:#F7F7F5!important;border-radius:10px!important}
html body .productmeasurefields,html body .boxfields,html body .productpackagingpanel{background:#FFFFFF!important;border:1px solid #E7E6E2!important;border-radius:12px!important}
html body .boxdimensions{background:transparent!important}
html body .unitweighthint{color:#8A8984!important}
html body .productdescriptionfields{background:#FFFFFF!important;border:1px solid #E7E6E2!important;border-radius:12px!important}
html body .productdescriptiontoggles label{color:#4A4A46!important}
html body .productdescriptioninputs{background:transparent!important}
html body .productbasicsgrid{background:transparent!important}

/* ---- login card: neutral link + tighter fields ---- */
html body .accountlogin .accountbrowserlink{color:#007AFF!important;font-size:13px!important;font-weight:600!important;text-decoration:none!important;display:inline-block!important;margin:2px 0 6px!important}
html body .accountlogin .accountbrowserlink:hover{text-decoration:underline!important}
html body .accountlogin .panel{background:#FFFFFF!important;border:1px solid #E7E6E2!important;border-radius:18px!important;box-shadow:0 10px 30px rgba(0,0,0,.06)!important;padding:22px 24px!important}
html body .accountlogin h1{font-size:22px!important;margin:6px 0 10px!important;color:#1C1C1E!important}
html body .accountlogin p{color:#6C6B66!important;font-size:13px!important;margin:6px 0!important}
html body .accountlogin form{display:flex!important;flex-direction:column!important;gap:10px!important;margin:8px 0 0!important}
html body .accountlogin label{display:flex!important;flex-direction:column!important;gap:4px!important;margin:0!important;font-size:12.5px!important;color:#6C6B66!important}
html body .accountlogin input{height:38px!important;min-height:38px!important;border-radius:10px!important}
html body .accountlogin .primary{background:#E6F0FF!important;color:#0058CC!important;border:1px solid #CFE0F8!important;border-radius:12px!important;height:34px!important}
html body .accountlogin .accountcontrols{margin-top:6px!important;gap:8px!important}
html body .accountlogin .quiet.accountrecheck{background:#E8E8E6!important;color:#007AFF!important;border:0!important;border-radius:12px!important}

/* ---- price catalog as a table ---- */
html body .priceproductlist{display:block!important;padding:0 12px 12px!important;gap:0!important}
html body .priceproducthead{display:grid!important;grid-template-columns:18px 40px 110px minmax(180px,1fr) 170px 130px 150px 100px!important;align-items:center!important;gap:12px!important;padding:8px 12px!important;background:#ECEBE8!important;border:1px solid #E0DFDA!important;border-radius:10px!important;color:#5F5E5A!important;font-size:12px!important;font-weight:600!important;margin-bottom:8px!important}
html body .priceproducthead i{display:block!important}
html body .priceproduct{border:1px solid #E7E6E2!important;border-radius:10px!important;background:#FFFFFF!important;margin-bottom:6px!important;overflow:hidden!important}
html body .priceproduct>summary{display:grid!important;grid-template-columns:18px 40px 110px minmax(180px,1fr) 170px 130px 150px 100px!important;align-items:center!important;gap:12px!important;padding:8px 12px!important;background:#FFFFFF!important;border:0!important;min-height:44px!important}
html body .priceproduct>summary:hover{background:#F7F7F5!important}
html body .priceproduct>summary:before{content:"▸"!important;color:#8A8984!important;font-size:11px!important}
html body .priceproduct[open]>summary:before{content:"▾"!important}
html body .priceproductimage{width:34px!important;height:34px!important;border-radius:6px!important;object-fit:cover!important;border:1px solid #E0DFDA!important;background:#F7F7F5!important}
html body .pricecode strong{font-size:13px!important;color:#1C1C1E!important;font-weight:600!important}
html body .pricename{font-size:13px!important;color:#1C1C1E!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
html body .pricespec{font-size:12.5px!important;color:#6C6B66!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
html body .pricesupplier{font-size:12.5px!important;color:#6C6B66!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
html body .priceupdatedtime{font-size:12px!important;color:#8A8984!important;margin:0!important;display:block!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
html body .priceproductcount{font-size:12.5px!important;color:#007AFF!important;white-space:nowrap!important;justify-self:start!important}
html body .priceproduct[open]{border-color:#CFE0F8!important;box-shadow:0 0 0 2px rgba(0,122,255,.08)!important}

/* ---- price table rows: no dot separators, neutral text ---- */
html body .priceproduct>summary>span::before,html body .priceproduct>summary>small::before{content:none!important;display:none!important}
html body .priceproduct>summary>span,html body .priceproduct>summary>small{color:#1C1C1E!important;font-size:13px!important}
html body .priceproduct>summary .pricespec,html body .priceproduct>summary .pricesupplier,html body .priceproduct>summary .priceupdatedtime{color:#6C6B66!important;font-size:12.5px!important}
html body .priceproduct>summary .priceproductcount{color:#007AFF!important;font-size:12.5px!important}
html body .priceproduct{border-left:1px solid #E7E6E2!important;border-right:1px solid #E7E6E2!important}

/* ---- product toolbar: select hugs search, actions flush right ---- */
html body div:has(>select[aria-label="所属客户"]){padding-right:14px!important;gap:8px!important}
html body div:has(>select[aria-label="所属客户"])>.search{flex:0 0 300px!important;max-width:300px!important;margin-right:0!important}
html body div:has(>select[aria-label="所属客户"])>select[aria-label="所属客户"]{margin-left:0!important;flex:0 0 auto!important}
html body div:has(>select[aria-label="所属客户"])>select[aria-label="所属客户"]+*{margin-left:auto!important}
html body div:has(>select[aria-label="所属客户"])>button:last-child{margin-right:0!important}

/* ---- price PDF button matches the grey secondary button ---- */
html body button.pricepdfbutton[class][class][class],html body .panel button.pricepdfbutton[class][class][class]{background:#E8E8E6!important;color:#007AFF!important;border:0!important;border-radius:12px!important;font-weight:600!important;box-shadow:none!important}
html body button.pricepdfbutton[class][class][class]:hover,html body .panel button.pricepdfbutton[class][class][class]:hover{background:#DEDEDB!important}
html body button.pricepdfbutton[class][class][class]:disabled{background:#E8E8E6!important;color:#B9C6C0!important}

/* ---- customer form: neutral print options and address cards ---- */
html body .customerprintoptions{display:flex!important;gap:12px!important;flex-wrap:wrap!important}
html body .customerlabelmode,html body .customerprintmode{background:#F7F7F5!important;border:1px solid #E7E6E2!important;border-radius:12px!important;color:#4A4A46!important;padding:12px 14px!important}
html body .customerlabelmode>span,html body .customerprintmode>span{color:#1C1C1E!important;font-weight:600!important;font-size:13px!important}
html body .customerlabelmode label,html body .customerprintmode label{color:#4A4A46!important;font-size:12.5px!important}
html body .customerlabelmode small,html body .customerprintmode small{color:#8A8984!important;font-size:11.5px!important}
html body .customerlabelmode input[type="radio"],html body .customerprintmode input[type="radio"]{width:14px!important;height:14px!important;min-height:14px!important;margin:0 4px 0 0!important;accent-color:#007AFF!important}
html body .deliveryaddressgrid>section{background:#FFFFFF!important;border:1px solid #E7E6E2!important;border-radius:12px!important;overflow:hidden!important}
html body .deliveryaddressheading{background:#ECEBE8!important;border:0!important;border-bottom:1px solid #E0DFDA!important;border-radius:0!important;padding:8px 12px!important}
html body .deliveryaddressheading h3{color:#1C1C1E!important;font-size:13px!important;font-weight:600!important;margin:0!important}
html body .deliveryaddressgrid section>.customercontactgrid,html body .deliveryaddressgrid section>label{background:transparent!important}
html body .deliveryaddresspaste textarea{background:#FFFFFF!important;border:1px solid #E0DFDB!important;border-radius:10px!important;color:#1C1C1E!important}
html body .deliveryaddresspaste button{background:#E8E8E6!important;color:#007AFF!important;border:0!important;border-radius:10px!important}

/* ---- combo chevrons sit inside their field ---- */
html body .productcombocontrol{position:relative!important;display:flex!important;align-items:center!important;width:100%!important;min-width:0!important}
html body .productcombocontrol>input,html body .productcombocontrol>button:not(.productcombochevron){width:100%!important;padding-right:34px!important}
html body .productcombochevron{position:absolute!important;right:6px!important;top:50%!important;transform:translateY(-50%)!important;width:24px!important;min-width:24px!important;height:24px!important;min-height:24px!important;padding:0!important;margin:0!important;display:flex!important;align-items:center!important;justify-content:center!important;background:transparent!important;border:0!important;box-shadow:none!important;color:#8A8984!important;z-index:2!important}
html body .productcombochevron:hover{background:transparent!important;color:#007AFF!important}
html body .productcombochevron svg{width:14px!important;height:14px!important;stroke:currentColor!important}

/* ---- price table: explicit column placement ---- */
html body .priceproduct>summary::before{grid-column:1!important;grid-row:1!important}
html body .priceproduct>summary>img.priceproductimage{grid-column:2!important;grid-row:1!important}
html body .priceproduct>summary>.pricecode{grid-column:3!important;grid-row:1!important}
html body .priceproduct>summary>.pricename{grid-column:4!important;grid-row:1!important}
html body .priceproduct>summary>.pricespec{grid-column:5!important;grid-row:1!important}
html body .priceproduct>summary>.pricesupplier{grid-column:6!important;grid-row:1!important}
html body .priceproduct>summary>.priceupdatedtime{grid-column:7!important;grid-row:1!important}
html body .priceproduct>summary>.priceproductcount{grid-column:8!important;grid-row:1!important}
html body .priceproducthead>span:nth-child(1){grid-column:3!important}
html body .priceproducthead>span:nth-child(2){grid-column:4!important}
html body .priceproducthead>span:nth-child(3){grid-column:5!important}
html body .priceproducthead>span:nth-child(4){grid-column:6!important}
html body .priceproducthead>span:nth-child(5){grid-column:7!important}
html body .priceproducthead>span:nth-child(6){grid-column:8!important}

/* ---- price header cells use nth-of-type placement ---- */
html body .priceproducthead>span:nth-of-type(1){grid-column:3!important;grid-row:1!important}
html body .priceproducthead>span:nth-of-type(2){grid-column:4!important;grid-row:1!important}
html body .priceproducthead>span:nth-of-type(3){grid-column:5!important;grid-row:1!important}
html body .priceproducthead>span:nth-of-type(4){grid-column:6!important;grid-row:1!important}
html body .priceproducthead>span:nth-of-type(5){grid-column:7!important;grid-row:1!important}
html body .priceproducthead>span:nth-of-type(6){grid-column:8!important;grid-row:1!important}
html body .priceproducthead{grid-auto-flow:row!important;min-height:36px!important;align-items:center!important;white-space:nowrap!important}

/* ---- price table: fully fixed column widths ---- */
html body .priceproducthead,html body .priceproduct>summary{grid-template-columns:18px 40px 110px 320px 180px 140px 150px 110px!important;grid-auto-columns:0!important;grid-auto-flow:row!important}
html body .priceproduct>summary{overflow:hidden!important}
html body .priceproductlist{overflow-x:auto!important}

/* ---- product toolbar order: import/template left, filters right ---- */
html body .excelactions{display:contents!important}
html body div:has(>select[aria-label="所属客户"])>.search{order:1!important}
html body div:has(>select[aria-label="所属客户"])>select[aria-label="所属客户"]{order:2!important}
html body div:has(>select[aria-label="所属客户"]) .excelactions>button.secondary{order:3!important}
html body div:has(>select[aria-label="所属客户"]) .excelactions>button.link{order:4!important}
html body div:has(>select[aria-label="所属客户"])>button[class=""]{order:5!important}
html body div:has(>select[aria-label="所属客户"]) .excelactions>button[data-function-color="excel"]{order:6!important}
html body div:has(>select[aria-label="所属客户"])>.packagingfilter{order:7!important}
html body div:has(>select[aria-label="所属客户"])>.table-size-control{order:8!important}
html body div:has(>select[aria-label="所属客户"])>button.primary{order:9!important}
html body div:has(>select[aria-label="所属客户"])>.packagingfilter{margin-left:auto!important}

/* ---- product toolbar: explicit flex order, high specificity ---- */
html body div:has(>select[aria-label="所属客户"])>.search[class]{order:1!important;margin-left:0!important}
html body div:has(>select[aria-label="所属客户"])>select[aria-label="所属客户"][aria-label]{order:2!important;margin-left:0!important}
html body div:has(>select[aria-label="所属客户"]) .excelactions>button.secondary[class]{order:3!important;margin-left:0!important}
html body div:has(>select[aria-label="所属客户"]) .excelactions>button.link[class]{order:4!important;margin-left:0!important}
html body div:has(>select[aria-label="所属客户"])>button[class=""]{order:5!important;margin-left:0!important}
html body div:has(>select[aria-label="所属客户"]) .excelactions>button[data-function-color="excel"]{order:6!important;margin-left:0!important}
html body div:has(>select[aria-label="所属客户"])>button.packagingfilter[class]{order:7!important;margin-left:auto!important}
html body div:has(>select[aria-label="所属客户"])>.table-size-control[class]{order:8!important;margin-left:0!important}
html body div:has(>select[aria-label="所属客户"])>button.primary[class]{order:9!important;margin-left:0!important}

/* ---- bulk-delete order fix ---- */
html body div:has(>select[aria-label="所属客户"])>button:not([class]){order:5!important;margin-left:0!important}
html body div:has(>select[aria-label="所属客户"])>button.bulkdelete[class],html body div:has(>select[aria-label="所属客户"])>button[data-function-color="delete"][class]{order:5!important}

/* ---- toolbar order: nth-of-type inside excel actions ---- */
html body div:has(>select[aria-label="所属客户"]) .excelactions>button:nth-of-type(1){order:3!important}
html body div:has(>select[aria-label="所属客户"]) .excelactions>button:nth-of-type(3){order:4!important}
html body div:has(>select[aria-label="所属客户"]) .excelactions>button:nth-of-type(2){order:6!important}
html body div:has(>select[aria-label="所属客户"])>button[class=""]{order:5!important;margin-left:0!important}

/* ---- print options: two equal halves matching the address cards ---- */
html body .customerprintoptions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:16px!important;align-items:stretch!important}
html body .customerlabelmode,html body .customerprintmode{width:100%!important;min-width:0!important;box-sizing:border-box!important}

/* ---- price table header row removed ---- */
html body .priceproducthead{display:none!important}

/* ---- table-size drag handles stay visible and clickable ---- */
html body .customerdragtable.sizingactive th{overflow:visible!important;position:relative!important;z-index:4!important}
html body .customerdragtable.sizingactive th>span,html body .customerdragtable.sizingactive th>i{pointer-events:auto!important;z-index:5!important}
html body .priceproduct{overflow:visible!important}
html body .priceproduct .customertablearea{overflow:visible!important}
html body .priceproduct .tablewrap{overflow:auto!important}
html body .priceproduct>summary{overflow:visible!important}
html body .tablewrap{overflow:auto!important}

/* ---- price tier table: white add row + visible outline ---- */
html body .priceproduct table{border:1px solid #D3D2CE!important;border-collapse:collapse!important;background:#FFFFFF!important}
html body .priceproduct table th{background:#ECEBE8!important;border:1px solid #D3D2CE!important;color:#4A4A46!important}
html body .priceproduct table td{background:#FFFFFF!important;border:1px solid #E0DFDA!important}
html body .priceproduct table tr.addtierrow td,html body .priceproduct table td[colspan]{background:#FFFFFF!important;border:1px solid #E0DFDA!important}
html body .priceproduct table tr:hover>td{background:#F7F7F5!important}
html body .priceproduct .tablewrap{border:1px solid #D9D8D3!important;border-radius:8px!important;background:#FFFFFF!important}
html body .priceproduct table td button{background:transparent!important;color:#007AFF!important;border:0!important}

/* ---- default placeholder image for products without a photo ---- */
html body .priceproductimage.priceimageplaceholder{display:block!important;width:34px!important;height:34px!important;border-radius:6px!important;border:1px solid #E0DFDA!important;background-color:#F7F7F5!important;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40'><rect width='40' height='40' rx='6' fill='%23F2F1EE'/><path d='M9 27l7-8 5 6 4-4 6 6z' fill='%23C9C8C2'/><circle cx='27' cy='13' r='3' fill='%23C9C8C2'/></svg>")!important;background-repeat:no-repeat!important;background-position:center!important;background-size:26px 26px!important}

/* ---- price tier table: borders on every cell incl. empty state ---- */
html body .priceproduct table,html body .priceproduct table.productgrid{border:1px solid #C9C8C2!important;border-collapse:collapse!important;background:#FFFFFF!important}
html body .priceproduct table th{border:1px solid #C9C8C2!important;background:#ECEBE8!important;color:#4A4A46!important}
html body .priceproduct table td{border:1px solid #D9D8D3!important;background:#FFFFFF!important}
html body .priceproduct table tfoot td{border:1px solid #D9D8D3!important;background:#FFFFFF!important}
html body .priceproduct table tbody tr:hover>td,html body .priceproduct table tfoot tr:hover>td{background:#F7F7F5!important}
html body .priceproduct table td input{background:#FFFFFF!important;border:1px solid #E0DFDB!important;border-radius:6px!important}
html body .priceproduct table td input[data-required],html body .priceproduct table td .pricerequired input{background:#FFF6F8!important;border-color:#F3C9D2!important}

/* ---- hide USD sale-price columns in the price tier table ---- */

/* ---- remove per-product save button, tidy the uniform row ---- */
html body .priceproduct .priceuniformbar{background:transparent!important;border:0!important;padding:4px 0!important;box-shadow:none!important;display:flex!important;align-items:center!important;gap:10px!important}
html body .priceproduct .priceuniformbar label{color:#4A4A46!important;font-size:12.5px!important}

/* ---- products without tiers: no empty table, only the add button ---- */
html body .priceproduct.notiers table{border:0!important;width:auto!important;background:transparent!important}
html body .priceproduct.notiers thead{display:none!important}
html body .priceproduct.notiers tbody{display:none!important}
html body .priceproduct.notiers tfoot td[colspan]{display:none!important}
html body .priceproduct.notiers tfoot td{display:table-cell!important;border:0!important;background:transparent!important;padding:4px 0!important}
html body .priceproduct.notiers tfoot tr{display:table-row!important}
html body .priceproduct.notiers .tablewrap{border:0!important;background:transparent!important}

/* ---- price tier table: drop empty placeholder cells ---- */

/* ---- price tier table: drop trailing placeholder columns ---- */

/* ---- show the 单个销售价（USD） column again ---- */
html body .priceproduct table thead th:nth-child(9),html body .priceproduct table tbody td:nth-child(9),html body .priceproduct table tfoot td:nth-child(9){display:table-cell!important}

/* ---- reminder / confirm dialogs: title, text and actions all centred ---- */
html body .workspacecloseoverlay .paneltitle,html body .workspacecloseoverlay .paneltitle h2{margin:0 auto!important;justify-content:center!important;text-align:center!important;width:auto!important}
html body .workspacecloseoverlay .paneltitle h2{flex:0 0 auto!important}
html body [class*="confirm"]>.paneltitle,html body [class*="deletemodal"]>.paneltitle,html body [class*="shortagemodal"]>.paneltitle,html body [class*="deleteconfirm"]>.paneltitle{justify-content:center!important;text-align:center!important}
html body [class*="confirm"]>.paneltitle h2,html body [class*="deletemodal"]>.paneltitle h2,html body [class*="shortagemodal"]>.paneltitle h2,html body [class*="deleteconfirm"]>.paneltitle h2{margin-left:0!important;margin-right:0!important;text-align:center!important;width:100%!important}
html body [class*="confirm"]>p,html body [class*="deletemodal"]>p,html body [class*="shortagemodal"]>p,html body [class*="deleteconfirm"]>p{text-align:center!important}
html body [class*="confirm"]>div:last-child,html body [class*="deletemodal"]>div:last-child,html body [class*="shortagemodal"]>div:last-child,html body [class*="deleteconfirm"]>div:last-child{justify-content:center!important;display:flex!important;gap:8px!important;flex-wrap:wrap!important}

/* ---- price tier table: no visible scrollbar when content fits ---- */
html body .priceproduct .tablewrap{overflow:auto!important;scrollbar-width:none!important;-ms-overflow-style:none!important}
html body .priceproduct .tablewrap::-webkit-scrollbar{width:0!important;height:0!important;display:none!important}

/* ---- hide the customer summary strip above the tabs ---- */
html body .customerdetail{display:none!important}

/* ---- price history trigger + dialog ---- */
html body .pricehistoryopen{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:22px!important;min-width:22px!important;height:22px!important;min-height:22px!important;padding:0!important;margin:0 6px 0 0!important;background:transparent!important;border:0!important;color:#8A8984!important;font-size:12px!important;box-shadow:none!important;vertical-align:middle!important}
html body .pricehistoryopen:hover{color:#007AFF!important;background:transparent!important}
html body .priceproduct table td .pricehistoryopen{margin-left:4px!important;margin-right:0!important}
html body .pricehistorymodal{width:min(820px,94vw)!important;max-width:820px!important}
html body .pricehistorymodal .paneltitle{justify-content:space-between!important}
html body .pricehistorymodal .paneltitle h2{font-size:17px!important;margin:0!important}
html body .pricehistorymodal .hint{margin:10px 16px!important}
html body .pricehistorymodal .tablewrap{margin:0 16px 16px!important;border:1px solid #E0DFDA!important;border-radius:10px!important;overflow:auto!important;max-height:60vh!important}
html body .pricehistorymodal .pricehistoryempty{margin:0!important;padding:18px!important;color:#8A8984!important;text-align:center!important}

/* ---- candidate dialog: taller list ---- */
html body .productcombomenu{max-height:min(64vh,600px)!important}
html body .modal:has(.productcombomenu){max-height:84vh!important}
html body .modalscroll:has(.productcombomenu),html body .selectiondialog:has(.productcombomenu){max-height:84vh!important}

/* ---- combo chevron: transparent, perfectly centred ---- */
html body button.productcombochevron[class][class]{position:absolute!important;top:50%!important;right:6px!important;transform:translateY(-50%)!important;width:24px!important;min-width:24px!important;height:24px!important;min-height:24px!important;padding:0!important;margin:0!important;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;color:#8A8984!important;display:flex!important;align-items:center!important;justify-content:center!important;line-height:1!important}
html body button.productcombochevron[class][class]:hover{background:transparent!important;color:#007AFF!important}
html body button.productcombochevron[class][class] svg{width:14px!important;height:14px!important;display:block!important;margin:0 auto!important}

/* ---- combo chevron: no circle, arrow centred (max specificity) ---- */
html body button.productcombochevron[class][class][class][class]{background:transparent!important;border:0!important;box-shadow:none!important;border-radius:0!important;width:24px!important;min-width:24px!important;height:24px!important;min-height:24px!important;padding:0!important;color:#6C6B66!important;font-size:12px!important;line-height:1!important;display:flex!important;align-items:center!important;justify-content:center!important;position:absolute!important;top:50%!important;right:8px!important;transform:translateY(-50%)!important}
html body button.productcombochevron[class][class][class][class]:hover{background:transparent!important;color:#007AFF!important}

/* ---- combo chevron drawn as a clean CSS chevron ---- */
html body button.productcombochevron[class][class][class][class]{font-size:0!important;color:transparent!important}
html body button.productcombochevron[class][class][class][class]::before{content:""!important;display:block!important;width:8px!important;height:8px!important;margin-top:-4px!important;border-right:1.6px solid #6C6B66!important;border-bottom:1.6px solid #6C6B66!important;transform:rotate(45deg)!important}
html body button.productcombochevron[class][class][class][class]:hover::before{border-color:#007AFF!important}

/* ---- modal close buttons: red circle everywhere ---- */
html body .paneltitle>button[aria-label*="关闭"][class],html body .paneltitle>button[aria-label="关闭"],html body .paneltitle>button.quiet[class]{background:#FF3B30!important;color:#FFFFFF!important;border:0!important;border-radius:50%!important;width:24px!important;min-width:24px!important;height:24px!important;min-height:24px!important;padding:0!important;font-size:0!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;box-shadow:none!important}
html body .paneltitle>button[aria-label*="关闭"][class]::before,html body .paneltitle>button.quiet[class]::before{content:"×"!important;font-size:14px!important;line-height:1!important;color:#FFFFFF!important}
html body .paneltitle>button.quiet[class]>*{display:none!important}

/* ---- panel close button: red circle (max specificity) ---- */
html body .paneltitle>button.quiet[class][class][class]{background:#FF3B30!important;color:#FFFFFF!important;border:0!important;border-radius:50%!important;width:26px!important;min-width:26px!important;height:26px!important;min-height:26px!important;padding:0!important;font-size:0!important;line-height:1!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;box-shadow:none!important}
html body .paneltitle>button.quiet[class][class][class]>*{display:none!important}
html body .paneltitle>button.quiet[class][class][class]::before{content:"×"!important;font-size:15px!important;line-height:1!important;color:#FFFFFF!important;font-weight:600!important}
html body .paneltitle>button.quiet[class][class][class]:hover{background:#E0332A!important}

/* ---- template manager dialog: neutral theme ---- */
html body .templatemanager{background:#FFFFFF!important;color:#1C1C1E!important}
html body .templatemanager .templatesearch{background:#FFFFFF!important;border:1px solid #E0DFDB!important;color:#1C1C1E!important;border-radius:10px!important}
html body .templatemanager .templatecatalog{border:1px solid #E7E6E2!important;border-radius:12px!important;background:#FFFFFF!important;overflow:hidden!important}
html body .templatemanager .templatecatalogheading{background:#ECEBE8!important;border:0!important;border-bottom:1px solid #E0DFDA!important;color:#1C1C1E!important;border-radius:0!important}
html body .templatemanager .templatecatalogheading strong,html body .templatemanager .templatecatalogheading label{color:#1C1C1E!important;font-weight:600!important}
html body .templatemanager .templatecatalogrow{background:#FFFFFF!important;border-bottom:1px solid #F0EFEC!important}
html body .templatemanager .templatecatalogrow:hover{background:#F7F7F5!important}
html body .templatemanager .templatecatalogtext,html body .templatemanager .templatecatalogtext strong{color:#1C1C1E!important}
html body .templatemanager .templatecatalogempty,html body .templatemanager .templatehint{color:#8A8984!important}
html body .templatemanager p[role="status"]{color:#6C6B66!important}
html body .templatemanager button.secondary,html body .templatemanager button.primary{background:#E8E8E6!important;color:#007AFF!important;border:0!important;border-radius:12px!important;font-weight:600!important}
html body .templatemanager button.secondary:hover{background:#DEDEDB!important}
html body .templatemanager .templatedelete,html body .templatemanager button[data-function-color="delete"]{background:#FF3B30!important;color:#FFFFFF!important;border:0!important;border-radius:12px!important}
html body .templatemanager .templatepickbtn,html body .templatemanager .templatesavebtn{background:#E6F0FF!important;color:#0058CC!important;border:1px solid #CFE0F8!important;border-radius:12px!important}

/* ---- customer tabs: larger hit area and text ---- */
html body .inboundtabs[class]{padding:4px!important;gap:4px!important;border-radius:14px!important}
html body .inboundtabs[class]>button{height:30px!important;min-height:30px!important;padding:0 16px!important;font-size:14px!important;border-radius:10px!important;font-weight:600!important}
html body .inboundtabs[class]>button.active{background:#FFFFFF!important;color:#1C1C1E!important;box-shadow:0 1px 3px rgba(0,0,0,.12)!important}

/* ---- PO helper fields share one light blue fill ---- */
html body input.fieldhighlight-po[class][class],html body textarea.fieldhighlight-po[class][class]{background:#F1F6FF!important;border:1px solid #D9E6FA!important;color:#1C1C1E!important;border-radius:10px!important}
html body input.fieldhighlight-po[class][class]:focus,html body textarea.fieldhighlight-po[class][class]:focus{background:#FFFFFF!important;border-color:#007AFF!important;box-shadow:0 0 0 3px rgba(0,122,255,.15)!important}

/* ---- auto-filled fields share one light green fill ---- */
html body input.fieldhighlight[class][class],html body textarea.fieldhighlight[class][class],html body select.fieldhighlight[class][class]{background:#F3FAF5!important;border:1px solid #D8EADF!important;color:#1C1C1E!important;border-radius:10px!important}
html body input.fieldhighlight[class][class]:focus,html body textarea.fieldhighlight[class][class]:focus{background:#FFFFFF!important;border-color:#1C8F4A!important;box-shadow:0 0 0 3px rgba(28,143,74,.15)!important}

/* ---- batch upload dialog: table-size button right aligned ---- */
html body .customerbatchsizing{display:flex!important;justify-content:flex-end!important;width:100%!important;margin:8px 0 10px!important;gap:8px!important}
html body .customerbatchsizing .table-size-control{display:inline-flex!important;justify-content:flex-end!important;margin-left:auto!important}

/* ---- template dialog: toolbar + review row buttons neutral ---- */
html body .selectiondialog:has(.templatemanager) button.secondary,html body .selectiondialog:has(.templatemanager) button.primary,html body .selectiondialog:has(.templatemanager) button.quiet{background:#E8E8E6!important;color:#007AFF!important;border:0!important;border-radius:12px!important;font-weight:600!important;box-shadow:none!important}
html body .selectiondialog:has(.templatemanager) button.secondary:hover,html body .selectiondialog:has(.templatemanager) button.primary:hover{background:#DEDEDB!important}
html body .selectiondialog:has(.templatemanager) button[data-function-color="delete"],html body .selectiondialog:has(.templatemanager) .templatedelete{background:#FF3B30!important;color:#FFFFFF!important}
html body .templatecatalogrow button,html body .templateimportrow button,html body .templatecatalogactions button,html body .importreviewrow button{background:#E8E8E6!important;color:#007AFF!important;border:0!important;border-radius:12px!important;font-weight:600!important;height:26px!important;min-height:26px!important;padding:0 12px!important;box-shadow:none!important}
html body .templatecatalogrow button:hover,html body .templateimportrow button:hover{background:#DEDEDB!important}

/* ---- panel close button: glyph and position centred ---- */
html body .paneltitle>button.quiet[class][class][class]{display:inline-grid!important;place-items:center!important;line-height:1!important;vertical-align:middle!important;align-self:center!important;margin:0 0 0 auto!important}
html body .paneltitle>button.quiet[class][class][class]::before{margin:0!important;padding:0!important;transform:none!important;display:block!important;line-height:1!important;text-align:center!important}
html body .paneltitle{align-items:center!important}

/* ---- modal headers: keep the close button clear of the scrollbar ---- */
html body .paneltitle,html body .selectiondialogheading{padding-right:16px!important}
html body .paneltitle>button.quiet[class][class][class]{margin-right:2px!important}

/* ---- image library card: compact icon buttons inside the card ---- */
html body .imagecard .imagecopybtn,html body .imagecard .imagepreviewlink,html body .imagecard .imagerenamebtn,html body .imagecard .imagedeletebtn{width:24px!important;min-width:24px!important;height:24px!important;min-height:24px!important;padding:0!important;border-radius:8px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;background:#E8E8E6!important;color:#007AFF!important;border:0!important;box-shadow:none!important;line-height:1!important}
html body .imagecard .imagecopybtn svg,html body .imagecard .imagepreviewlink svg,html body .imagecard .imagerenamebtn svg,html body .imagecard .imagedeletebtn svg{width:14px!important;height:14px!important;stroke:currentColor!important;color:inherit!important;display:block!important}
html body .imagecard .imagedeletebtn svg{stroke:#FF3B30!important;color:#FF3B30!important}
html body .imagecard>div:nth-last-child(1),html body .imagecard .imageactions{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:6px!important;padding:0 8px 8px!important;flex-wrap:nowrap!important}
html body .imagecard{overflow:hidden!important}

/* ---- image card: hide the preview (eye) button ---- */
html body .imagecard .imagepreviewlink{display:none!important}

/* ---- image viewer actions use system button colours ---- */
html body .imagevieweractions a.imagepreviewlink,html body .imagevieweractions .imagepreviewlink{background:#E8E8E6!important;color:#007AFF!important;border:0!important;border-radius:12px!important;height:26px!important;min-height:26px!important;padding:0 14px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;font-size:12.5px!important;font-weight:600!important;text-decoration:none!important;box-shadow:none!important}
html body .imagevieweractions a.imagepreviewlink:hover{background:#DEDEDB!important}
html body .imagevieweractions button.primary{background:#E6F0FF!important;color:#0058CC!important;border:1px solid #CFE0F8!important;border-radius:12px!important;height:26px!important;min-height:26px!important;padding:0 14px!important;font-size:12.5px!important;font-weight:600!important}
html body .imagevieweractions{display:flex!important;justify-content:flex-end!important;gap:8px!important;padding:8px 12px 4px!important}

/* ---- image viewer: both buttons identical size ---- */
html body .imagevieweractions a.imagepreviewlink,html body .imagevieweractions button.primary,html body .imagevieweractions .imagepreviewlink{width:104px!important;min-width:104px!important;height:26px!important;min-height:26px!important;padding:0!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;font-size:12.5px!important;font-weight:600!important;border-radius:12px!important;box-sizing:border-box!important;line-height:1!important}

/* ---- packaging status select keeps its status colour ---- */

/* ---- all tab bars share one size ---- */
html body .inboundtabs[class][class]>button[class]{height:30px!important;min-height:30px!important;padding:0 16px!important;font-size:14px!important;border-radius:10px!important;font-weight:600!important}
html body .inboundtabs[class][class]>button.primary,html body .inboundtabs[class][class]>button.secondary{height:30px!important;min-height:30px!important}
html body .inboundtabs[class][class]{padding:4px!important;gap:4px!important;border-radius:14px!important}

/* ---- candidate dialog header: compact + close right aligned ---- */
html body .selectiondialogheading{display:flex!important;align-items:center!important;gap:10px!important;padding:10px 14px!important;min-height:0!important}
html body .selectiondialogheading strong{font-size:16px!important;line-height:1.25!important;margin:0!important}
html body .selectiondialogheading>button[aria-label],html body .selectiondialogheading>button{position:static!important;margin-left:auto!important;flex:0 0 auto!important}
html body .hscodecompactdialog .selectionsearch{padding:8px 14px 4px!important}
html body .selectiondialog:has(.productcombomenu) .productcombomenu{margin:0 14px 12px!important}

/* ---- packaging status: whole fieldset tinted, select stays neutral ---- */
html body select.packagingstatus[class]{background:#FFFFFF!important;color:#1C1C1E!important;border:1px solid #E0DFDB!important;border-radius:999px!important;height:28px!important;min-height:28px!important;padding:0 28px 0 12px!important;font-size:12.5px!important;font-weight:600!important}
html body fieldset.boxfields[class]{border:1px solid #E7E6E2!important;border-radius:14px!important;padding:12px 14px!important;transition:background .15s ease}
html body fieldset.boxfields.packagingstate-confirmed[class]{background:#F3FBF6!important;border-color:#CFE9D8!important}
html body fieldset.boxfields.packagingstate-estimated[class]{background:#F5F7FF!important;border-color:#D8DFFF!important}
html body fieldset.boxfields.packagingstate-pending[class]{background:#FFFBF2!important;border-color:#F3E1C7!important}
html body fieldset.boxfields[class]>legend{color:#1C1C1E!important;font-weight:600!important}

/* ---- destructive leave buttons are red ---- */
html body .workspaceclosebody .unsaveddiscard[class][class],html body .workspaceclosebody .unsaveddelete[class][class]{background:#FF3B30!important;color:#FFFFFF!important;border:0!important;border-radius:12px!important;font-weight:600!important;box-shadow:none!important}
html body .workspaceclosebody>div:not(:has(button[data-function-color="save"]))>button[data-function-color="edit"]{background:#FF3B30!important;color:#FFFFFF!important;border:0!important;border-radius:12px!important}
html body .workspaceclosebody .unsaveddiscard[class][class]:hover,html body .workspaceclosebody .unsaveddelete[class][class]:hover{background:#E0332A!important}

/* ---- category chips follow the button size standard ---- */
html body table .tag[class],html body .tag[class]{display:inline-flex!important;align-items:center!important;justify-content:center!important;height:24px!important;min-height:24px!important;padding:0 10px!important;font-size:12.5px!important;font-weight:600!important;line-height:1!important;border-radius:12px!important;box-sizing:border-box!important;white-space:nowrap!important}

/* ---- template dialog buttons: found by the template search field ---- */
html body .selectiondialog:has(input[placeholder*="搜索模板"]) button.secondary,html body .selectiondialog:has(input[placeholder*="搜索模板"]) button.primary,html body .selectiondialog:has(input[placeholder*="搜索模板"]) button.quiet,html body .selectiondialog:has(input[placeholder*="搜索模板"]) a.secondary{background:#E8E8E6!important;color:#007AFF!important;border:0!important;border-radius:12px!important;font-weight:600!important;box-shadow:none!important}
html body .selectiondialog:has(input[placeholder*="搜索模板"]) button[data-function-color="delete"],html body .selectiondialog:has(input[placeholder*="搜索模板"]) button[data-action-tone="red"]{background:#FF3B30!important;color:#FFFFFF!important}
html body .selectiondialog:has(input[placeholder*="搜索模板"]) button.secondary:hover{background:#DEDEDB!important}

/* ---- template import footer: drop close button, align save right ---- */
html body .importreviewfooter{display:flex!important;justify-content:flex-end!important;align-items:center!important;gap:8px!important;padding:8px 18px 10px!important;border-top:1px solid #F0EFEC!important}
html body .importreviewfooter>button[data-act="close"],html body .importreviewfooter>button[data-function-color="back"]{display:none!important}
html body .importreviewfooter>button[data-function-color="save"]{background:#E6F0FF!important;color:#0058CC!important;border:1px solid #CFE0F8!important;border-radius:12px!important;height:26px!important;min-height:26px!important;padding:0 14px!important;font-size:12.5px!important;font-weight:600!important}
html body .importreviewactions{display:flex!important;justify-content:flex-end!important;padding-right:18px!important}

/* ---- active tab keeps a filled grey-blue background ---- */
html body .inboundtabs[class][class]>button.active[class],html body .inboundtabs[class][class]>button[aria-selected="true"][class]{background:#C3CBD3!important;color:#0A4B8C!important;box-shadow:none!important;font-weight:700!important}
html body .inboundtabs[class][class]>button.active[class]:hover{background:#BAC3CC!important}

/* ---- active tab uses the sidebar selection grey ---- */
html body .inboundtabs[class][class]{background:#F5F4F1!important}
html body .inboundtabs[class][class]>button.active[class],html body .inboundtabs[class][class]>button[aria-selected="true"][class]{background:#ECEBE8!important;color:#1C1C1E!important;box-shadow:0 1px 2px rgba(0,0,0,.08)!important;font-weight:700!important}
html body .inboundtabs[class][class]>button.active[class]:hover{background:#E5E4E0!important}

/* ---- active tab: only the fill changes, text stays blue ---- */
html body .inboundtabs[class][class]>button.active[class],html body .inboundtabs[class][class]>button[aria-selected="true"][class]{background:#ECEBE8!important;color:#007AFF!important;box-shadow:0 1px 2px rgba(0,0,0,.08)!important;font-weight:600!important}
html body .inboundtabs[class][class]>button.active[class]:hover{background:#E5E4E0!important}

/* ---- tabs back to the white active pill on a grey track ---- */
html body .inboundtabs[class][class]{background:#ECEBE8!important;padding:4px!important;gap:4px!important;border-radius:14px!important}
html body .inboundtabs[class][class]>button[class]{background:transparent!important;color:#5F5E5A!important;box-shadow:none!important;font-weight:600!important;height:30px!important;min-height:30px!important;padding:0 16px!important;font-size:14px!important;border-radius:10px!important}
html body .inboundtabs[class][class]>button.active[class],html body .inboundtabs[class][class]>button[aria-selected="true"][class]{background:#FFFFFF!important;color:#1C1C1E!important;box-shadow:0 1px 2px rgba(0,0,0,.10)!important;font-weight:600!important}
html body .inboundtabs[class][class]>button.active[class]:hover{background:#FFFFFF!important}

/* ---- template dialog: every button grey except save/delete ---- */
html body .selectiondialog:has(input[placeholder*="搜索模板"]) button[class]:not([data-function-color="save"]):not([data-function-color="delete"]):not([data-action-tone="red"]):not([data-act="close"]),html body .selectiondialog:has(input[placeholder*="搜索模板"]) a.secondary{background:#E8E8E6!important;color:#007AFF!important;border:0!important;border-radius:12px!important;font-weight:600!important;box-shadow:none!important;height:26px!important;min-height:26px!important;padding:0 12px!important}
html body .selectiondialog:has(input[placeholder*="搜索模板"]) button[class]:hover:not([data-function-color="save"]):not([data-function-color="delete"]){background:#DEDEDB!important}

/* ---- tabs: one connected row, blue text, no background ---- */
html body .inboundtabs[class][class]{background:transparent!important;padding:0!important;gap:0!important;border-radius:0!important;display:inline-flex!important;align-items:center!important}
html body .inboundtabs[class][class]>button[class]{background:transparent!important;color:#007AFF!important;box-shadow:none!important;height:34px!important;min-height:34px!important;padding:0 14px!important;font-size:14px!important;font-weight:600!important;border-radius:0!important;border:0!important;border-bottom:2px solid transparent!important}
html body .inboundtabs[class][class]>button[class]:hover{background:transparent!important;color:#0058CC!important}
html body .inboundtabs[class][class]>button.active[class],html body .inboundtabs[class][class]>button[aria-selected="true"][class]{background:transparent!important;color:#0058CC!important;font-weight:700!important;border-bottom:2px solid #007AFF!important;box-shadow:none!important}

/* ---- tabs: one grey block with a darker active pill, blue text ---- */
html body .inboundtabs[class][class]{background:#F4F5F7!important;padding:3px!important;gap:2px!important;border-radius:12px!important;display:inline-flex!important;align-items:center!important}
html body .inboundtabs[class][class]>button[class]{background:transparent!important;color:#007AFF!important;box-shadow:none!important;height:30px!important;min-height:30px!important;padding:0 16px!important;font-size:14px!important;font-weight:600!important;border-radius:9px!important;border:0!important}
html body .inboundtabs[class][class]>button[class]:hover{background:transparent!important;color:#0058CC!important}
html body .inboundtabs[class][class]>button.active[class],html body .inboundtabs[class][class]>button[aria-selected="true"][class]{background:#E1E3E7!important;color:#007AFF!important;font-weight:700!important;box-shadow:none!important;border:0!important}

/* ---- tabs: each tab is its own grey button, active one darker ---- */
html body .inboundtabs[class][class]{background:transparent!important;padding:0!important;gap:2px!important;border-radius:0!important;display:inline-flex!important;align-items:center!important}
html body .inboundtabs[class][class]>button[class]{background:#F4F5F7!important;color:#007AFF!important;box-shadow:none!important;height:30px!important;min-height:30px!important;padding:0 16px!important;font-size:14px!important;font-weight:600!important;border-radius:9px!important;border:0!important}
html body .inboundtabs[class][class]>button[class]:hover{background:#EDEEF1!important;color:#007AFF!important}
html body .inboundtabs[class][class]>button.active[class],html body .inboundtabs[class][class]>button[aria-selected="true"][class]{background:#E1E3E7!important;color:#007AFF!important;font-weight:700!important;box-shadow:none!important;border:0!important}

/* ---- tabs: four buttons joined into one block, active darker ---- */
html body .inboundtabs[class][class]{background:#F4F5F7!important;padding:0!important;gap:0!important;border-radius:10px!important;overflow:hidden!important;display:inline-flex!important;align-items:stretch!important}
html body .inboundtabs[class][class]>button[class]{background:transparent!important;color:#007AFF!important;box-shadow:none!important;height:34px!important;min-height:34px!important;padding:0 18px!important;font-size:14px!important;font-weight:600!important;border-radius:0!important;border:0!important;border-right:1px solid #E7E8EB!important}
html body .inboundtabs[class][class]>button[class]:last-child{border-right:0!important}
html body .inboundtabs[class][class]>button[class]:hover{background:#EDEEF1!important}
html body .inboundtabs[class][class]>button.active[class],html body .inboundtabs[class][class]>button[aria-selected="true"][class]{background:#E1E3E7!important;color:#007AFF!important;font-weight:700!important;box-shadow:none!important}

/* ---- tabs: separate grey pills, tight gaps, no separators ---- */
html body .inboundtabs[class][class]{background:transparent!important;padding:0!important;gap:4px!important;border-radius:0!important;overflow:visible!important;display:inline-flex!important;align-items:center!important}
html body .inboundtabs[class][class]>button[class]{background:#F4F5F7!important;color:#007AFF!important;height:32px!important;min-height:32px!important;padding:0 18px!important;font-size:14px!important;font-weight:600!important;border-radius:9px!important;border:0!important;border-right:0!important;box-shadow:none!important}
html body .inboundtabs[class][class]>button[class]:hover{background:#EDEEF1!important}
html body .inboundtabs[class][class]>button.active[class],html body .inboundtabs[class][class]>button[aria-selected="true"][class]{background:#E5E7EA!important;color:#007AFF!important;font-weight:700!important;box-shadow:none!important}

/* ---- tabs: grey block with inner active cell + underline ---- */
html body .inboundtabs[class][class]{background:#F4F5F7!important;padding:2px!important;gap:2px!important;border-radius:10px!important;display:inline-flex!important;align-items:center!important}
html body .inboundtabs[class][class]>button[class]{background:transparent!important;color:#007AFF!important;height:32px!important;min-height:32px!important;padding:0 18px!important;font-size:14px!important;font-weight:600!important;border-radius:8px!important;border:0!important;box-shadow:none!important;text-decoration:none!important}
html body .inboundtabs[class][class]>button[class]:hover{background:#EDEEF1!important}
html body .inboundtabs[class][class]>button.active[class],html body .inboundtabs[class][class]>button[aria-selected="true"][class]{background:#E1E3E7!important;color:#007AFF!important;font-weight:700!important;text-decoration:underline!important;text-decoration-thickness:2px!important;text-underline-offset:7px!important;text-decoration-color:#007AFF!important;box-shadow:none!important}

/* ---- tabs restored to the original pill-on-track layout ---- */
html body .inboundtabs[class][class]{display:flex!important;flex-wrap:wrap!important;gap:8px!important;padding:6px!important;background:#ECEBE8!important;border-radius:10px!important;width:fit-content!important;align-items:center!important}
html body .inboundtabs[class][class]>button[class]{padding:10px 20px!important;border-radius:7px!important;color:#5F5E5A!important;background:transparent!important;border:0!important;font-size:14px!important;font-weight:600!important;height:auto!important;min-height:0!important;line-height:1.2!important;text-decoration:none!important;box-shadow:none!important}
html body .inboundtabs[class][class]>button.active[class],html body .inboundtabs[class][class]>button[aria-selected="true"][class]{background:#FFFFFF!important;color:#1C1C1E!important;box-shadow:0 2px 6px rgba(35,74,48,.12)!important;text-decoration:none!important;font-weight:600!important}

/* ---- tabs: blue text, underline on the active tab ---- */
html body .inboundtabs[class][class]>button[class]{color:#007AFF!important}
html body .inboundtabs[class][class]>button.active[class],html body .inboundtabs[class][class]>button[aria-selected="true"][class]{color:#007AFF!important;background:#FFFFFF!important;text-decoration:underline!important;text-decoration-color:#007AFF!important;text-decoration-thickness:2px!important;text-underline-offset:6px!important}

/* ---- active tab: no white pill, only underline ---- */
html body .inboundtabs[class][class]>button.active[class],html body .inboundtabs[class][class]>button[aria-selected="true"][class]{background:transparent!important;box-shadow:none!important;color:#007AFF!important;text-decoration:underline!important;text-decoration-color:#007AFF!important;text-decoration-thickness:2px!important;text-underline-offset:6px!important;font-weight:700!important}

/* ---- settings dictionary rows: equal height, left side as reference ---- */
html body .settingsworkspace li,html body .settingsworkspace .dictionaryrow,html body .settingsworkspace .listrow{min-height:40px!important;height:40px!important;display:flex!important;align-items:center!important;padding:0 12px!important;box-sizing:border-box!important}
html body .settingsworkspace li>button,html body .settingsworkspace li a,html body .settingsworkspace .dictionaryrow button{height:24px!important;min-height:24px!important;padding:0 10px!important;font-size:12.5px!important;border-radius:12px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important}
html body .settingsworkspace li>.orderlinemoves,html body .settingsworkspace li>span:has(button){display:inline-flex!important;align-items:center!important;gap:6px!important}

/* ---- image library buttons match the product picker ---- */
html body .imagecard .imagecopybtn,html body .imagecard .imagepickbtn,html body .imagecard .imagerenamebtn,html body .imagecard .imagedeletebtn{width:34px!important;min-width:34px!important;height:28px!important;min-height:28px!important;padding:0!important;border-radius:8px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;background:#E8E8E6!important;color:#007AFF!important;border:0!important;box-shadow:none!important}
html body .imagecard .imagepickbtn{background:#E6F0FF!important;border:1px solid #CFE0F8!important}
html body .imagecard .imagecopybtn svg,html body .imagecard .imagepickbtn svg,html body .imagecard .imagerenamebtn svg{width:15px!important;height:15px!important;stroke:#007AFF!important;color:#007AFF!important;display:block!important}
html body .imagecard .imagedeletebtn svg{width:15px!important;height:15px!important;stroke:#A9B0B6!important;color:#A9B0B6!important;display:block!important}
html body .imagecard .imagecopybtn:hover,html body .imagecard .imagerenamebtn:hover{background:#DEDEDB!important}
html body .imagecard .imagedeletebtn:hover{background:#E8E8E6!important}

/* ---- customer path sits on the title line ---- */
html body section.content{position:relative!important}
html body .customerpath{position:absolute!important;top:26px!important;left:238px!important;display:inline-flex!important;align-items:center!important;gap:6px!important;margin:0!important;padding:0!important;background:transparent!important;border:0!important;font-size:13px!important;color:#6C6B66!important;z-index:3!important;white-space:nowrap!important;box-shadow:none!important}
html body .customerpath .customerpathcurrent,html body .customerpath strong,html body .customerpath span{color:#6C6B66!important;font-weight:500!important;font-size:13px!important}
html body .customerpath strong{color:#4A4A46!important}
html body .customerpath svg{display:none!important}

/* ---- customer path baseline-aligned with the page title ---- */
html body .customerpath{top:40px!important;left:246px!important;display:inline-flex!important;align-items:baseline!important;gap:0!important;font-size:14px!important;line-height:1.2!important;color:#6C6B66!important}
html body .customerpath>span,html body .customerpath>strong{display:inline-flex!important;align-items:baseline!important;font-size:14px!important;line-height:1.2!important;color:#6C6B66!important;font-weight:500!important}
html body .customerpath>span:first-child{margin-right:8px!important}
html body .customerpath>span+strong,html body .customerpath>strong+span,html body .customerpath>span+span{margin-left:8px!important}
html body .customerpath strong{color:#4A4A46!important;font-weight:600!important}

/* ---- customer path: bullet separators, vertically centred on the title ---- */
html body .customerpath{top:44px!important;left:250px!important;display:inline-flex!important;align-items:center!important;gap:0!important;font-size:14px!important;line-height:1!important;color:#6C6B66!important;height:26px!important}
html body .customerpath>span,html body .customerpath>strong{display:inline-flex!important;align-items:center!important;font-size:14px!important;line-height:1!important;color:#6C6B66!important;font-weight:500!important}
html body .customerpath .customerpathdot{color:#B9B8B4!important;font-size:15px!important;margin:0 10px!important;font-weight:400!important}
html body .customerpath strong{color:#4A4A46!important;font-weight:600!important}

/* ---- breadcrumb back to its own line under the title ---- */
html body .customerpath{position:static!important;top:auto!important;left:auto!important;height:auto!important;display:flex!important;align-items:center!important;flex-wrap:wrap!important;gap:6px!important;margin:6px 0 14px!important;padding:0!important;background:transparent!important;border:0!important;font-size:14px!important;line-height:1.4!important;color:#6C6B66!important;white-space:normal!important;z-index:auto!important;box-shadow:none!important}
html body .customerpath>span,html body .customerpath>strong{font-size:14px!important;color:#6C6B66!important;font-weight:500!important;margin:0!important}
html body .customerpath strong{color:#4A4A46!important;font-weight:600!important}

/* ---- file toolbar buttons follow the button standard ---- */
html body .filepaste-search button[class]{height:24px!important;min-height:24px!important;padding:0 12px!important;border-radius:12px!important;font-size:12.5px!important;font-weight:600!important;border:0!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;box-shadow:none!important}
html body .filepaste-search button.secondary[class]{background:#E8E8E6!important;color:#007AFF!important}
html body .filepaste-search button.primary[class]{background:#E6F0FF!important;color:#0058CC!important}
html body .filepaste-search button.secondary[class]:hover{background:#DEDEDB!important}

/* ---- tab text aligned with the page left edge ---- */
html body .inboundtabs[class][class]{margin-left:0!important;padding:4px!important;justify-content:flex-start!important}
html body .inboundtabs[class][class]>button[class]{padding:10px 14px!important}
html body .inboundtabs[class][class]>button[class]:first-child{padding-left:8px!important}

/* ---- template manager: classless buttons forced to grey ---- */
html body .templatemanager button:not([data-function-color="save"]):not([data-function-color="delete"]):not([data-action-tone="red"]):not([data-act="close"]),html body .templatefileactions>button:not([data-function-color="delete"]){background:#E8E8E6!important;color:#007AFF!important;border:0!important;border-radius:12px!important;height:26px!important;min-height:26px!important;padding:0 12px!important;font-size:12.5px!important;font-weight:600!important;box-shadow:none!important;line-height:1!important;display:inline-flex!important;align-items:center!important;justify-content:center!important}
html body .templatemanager button:not([data-function-color="save"]):hover{background:#DEDEDB!important}
html body .templatemanager button[data-function-color="delete"]{background:#FF3B30!important;color:#FFFFFF!important;border:0!important;border-radius:12px!important;height:26px!important;padding:0 12px!important;font-size:12.5px!important;font-weight:600!important}
html body .templatefileactions{display:flex!important;align-items:center!important;gap:8px!important;flex-wrap:wrap!important}

/* ---- template footer: close removed, save aligned with row buttons ---- */
html body .templatemanager .importreviewfooter>button[data-act="close"],html body .templatemanager .importreviewfooter>button[data-function-color="back"],html body .importreviewfooter>button[data-act="close"]{display:none!important;width:0!important;min-width:0!important;height:0!important;padding:0!important;margin:0!important;border:0!important;background:transparent!important;overflow:hidden!important;font-size:0!important}
html body .importreviewfooter{display:flex!important;justify-content:flex-end!important;align-items:center!important;gap:0!important;padding:8px 22px 10px!important;border-top:1px solid #F0EFEC!important}
html body .templateimportrow .importreviewactions{display:flex!important;justify-content:flex-end!important;padding-right:22px!important;margin-right:0!important}
html body .importreviewfooter>button[data-function-color="save"]{background:#E6F0FF!important;color:#0058CC!important;border:1px solid #CFE0F8!important;border-radius:12px!important;height:28px!important;min-height:28px!important;padding:0 14px!important;font-size:12.5px!important;font-weight:600!important}

/* ---- template delete button: solid red like the back button ---- */
html body .templatefileactions>button[data-function-color="delete"],html body .templatemanager button[data-function-color="delete"]{background:#FF3B30!important;color:#FFFFFF!important;border:0!important;border-radius:12px!important;height:26px!important;min-height:26px!important;padding:0 12px!important;font-size:12.5px!important;font-weight:600!important;opacity:1!important;box-shadow:none!important}
html body .templatefileactions>button[data-function-color="delete"]:disabled,html body .templatemanager button[data-function-color="delete"]:disabled{background:#FF3B30!important;color:#FFFFFF!important;opacity:1!important}

/* ---- footer save button centred under the row action column ---- */
html body .importreviewfooter{display:flex!important;justify-content:flex-end!important;align-items:center!important;padding:8px 33px 10px!important}
html body .importreviewactions{padding-right:22px!important}
html body .importreviewfooter>button[data-function-color="save"]{min-width:150px!important;justify-content:center!important;text-align:center!important}

/* ---- delete tier dialog: standard cancel + red delete ---- */
html body .pricedeleteactions{display:flex!important;justify-content:center!important;gap:8px!important;padding:6px 0 4px!important}
html body .pricedeleteactions>button{height:28px!important;min-height:28px!important;padding:0 16px!important;border-radius:14px!important;font-size:13px!important;font-weight:600!important;border:0!important;box-shadow:none!important;display:inline-flex!important;align-items:center!important;justify-content:center!important}
html body .pricedeleteactions>button.secondary,html body .pricedeleteactions>button[data-function-color="back"]{background:#E8E8E6!important;color:#007AFF!important}
html body .pricedeleteactions>button.primary,html body .pricedeleteactions>button[data-function-color="delete"]{background:#FF3B30!important;color:#FFFFFF!important}
html body .pricedeleteactions>button.primary:hover,html body .pricedeleteactions>button[data-function-color="delete"]:hover{background:#E0332A!important}

/* ---- footer save: auto width, right edge matches row buttons ---- */
html body .importreviewfooter{display:flex!important;justify-content:flex-end!important;align-items:center!important;padding:8px 22px 10px!important}
html body .importreviewfooter>button[data-function-color="save"]{width:auto!important;min-width:0!important;padding:0 16px!important;height:28px!important;min-height:28px!important;border-radius:14px!important;font-size:12.5px!important;font-weight:600!important;background:#E6F0FF!important;color:#0058CC!important;border:1px solid #CFE0F8!important;display:inline-flex!important;align-items:center!important;justify-content:center!important}

/* ---- footer save: same fixed width as row buttons so centres match ---- */
html body .importreviewactions>button,html body .templateimportrow button[class]{width:140px!important;min-width:140px!important;justify-content:center!important;text-align:center!important;padding:0!important;height:28px!important;min-height:28px!important;border-radius:14px!important;font-size:12.5px!important;font-weight:600!important;display:inline-flex!important;align-items:center!important;background:#E8E8E6!important;color:#007AFF!important;border:0!important}
html body .importreviewfooter>button[data-function-color="save"]{width:140px!important;min-width:140px!important;padding:0!important;height:28px!important;min-height:28px!important;border-radius:14px!important;font-size:12.5px!important;font-weight:600!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;background:#E6F0FF!important;color:#0058CC!important;border:1px solid #CFE0F8!important}
html body .importreviewfooter{padding:8px 22px 10px!important}
html body .importreviewactions{padding-right:0!important}

/* ---- footer save: matched width and inset vs row action column ---- */
html body .importreviewactions{display:flex!important;justify-content:flex-end!important;padding-right:0!important;margin-right:0!important}
html body .importreviewactions>button{width:140px!important;min-width:140px!important;max-width:140px!important;padding:0!important;height:28px!important;min-height:28px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;font-size:12.5px!important;font-weight:600!important;border-radius:14px!important;background:#E8E8E6!important;color:#007AFF!important;border:0!important}
html body .importreviewfooter{display:flex!important;justify-content:flex-end!important;align-items:center!important;padding:8px 42px 10px!important}
html body .importreviewfooter>button[data-function-color="save"]{width:140px!important;min-width:140px!important;max-width:140px!important;box-sizing:border-box!important;padding:0!important;height:28px!important;min-height:28px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;font-size:12.5px!important;font-weight:600!important;border-radius:14px!important;background:#E6F0FF!important;color:#0058CC!important;border:1px solid #CFE0F8!important}

/* ---- footer save nudged right to sit exactly under the column ---- */
html body .importreviewfooter{padding:8px 36px 10px!important}

/* ---- footer save nudged right again ---- */
html body .importreviewfooter{padding:8px 30px 10px!important}

/* ---- footer save nudged left 2px ---- */
html body .importreviewfooter{padding:8px 32px 10px!important}

/* ---- footer save nudged left 1px ---- */
html body .importreviewfooter{padding:8px 33px 10px!important}

/* ---- product toolbar: action buttons aligned right ---- */
html body .customerproductactions{display:flex!important;flex-wrap:wrap!important;align-items:center!important;justify-content:flex-end!important;gap:8px!important;width:100%!important}
html body .customerproductactions>*:first-child{margin-right:auto!important}

/* ---- product panel: align the sizing button with the add button ---- */
html body .panel:has(.customerproductactions) .toolbar.standardtoolbar{padding-right:16px!important}
html body .panel:has(.customerproductactions) .toolbar.standardtoolbar .customerdragbutton{margin-right:0!important}

/* ---- heading and breadcrumb align with the card text column ---- */
html body section.content>.heading{padding-left:13px!important}
html body .customerpath{margin-left:13px!important}

/* ---- back button and tabs join the same left column ---- */
html body .customerworkspace .inboundback,html body section.content>button.inboundback{margin-left:13px!important}
html body .inboundtabs[class][class]>button[class]:first-child{padding-left:9px!important}

/* ---- heading alignment reverted to original ---- */
html body section.content>.heading{padding-left:0!important}
html body .customerpath{margin-left:0!important}
html body .customerworkspace .inboundback,html body section.content>button.inboundback{margin-left:0!important}
html body .inboundtabs[class][class]>button[class]:first-child{padding-left:8px!important}

/* ---- SLB shipping label builder ---- */
html body .slbmodal{width:min(1080px,96vw)!important;max-width:1080px!important;max-height:92vh!important;overflow:auto!important}
html body .slbbody{display:grid!important;grid-template-columns:minmax(280px,1fr) 380px!important;gap:18px!important;padding:0 18px 8px!important;align-items:start!important}
html body .slbform{display:grid!important;gap:10px!important}
html body .slbfield{display:grid!important;gap:4px!important}
html body .slbfield>span{font-size:12.5px!important;color:#6C6B66!important;font-weight:600!important}
html body .slbfield input,html body .slbfield textarea{width:100%!important;border:1px solid #E0DFDB!important;border-radius:10px!important;padding:8px 10px!important;font-size:13px!important;background:#FFFFFF!important;color:#1C1C1E!important;resize:vertical!important}
html body .slbrow{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important}
html body .slbpreview{position:sticky!important;top:6px!important;background:#F1F0ED!important;border-radius:12px!important;padding:14px!important;display:flex!important;justify-content:center!important}
html body .slblabel{width:352px!important;height:528px!important;background:#FFFFFF!important;box-shadow:0 2px 10px rgba(0,0,0,.12)!important;border-radius:4px!important}
html body .slbactions{display:flex!important;justify-content:flex-end!important;gap:8px!important;padding:10px 18px 16px!important}
html body .slbactions>button{height:28px!important;min-height:28px!important;padding:0 16px!important;border-radius:14px!important;font-size:12.5px!important;font-weight:600!important}

/* ---- SLB tracking row ---- */
html body .slbtracking{display:flex!important;gap:8px!important;align-items:center!important}
html body .slbtracking>input{flex:1!important;font-family:ui-monospace,SFMono-Regular,Menlo,monospace!important;letter-spacing:1px!important}
html body .slbtracking>button{height:28px!important;min-height:28px!important;padding:0 12px!important;border-radius:14px!important;font-size:12.5px!important;font-weight:600!important;white-space:nowrap!important}

/* ---- standard toolbars share the panel right padding ---- */
html body .toolbar.standardtoolbar{padding-right:16px!important}
html body .toolbar.standardtoolbar .customerdragbutton{margin-right:0!important}

/* ---- toolbar right padding forced ---- */
html body .panel .toolbar.standardtoolbar[class],html body .panel .toolbar[class][class]{padding-right:16px!important}

/* ---- row menu: divider above delete ---- */
html body .rowactionslist>button.customerdeletebtn{position:relative!important;margin-top:12px!important}
html body .rowactionslist>button.customerdeletebtn::before{content:""!important;position:absolute!important;left:-8px!important;right:-8px!important;top:-7px!important;height:1px!important;background:#E2E1DD!important}

/* ---- product panel: batch delete joins the right-hand group ---- */
html body .customerproductactions>*:first-child{margin-right:8px!important}
html body .customerproductactions{justify-content:flex-end!important}

/* ---- product actions stay on one row so the title keeps its position ---- */
html body .customerproductactions{flex-wrap:nowrap!important;overflow-x:auto!important;max-width:100%!important;justify-content:flex-end!important}
html body .customerproductactions::-webkit-scrollbar{height:0!important;width:0!important}
html body .customerproductactions>*{flex:0 0 auto!important}

/* ---- HS code dialog: title and search inside one inner frame ---- */
html body .hscodecompactdialog{padding:10px 12px 12px!important;background:#FFFFFF!important}
html body .hscodecompactdialog>.selectiondialogheading{padding:4px 2px 10px!important;margin:0!important;border:0!important;border-radius:0!important;background:transparent!important}
html body .hscodecompactdialog .selectionsearch{padding:0 2px 10px!important;background:transparent!important}
html body .hscodecompactdialog .selectionsearch input,html body .hscodecompactdialog input[type="search"]{width:100%!important;box-sizing:border-box!important}
html body .hscodecompactdialog .productcombomenu{margin:0!important;border:1px solid #E7E6E2!important;border-radius:12px!important}
html body .hscodecompactdialog{border:1px solid #EDECE8!important;border-radius:16px!important}

/* ---- file paste hint uses the neutral hint colour ---- */
html body .filepastehint{color:#8A8984!important;font-size:12.5px!important;font-weight:400!important;line-height:1.6!important;background:transparent!important;border:0!important;padding:2px 4px 8px!important;margin:0!important}

/* ---- product header: title and actions on one centred line ---- */
html body .paneltitle:has(.customerproductactions){display:flex!important;align-items:center!important;gap:12px!important;padding:10px 16px!important;min-height:0!important}
html body .paneltitle:has(.customerproductactions)>h2{flex:0 1 auto!important;margin:0!important}
html body .customerproductactions{margin:0!important;padding:0!important;align-self:center!important;align-items:center!important;height:auto!important}

/* ---- product header never wraps to a second line ---- */
html body .paneltitle:has(.customerproductactions){flex-wrap:nowrap!important;align-items:center!important}
html body .customerproductactions{flex:1 1 auto!important;min-width:0!important;justify-content:flex-end!important;align-items:center!important}

/* ---- product header: title never wraps, actions scroll ---- */
html body .paneltitle:has(.customerproductactions)>h2{flex:0 0 auto!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:52%!important}
html body .customerproductactions{flex:1 1 0!important;min-width:0!important;overflow-x:auto!important;overflow-y:hidden!important;flex-wrap:nowrap!important;justify-content:flex-end!important;scrollbar-width:none!important}

/* ---- image card delete icon is red like the back button ---- */
html body .imagecard .imagedeletebtn{color:#FF3B30!important}
html body .imagecard .imagedeletebtn svg{stroke:#FF3B30!important;color:#FF3B30!important}
html body .imagecard .imagedeletebtn:hover{background:#FBE6E4!important}

/* ---- paste hint aligns with the card content column ---- */
html body .filepastehint{padding-left:22px!important;padding-right:22px!important}

/* ---- image card buttons: identical box, red delete icon ---- */
html body .imagecard button.imagecopybtn[class][class][class],html body .imagecard button.imagepickbtn[class][class][class],html body .imagecard button.imagerenamebtn[class][class][class],html body .imagecard button.imagedeletebtn[class][class][class]{width:34px!important;min-width:34px!important;max-width:34px!important;height:28px!important;min-height:28px!important;padding:0!important;margin:0!important;border-radius:8px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;box-shadow:none!important;font-size:0!important;line-height:1!important}
html body .imagecard button.imagecopybtn[class][class][class],html body .imagecard button.imagerenamebtn[class][class][class]{background:#E8E8E6!important;color:#007AFF!important;border:0!important}
html body .imagecard button.imagepickbtn[class][class][class]{background:#E6F0FF!important;color:#0058CC!important;border:1px solid #CFE0F8!important}
html body .imagecard button.imagedeletebtn[class][class][class]{background:#E8E8E6!important;border:0!important}
html body .imagecard button.imagedeletebtn[class][class][class] svg,html body .imagecard button.imagedeletebtn[class][class][class] svg *{stroke:#FF3B30!important;stroke-width:2!important;fill:none!important;color:#FF3B30!important;width:15px!important;height:15px!important}
html body .imagecard button.imagecopybtn[class][class][class] svg,html body .imagecard button.imagerenamebtn[class][class][class] svg{stroke:#007AFF!important;color:#007AFF!important;width:15px!important;height:15px!important}
html body .imagecard button.imagepickbtn[class][class][class] svg{stroke:#0058CC!important;color:#0058CC!important;width:15px!important;height:15px!important}

/* ---- copy button keeps its glyph visible ---- */
html body .imagecard button.imagecopybtn[class][class][class],html body .imagecard button.imagepickbtn[class][class][class],html body .imagecard button.imagerenamebtn[class][class][class],html body .imagecard button.imagedeletebtn[class][class][class]{font-size:13px!important;line-height:1!important;color:#007AFF!important}

/* ---- price cards: drop misaligned colour guides ---- */
html body .priceproduct{border-left:0!important;box-shadow:none!important}
html body .priceproduct::before,html body .priceproduct::after{display:none!important;content:none!important}
html body .priceproductlist::before,html body .priceproductlist::after{display:none!important;content:none!important}
html body .priceproduct>summary::before,html body .priceproduct>summary::after{display:none!important;content:none!important}

/* ---- paste hint aligned exactly with the title text ---- */
html body .filepastehint{padding-left:12px!important;padding-right:12px!important}

/* ---- price card chevron restored (its removal shifted the row grid) ---- */
html body .priceproduct>summary::before{content:"▸"!important;display:inline-block!important;width:14px!important;min-width:14px!important;text-align:center!important;color:#8A8984!important;font-size:12px!important}
html body .priceproduct[open]>summary::before{content:"▾"!important}

/* ---- paste hint vertically centred in its band ---- */
html body .filepastehint{display:flex!important;align-items:center!important;min-height:56px!important;padding:10px 12px!important;box-sizing:border-box!important}

/* ---- price row markers: no coloured bars behind the chevron ---- */
html body .priceproduct>summary::before{background:transparent!important;border:0!important;box-shadow:none!important;background-image:none!important}
html body .priceproduct>summary::after{display:none!important;background:transparent!important;content:none!important}
html body .priceproduct summary>span::before{background:transparent!important;content:none!important;display:none!important}

/* ---- price summary: strip every coloured accent ---- */
html body .priceproduct>summary,html body .priceproduct>summary>*{border-left:0!important;border-right:0!important;background-image:none!important;box-shadow:none!important}
html body .priceproduct,html body .priceproduct>*{background-image:none!important}
html body .priceproduct[style]{border-left:0!important}
html body .priceproductlist>details,html body .priceproductlist>details>summary{border-left:0!important}

/* ---- files panel: tighter vertical rhythm ---- */
html body .filepastehint{min-height:0!important;padding:4px 12px!important;margin:0!important;line-height:1.45!important}
html body .customerattachmentpanel>.paneltitle{padding-bottom:4px!important}
html body .customerattachmentpanel .toolbar.standardtoolbar{padding-top:6px!important;padding-bottom:6px!important;margin-top:2px!important}

/* ---- price page: neutralise every inset accent shadow ---- */
html body .pricecatalogscroll,html body .pricecatalogscroll *,html body .priceproductlist,html body .priceproductlist *,html body .priceproduct,html body .priceproduct *{box-shadow:none!important}
html body .pricecatalogscroll::before,html body .pricecatalogscroll::after,html body .priceproductlist::before,html body .priceproductlist::after{display:none!important;content:none!important}

/* ---- files panel: shift toolbar and grid upward ---- */
html body .customerattachmentpanel>.paneltitle{padding-bottom:0!important}
html body .customerattachmentpanel .filepastehint{padding-top:0!important;padding-bottom:0!important;margin-bottom:0!important}
html body .customerattachmentpanel .toolbar.standardtoolbar{margin-top:0!important;padding-top:4px!important;padding-bottom:2px!important}
html body .customerattachmentpanel .filegrid,html body .customerattachmentpanel .filelist{margin-top:4px!important}

/* ---- price hierarchy connector svg removed ---- */
html body .pricehierarchyline{display:none!important;visibility:hidden!important;width:0!important;height:0!important}
html body svg.pricehierarchyline{display:none!important}

/* ---- price tier: neutral text, system-blue checkbox ---- */
html body .priceproduct input[type="checkbox"],html body .customerprices input[type="checkbox"]{accent-color:#007AFF!important}
html body .pricequantitycell,html body .pricequantitycell *{color:#1C1C1E!important}
html body .priceproduct td:first-child,html body .priceproduct td:first-child *{color:#1C1C1E!important}

/* ---- delete tier dialog: roomier bottom ---- */
html body .pricedeletemodal{padding-bottom:18px!important}
html body .pricedeleteactions{padding:12px 0 2px!important}

/* ---- PO table scrollbar: thicker and easier to grab ---- */
html body .cgmodal .tablewrap,html body .cgmodal .sitablewrap{scrollbar-width:auto!important;overflow-x:auto!important;padding-bottom:8px!important}
html body .cgmodal .tablewrap::-webkit-scrollbar,html body .cgmodal .sitablewrap::-webkit-scrollbar{height:12px!important;display:block!important;width:12px!important}
html body .cgmodal .tablewrap::-webkit-scrollbar-track,html body .cgmodal .sitablewrap::-webkit-scrollbar-track{background:#F1F0ED!important;border-radius:6px!important}
html body .cgmodal .tablewrap::-webkit-scrollbar-thumb,html body .cgmodal .sitablewrap::-webkit-scrollbar-thumb{background:#B9B8B4!important;border-radius:6px!important;border:2px solid #F1F0ED!important}
html body .cgmodal .tablewrap::-webkit-scrollbar-thumb:hover,html body .cgmodal .sitablewrap::-webkit-scrollbar-thumb:hover{background:#8A8984!important}

/* ---- draggable tables: allow cells to shrink freely ---- */
html body table.customerdragtable td,html body table.customerdragtable th{overflow:hidden!important;text-overflow:ellipsis!important;min-width:0!important}
html body table.customerdragtable td>*,html body table.customerdragtable th>*{min-width:0!important;max-width:100%!important}
html body table.customerdragtable td input,html body table.customerdragtable td select,html body table.customerdragtable td textarea,html body table.customerdragtable td button{min-width:0!important;max-width:100%!important;box-sizing:border-box!important}
html body table.customerdragtable td input[type="number"],html body table.customerdragtable td input[type="text"]{width:100%!important}
html body table.customerdragtable td .pricequantitycell,html body table.customerdragtable td .priceentryhighlight{min-width:0!important}
html body table.customerdragtable td img{max-width:100%!important;height:auto!important}

/* ---- modal tables: let the drag sizing own the table width ---- */

/* ---- customer header: no big title, breadcrumb beside the back button ---- */
html body .customerworkspace .heading{position:relative!important;padding:0!important;margin:0!important;min-height:0!important;height:0!important;border:0!important}
html body .customerworkspace .heading>div{display:none!important}
html body .customerworkspace .heading h1{display:none!important}
html body .customerpath{position:absolute!important;top:-24px!important;left:36px!important;margin:0!important;padding:0!important;width:auto!important;display:inline-flex!important;align-items:baseline!important;gap:6px!important;white-space:nowrap!important;font-size:14px!important;line-height:1.2!important;color:#6C6B66!important}
html body .customerpath>span,html body .customerpath>strong{font-size:14px!important;color:#6C6B66!important;font-weight:500!important}
html body .customerpath strong{color:#1C1C1E!important;font-weight:600!important}
html body .customerworkspace .inboundtabs{margin-top:8px!important}

/* ---- customer breadcrumb anchored beside the back button ---- */
html body .customerpath{position:absolute!important;top:9px!important;left:78px!important;margin:0!important;padding:0!important;width:auto!important;display:inline-flex!important;align-items:center!important;gap:6px!important;white-space:nowrap!important;font-size:14px!important;line-height:1!important;height:24px!important;color:#6C6B66!important;z-index:2!important}
html body .customerpath>span,html body .customerpath>strong{font-size:14px!important;line-height:1!important;color:#6C6B66!important;font-weight:500!important}
html body .customerpath strong{color:#1C1C1E!important;font-weight:600!important}

/* ---- keep the heading box so the account chip stays put ---- */
html body .customerworkspace .heading{height:auto!important;min-height:0!important;padding:0 0 4px!important;position:relative!important;display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:12px!important}
html body .customerpath{top:-24px!important;left:36px!important}

/* ---- breadcrumb final position (anchored to the content box) ---- */
html body .customerpath{position:absolute!important;top:9px!important;left:78px!important;height:24px!important;display:inline-flex!important;align-items:center!important;gap:6px!important;margin:0!important;padding:0!important;width:auto!important;white-space:nowrap!important;font-size:14px!important;line-height:1!important;color:#6C6B66!important;z-index:3!important;background:transparent!important}
html body .customerworkspace .inboundtabs{margin-top:-6px!important}

/* ---- packaging legend: text and status select on one centred line ---- */
html body fieldset.boxfields>legend{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:10px!important;padding:0 8px!important;line-height:1!important;height:auto!important}
html body fieldset.boxfields>legend>select,html body fieldset.boxfields>legend select.packagingstatus{align-self:center!important;margin:0!important;height:28px!important;line-height:1!important}
html body fieldset.boxfields>legend{font-size:13.5px!important;color:#1C1C1E!important}

/* ---- breadcrumb optical centring against the back button ---- */
html body .customerpath{line-height:24px!important;transform:translateY(-2px)!important}
html body .customerpath>span,html body .customerpath>strong{line-height:24px!important}

/* ---- customer list: hide the single-segment breadcrumb ---- */
html body .customerworkspace .customerpath:not(:has(strong)){display:none!important}

/* ---- hide the account scope chip in the page heading ---- */
html body .heading>.private{display:none!important}

/* ---- breadcrumb micro offset: +2px right, +3px down ---- */
html body .customerpath{left:80px!important;transform:translateY(1px)!important}

/* ---- breadcrumb micro offset: -3px left, +2px down ---- */
html body .customerpath{left:77px!important;transform:translateY(3px)!important}

/* ---- breadcrumb: further 2px left ---- */
html body .customerpath{left:75px!important}

/* ---- customer tabs: 10px lower ---- */
html body .customerworkspace .inboundtabs{margin-top:4px!important}

/* ---- breadcrumb: -2px left, -1px up ---- */
html body .customerpath{left:73px!important;transform:translateY(2px)!important}

/* ---- breadcrumb: another 1px left ---- */
html body .customerpath{left:72px!important}

/* ---- customer tabs: 4px lower again ---- */
html body .customerworkspace .inboundtabs{margin-top:8px!important}

/* ---- packaging legend centred over the fieldset ---- */
html body fieldset.boxfields>legend{width:100%!important;justify-content:center!important;padding:0!important;margin:0 auto!important;text-align:center!important}

/* ---- customer content panel: 2px lower ---- */
html body .customerworkspace .panel{margin-top:2px!important}
html body .customerworkspace>.panel{margin-top:2px!important}

/* ---- 2px gap between tabs and the content card ---- */
html body .customerworkspace .panel{margin-top:0!important}
html body .customerworkspace>.panel{margin-top:0!important}
html body .customerworkspace .inboundtabs{margin-bottom:2px!important}

/* ---- correct downward gap below tabs (net +2px vs earlier) ---- */
html body .customerworkspace .inboundtabs{margin-bottom:6px!important}
html body .customerworkspace .panel{margin-top:0!important}

/* ---- customer tables: hide the horizontal scrollbar strip ---- */
html body .customerworkspace .tablewrap,html body .customerworkspace .sitablewrap{scrollbar-width:none!important;-ms-overflow-style:none!important}
html body .customerworkspace .tablewrap::-webkit-scrollbar,html body .customerworkspace .sitablewrap::-webkit-scrollbar{height:0!important;width:0!important;display:none!important}

/* ---- stock toolbar: warehouse select sits next to the search box ---- */
html body .stockquerytoolbar .search{flex:0 0 420px!important;width:420px!important;max-width:420px!important}
html body .stockquerytoolbar>select{margin-right:auto!important;margin-left:8px!important}

/* ---- content card 10px lower ---- */
html body .customerworkspace .inboundtabs{margin-bottom:16px!important}

/* ---- content card 2px higher ---- */
html body .customerworkspace .inboundtabs{margin-bottom:14px!important}

/* ---- customer tabs: 2px lower ---- */
html body .customerworkspace .inboundtabs{margin-top:10px!important}

/* ---- unsaved-changes dialog: delete-item button is red ---- */
html body .workspaceclosebody button.deletebtn[class][class][class],html body .workspaceclosebody button[data-action-tone="red"][class][class][class],html body .workspaceclosebody button.unsaveddelete[class][class][class]{background:#FF3B30!important;color:#FFFFFF!important;border:0!important;border-radius:12px!important;font-weight:600!important;box-shadow:none!important}
html body .workspaceclosebody button.deletebtn[class][class][class]:hover,html body .workspaceclosebody button[data-action-tone="red"][class][class][class]:hover{background:#E0332A!important}

/* ---- delete tier dialog: centred title, no header close, bottom close button ---- */
html body .pricedeletemodal .paneltitle{justify-content:center!important;position:relative!important;padding-right:16px!important}
html body .pricedeletemodal .paneltitle>h2{text-align:center!important;margin:0 auto!important;width:100%!important;font-size:19px!important}
html body .pricedeletemodal .paneltitle>button{display:none!important}
html body .pricedeleteactions{justify-content:center!important;gap:8px!important;position:relative!important}
html body .pricedeleteactions>button.pricedeleteclose{position:absolute!important;right:0!important;top:12px!important;background:#E8E8E6!important;color:#007AFF!important;border:0!important}

/* ---- red circular close button: glyph optically centred ---- */
html body .paneltitle>button.quiet[class][class][class]{display:inline-flex!important;align-items:center!important;justify-content:center!important;padding:0!important;line-height:1!important}
html body .paneltitle>button.quiet[class][class][class]::before{display:flex!important;align-items:center!important;justify-content:center!important;line-height:1!important;margin:0!important;transform:translateY(-1px)!important;font-size:15px!important}

/* ---- delete tier dialog: centred title, no header close, all actions centred ---- */
html body .pricedeletemodal .paneltitle{justify-content:center!important;align-items:center!important;position:relative!important;display:flex!important}
html body .pricedeletemodal .paneltitle h2{text-align:center!important;margin:0 auto!important;width:100%!important;font-size:19px!important}
html body .pricedeletemodal .paneltitle button{display:none!important;visibility:hidden!important;width:0!important;height:0!important;overflow:hidden!important}
html body .pricedeleteactions{display:flex!important;justify-content:center!important;align-items:center!important;gap:8px!important}
html body .pricedeleteactions>button.pricedeleteclose{position:static!important;right:auto!important;top:auto!important;margin:0!important}

/* ---- delete dialog: force-hide header close (max specificity) ---- */
html body .pricedeletemodal .paneltitle>button.quiet[class][class][class][class]{display:none!important;visibility:hidden!important;position:absolute!important;width:0!important;height:0!important;padding:0!important;margin:0!important;overflow:hidden!important;border:0!important}
html body .pricedeletemodal .paneltitle>button[class][class][class][class]{display:none!important}

/* ---- delete dialog title: forced centre ---- */
html body .modal.pricedeletemodal .paneltitle>h2{text-align:center!important;flex:1 1 100%!important;width:100%!important;margin:0!important;display:block!important}
html body .modal.pricedeletemodal .paneltitle{justify-content:center!important;text-align:center!important}

/* ---- close glyph nudged 2px right ---- */
html body .paneltitle>button.quiet[class][class][class]::before{transform:translate(2px, -1px)!important}

/* ---- profit freight: left amount centred like the input ---- */
html body .profitfreight>div>strong{display:block!important;text-align:center!important}
html body .profitfreight>div>span{text-align:center!important;display:block!important}
html body .profitfreight>div>small{text-align:center!important;display:block!important}
html body .profitfreight>label{text-align:center!important}
html body .profitfreight>label>input{text-align:center!important}

/* ---- close glyph nudged 2px further right ---- */
html body .paneltitle>button.quiet[class][class][class]::before{transform:translate(4px, -1px)!important}

/* ---- profit freight: three stacked rows ---- */
html body .profitfreight{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;align-items:stretch!important}
html body .profitfreight>div,html body .profitfreight>label{display:flex!important;flex-wrap:wrap!important;align-items:center!important;justify-content:space-between!important;gap:6px 12px!important;padding:10px 14px!important;background:#F7F7F5!important;border-radius:10px!important;text-align:left!important}
html body .profitfreight>div>span,html body .profitfreight>label{color:#6C6B66!important;font-size:12.5px!important;font-weight:600!important}
html body .profitfreight>div>strong{font-size:17px!important;color:#1C1C1E!important;margin-left:auto!important;text-align:right!important}
html body .profitfreight>div>small{flex:1 1 100%!important;text-align:right!important;color:#8A8984!important;font-size:12px!important}
html body .profitfreight>label>input{width:200px!important;text-align:right!important;margin-left:auto!important}

/* ---- profit freight: compact label/value rows, no big boxes ---- */
html body .profitfreight{display:grid!important;grid-template-columns:1fr!important;gap:0!important;background:transparent!important;padding:0!important}
html body .profitfreight>div,html body .profitfreight>label{display:grid!important;grid-template-columns:1fr auto!important;align-items:center!important;gap:2px 16px!important;padding:9px 2px!important;background:transparent!important;border:0!important;border-bottom:1px solid #EDECE8!important;border-radius:0!important;text-align:left!important}
html body .profitfreight>div>span,html body .profitfreight>label{grid-column:1!important;color:#6C6B66!important;font-size:12.5px!important;font-weight:600!important;text-align:left!important}
html body .profitfreight>div>strong{grid-column:2!important;justify-self:end!important;font-size:16px!important;color:#1C1C1E!important;text-align:right!important;margin:0!important}
html body .profitfreight>div>small{grid-column:1/-1!important;text-align:left!important;color:#8A8984!important;font-size:11.5px!important;margin:2px 0 0!important}
html body .profitfreight>label>input{grid-column:2!important;justify-self:end!important;width:190px!important;height:28px!important;padding:0 10px!important;text-align:right!important;margin:0!important}

/* ---- profit freight note: no background bar ---- */
html body .profitfreight>div>small{background:transparent!important;padding:0!important;border:0!important;border-radius:0!important;box-shadow:none!important}
html body .profitfreight>label>input{width:220px!important}

/* ---- profit freight: values left-aligned beside labels ---- */
html body .profitfreight>div,html body .profitfreight>label{display:grid!important;grid-template-columns:220px auto!important;justify-content:start!important;align-items:center!important;column-gap:20px!important;text-align:left!important}
html body .profitfreight>div>strong{grid-column:2!important;justify-self:start!important;text-align:left!important;margin:0!important;font-size:16px!important}
html body .profitfreight>label>input{grid-column:2!important;justify-self:start!important;text-align:left!important;width:240px!important;margin:0!important}
html body .profitfreight>div>small{grid-column:1 / -1!important;text-align:left!important;background:transparent!important;padding:0!important;border:0!important;border-radius:0!important;box-shadow:none!important;display:block!important;width:auto!important}
html body .profitfreight>div>span,html body .profitfreight>label{grid-column:1!important;justify-self:start!important;text-align:left!important}

/* ---- profit freight: currency prefix and identical text start ---- */
html body .profitfreight>label{display:grid!important;grid-template-columns:220px auto!important;justify-content:start!important;align-items:center!important;column-gap:20px!important}
html body .profitfreight .freightinputwrap{grid-column:2!important;display:inline-flex!important;align-items:center!important;gap:6px!important;justify-self:start!important}
html body .profitfreight .freightcurrency{font-style:normal!important;font-size:15px!important;color:#1C1C1E!important;font-weight:600!important}
html body .profitfreight .freightinputwrap>input{width:210px!important;height:30px!important;padding:0 10px!important;text-align:left!important;margin:0!important}
html body .profitfreight>div>strong{padding-left:22px!important}

/* ---- profit freight: amounts and currency prefix share one left edge ---- */
html body .profitfreight>div>strong{padding-left:0!important}
html body .profitfreight .freightinputwrap{justify-self:start!important}

/* ---- profit freight: borderless input aligned with the amounts ---- */
html body .profitfreight .freightinputwrap>input{border:0!important;background:transparent!important;box-shadow:none!important;outline:none!important;padding:0 4px!important;height:24px!important;width:180px!important;font-size:16px!important;font-weight:600!important;color:#1C1C1E!important}
html body .profitfreight .freightinputwrap>input::placeholder{font-weight:400!important;color:#A9A8A3!important;font-size:13px!important}
html body .profitfreight .freightinputwrap{gap:4px!important}

/* ---- profit freight: identical glyph metrics for the editable value ---- */
html body .profitfreight .freightinputwrap{gap:0!important;align-items:baseline!important}
html body .profitfreight .freightinputwrap>input{padding:0!important;margin:0!important;height:auto!important;line-height:1.2!important;font-size:16px!important;font-weight:600!important;font-family:inherit!important;width:200px!important;border:0!important;background:transparent!important;box-shadow:none!important}
html body .profitfreight .freightinputwrap>input::placeholder{font-size:13px!important;font-weight:400!important;color:#A9A8A3!important}

/* ---- profit freight: currency symbol overlaid, digits share one left edge ---- */
html body .profitfreight .freightinputwrap{position:relative!important;display:inline-block!important;gap:0!important;vertical-align:baseline!important}
html body .profitfreight .freightcurrency{position:absolute!important;left:0!important;top:50%!important;transform:translateY(-50%)!important;font-size:16px!important;font-weight:600!important;line-height:1!important;color:#1C1C1E!important;pointer-events:none!important}
html body .profitfreight .freightinputwrap>input{width:230px!important;height:22px!important;padding:0 0 0 13px!important;margin:0!important;font-size:16px!important;font-weight:600!important;line-height:22px!important;border:0!important;background:transparent!important;box-shadow:none!important;font-family:inherit!important;color:#1C1C1E!important}
html body .profitfreight .freightinputwrap>input::placeholder{padding-left:0!important;font-size:13px!important;font-weight:400!important;color:#A9A8A3!important}

/* ---- profit freight input: beat the old 18px/38px rules ---- */
html body .profitmodal .profitfreight .freightinputwrap>input[type="number"][type][type][type]{font-size:16px!important;font-weight:600!important;height:22px!important;min-height:22px!important;line-height:22px!important;padding:0 0 0 13px!important;border:0!important;background:transparent!important;box-shadow:none!important;width:230px!important}
html body .profitmodal .profitfreight .freightinputwrap{display:inline-block!important;position:relative!important}
html body .profitmodal .profitfreight .freightcurrency{position:absolute!important;left:0!important;top:50%!important;transform:translateY(-50%)!important;font-size:16px!important;font-weight:600!important;line-height:1!important}

/* ---- profit cost rows: same rhythm as the freight rows ---- */
html body .profitcost{display:grid!important;grid-template-columns:220px 1fr auto!important;align-items:center!important;column-gap:20px!important;padding:9px 2px!important;border:0!important;border-bottom:1px solid #EDECE8!important;border-radius:0!important;background:transparent!important}
html body .profitcost input{border:0!important;background:transparent!important;box-shadow:none!important;outline:none!important;padding:0!important;height:24px!important;min-height:24px!important;font-size:16px!important;font-weight:600!important;color:#1C1C1E!important;width:100%!important}
html body .profitcost input:first-child{font-size:12.5px!important;font-weight:600!important;color:#6C6B66!important}
html body .profitcost input::placeholder{font-weight:400!important;font-size:13px!important;color:#A9A8A3!important}
html body .profitcost button{justify-self:end!important}
html body .sisection .hint{padding:6px 2px!important;margin:0!important}

/* ---- profit cost inputs forced borderless (high specificity) ---- */
html body .profitmodal .sisection .profitcost{grid-template-columns:220px 240px auto!important;justify-content:start!important}
html body .profitmodal .sisection .profitcost input[type="number"][type][type],html body .profitmodal .sisection .profitcost input[type="text"][type][type],html body .profitmodal .sisection .profitcost input:not([type])[class][class]{border:0!important;border-bottom:1px solid #E7E6E2!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;font-size:16px!important;font-weight:600!important;height:26px!important;min-height:26px!important;padding:0!important;width:100%!important}
html body .profitmodal .sisection .profitcost input[type="number"][type][type]:focus,html body .profitmodal .sisection .profitcost input:not([type])[class][class]:focus{border-bottom-color:#007AFF!important;outline:none!important}

/* ---- profit cost row: delete pinned to the far right ---- */
html body .profitmodal .sisection .profitcost{grid-template-columns:220px 240px 1fr auto!important;justify-content:stretch!important}
html body .profitmodal .sisection .profitcost>button{grid-column:3!important;justify-self:end!important}

/* ---- profit freight: identical row heights, no number steppers ---- */
html body .profitfreight>div,html body .profitfreight>label{min-height:40px!important;height:40px!important;box-sizing:border-box!important;align-items:center!important;padding:0 2px!important}
html body .profitfreight>div>span,html body .profitfreight>div>strong,html body .profitfreight>label{line-height:1.2!important}
html body .profitmodal input[type="number"]::-webkit-inner-spin-button,html body .profitmodal input[type="number"]::-webkit-outer-spin-button{-webkit-appearance:none!important;appearance:none!important;margin:0!important;display:none!important}
html body .profitmodal input[type="number"]{-moz-appearance:textfield!important;appearance:textfield!important}

/* ---- profit section badges: three soft tints ---- */
html body .profitbadge.badge-freight{background:#EAF2FF!important;color:#1F4E8C!important;border:1px solid #D6E4FA!important}
html body .profitbadge.badge-cost{background:#FFF6E8!important;color:#8A5A14!important;border:1px solid #F3E3C7!important}
html body .profitbadge.badge-items{background:#EAF7EF!important;color:#1F6B43!important;border:1px solid #CFE9D8!important}
html body .profitbadge{font-weight:700!important}

/* ---- profit cost: currency symbol and digits on the same columns as freight ---- */
html body .profitcost .costamountwrap{position:relative!important;display:inline-block!important;width:100%!important}
html body .profitcost .costamountwrap>.freightcurrency{position:absolute!important;left:0!important;top:50%!important;transform:translateY(-50%)!important;font-size:16px!important;font-weight:600!important;line-height:1!important;color:#1C1C1E!important;pointer-events:none!important}
html body .profitcost .costamountwrap>input{padding-left:13px!important}

/* ---- profit cost: shift by wrapper padding so placeholder clears the symbol ---- */
html body .profitcost .costamountwrap{padding-left:14px!important;box-sizing:border-box!important;position:relative!important;display:block!important;width:100%!important}
html body .profitcost .costamountwrap>input{padding:0!important;width:100%!important}
html body .profitcost .costamountwrap>.freightcurrency{left:0!important}

/* ---- freight paid switch: grey off, red on ---- */
html body .freightpaid>span.cgswitch{background:#DCDBD6!important;border:0!important}
html body .freightpaid.isrepeat>span.cgswitch{background:#FF3B30!important;border:0!important}
html body .freightpaid>span.cgswitch::after,html body .freightpaid>span.cgswitch::before{background:#FFFFFF!important}
html body .freightpaid.isrepeat{color:#1C1C1E!important}

/* ---- generic switch (PO 返单 etc.): grey off, red on ---- */
html body .cgrepeat>span.cgswitch{background:#DCDBD6!important;border:0!important}
html body .cgrepeat.isrepeat>span.cgswitch{background:#FF3B30!important;border:0!important}
html body .cgrepeat>span.cgswitch::after,html body .cgrepeat>span.cgswitch::before{background:#FFFFFF!important}
html body .cgrepeat.isrepeat{color:#1C1C1E!important}

/* ---- top bar: language icon and role chip in red tone ---- */
html body .accountchip em{color:#FF3B30!important;background:#FFECEA!important;border:1px solid #FFD6D2!important;border-radius:999px!important;padding:1px 8px!important;font-style:normal!important;font-weight:600!important}
html body .languageswitcher>svg{color:#FF3B30!important;background:#FFECEA!important;border-radius:999px!important;padding:2px!important;box-sizing:content-box!important}
html body .accountchip strong{color:#1C1C1E!important}

/* ---- top bar red accents: text only, no fill ---- */
html body .accountchip em{background:transparent!important;border:0!important;padding:0!important;margin-left:4px!important;color:#FF3B30!important;font-weight:600!important}
html body .languageswitcher>svg{background:transparent!important;padding:0!important;border:0!important;color:#FF3B30!important}

/* ---- header refresh button: standard size, icon+label centred ---- */
html body header>button.quiet[class]{width:auto!important;min-width:0!important;max-width:none!important;height:26px!important;min-height:26px!important;padding:0 12px!important;border-radius:13px!important;background:#E8E8E6!important;color:#007AFF!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:6px!important;font-size:12.5px!important;font-weight:600!important;line-height:1!important;white-space:nowrap!important}
html body header>button.quiet[class] svg{width:14px!important;height:14px!important;flex:0 0 auto!important;display:block!important}

/* ---- header refresh icon: force visible stroke ---- */
html body header>button.quiet[class] svg{stroke:#007AFF!important;fill:none!important;stroke-width:2!important;stroke-linecap:round!important;stroke-linejoin:round!important;color:#007AFF!important;display:block!important;width:14px!important;height:14px!important}
html body header>button.quiet[class] svg *{stroke:#007AFF!important;fill:none!important}

/* ---- order print center: system palette ---- */
html body .orderprintcenter{background:#FFFFFF!important;border:1px solid #E7E6E2!important;border-radius:16px!important;box-shadow:0 18px 50px rgba(20,20,20,.18)!important}
html body .orderprintheader{background:#FFFFFF!important;border-bottom:1px solid #ECEBE8!important;padding:12px 18px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important}
html body .orderprintheader h2{font-size:16px!important;color:#1C1C1E!important;margin:0 0 2px!important}
html body .orderprintheader small{font-size:12.5px!important;color:#6C6B66!important}
html body .orderprintactions{display:flex!important;align-items:center!important;gap:8px!important;flex-wrap:wrap!important}
html body .orderprintactions>button,html body .orderprintactions>a{height:26px!important;min-height:26px!important;padding:0 12px!important;border-radius:13px!important;font-size:12.5px!important;font-weight:600!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;border:0!important;text-decoration:none!important;box-shadow:none!important}
html body .orderprintactions>button.secondary{background:#E8E8E6!important;color:#007AFF!important}
html body .orderprintactions>a.orderpdfdownload,html body .orderprintactions>button.primary{background:#E6F0FF!important;color:#0058CC!important;border:1px solid #CFE0F8!important}
html body .orderprinttip{background:#F7F7F5!important;border-bottom:1px solid #ECEBE8!important;color:#6C6B66!important;font-size:12.5px!important;padding:8px 18px!important;margin:0!important}
html body .printzoomtools{background:#FFFFFF!important;border-bottom:1px solid #ECEBE8!important;padding:8px 18px!important;gap:8px!important}
html body .printzoomtools button{background:#E8E8E6!important;color:#007AFF!important;border:0!important;border-radius:13px!important;font-size:12.5px!important;font-weight:600!important;height:26px!important;min-height:26px!important;padding:0 12px!important}
html body .printzoomtools select{height:26px!important;min-height:26px!important;border:1px solid #E0DFDB!important;border-radius:13px!important;background:#FFFFFF!important;color:#1C1C1E!important;font-size:12.5px!important;padding:0 10px!important}
html body .printzoomtools .printzoomlabel span,html body .printzoomtools small{color:#6C6B66!important;font-size:12.5px!important}

/* ---- print preview: neutral scrollbars ---- */
html body .printzoomscroll{scrollbar-width:thin!important;scrollbar-color:#C9C8C4 #F1F0ED!important}
html body .printzoomscroll::-webkit-scrollbar{height:10px!important;width:10px!important}
html body .printzoomscroll::-webkit-scrollbar-track{background:#F1F0ED!important}
html body .printzoomscroll::-webkit-scrollbar-thumb{background:#C9C8C4!important;border-radius:5px!important;border:2px solid #F1F0ED!important}
html body .printzoomscroll::-webkit-scrollbar-thumb:hover{background:#A9A8A3!important}