:root {
  --bg: #f4f7fb;
  --panel: #ffffff;
  --line: #d8e0ea;
  --text: #1f2937;
  --muted: #6b7280;
  --primary: #1d4ed8;
  --primary-soft: #dbeafe;
  --accent: #0f766e;
}

* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: "Segoe UI", "Microsoft YaHei", sans-serif;
  background: var(--bg);
  color: var(--text);
}
.topbar, .panel, .detail-card {
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: 12px;
}
.topbar {
  margin: 16px;
  padding: 14px 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  align-items: stretch;
}
.topbar-main-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px 16px;
  width: 100%;
  min-width: 0;
}
.topbar-selects {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  flex-shrink: 0;
}
.topbar-filters-row,
.tab-filters-row {
  display: grid;
  align-items: center;
  min-width: 0;
  min-height: 2.5rem;
}
.topbar-filters-row {
  width: 100%;
}
.tab-filters-row {
  flex: 1 1 auto;
  justify-content: flex-end;
}
.topbar-filters-row > .topbar-filter-bar,
.tab-filters-row > .topbar-filter-bar {
  grid-area: 1 / 1;
  min-width: 0;
  justify-content: flex-end;
}
.topbar-filters-row > .topbar-filter-bar.hidden,
.tab-filters-row > .topbar-filter-bar.hidden {
  display: flex !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
.brand {
  flex: 0 0 auto;
  min-width: 160px;
}
.brand h1,
.app-brand-title {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.25;
}
.app-branding { display: flex; flex-direction: column; gap: 4px; }
.app-brand-logo {
  display: block;
  max-height: 40px;
  max-width: 180px;
  object-fit: contain;
}
.app-brand-slogan {
  margin: 0;
  font-size: 0.85rem;
  font-weight: 700;
  text-align: center;
  color: var(--muted);
  line-height: 1.4;
  max-width: 320px;
  width: 100%;
}
.app-product-count {
  display: block;
  margin: 0;
  font-size: 13px;
  text-align: center;
  line-height: 1.4;
  max-width: 320px;
  width: 100%;
}
.party-logo-field {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin-bottom: 12px;
}
.party-logo-preview-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 120px;
  min-height: 56px;
  padding: 8px;
  border: 1px dashed #cbd5e1;
  border-radius: 8px;
  background: #f8fafc;
}
.party-logo-preview {
  display: block;
  max-width: 160px;
  max-height: 64px;
  object-fit: contain;
}
.party-logo-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.supplier-business-license-field {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 12px;
}
.supplier-business-license-preview-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 140px;
  min-height: 80px;
  padding: 8px;
  border: 1px dashed #cbd5e1;
  border-radius: 8px;
  background: #f8fafc;
}
.supplier-business-license-preview {
  display: block;
  max-width: 200px;
  max-height: 120px;
  object-fit: contain;
}
.supplier-business-license-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.brand-title-row {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-bottom: 4px;
}
.app-version {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  background: #eef2ff;
  color: #4338ca;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.5;
  white-space: nowrap;
}
.app-version.inline-version {
  vertical-align: middle;
  font-size: 11px;
  font-weight: 600;
}
.topbar-field {
  display: flex;
  flex-direction: column;
  gap: 0;
  font-size: 13px;
  min-width: 0;
}
.topbar-label {
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
}
.topbar-suppliers {
  flex: 1 1 320px;
}
.topbar-suppliers .supplier-bar-wrap {
  min-width: 0;
}
.topbar-selects .customer-select-wrap {
  max-width: 120px;
  min-width: 0;
}
.topbar-selects .customer-select-wrap select,
.topbar-selects .customer-select-wrap .searchable-combobox-input {
  min-width: 70px;
  max-width: 120px;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.topbar-selects .supplier-select-wrap {
  max-width: calc(120px + 2ch);
}
.topbar-selects .supplier-select-wrap select,
.topbar-selects .supplier-select-wrap .searchable-combobox-input {
  min-width: calc(70px + 2ch);
  max-width: calc(120px + 2ch);
}
.topbar-filter-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
  align-items: center;
  padding: 0;
  border: 0;
  background: transparent;
}
.topbar-filter-bar.hidden { display: none !important; }
.topbar-filter-label {
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
  white-space: nowrap;
}
.topbar-filter-meta {
  font-size: 12px;
  white-space: nowrap;
}
.toolbar, .row, .cart-actions, .chip-group { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.toolbar-user-actions {
  display: flex;
  flex-wrap: nowrap;
  gap: 10px;
  align-items: center;
  flex-shrink: 0;
  margin-left: auto;
}
.header-user-dropdown.hidden { display: none !important; }
.header-user-dropdown .toolbar-dropdown-btn {
  min-width: 0;
  max-width: min(220px, 42vw);
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 6px 10px;
  font-size: 12px;
  font-weight: 600;
  border-radius: 999px;
}
.header-user-dropdown-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}
.header-user-dropdown-chevron {
  flex-shrink: 0;
  font-size: 10px;
  opacity: 0.75;
}
.header-user-dropdown .toolbar-dropdown-panel {
  min-width: 140px;
}
.header-business-nav {
  display: flex;
  flex-wrap: nowrap;
  gap: 6px;
  align-items: center;
  flex: 1 1 auto;
  min-width: 0;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  padding: 2px 0;
}
.header-business-nav.hidden { display: none !important; }
.header-business-nav-btn {
  padding: 6px 10px;
  font-size: 12px;
  border-radius: 999px;
  white-space: nowrap;
  flex-shrink: 0;
}
.header-business-nav-btn.hidden { display: none !important; }
.header-business-nav-btn.active {
  background: var(--primary);
  color: #fff;
}
.toolbar-dropdown-wrap { position: relative; }
.toolbar-dropdown-btn {
  min-width: 88px;
  background: var(--primary);
  color: #fff;
}
.toolbar-dropdown-panel {
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  z-index: 50;
  min-width: 180px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  display: grid;
  gap: 2px;
}
.toolbar-dropdown-panel.hidden { display: none !important; }
.toolbar-menu-item {
  width: 100%;
  text-align: left;
  background: #fff;
  color: var(--text);
  border: 0;
  border-radius: 6px;
  padding: 8px 12px;
  font-size: 13px;
}
.toolbar-menu-item:hover { background: #f1f5f9; }
.toolbar-menu-divider {
  height: 1px;
  margin: 6px 0;
  background: #e2e8f0;
}
.toolbar-menu-section-label {
  padding: 4px 12px 2px;
  font-size: 11px;
  font-weight: 700;
  color: #64748b;
  letter-spacing: 0.02em;
}
button, .file-btn {
  border: 0;
  background: var(--primary);
  color: #fff;
  padding: 10px 14px;
  border-radius: 8px;
  cursor: pointer;
  font-size: 14px;
}
button.secondary, .file-btn.secondary { background: #e5e7eb; color: var(--text); }
.file-btn { display: inline-flex; align-items: center; }
.customer-bar, .tabs-toolbar.panel, main .panel, .results {
  margin: 0 16px 16px;
  padding: 16px;
}
.tabs-toolbar {
  display: flex;
  align-items: center;
  gap: 12px 16px;
  flex-wrap: wrap;
  min-height: 2.5rem;
}
.tabs-toolbar:has(> .product-toolbar-zone.hidden) {
  display: none;
}
.product-toolbar-zone {
  display: flex;
  align-items: center;
  gap: 12px 16px;
  flex-wrap: wrap;
  flex: 1 1 100%;
  min-width: 0;
}
.product-toolbar-zone.hidden {
  display: none !important;
}
.product-toolbar-lookup {
  display: flex;
  align-items: center;
  gap: 12px 16px;
  flex-wrap: wrap;
  flex: 1 1 100%;
  min-width: 0;
}
.product-toolbar-lookup.hidden {
  display: none !important;
}
.product-catalog-l1-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  flex: 1 1 100%;
  min-width: 0;
  align-items: center;
}
.product-catalog-l1-toolbar.hidden {
  display: none !important;
}
.product-catalog-l1-toolbar .catalog-l1-btn.active {
  background: #1d4ed8;
  color: #fff;
  border-color: #1d4ed8;
}
.product-catalog-panel-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 16px;
  margin-bottom: 12px;
}
.product-catalog-panel-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.product-catalog-tip {
  margin: 0;
  flex: 1 1 280px;
}
.tabs {
  display: flex;
  gap: 8px;
  margin: 0;
  flex: 0 0 auto;
}
.tab.tab-strip-hidden {
  display: none !important;
}
.browse-toolbar-head {
  display: flex;
  align-items: center;
  gap: 12px;
}
.tab-toolbar-extra {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 0 0 auto;
  min-width: 0;
}
.tab-toolbar-extra.hidden { display: none !important; }
.lookup-toolbar-head {
  margin-left: auto;
}
.lookup-toolbar-head input {
  flex: 1;
  min-width: 180px;
  max-width: 420px;
}
#lookupTab.tab-panel-empty { display: none !important; }
.browse-toolbar-head h2 {
  margin: 0;
  font-size: 16px;
  font-weight: 600;
  white-space: nowrap;
}
.tab {
  background: #e5e7eb;
  color: var(--text);
}
.tab.active { background: var(--primary); color: #fff; }
.tab-panel { display: none; }
.tab-panel.active { display: block; }
.customer-bar-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  align-items: center;
  margin-bottom: 10px;
}
.customer-select-wrap {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 13px;
}
.customer-status {
  font-size: 13px;
  line-height: 1.5;
}
.supplier-bar-wrap {
  display: grid;
  gap: 4px;
}
button.danger {
  color: #b91c1c;
  border-color: #fecaca;
  background: #fef2f2;
}
button.danger:hover:not(:disabled) {
  background: #fee2e2;
}
button:disabled { opacity: 0.5; cursor: not-allowed; }
.customer-mode-banner,
.customer-catalog-panel {
  padding: 0;
  border: 0;
  background: transparent;
}
.library-registry-filters label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid var(--line);
  font-size: 13px;
}
.library-import-actions {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.library-import-actions.hidden {
  display: none !important;
}
.product-import-result-modal-card {
  width: min(560px, calc(100vw - 32px));
  max-height: min(80vh, 720px);
  overflow: auto;
}
.product-import-result-summary {
  margin: 0 0 12px;
  line-height: 1.6;
}
.product-import-warnings-wrap {
  margin-top: 0.75rem;
}
.product-import-warnings {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  max-height: 9rem;
  overflow: auto;
}
.product-import-warning-row {
  padding: 0.35rem 0.5rem;
  border-radius: 6px;
  background: rgba(255, 193, 7, 0.12);
  color: var(--text);
  font-size: 0.92rem;
}
.product-import-errors-wrap {
  margin-top: 8px;
}
.product-import-errors {
  display: grid;
  gap: 6px;
  max-height: 280px;
  overflow: auto;
  font-size: 13px;
}
.product-import-error-row {
  padding: 8px 10px;
  border-radius: 8px;
  background: #fef2f2;
  border: 1px solid #fecaca;
  color: #991b1b;
}
.product-import-result-actions {
  margin-top: 16px;
  justify-content: flex-end;
}
.registry-cell {
  max-width: 180px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 12px;
}
.detail-registry-block {
  grid-column: 1 / -1;
  display: grid;
  gap: 4px;
}
.detail-registry-block em {
  font-style: normal;
  font-size: 12px;
}
.customer-view-filters label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  background: #fff;
  border: 1px solid var(--line);
  font-size: 13px;
}
.customer-view-filters input { margin: 0; }
.supplier-scope-stats {
  padding: 8px 10px;
  border-radius: 8px;
  background: var(--primary-soft);
}
.supplier-filter-wrap { flex: 1; min-width: 200px; }
.upload-status { margin: 0; min-height: 18px; line-height: 1.5; }
.filter-panel { padding: 0; }
#browseTab.browse-tab-collapsed {
  display: none !important;
}
#browseTab.matrix-view-hidden {
  display: none !important;
}
.browse-filter-body.hidden { display: none !important; }
.filter-advanced { border-top: 1px dashed #e2e8f0; }
.filter-extra-row { align-items: center; border-top: 1px dashed #e2e8f0; }
.filter-rowline.compact-row select.filter-select {
  min-width: 140px;
  padding: 6px 8px;
  border: 1px solid #cbd5e1;
  border-radius: 4px;
  font-size: 13px;
  background: #fff;
}
.filter-rowline {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 10px 16px;
  border-bottom: 1px solid #edf2f7;
  flex-wrap: wrap;
}
.filter-label {
  width: 72px;
  flex-shrink: 0;
  color: var(--muted);
  font-size: 13px;
  line-height: 32px;
}
.filter-search-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(120px, 1fr));
  gap: 8px;
  flex: 1;
  min-width: 280px;
}
.filter-search-grid input,
.range-input {
  min-height: 34px;
  padding: 6px 10px;
}
.filter-actions { display: flex; gap: 8px; align-items: center; }
.btn-query {
  background: #2563eb;
  min-width: 72px;
  padding: 8px 16px;
}
.btn-clear {
  background: #fff;
  color: #dc2626;
  border: 1px solid #fecaca;
  min-width: 72px;
  padding: 8px 16px;
}
.btn-clear:hover { background: #fef2f2; }
.filter-taxonomy-row {
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.taxonomy-group {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 0 1 auto;
  min-width: 0;
}
.taxonomy-dropdown-group {
  flex: 0 1 200px;
  min-width: 160px;
}
.browse-filter-dropdown-wrap {
  flex: 1;
  min-width: 140px;
}
.browse-filter-dropdown-wrap .category-dropdown-btn {
  min-width: 120px;
}
.taxonomy-label {
  flex-shrink: 0;
  color: var(--muted);
  font-size: 13px;
  font-weight: 600;
  white-space: nowrap;
}
.filter-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  flex: 1;
  min-width: 200px;
}
.filter-tags-inline {
  flex: 0 1 auto;
  min-width: 0;
  flex-wrap: nowrap;
}
.filter-tags-inline .filter-tag {
  padding: 4px 10px;
  font-size: 12px;
  white-space: nowrap;
}
.category-dropdown-wrap {
  position: relative;
  min-width: 160px;
}
.category-dropdown-btn {
  width: 100%;
  min-width: 160px;
  text-align: left;
  padding: 6px 12px;
  font-size: 12px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.category-dropdown-panel {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  z-index: 30;
  min-width: 260px;
  max-width: min(420px, 90vw);
  max-height: 280px;
  overflow: auto;
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  display: grid;
  gap: 6px;
}
.category-dropdown-panel.hidden { display: none !important; }
.category-dropdown-panel label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  padding: 4px 2px;
  cursor: pointer;
}
.category-dropdown-actions {
  display: flex;
  gap: 8px;
  padding-bottom: 6px;
  border-bottom: 1px solid var(--line);
  margin-bottom: 4px;
}
.category-dropdown-actions button {
  padding: 4px 10px;
  font-size: 12px;
}
.filter-tag {
  border: 1px solid #cbd5e1;
  background: #fff;
  color: #334155;
  border-radius: 4px;
  padding: 5px 12px;
  font-size: 13px;
  cursor: pointer;
  line-height: 1.3;
}
.filter-tag:hover { border-color: #94a3b8; }
.filter-tag.active {
  background: #1e3a8a;
  border-color: #1e3a8a;
  color: #fff;
}
.filter-tag.multi-on {
  background: #dbeafe;
  border-color: #2563eb;
  color: #1d4ed8;
}
.range-row { align-items: center; }
.range-sep { color: var(--muted); }
.range-unit { color: var(--muted); font-size: 12px; margin-left: 8px; }
.btn-mini {
  background: #2563eb;
  padding: 6px 14px;
  font-size: 13px;
  border-radius: 4px;
}
.filter-more-bar { background: #fafbfc; }
.more-filter-btn {
  background: #fff;
  color: var(--text);
  border: 1px solid #cbd5e1;
  padding: 6px 14px;
  font-size: 13px;
  border-radius: 4px;
}
.more-filter-btn.open { background: #eff6ff; border-color: #93c5fd; }
.more-filters { border-bottom: 1px solid #edf2f7; }
.more-filters .compact-row { align-items: center; }
.filters label { display: flex; flex-direction: column; gap: 6px; font-size: 13px; }
.filter-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 12px;
  margin: 12px 0;
}
.filter-block { margin-bottom: 8px; }
.checks { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; }
input, select {
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: 14px;
}
.searchable-combobox {
  position: relative;
  min-width: 0;
}
.searchable-combobox.disabled {
  opacity: 0.55;
}
.searchable-combobox-input {
  padding: 9px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: 14px;
  background: #fff;
  color: var(--text);
  box-sizing: border-box;
}
.searchable-combobox-input:focus {
  outline: 2px solid var(--primary-soft);
  border-color: var(--primary);
}
.searchable-combobox-list {
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  z-index: 300;
  min-width: 100%;
  width: max-content;
  max-width: 280px;
  margin: 0;
  padding: 4px 0;
  list-style: none;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
  max-height: 240px;
  overflow-y: auto;
}
.searchable-combobox-option {
  padding: 8px 10px;
  font-size: 13px;
  line-height: 1.35;
  cursor: pointer;
  white-space: nowrap;
}
.searchable-combobox-option.selected {
  color: var(--primary);
  font-weight: 600;
}
.searchable-combobox-option.highlighted,
.searchable-combobox-option:hover {
  background: var(--primary-soft);
}
.searchable-combobox-empty {
  padding: 8px 10px;
  font-size: 13px;
}
.muted { color: var(--muted); font-size: 13px; }
.results { min-height: 240px; }
.results-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px 16px;
  margin-bottom: 12px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #f8fafc;
}
.results-toolbar.hidden { display: none !important; }
.result-summary {
  font-size: 13px;
  min-width: 0;
}
.results-toolbar-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin-left: auto;
}
.view-mode-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.view-mode-controls.hidden { display: none !important; }
.view-toggle-label { font-size: 13px; color: var(--muted); }
.view-btn.active,
.view-btn.active.secondary {
  background: var(--primary);
  color: #fff;
}
.price-compare-matrix-root {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.matrix-filter-toolbar {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--panel);
}
.matrix-filter-row-primary {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 12px 20px;
}
.matrix-filter-row-capacity {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 8px 12px;
  width: 100%;
  padding-top: 4px;
  border-top: 1px dashed var(--border, #e2e8f0);
}
.matrix-filter-row-capacity .matrix-capacity-filter {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 10px;
  flex: 1 1 100%;
  width: 100%;
  min-width: 0;
}
.matrix-filter-row-capacity .matrix-capacity-options {
  flex: 1 1 160px;
  min-width: 0;
}
.matrix-filter-dim-head {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  min-width: 140px;
}
.matrix-filter-dim-actions {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 10px;
}
.matrix-filter-dim-options {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 12px;
  flex: 1;
  min-width: 0;
}
.matrix-filter-dim-options-scroll {
  max-height: 72px;
  overflow-y: auto;
  padding: 2px 4px 2px 0;
  align-content: flex-start;
}
.matrix-shape-filter,
.matrix-variant-filter {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 10px;
  font-size: 13px;
  min-width: 0;
}
.matrix-capacity-filter {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 4px;
  font-size: 13px;
  min-width: 0;
}
.matrix-variant-dimension-filter {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 4px;
  font-size: 13px;
  min-width: 0;
  padding: 4px 6px;
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 6px;
  background: var(--panel-2, #f8fafc);
}
.matrix-shape-filter {
  flex: 1 1 280px;
}
.matrix-capacity-filter .matrix-filter-dim-head {
  position: relative;
  z-index: 1;
}
.matrix-shape-filter .matrix-filter-dim-head,
.matrix-capacity-filter .matrix-filter-dim-head {
  min-width: auto;
}
.matrix-shape-options,
.matrix-capacity-options {
  flex: 1 1 160px;
}
.matrix-mode-toggle {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
  font-size: 13px;
  flex: 0 1 auto;
  min-width: 200px;
}
.matrix-variant-filters {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 8px 10px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--panel);
}
.matrix-variant-filters-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding-bottom: 4px;
  border-bottom: 1px dashed var(--border, #e2e8f0);
}
.matrix-variant-filters-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 4px 8px;
}
.matrix-variant-dimension-filter:not([data-dimension="weight"]) {
  padding: 3px 5px;
  font-size: 12px;
  gap: 3px;
}
.matrix-variant-dimension-filter:not([data-dimension="weight"]) .matrix-filter-dim-head {
  min-width: 0;
  flex-wrap: wrap;
  gap: 3px 6px;
}
.matrix-variant-dimension-filter:not([data-dimension="weight"]) .matrix-filter-dim-actions {
  gap: 3px 6px;
}
.matrix-variant-dimension-filter:not([data-dimension="weight"]) .filter-label {
  font-size: 11px;
}
.matrix-variant-dimension-filter:not([data-dimension="weight"]) .matrix-filter-dim-options {
  gap: 2px 6px;
}
.matrix-variant-dimension-filter:not([data-dimension="weight"]) label {
  font-size: 11px;
  gap: 2px;
  padding: 1px 0;
}
.matrix-variant-dimension-filter:not([data-dimension="weight"]) .matrix-variant-clear-btn {
  padding: 0 5px;
  font-size: 10px;
}
.matrix-variant-dimension-filter[data-dimension="weight"] {
  grid-column: 1 / -1;
}
.matrix-shape-filter .filter-label,
.matrix-capacity-filter .filter-label,
.matrix-variant-filter .filter-label,
.matrix-variant-dimension-filter .filter-label,
.matrix-variant-filters-header .filter-label,
.matrix-mode-toggle .filter-label {
  font-weight: 600;
  color: var(--text-muted, #64748b);
  white-space: nowrap;
}
.matrix-shape-filter label,
.matrix-capacity-filter label,
.matrix-variant-filter label,
.matrix-variant-dimension-filter label,
.matrix-mode-toggle label {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  cursor: pointer;
  user-select: none;
  font-size: 12px;
  line-height: 1.3;
  padding: 2px 0;
}
.matrix-variant-dimension-filter .matrix-variant-clear-btn,
.matrix-capacity-filter .matrix-capacity-clear-btn,
.matrix-variant-filters-header .matrix-variant-clear-all-btn {
  padding: 1px 8px;
  font-size: 11px;
  line-height: 1.4;
}
@media (max-width: 900px) {
  .matrix-filter-row-primary {
    flex-direction: column;
    gap: 8px;
  }
  .matrix-variant-filters-grid {
    grid-template-columns: 1fr;
  }
  .matrix-variant-dimension-filter[data-dimension="weight"] {
    grid-column: auto;
  }
}
.matrix-shape-section {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.matrix-shape-heading {
  font-size: 14px;
  font-weight: 600;
  color: var(--text, #0f172a);
  padding: 0 2px;
}
.price-compare-matrix-wrap {
  overflow: auto;
  max-width: 100%;
  margin-bottom: 8px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--panel);
}
.price-compare-matrix {
  border-collapse: collapse;
  font-size: 13px;
  min-width: max-content;
  width: 100%;
}
.price-compare-matrix th,
.price-compare-matrix td {
  border: 1px solid var(--border);
  padding: 6px 10px;
  vertical-align: middle;
}
.price-compare-matrix thead th {
  background: var(--panel-2, #f1f5f9);
  position: sticky;
  top: 0;
  z-index: 2;
  font-weight: 600;
}
.price-compare-matrix .shape-col {
  position: sticky;
  left: 0;
  z-index: 1;
  background: var(--panel);
  font-weight: 600;
  white-space: nowrap;
  min-width: 64px;
  text-align: center;
}
.price-compare-matrix .dim-col {
  position: sticky;
  left: var(--matrix-shape-col-width, 64px);
  z-index: 1;
  background: var(--panel);
  font-weight: 600;
  white-space: nowrap;
  min-width: 140px;
}
.price-compare-matrix thead .shape-col,
.price-compare-matrix thead .dim-col {
  z-index: 3;
  background: var(--panel-2, #f1f5f9);
}
.price-compare-matrix tbody tr:hover .shape-col,
.price-compare-matrix tbody tr:hover .dim-col {
  background: var(--hover, #f8fafc);
}
.price-compare-matrix tbody tr.shape-group-start td {
  border-top-width: 2px;
}
.price-compare-matrix .price-cell {
  text-align: center;
  font-variant-numeric: tabular-nums;
  cursor: pointer;
  min-width: 72px;
}
.price-compare-matrix .price-cell:hover {
  background: var(--hover, #f8fafc);
}
.price-compare-matrix .price-cell-empty {
  color: var(--muted);
  cursor: default;
}
.price-compare-matrix .factory-col {
  text-align: center;
  max-width: 120px;
  word-break: break-all;
}
.matrix-mode-toggle label {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  cursor: pointer;
  user-select: none;
}
.price-compare-matrix.spec-supplier-matrix .huohao-col {
  position: sticky;
  left: 0;
  z-index: 1;
  background: var(--panel);
  white-space: nowrap;
  min-width: 80px;
  text-align: center;
  word-break: break-all;
}
.price-compare-matrix.spec-supplier-matrix .shape-col {
  position: sticky;
  left: var(--matrix-huohao-col-width, 80px);
  z-index: 1;
  background: var(--panel);
  font-weight: 600;
  white-space: nowrap;
  min-width: 64px;
  text-align: center;
}
.price-compare-matrix.spec-supplier-matrix .dim-col {
  position: sticky;
  left: calc(var(--matrix-huohao-col-width, 80px) + var(--matrix-shape-col-width, 64px));
  z-index: 1;
  background: var(--panel);
  white-space: nowrap;
  min-width: 120px;
}
.price-compare-matrix.spec-supplier-matrix .capacity-col {
  position: sticky;
  left: calc(
    var(--matrix-huohao-col-width, 80px)
    + var(--matrix-shape-col-width, 64px)
    + var(--matrix-dim-col-width, 120px)
  );
  z-index: 1;
  background: var(--panel);
  white-space: nowrap;
  min-width: 72px;
  text-align: center;
}
.price-compare-matrix.spec-supplier-matrix thead .huohao-col,
.price-compare-matrix.spec-supplier-matrix thead .shape-col,
.price-compare-matrix.spec-supplier-matrix thead .dim-col,
.price-compare-matrix.spec-supplier-matrix thead .capacity-col {
  z-index: 3;
}
.price-compare-matrix.spec-supplier-matrix tbody tr:hover .huohao-col,
.price-compare-matrix.spec-supplier-matrix tbody tr:hover .shape-col,
.price-compare-matrix.spec-supplier-matrix tbody tr:hover .dim-col,
.price-compare-matrix.spec-supplier-matrix tbody tr:hover .capacity-col {
  background: var(--panel-2, #f1f5f9);
}
.price-compare-matrix.spec-supplier-matrix .variant-header-row .variant-col {
  text-align: center;
  min-width: 72px;
  max-width: 120px;
  font-size: 12px;
  font-weight: 500;
  color: var(--text-muted, #64748b);
  word-break: break-all;
  white-space: nowrap;
  padding-top: 0;
  padding-bottom: 6px;
}
.price-compare-matrix.spec-supplier-matrix thead .supplier-col {
  border-bottom: 1px solid var(--border, #e2e8f0);
}
.price-compare-matrix.sku-supplier-matrix .sku-col {
  position: sticky;
  left: 0;
  z-index: 1;
  background: var(--panel);
  font-weight: 600;
  white-space: nowrap;
  min-width: 72px;
  text-align: center;
}
.price-compare-matrix.sku-supplier-matrix .shape-col {
  position: sticky;
  left: var(--matrix-sku-col-width, 72px);
  z-index: 1;
  background: var(--panel);
  font-weight: 600;
  white-space: nowrap;
  min-width: 64px;
  text-align: center;
}
.price-compare-matrix.sku-supplier-matrix thead .sku-col,
.price-compare-matrix.sku-supplier-matrix thead .shape-col {
  z-index: 3;
}
.price-compare-matrix.sku-supplier-matrix tbody tr:hover .sku-col,
.price-compare-matrix.sku-supplier-matrix tbody tr:hover .shape-col {
  background: var(--panel-2, #f1f5f9);
}
.price-compare-matrix .sku-cross-spec {
  margin-top: 2px;
}
.price-compare-matrix .sku-cross-spec-line {
  font-size: 11px;
  color: var(--text-muted, #64748b);
  line-height: 1.35;
  word-break: break-all;
}
.price-compare-matrix .sku-cross-spec-meta {
  font-variant-numeric: tabular-nums;
}
.price-compare-matrix .sku-cross-spec-huohao {
  font-size: 10px;
  opacity: 0.85;
}
.price-compare-matrix .supplier-col {
  text-align: center;
  min-width: 88px;
  max-width: 140px;
  word-break: break-all;
}
.price-compare-matrix .price-cell-lowest {
  color: #15803d;
  font-weight: 600;
  background: #ecfdf5;
}
.price-compare-matrix .price-cell-lowest:hover {
  background: #d1fae5;
}
.price-compare-matrix .sku-matrix-model {
  font-size: 12px;
  color: var(--text-muted, #64748b);
  line-height: 1.3;
  word-break: break-all;
}
.price-compare-matrix .sku-matrix-prices {
  margin-top: 2px;
}
.price-compare-matrix .sku-matrix-price-line {
  display: flex;
  justify-content: center;
  align-items: baseline;
  gap: 4px;
  font-variant-numeric: tabular-nums;
  line-height: 1.35;
}
.price-compare-matrix .sku-matrix-price-line-customer {
  color: var(--text-muted, #64748b);
  font-size: 11px;
}
.price-compare-matrix .sku-matrix-price-label {
  font-size: 11px;
  color: var(--text-muted, #64748b);
  flex-shrink: 0;
}
.price-compare-matrix .sku-matrix-price-value {
  font-weight: 500;
}
.price-compare-matrix .price-cell-lowest .sku-matrix-price-line:first-child .sku-matrix-price-value {
  color: #15803d;
}
.view-toggle { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.product-table .num-right,
.product-table th.num-right {
  text-align: center;
  font-variant-numeric: tabular-nums;
}
.product-table .table-input,
.product-table .table-select {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding: 5px 6px;
  border: 1px solid var(--line);
  border-radius: 6px;
  font-size: 12px;
  text-align: center;
}
.product-table .num-input {
  text-align: center;
}
.product-table input[type="number"]::-webkit-inner-spin-button,
.product-table input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.product-table input[type="number"] {
  -moz-appearance: textfield;
  appearance: textfield;
}
.table-wrap {
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}
.product-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
  font-size: 13px;
}
.product-table th,
.product-table td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
  border-right: 1px solid var(--line);
  text-align: center;
  vertical-align: middle;
  overflow: hidden;
  text-overflow: ellipsis;
}
.product-table th:last-child,
.product-table td:last-child {
  border-right: none;
}
.product-table th {
  background: #f8fafc;
  position: sticky;
  top: 0;
  z-index: 1;
  white-space: nowrap;
}
.product-table th[data-col-key="sku"],
.product-table th[data-col-key="factoryModel"],
.product-table th[data-col-key="customerSku"],
.product-table th[data-col-key="topDiameter"],
.product-table th[data-col-key="height"],
.product-table th[data-col-key="bottomDiameter"],
.product-table th[data-col-key="capacity"],
.product-table th[data-col-key="weight"],
.product-table th[data-col-key="packNote"],
.product-table th[data-col-key="packQty"],
.product-table th[data-col-key="unit"],
.product-table th[data-col-key="boxCount"],
.product-table th[data-col-key="totalQty"],
.product-table th[data-col-key="outerLength"],
.product-table th[data-col-key="outerWidth"],
.product-table th[data-col-key="outerHeight"],
.product-table th[data-col-key="outerGrossWeight"],
.product-table th[data-col-key="totalVolume"],
.product-table th[data-col-key="outerVolume"],
.product-table th[data-col-key="totalGrossWeight"] {
  padding-left: 6px;
  padding-right: 6px;
}
.product-table th.pack-qty-group-head {
  text-align: center;
}
.product-table td.pack-qty-cell {
  text-align: right;
  border-right: none;
  padding-right: 4px;
}
.product-table td.pack-unit-cell {
  text-align: left;
  border-left: none;
  padding-left: 4px;
}
.product-table td.pack-qty-cell .pack-qty-input {
  text-align: right;
}
.product-table td.pack-unit-cell .pack-unit-input {
  text-align: left;
}
.product-table td.pack-unit-cell .table-field-wide {
  min-width: 3.6em;
  padding-left: 8px;
  padding-right: 8px;
}
.product-table td.pack-qty-cell .field-narrow-input,
.product-table td.field-right-cell .field-narrow-input,
.product-table td.outer-dim-cell .field-narrow-input,
.product-table td.outer-gross-cell .field-narrow-input {
  min-width: 0;
  padding-left: 4px;
  padding-right: 4px;
}
.product-table th.field-center-head {
  text-align: center;
}
.product-table td.metric-right-cell {
  text-align: right;
  padding-right: 10px;
  font-variant-numeric: tabular-nums;
}
.product-table th[data-col-key="totalVolume"],
.product-table th[data-col-key="outerVolume"],
.product-table th[data-col-key="totalGrossWeight"],
.product-table th.field-right-head {
  text-align: right;
  padding-right: 10px;
}
.product-library-table th[data-col-key="categoryL2"] {
  min-width: var(--col-w-categoryL2, 112px);
}
.product-library-table th[data-col-key="capacity"] {
  min-width: var(--col-w-capacity, 80px);
}
.product-library-table th[data-col-key="shape"] {
  min-width: var(--col-w-shape, 96px);
}
.product-library-table th[data-col-key="height"] {
  min-width: var(--col-w-height, 80px);
}
.product-library-table th[data-col-key="feature"] {
  min-width: var(--col-w-feature, 100px);
}
.product-table td.field-right-cell {
  text-align: right;
  padding-right: 10px;
  font-variant-numeric: tabular-nums;
}
.product-table td.field-right-cell .field-right-input {
  text-align: right;
}
.product-table td.field-right-cell .table-field-money-input {
  min-width: 9em;
  padding-left: 6px;
  padding-right: 6px;
  font-variant-numeric: tabular-nums;
}
.product-table td.field-center-cell {
  text-align: center;
  padding-left: 6px;
  padding-right: 6px;
  font-variant-numeric: tabular-nums;
}
.product-table th[data-col-key="quotePrice"] {
  text-align: center;
}
.product-table td.field-right-cell .table-field-price-input {
  text-align: right;
  min-width: 6.3em;
  max-width: 6.3em;
  width: 100%;
  padding-left: 4px;
  padding-right: 4px;
  font-variant-numeric: tabular-nums;
}
.product-table th[data-col-key="totalQty"] {
  text-align: center;
}
.product-table th .col-resize-handle {
  position: absolute;
  top: 0;
  right: 0;
  width: 8px;
  height: 100%;
  cursor: col-resize;
  user-select: none;
  touch-action: none;
  z-index: 6;
}
.product-table th .col-resize-handle:hover,
body.col-resizing .product-table th .col-resize-handle {
  background: rgba(37, 99, 235, 0.22);
}
body.col-resizing {
  cursor: col-resize !important;
  user-select: none;
}
.product-table .sticky-col {
  position: sticky;
  background: #fff;
}
.product-table .sticky-col-1 { z-index: 2; }
.product-table .sticky-col-2 { z-index: 3; }
.product-table .sticky-col-3 { z-index: 4; }
.product-table .sticky-col-4 { z-index: 5; }
.product-table .sticky-col-5 { z-index: 6; }
.product-table .sticky-col-6 { z-index: 7; }
.product-table .sticky-col-7 { z-index: 8; }
.product-table .sticky-col-8 { z-index: 9; }
.product-table .sticky-col-9 { z-index: 10; }
.product-table thead .sticky-col {
  background: #f8fafc;
}
.product-table thead .sticky-col-1 { z-index: 11; }
.product-table thead .sticky-col-2 { z-index: 12; }
.product-table thead .sticky-col-3 { z-index: 13; }
.product-table thead .sticky-col-4 { z-index: 14; }
.product-table thead .sticky-col-5 { z-index: 15; }
.product-table thead .sticky-col-6 { z-index: 16; }
.product-table thead .sticky-col-7 { z-index: 17; }
.product-table thead .sticky-col-8 { z-index: 18; }
.product-table thead .sticky-col-9 { z-index: 19; }
.product-table tbody tr:hover .sticky-col {
  background: #f8fafc;
}
.product-table .sticky-col-1 {
  left: 0;
  width: var(--col-w-pick, 42px);
  min-width: var(--col-w-pick, 42px);
  max-width: var(--col-w-pick, 42px);
}
.product-table .sticky-col-2 {
  left: var(--sticky-left-2, 42px);
  width: var(--col-w-sku, 88px);
  min-width: var(--col-w-sku, 88px);
}
.product-table .sticky-col-3 {
  left: var(--sticky-left-3, 98px);
  width: var(--col-w-series, 72px);
  min-width: var(--col-w-series, 72px);
}
.product-table .sticky-col-4 {
  left: var(--sticky-left-4, 170px);
  width: var(--col-w-image, 80px);
  min-width: var(--col-w-image, 80px);
}
.product-table .sticky-col-5 {
  left: var(--sticky-left-5, 250px);
  width: var(--col-w-huohao, 100px);
  min-width: var(--col-w-huohao, 100px);
}
.product-table .sticky-col-6 {
  left: var(--sticky-left-6, 350px);
  width: var(--col-w-name, 140px);
  min-width: var(--col-w-name, 140px);
}
.product-table .sticky-col-7 {
  left: var(--sticky-left-7, 490px);
  width: var(--col-w-nameEn, 120px);
  min-width: var(--col-w-nameEn, 120px);
}
.product-table .sticky-col-8 {
  left: var(--sticky-left-8, 610px);
  width: var(--col-w-foreignName, 120px);
  min-width: var(--col-w-foreignName, 120px);
}
.product-table .sticky-col-9 {
  left: var(--sticky-left-9, 730px);
  width: var(--col-w-customsName, 120px);
  min-width: var(--col-w-customsName, 120px);
}
.product-library-table th[data-col-key="nameEn"],
.product-library-table td[data-col-key="nameEn"] {
  width: var(--col-w-nameEn, 120px);
  min-width: var(--col-w-nameEn, 120px);
  max-width: none;
}
.product-library-table th[data-col-key="foreignName"],
.product-library-table td[data-col-key="foreignName"] {
  width: var(--col-w-foreignName, 120px);
  min-width: var(--col-w-foreignName, 120px);
  max-width: none;
}
.product-library-table td[data-col-key="nameEn"] {
  color: inherit;
}
.product-library-table td[data-col-key="foreignName"] {
  color: inherit;
}
.product-library-table td[data-col-key="nameEn"].sticky-col-7 {
  box-shadow: none;
}
.product-library-table td[data-col-key="foreignName"].sticky-col-8 {
  box-shadow: none;
}
.product-table .series-sku-cell {
  font-weight: 600;
  max-width: var(--col-w-sku, 88px);
}
.product-table .customer-sku-cell {
  max-width: var(--col-w-customerSku, 110px);
}
.product-table .sticky-col-edge {
  box-shadow: 4px 0 8px -4px rgba(15, 23, 42, 0.18);
}
.product-table tbody tr:hover { background: #f8fafc; }
.product-table tr.row-picked {
  background: #dbeafe;
  box-shadow: inset 3px 0 0 #2563eb;
}
.product-table tr.row-picked .sticky-col {
  background: #dbeafe;
}
.product-table tbody tr.row-picked:hover,
.product-table tbody tr.row-picked:hover .sticky-col {
  background: #bfdbfe;
}
.card.row-picked {
  background: #dbeafe;
  border-color: #3b82f6;
  box-shadow: 0 0 0 1px #93c5fd;
}
.product-table .detail-link-cell {
  cursor: pointer;
  color: var(--primary);
  font-weight: 500;
}
.product-table .detail-link-cell:hover {
  text-decoration: underline;
}
.product-library-row {
  cursor: default;
}
.product-library-image-cell {
  cursor: pointer;
}
.product-library-image-cell:hover .table-thumb {
  outline: 2px solid var(--primary, #2563eb);
  outline-offset: 1px;
}
.product-library-action-col {
  white-space: nowrap;
}
.product-library-action-col .btn-mini + .btn-mini {
  margin-left: 6px;
}
.product-library-detail-btn {
  color: var(--primary, #2563eb);
  border-color: #93c5fd;
}
.product-table .packaging-input {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  font-size: 13px;
  text-align: center;
}
.product-table .packaging-cell { overflow: visible; }
.product-table .carton-type-cell {
  overflow: visible;
  text-align: center;
}
.product-table .carton-checkboxes {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 2px 0;
}
.product-table .tag-cell {
  text-align: center;
}
.product-table .tag-cell .tag {
  margin: 0 3px 4px;
}
.product-table th.pick-col,
.product-table td:first-child {
  vertical-align: middle;
}
.selection-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin-top: 14px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #f8fafc;
}
.selection-bar .selection-count strong {
  color: var(--primary);
  font-size: 16px;
}
.cart-pending-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  align-items: center;
  margin-bottom: 12px;
  padding: 12px 14px;
  border: 1px solid #fecaca;
  border-radius: 10px;
  background: #fef2f2;
  font-size: 13px;
  line-height: 1.5;
}
.cart-pending-bar.hidden { display: none !important; }
.cart-pending-bar strong { color: #b91c1c; }
.cart-save-order-bar {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 12px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #f8fafc;
}
.cart-save-order-bar.hidden { display: none !important; }
.cart-save-order-fields {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 10px 12px;
}
.cart-save-order-hint {
  margin: 0;
  font-size: 12px;
}
.order-field-label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 13px;
  min-width: 0;
}
.order-field-label input,
.order-field-label select,
.order-field-select {
  width: 100%;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font: inherit;
  box-sizing: border-box;
}
.order-field-label input[readonly] {
  background: #f1f5f9;
  color: #334155;
  cursor: default;
}
.order-field-number { flex: 0 1 168px; }
.order-field-customer-code { flex: 0 1 120px; }
.order-field-number input { font-weight: 600; letter-spacing: 0.02em; }
.order-field-name { flex: 2 1 220px; }
.order-field-days { flex: 0 1 96px; }
.order-field-days input { text-align: center; }
.order-field-quote { flex: 0 1 100px; }
.order-field-currency { flex: 0 1 88px; }
.order-quote-type-select.quote-type-exw {
  color: #dc2626;
  font-weight: 600;
  border-color: #fca5a5;
  background: #fef2f2;
}
.order-quote-type-select.quote-type-fob {
  color: #16a34a;
  font-weight: 600;
  border-color: #86efac;
  background: #f0fdf4;
}
.order-quote-type-select option[value="EXW"] { color: #dc2626; }
.order-quote-type-select option[value="FOB"] { color: #16a34a; }
.order-currency-select.currency-rmb,
.order-currency-label.currency-rmb {
  color: #dc2626;
  font-weight: 600;
  border-color: #fca5a5;
  background: #fef2f2;
}
.order-currency-select.currency-usd,
.order-currency-label.currency-usd {
  color: #16a34a;
  font-weight: 600;
  border-color: #86efac;
  background: #f0fdf4;
}
.order-currency-select option[value="RMB"] { color: #dc2626; }
.order-currency-select option[value="USD"] { color: #16a34a; }
.order-currency-label {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 6px;
  font-size: 12px;
  border: 1px solid transparent;
}
.orders-master-table .orders-currency-select.currency-rmb {
  color: #dc2626;
  border-color: #fca5a5;
  background: #fef2f2;
  font-weight: 600;
}
.orders-master-table .orders-currency-select.currency-usd {
  color: #16a34a;
  border-color: #86efac;
  background: #f0fdf4;
  font-weight: 600;
}
.order-field-port { flex: 0 1 120px; }
.order-port-select {
  font-weight: 600;
  text-align: center;
}
.order-port-select[readonly] {
  cursor: default;
}
.order-port-select.port-ningbo {
  color: #16a34a;
  border-color: #86efac;
  background: #f0fdf4;
}
.order-port-select.port-shanghai {
  color: #2563eb;
  border-color: #93c5fd;
  background: #eff6ff;
}
.order-port-select.port-shenzhen {
  color: #ea580c;
  border-color: #fdba74;
  background: #fff7ed;
}
.order-port-select.port-qingdao {
  color: #7c3aed;
  border-color: #c4b5fd;
  background: #f5f3ff;
}
.order-port-select.port-tianjin {
  color: #0d9488;
  border-color: #5eead4;
  background: #f0fdfa;
}
.order-port-select.port-guangzhou {
  color: #d97706;
  border-color: #fcd34d;
  background: #fffbeb;
}
.order-port-select.port-xiamen {
  color: #4f46e5;
  border-color: #a5b4fc;
  background: #eef2ff;
}
.order-port-select.port-dalian {
  color: #e11d48;
  border-color: #fda4af;
  background: #fff1f2;
}
.order-port-select.port-chongqing {
  color: #0891b2;
  border-color: #67e8f9;
  background: #ecfeff;
}
.order-port-select.port-nanjing {
  color: #9333ea;
  border-color: #d8b4fe;
  background: #faf5ff;
}
.order-port-select.port-yantian {
  color: #059669;
  border-color: #6ee7b7;
  background: #ecfdf5;
}
.order-port-select.port-shekou {
  color: #db2777;
  border-color: #f9a8d4;
  background: #fdf2f8;
}
.order-port-select option[value="NINGBO"] { color: #16a34a; }
.order-port-select option[value="SHANGHAI"] { color: #2563eb; }
.order-port-select option[value="SHENZHEN"] { color: #ea580c; }
.order-port-select option[value="QINGDAO"] { color: #7c3aed; }
.order-port-select option[value="TIANJIN"] { color: #0d9488; }
.order-port-select option[value="GUANGZHOU"] { color: #d97706; }
.order-port-select option[value="XIAMEN"] { color: #4f46e5; }
.order-port-select option[value="DALIAN"] { color: #e11d48; }
.order-port-select option[value="CHONGQING"] { color: #0891b2; }
.order-port-select option[value="NANJING"] { color: #9333ea; }
.order-port-select option[value="YANTIAN"] { color: #059669; }
.order-port-select option[value="SHEKOU"] { color: #db2777; }
.order-port-text {
  font-weight: 600;
}
.order-port-text.port-ningbo { color: #16a34a; }
.order-port-text.port-shanghai { color: #2563eb; }
.order-port-text.port-shenzhen { color: #ea580c; }
.order-port-text.port-qingdao { color: #7c3aed; }
.order-port-text.port-tianjin { color: #0d9488; }
.order-port-text.port-guangzhou { color: #d97706; }
.order-port-text.port-xiamen { color: #4f46e5; }
.order-port-text.port-dalian { color: #e11d48; }
.order-port-text.port-chongqing { color: #0891b2; }
.order-port-text.port-nanjing { color: #9333ea; }
.order-port-text.port-yantian { color: #059669; }
.order-port-text.port-shekou { color: #db2777; }
.order-country-text,
.order-country-input {
  font-weight: 600;
}
.order-country-input.country-cn { color: #dc2626; border-color: #fca5a5; background: #fef2f2; }
.order-country-text.country-cn { color: #dc2626; }
.order-country-input.country-us { color: #2563eb; border-color: #93c5fd; background: #eff6ff; }
.order-country-text.country-us { color: #2563eb; }
.order-country-input.country-uk { color: #7c3aed; border-color: #c4b5fd; background: #f5f3ff; }
.order-country-text.country-uk { color: #7c3aed; }
.order-country-input.country-de { color: #374151; border-color: #d1d5db; background: #f9fafb; }
.order-country-text.country-de { color: #374151; }
.order-country-input.country-jp { color: #e11d48; border-color: #fda4af; background: #fff1f2; }
.order-country-text.country-jp { color: #e11d48; }
.order-country-input.country-au { color: #059669; border-color: #6ee7b7; background: #ecfdf5; }
.order-country-text.country-au { color: #059669; }
.order-country-input.country-fr { color: #1d4ed8; border-color: #93c5fd; background: #eff6ff; }
.order-country-text.country-fr { color: #1d4ed8; }
.order-country-input.country-kr { color: #0891b2; border-color: #67e8f9; background: #ecfeff; }
.order-country-text.country-kr { color: #0891b2; }
.order-country-input.country-in { color: #ea580c; border-color: #fdba74; background: #fff7ed; }
.order-country-text.country-in { color: #ea580c; }
.order-country-input.country-ca { color: #dc2626; border-color: #fca5a5; background: #fef2f2; }
.order-country-text.country-ca { color: #b91c1c; }
.order-country-input.country-mx { color: #16a34a; border-color: #86efac; background: #f0fdf4; }
.order-country-text.country-mx { color: #16a34a; }
.order-country-input.country-es { color: #d97706; border-color: #fcd34d; background: #fffbeb; }
.order-country-text.country-es { color: #d97706; }
.order-country-input.country-it { color: #059669; border-color: #6ee7b7; background: #ecfdf5; }
.order-country-text.country-it { color: #047857; }
.order-country-input.country-br { color: #ca8a04; border-color: #fde047; background: #fefce8; }
.order-country-text.country-br { color: #ca8a04; }
.order-country-input.country-nl { color: #f97316; border-color: #fdba74; background: #fff7ed; }
.order-country-text.country-nl { color: #f97316; }
.order-country-input.country-sg { color: #0d9488; border-color: #5eead4; background: #f0fdfa; }
.order-country-text.country-sg { color: #0d9488; }
.order-country-input.country-hk { color: #db2777; border-color: #f9a8d4; background: #fdf2f8; }
.order-country-text.country-hk { color: #db2777; }
.order-country-input.country-tw { color: #4f46e5; border-color: #a5b4fc; background: #eef2ff; }
.order-country-text.country-tw { color: #4f46e5; }
.order-country-input.country-ae { color: #15803d; border-color: #86efac; background: #f0fdf4; }
.order-country-text.country-ae { color: #15803d; }
.order-country-input.country-sa { color: #166534; border-color: #86efac; background: #f0fdf4; }
.order-country-text.country-sa { color: #166534; }
.order-country-input.country-ru { color: #1e40af; border-color: #93c5fd; background: #eff6ff; }
.order-country-text.country-ru { color: #1e40af; }
.order-country-input.country-vn { color: #b45309; border-color: #fcd34d; background: #fffbeb; }
.order-country-text.country-vn { color: #b45309; }
.order-country-input.country-th { color: #9333ea; border-color: #d8b4fe; background: #faf5ff; }
.order-country-text.country-th { color: #9333ea; }
.order-country-input.country-my { color: #0369a1; border-color: #7dd3fc; background: #f0f9ff; }
.order-country-text.country-my { color: #0369a1; }
.order-country-input.country-id { color: #be123c; border-color: #fda4af; background: #fff1f2; }
.order-country-text.country-id { color: #be123c; }
.order-country-input.country-ph { color: #0284c7; border-color: #7dd3fc; background: #f0f9ff; }
.order-country-text.country-ph { color: #0284c7; }
.order-company-text,
.order-company-input {
  font-weight: 600;
}
.order-company-input.company-hash-0 { color: #1d4ed8; border-color: #93c5fd; background: #eff6ff; }
.order-company-text.company-hash-0 { color: #1d4ed8; }
.order-company-input.company-hash-1 { color: #166534; border-color: #86efac; background: #f0fdf4; }
.order-company-text.company-hash-1 { color: #166534; }
.order-company-input.company-hash-2 { color: #6d28d9; border-color: #c4b5fd; background: #f5f3ff; }
.order-company-text.company-hash-2 { color: #6d28d9; }
.order-company-input.company-hash-3 { color: #92400e; border-color: #fcd34d; background: #fffbeb; }
.order-company-text.company-hash-3 { color: #92400e; }
.order-company-input.company-hash-4 { color: #be185d; border-color: #f9a8d4; background: #fdf2f8; }
.order-company-text.company-hash-4 { color: #be185d; }
.order-company-input.company-hash-5 { color: #0f766e; border-color: #5eead4; background: #f0fdfa; }
.order-company-text.company-hash-5 { color: #0f766e; }
.order-company-input.company-hash-6 { color: #c2410c; border-color: #fdba74; background: #fff7ed; }
.order-company-text.company-hash-6 { color: #c2410c; }
.order-company-input.company-hash-7 { color: #4338ca; border-color: #a5b4fc; background: #eef2ff; }
.order-company-text.company-hash-7 { color: #4338ca; }
.order-company-input.company-hash-8 { color: #047857; border-color: #6ee7b7; background: #ecfdf5; }
.order-company-text.company-hash-8 { color: #047857; }
.order-company-input.company-hash-9 { color: #7e22ce; border-color: #d8b4fe; background: #faf5ff; }
.order-company-text.company-hash-9 { color: #7e22ce; }
.order-field-attachments { flex: 1 1 200px; }
.cart-order-attachments-wrap {
  min-height: 36px;
}
.order-field-remarks { flex: 2 1 200px; }
.order-field-date { flex: 0 1 156px; }
.order-remarks-label {
  display: grid;
  gap: 6px;
  font-size: 13px;
}
.order-remarks-label textarea {
  width: 100%;
  min-height: 64px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font: inherit;
  resize: vertical;
}
.order-remarks-label input {
  width: 100%;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font: inherit;
}
.orders-panel-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 14px;
}
.orders-panel-head h3 { margin: 0 0 4px; }
.orders-panel-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
}
.orders-search-input {
  font: inherit;
  min-width: 220px;
  max-width: 320px;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.orders-search-input::placeholder {
  color: #94a3b8;
  font-size: 12px;
}
.orders-status-filter-label {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  color: #475569;
  white-space: nowrap;
}
.orders-status-filter-label .category-dropdown-wrap {
  min-width: 100px;
}
.orders-status-filter-label .category-dropdown-btn {
  min-width: 100px;
  max-width: 140px;
}
.orders-status-filter {
  font: inherit;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  min-width: 96px;
}
.orders-list-filter-input {
  font: inherit;
  min-width: 88px;
  max-width: 120px;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
}
.orders-list-filter-input::placeholder {
  color: #94a3b8;
  font-size: 12px;
}
.orders-master-list {
  margin-bottom: 16px;
  overflow-x: auto;
  overflow-y: visible;
}
.orders-master-table,
.orders-detail-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 10px;
  overflow: hidden;
}
.orders-master-table:has(.quote-status-dropdown.open) {
  overflow: visible;
}
.orders-master-table th,
.orders-master-table td,
.orders-detail-table th,
.orders-detail-table td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
  border-right: 1px solid var(--line);
  text-align: left;
  vertical-align: top;
}
.orders-master-table th:last-child,
.orders-master-table td:last-child,
.orders-detail-table th:last-child,
.orders-detail-table td:last-child {
  border-right: none;
}
.orders-master-table thead th,
.orders-detail-table thead th {
  background: #f8fafc;
  white-space: nowrap;
}
.orders-master-table th.num-right {
  text-align: center;
}
.orders-master-table td.num-right {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.orders-master-table.inquiry-list-table th.text-cell,
.orders-master-table.inquiry-list-table td.text-cell {
  text-align: center;
  vertical-align: middle;
}
.orders-master-table.inquiry-list-table th.num-cell,
.orders-master-table.inquiry-list-table td.num-cell {
  text-align: right;
  vertical-align: middle;
  font-variant-numeric: tabular-nums;
}
.orders-master-table.inquiry-list-table td.text-cell .orders-master-input,
.orders-master-table.inquiry-list-table td.text-cell .order-country-input {
  text-align: center;
}
.orders-master-table.inquiry-list-table td.text-cell .quote-status-dropdown,
.orders-master-table.inquiry-list-table td.text-cell .delivery-progress {
  margin-left: auto;
  margin-right: auto;
}
.confirmed-orders-master-table th,
.confirmed-orders-master-table td {
  vertical-align: middle;
}
.confirmed-orders-master-table th.confirmed-orders-country-col,
.confirmed-orders-master-table td.order-status-country-col {
  white-space: nowrap;
}
.packaging-orders-master-table th,
.packaging-orders-master-table td {
  vertical-align: middle;
  text-align: center;
}
.confirmed-orders-master-table th.orders-total-volume-col,
.confirmed-orders-master-table td.orders-total-volume-col,
.confirmed-orders-master-table th.orders-total-weight-col,
.confirmed-orders-master-table td.orders-total-weight-col {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.orders-master-row {
  cursor: pointer;
}
.orders-master-row:hover,
.orders-master-row.active {
  background: #eff6ff;
}
.orders-remarks-cell {
  max-width: 320px;
  word-break: break-word;
}
.delivery-progress-cell {
  min-width: 108px;
  max-width: 140px;
  vertical-align: middle;
}
.delivery-progress {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.delivery-progress-bar {
  height: 6px;
  border-radius: 999px;
  background: #e2e8f0;
  overflow: hidden;
}
.delivery-progress-fill {
  height: 100%;
  border-radius: 999px;
  transition: width 0.2s ease;
}
.delivery-progress-label {
  font-size: 11px;
  line-height: 1.2;
  color: #475569;
  white-space: nowrap;
}
.delivery-progress--ontrack {
  background: #22c55e;
}
.delivery-progress--overdue-1 {
  background: #fef08a;
}
.delivery-progress--overdue-3 {
  background: #fde047;
}
.delivery-progress--overdue-7 {
  background: #facc15;
}
.delivery-progress--overdue-14 {
  background: #eab308;
}
.delivery-progress--overdue-max {
  background: #ca8a04;
}
.delivery-progress--none {
  background: #cbd5e1;
}
.delivery-progress--inquiry-ontrack-1 {
  background: linear-gradient(90deg, #dcfce7, #bbf7d0);
}
.delivery-progress--inquiry-ontrack-2 {
  background: linear-gradient(90deg, #bbf7d0, #86efac);
}
.delivery-progress--inquiry-ontrack-3 {
  background: linear-gradient(90deg, #86efac, #4ade80);
}
.delivery-progress--inquiry-ontrack-4 {
  background: linear-gradient(90deg, #4ade80, #16a34a);
}
.delivery-progress--inquiry-overdue-1 {
  background: linear-gradient(90deg, #fee2e2, #fecaca);
}
.delivery-progress--inquiry-overdue-2 {
  background: linear-gradient(90deg, #fecaca, #f87171);
}
.delivery-progress--inquiry-overdue-3 {
  background: linear-gradient(90deg, #f87171, #ef4444);
}
.delivery-progress--inquiry-overdue-4 {
  background: linear-gradient(90deg, #ef4444, #b91c1c);
}
.orders-name-cell {
  min-width: 200px;
  max-width: 360px;
  word-break: break-word;
  font-weight: 500;
}
.orders-english-name-col {
  min-width: 240px;
  max-width: 320px;
  word-break: break-word;
}
.confirmed-orders-master-table th.orders-name-cell,
.confirmed-orders-master-table td.orders-name-cell {
  min-width: 220px;
  max-width: 380px;
}
.confirmed-orders-master-table th.orders-english-name-col,
.confirmed-orders-master-table td.orders-english-name-col {
  min-width: 260px;
  max-width: 340px;
}
.orders-supplier-cell,
.orders-supplier-value {
  font-weight: 600;
  color: #0f172a;
  white-space: nowrap;
}
.orders-detail-overlay {
  position: fixed;
  inset: 0;
  z-index: 40;
  display: flex;
  align-items: flex-end;
  justify-content: stretch;
  background: rgba(15, 23, 42, 0.45);
}
.orders-detail-overlay.hidden {
  display: none !important;
}
body.orders-detail-open {
  overflow: hidden;
}
.orders-detail-drawer {
  width: 100%;
  height: min(90vh, 100%);
  max-height: 90vh;
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: 14px 14px 0 0;
  box-shadow: 0 -12px 40px rgba(15, 23, 42, 0.18);
  overflow: hidden;
  animation: orders-detail-drawer-in 0.22s ease-out;
}
.orders-detail-drawer.is-fullscreen {
  height: 100vh;
  max-height: 100vh;
  border-radius: 0;
  box-shadow: none;
}
.orders-detail-overlay.orders-detail-overlay-fullscreen {
  align-items: stretch;
  background: #fff;
}
.orders-detail-overlay.orders-detail-overlay-fullscreen .orders-detail-drag-hint {
  display: none;
}
.inquiry-detail-fullscreen-btn {
  font-size: 14px;
  line-height: 1;
  padding: 4px 8px;
}
.inquiry-detail-table-section {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.inquiry-detail-table-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex: 0 0 auto;
  margin-bottom: 6px;
}
.inquiry-detail-table-toolbar-label {
  font-size: 14px;
  font-weight: 600;
  color: #0f172a;
}
.inquiry-detail-table-fullscreen-btn {
  flex-shrink: 0;
  font-size: 12px;
  padding: 4px 10px;
}
.orders-detail-drawer.inquiry-detail-table-fullscreen .orders-detail-drag-hint,
.orders-detail-drawer.inquiry-detail-table-fullscreen .orders-detail-head,
.orders-detail-drawer.inquiry-detail-table-fullscreen .orders-detail-meta,
.orders-detail-drawer.inquiry-detail-table-fullscreen .orders-detail-tip,
.orders-detail-drawer.inquiry-detail-table-fullscreen #confirmedOrderHub,
.orders-detail-drawer.inquiry-detail-table-fullscreen #orderPendingBar,
.orders-detail-drawer.inquiry-detail-table-fullscreen #inquiryProfitSummary,
.orders-detail-drawer.inquiry-detail-table-fullscreen .orders-detail-footer {
  display: none;
}
.orders-detail-drawer.inquiry-detail-table-fullscreen .orders-detail-drawer-inner {
  padding-top: 12px;
}
.orders-detail-drawer.inquiry-detail-table-fullscreen .orders-detail-body {
  flex: 1 1 auto;
  min-height: 0;
}
.orders-detail-drawer.inquiry-detail-table-fullscreen .inquiry-detail-table-section {
  flex: 1 1 auto;
  min-height: 0;
}
.orders-detail-drawer.inquiry-detail-table-fullscreen .orders-detail-table-wrap {
  flex: 1 1 auto;
  min-height: 0;
}
@keyframes orders-detail-drawer-in {
  from { transform: translateY(100%); }
  to { transform: translateY(0); }
}
.orders-detail-drag-hint {
  flex: 0 0 auto;
  width: 44px;
  height: 5px;
  margin: 10px auto 0;
  border-radius: 999px;
  background: #cbd5e1;
}
.orders-detail-drawer-inner {
  flex: 1;
  min-height: 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding: 12px 20px 20px;
  gap: 0;
  overflow: hidden;
}
.orders-detail-body {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.orders-detail-summary {
  flex: 0 0 auto;
  margin: 0 0 10px;
  padding: 10px 14px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
}
.orders-detail-summary-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 16px 28px;
}
.orders-detail-summary-item {
  display: flex;
  align-items: baseline;
  gap: 8px;
  min-width: 120px;
}
.orders-detail-summary-label {
  color: #64748b;
  font-size: 13px;
  white-space: nowrap;
}
.orders-detail-summary-item strong {
  font-variant-numeric: tabular-nums;
  font-size: 15px;
}
.orders-detail-footer {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-top: 12px;
  margin-top: 8px;
  border-top: 1px solid #e2e8f0;
}
.orders-detail-footer-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 12px;
  flex: 0 0 auto;
}
.inquiry-detail-footer-summary {
  flex: 1 1 auto;
  margin: 0;
  padding: 0;
  border: none;
  background: transparent;
}
.inquiry-detail-footer-summary .orders-detail-summary-grid {
  gap: 12px 24px;
}
.inquiry-profit-summary {
  margin-bottom: 10px;
  padding: 10px 12px;
  border: 1px solid var(--border, #ddd);
  border-radius: 6px;
  background: var(--panel-alt, #f8f9fb);
}
.inquiry-exchange-rate-wrap {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.inquiry-current-exchange-rate {
  font-size: 0.75rem;
  line-height: 1.3;
  white-space: nowrap;
}
.inquiry-valid-until-badge {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 6px;
  font-size: 0.72rem;
  font-weight: 600;
  border-radius: 4px;
  vertical-align: middle;
}
.inquiry-valid-until-badge.expiring {
  color: #b45309;
  background: rgba(180, 83, 9, 0.12);
}
.inquiry-valid-until-badge.ok {
  color: #047857;
  background: rgba(4, 120, 87, 0.1);
}
.inquiry-valid-until-badge.expired {
  color: #b91c1c;
  background: rgba(185, 28, 28, 0.1);
}
.inquiry-quote-terms-section,
.inquiry-activities-section,
.inquiry-email-send-records-section {
  margin-top: 8px;
  padding: 6px 8px;
  border: 1px solid var(--border, #ddd);
  border-radius: 6px;
  background: var(--panel-alt, #fafafa);
}
.inquiry-quote-terms-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 8px 12px;
  margin-top: 8px;
}
.inquiry-quote-terms-input {
  width: 100%;
  min-height: 3rem;
  resize: vertical;
}
.inquiry-activities-body {
  margin: 8px 0;
  max-height: 180px;
  overflow: auto;
}
.inquiry-activity-item {
  padding: 6px 0;
  border-bottom: 1px solid var(--border, #eee);
  font-size: 0.88rem;
}
.inquiry-activity-item:last-child {
  border-bottom: none;
}
.inquiry-activity-form {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 8px;
}
.inquiry-customer-conversion-snippet {
  margin: 8px 0 0;
  font-size: 0.85rem;
}
.inquiry-container-hint {
  font-size: 0.92rem;
  font-weight: 600;
}
.inquiry-list-valid-badge {
  display: inline-block;
  margin-left: 4px;
  padding: 0 5px;
  font-size: 0.68rem;
  font-weight: 600;
  border-radius: 3px;
  vertical-align: middle;
}
.inquiry-list-valid-badge.expiring {
  color: #b45309;
  background: rgba(180, 83, 9, 0.12);
}
.inquiry-list-valid-badge.ok {
  color: #047857;
  background: rgba(4, 120, 87, 0.1);
}
.inquiry-list-valid-badge.expired {
  color: #b91c1c;
  background: rgba(185, 28, 28, 0.1);
}
.inquiry-version-badge {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 6px;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.4;
  color: var(--accent, #2563eb);
  background: rgba(37, 99, 235, 0.08);
  border-radius: 4px;
  vertical-align: middle;
}
.inquiry-confirmed-link-wrap {
  display: inline-block;
  margin-left: 8px;
  vertical-align: middle;
}
.inquiry-confirmed-link-wrap .inquiry-confirmed-badge {
  display: inline-block;
  margin-right: 6px;
  padding: 1px 6px;
  font-size: 0.75rem;
  font-weight: 600;
  color: #15803d;
  background: rgba(21, 128, 61, 0.1);
  border-radius: 4px;
}
.inquiry-purchase-draft-link-wrap {
  display: inline-block;
  margin-left: 8px;
  vertical-align: middle;
}
.inquiry-purchase-draft-link-wrap .inquiry-purchase-draft-badge {
  display: inline-block;
  margin-right: 6px;
  padding: 1px 6px;
  font-size: 0.75rem;
  font-weight: 600;
  color: #7c3aed;
  background: rgba(124, 58, 237, 0.1);
  border-radius: 4px;
}
.inquiry-purchase-draft-link-wrap a {
  font-size: 0.85rem;
  color: var(--accent, #2563eb);
  text-decoration: none;
}
.inquiry-purchase-draft-link-wrap a:hover {
  text-decoration: underline;
}
.inquiry-source-version-wrap {
  display: block;
  margin-top: 4px;
  font-size: 0.85rem;
}
.inquiry-source-version-wrap a {
  color: var(--accent, #2563eb);
  text-decoration: none;
}
.inquiry-source-version-wrap a:hover {
  text-decoration: underline;
}
.inquiry-email-send-records-section {
  margin-top: 8px;
  padding: 8px 10px;
  border: 1px solid var(--border, #ddd);
  border-radius: 6px;
  background: var(--panel-alt, #f8f9fb);
}
.inquiry-email-send-records-section summary {
  cursor: pointer;
  font-weight: 600;
  user-select: none;
}
.inquiry-email-send-records-body {
  margin-top: 8px;
}
.inquiry-email-send-records-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.85rem;
}
.inquiry-email-send-records-table th,
.inquiry-email-send-records-table td {
  padding: 6px 8px;
  border-bottom: 1px solid var(--border, #e5e7eb);
  text-align: left;
}
.inquiry-email-send-records-table th {
  font-weight: 600;
  color: var(--muted, #666);
}
.inquiry-list-confirmed-link {
  font-size: 0.78rem;
  color: var(--accent, #2563eb);
  text-decoration: none;
}
.inquiry-list-confirmed-link:hover {
  text-decoration: underline;
}
.inquiry-list-open-btn {
  display: inline;
  padding: 0;
  border: none;
  background: none;
  font: inherit;
  color: var(--accent, #2563eb);
  cursor: pointer;
  text-align: left;
}
.inquiry-list-open-btn:hover {
  text-decoration: underline;
}
.inquiry-list-name-cell-editable {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}
.inquiry-list-name-open-btn {
  flex: 0 0 auto;
  padding: 0 4px;
  font-size: 11px;
  white-space: nowrap;
}
.inquiry-list-open-cell {
  cursor: pointer;
}
.orders-detail-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}
.orders-detail-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}
.cart-panel-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px 16px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}
.cart-panel-head-text {
  flex: 1 1 240px;
  min-width: 0;
}
.cart-panel-head-text h3 {
  margin: 0 0 4px;
}
.cart-panel-head .cart-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: center;
  flex: 0 1 auto;
}
.cart-action-dropdown .toolbar-dropdown-panel {
  left: 0;
  right: auto;
  min-width: 168px;
}
.cart-items-panel {
  margin-top: 4px;
}
.cart-items-summary {
  margin: 0 0 10px;
  font-size: 13px;
}
.inquiry-stats-panel {
  margin-top: 0;
  padding: 14px;
}
.inquiry-stats-panel h4 {
  margin: 0 0 10px;
}
.cart-stats-bars {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 16px;
}
.cart-stats-hint {
  margin: 0 0 10px;
  font-size: 13px;
}
.cart-stats-bar-row {
  display: grid;
  grid-template-columns: 100px 1fr 56px;
  gap: 10px;
  align-items: center;
  font-size: 13px;
  width: 100%;
  border: 1px solid transparent;
  border-radius: 8px;
  padding: 6px 8px;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
}
.cart-stats-bar-row:hover,
.cart-stats-bar-row.active {
  background: #eff6ff;
  border-color: #bfdbfe;
}
.cart-stats-bar-row .huohao-stats-pick-label {
  font-weight: 600;
  color: #1d4ed8;
}
.huohao-stats-pick.linkish {
  border: 0;
  background: none;
  padding: 0;
  color: #1d4ed8;
  font-weight: 600;
  cursor: pointer;
  text-decoration: underline;
}
.cart-stats-table tr.active {
  background: #eff6ff;
}
.huohao-stats-detail {
  margin: 14px 0 18px;
  padding: 12px 14px;
  border: 1px solid #bfdbfe;
  border-radius: 10px;
  background: #f8fbff;
}
.huohao-stats-detail-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 4px;
}
.huohao-stats-detail-head h4 { margin: 0; }
.huohao-stats-detail-hint {
  margin: 0 0 10px;
  font-size: 13px;
}
.cart-stats-bar-track {
  height: 10px;
  background: #e2e8f0;
  border-radius: 999px;
  overflow: hidden;
}
.cart-stats-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, #3b82f6, #60a5fa);
  border-radius: 999px;
  min-width: 2px;
}
.cart-stats-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.cart-stats-table th,
.cart-stats-table td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
  border-right: 1px solid var(--line);
  text-align: left;
}
.cart-stats-table th:last-child,
.cart-stats-table td:last-child {
  border-right: none;
}
.cart-stats-table th {
  background: #f8fafc;
  white-space: nowrap;
}
.cart-stats-table .num-right { text-align: right; }
.orders-detail-head h4 { margin: 0; }
.orders-detail-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 16px 24px;
  align-items: center;
  margin: 0 0 12px;
  padding: 10px 12px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
}
.orders-meta-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: #334155;
}
.orders-meta-label input[type="date"],
.orders-meta-label input[type="text"],
.orders-meta-label input[type="number"],
.orders-meta-label select {
  padding: 4px 8px;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  font: inherit;
}
.orders-meta-input { min-width: 0; }
.orders-number-input { width: 11rem; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 12px; }
.orders-days-input { width: 2.5rem; }
.orders-exchange-rate-input { width: 6.5rem; }
.orders-customer-po-input { width: 9rem; }
.orders-remarks-input { width: 14rem; }
.inquiry-order-name-en-input { width: 14rem; }
.inquiry-detail-primary-row {
  width: 100%;
  flex: 0 0 auto;
  align-items: start;
  row-gap: 10px;
}
.inquiry-detail-primary-row .inquiry-order-name-input { width: 100%; max-width: 11rem; }
.inquiry-detail-trading-row .orders-meta-attachments-label {
  min-width: 0;
}
.inquiry-detail-shipping-row {
  justify-content: flex-start;
}
.inquiry-purchase-status-select {
  min-width: 6.5rem;
}
.inquiry-customer-code-select {
  width: 7rem;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
}
.inquiry-customer-business-input { width: 9rem; }
.inquiry-deposit-amount-input { width: 8rem; }
.inquiry-commission-input { width: 8rem; }
.inquiry-order-name-input {
  width: 100%;
  max-width: 11rem;
  min-width: 0;
}
.inquiry-detail-trading-row {
  width: 100%;
  flex: 0 0 auto;
  align-items: start;
  row-gap: 10px;
}
.inquiry-detail-status-row {
  width: 100%;
  flex: 0 0 auto;
  align-items: start;
  row-gap: 10px;
}
.inquiry-customer-code-value {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
}
.inquiry-detail-quote-status-wrap {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
}
.inquiry-detail-quote-status-wrap .quote-status-dropdown {
  width: auto;
}
.inquiry-detail-meta:has(.quote-status-dropdown.open) {
  overflow: visible;
}
.inquiry-detail-meta .orders-meta-label:has(.quote-status-dropdown.open) {
  z-index: 20;
}
.confirmed-detail-meta { gap: 12px 20px; }
.confirmed-order-hub {
  margin-bottom: 12px;
  padding: 12px 14px;
  border: 1px solid var(--border, #ddd);
  border-radius: 8px;
  background: var(--panel-alt, #f8f9fb);
}
.confirmed-order-hub-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px 16px;
  margin-bottom: 10px;
}
.confirmed-order-hub-title {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: 0.01em;
}
.confirmed-order-hub-subline {
  margin-top: 4px;
  font-size: 0.88rem;
}
.confirmed-order-hub-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.confirmed-order-hub-grid {
  margin-bottom: 10px;
}
.confirmed-order-hub-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--border, #e5e7eb);
}
.confirmed-order-payment-progress {
  margin-top: 8px;
}
.confirmed-order-payment-bar {
  margin-top: 6px;
  height: 8px;
  border-radius: 4px;
  background: rgba(0, 0, 0, 0.08);
  overflow: hidden;
}
.confirmed-order-payment-fill {
  height: 100%;
  border-radius: 4px;
  background: linear-gradient(90deg, #059669, #10b981);
  transition: width 0.2s ease;
}
.confirmed-order-version-badge,
.confirmed-order-superseded-badge {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 6px;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 600;
  vertical-align: middle;
}
.confirmed-order-version-badge {
  background: #dbeafe;
  color: #1d4ed8;
}
.confirmed-order-superseded-badge {
  background: #f3f4f6;
  color: #6b7280;
}
.confirmed-order-superseded-row {
  opacity: 0.72;
}
.confirmed-order-version-links {
  margin: 6px 0 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.confirmed-order-version-link.active {
  font-weight: 600;
}
.confirmed-order-superseded-note {
  margin: 0 0 10px;
}
.confirmed-order-timeline {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid var(--border, #e5e7eb);
}
.confirmed-order-timeline-title {
  margin: 0 0 8px;
  font-size: 0.92rem;
}
.confirmed-order-timeline-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 8px;
}
.confirmed-order-timeline-item {
  display: grid;
  grid-template-columns: 92px 1fr;
  gap: 10px;
  align-items: start;
}
.confirmed-order-timeline-item time {
  color: #64748b;
  font-size: 0.82rem;
}
.confirmed-order-timeline-detail {
  font-size: 0.82rem;
  margin-top: 2px;
}
.confirmed-order-primary-no {
  font-weight: 600;
  line-height: 1.25;
}
.confirmed-order-secondary-no {
  margin-top: 2px;
  font-size: 0.82rem;
  line-height: 1.2;
}
.confirmed-orders-status-col {
  white-space: nowrap;
}
.inquiry-detail-meta {
  flex: 0 1 auto;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: stretch;
  align-content: stretch;
  gap: 10px;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  max-height: min(42vh, 360px);
  overflow-x: hidden;
  overflow-y: auto;
}
.inquiry-detail-meta .orders-detail-meta-row {
  display: grid;
  width: 100%;
  flex: 0 0 auto;
  min-width: 0;
  align-items: start;
  gap: 10px 16px;
}
.inquiry-detail-primary-row {
  grid-template-columns: repeat(auto-fill, minmax(168px, 1fr));
}
.inquiry-detail-trading-row {
  grid-template-columns: repeat(auto-fill, minmax(156px, 1fr));
}
.inquiry-detail-status-row {
  grid-template-columns: repeat(auto-fill, minmax(148px, 1fr));
}
.inquiry-detail-meta .orders-meta-label {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 0.35rem;
  min-width: 0;
  max-width: 100%;
  white-space: nowrap;
}
.inquiry-detail-meta .orders-meta-label input,
.inquiry-detail-meta .orders-meta-label select,
.inquiry-detail-meta .orders-meta-label .orders-meta-value,
.inquiry-detail-meta .orders-meta-label .inquiry-detail-attachments-wrap,
.inquiry-detail-meta .orders-meta-label .inquiry-inquiry-attachments-wrap,
.inquiry-detail-meta .orders-meta-label .inquiry-detail-quote-status-wrap {
  white-space: normal;
}
.inquiry-detail-meta .orders-meta-attachments-label,
.inquiry-detail-meta .inquiry-inquiry-attachments-label {
  min-width: 0;
  max-width: none;
}
.inquiry-detail-meta .inquiry-detail-attachments-wrap,
.inquiry-detail-meta .inquiry-inquiry-attachments-wrap {
  flex: 0 1 auto;
  min-width: 0;
  max-width: 100%;
}
.inquiry-detail-meta .orders-meta-input,
.inquiry-detail-meta .orders-meta-label input[type="date"],
.inquiry-detail-meta .orders-meta-label input[type="text"],
.inquiry-detail-meta .orders-meta-label input[type="number"],
.inquiry-detail-meta .orders-meta-label select {
  flex: 0 1 auto;
  width: auto;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}
.inquiry-detail-meta .inquiry-order-name-input {
  width: auto;
  max-width: 11rem;
}
.inquiry-detail-meta .orders-number-input { max-width: 11rem; }
.inquiry-detail-meta .orders-remarks-input { max-width: 14rem; }
.inquiry-detail-meta .orders-days-input { max-width: 2.5rem; }
.inquiry-detail-meta .orders-exchange-rate-input { max-width: 6.5rem; }
.inquiry-detail-meta .inquiry-customer-code-select { max-width: 7rem; }
.inquiry-detail-meta .inquiry-customer-business-input { max-width: 9rem; }
.inquiry-detail-meta .inquiry-deposit-amount-input { max-width: 8rem; }
.inquiry-detail-meta .inquiry-deposit-date-input { min-width: 10.5rem; max-width: 11rem; }
.inquiry-detail-meta .inquiry-commission-input { max-width: 8rem; }
.inquiry-detail-meta .inquiry-supplier-select { min-width: 6rem; max-width: 11rem; }
.inquiry-detail-meta .orders-numeric-text-input::-webkit-inner-spin-button,
.inquiry-detail-meta .orders-numeric-text-input::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.inquiry-detail-meta .orders-numeric-text-input {
  -moz-appearance: textfield;
  appearance: textfield;
}
.inquiry-detail-meta .orders-meta-label:focus-within {
  z-index: 5;
}
.inquiry-detail-meta .orders-meta-input,
.inquiry-detail-meta select,
.inquiry-detail-meta input[type="date"] {
  pointer-events: auto;
}
.inquiry-detail-meta select {
  appearance: auto;
  -webkit-appearance: menulist;
  cursor: pointer;
}
.inquiry-save-btn {
  padding: 8px 22px;
  font-size: 14px;
  font-weight: 600;
  min-width: 108px;
  border-radius: 8px;
  cursor: pointer;
}
.inquiry-save-btn-dirty {
  background: #2563eb;
  color: #fff;
  border: 1px solid #2563eb;
}
.inquiry-save-btn-dirty:hover {
  background: #1d4ed8;
}
.inquiry-save-btn-clean {
  background: #e2e8f0;
  color: #475569;
  border: 1px solid #cbd5e1;
}
.inquiry-save-btn-clean:hover {
  background: #cbd5e1;
}
.inquiry-save-btn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}
.orders-detail-meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 20px;
  align-items: center;
}
.orders-detail-head-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.shipping-budget-detail-modal-head-actions,
.order-status-print-btn {
  flex-shrink: 0;
}
.shipping-budget-detail-modal-head-actions {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  margin: 8px 0 12px;
}
.orders-save-status {
  font-size: 12px;
}
.orders-save-status-error {
  color: #b45309;
}
.orders-detail-tip {
  margin: 0 0 10px;
  font-size: 12px;
}
.orders-attachment-cell {
  min-width: 148px;
  max-width: 220px;
  vertical-align: middle;
  padding-top: 8px;
  padding-bottom: 8px;
}
.order-attachments-wrap {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-height: 36px;
}
.order-attachments-footer {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 8px;
  margin-top: auto;
}
.order-attachments-toolbar {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.order-upload-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  border: 1px dashed #93c5fd;
  border-radius: 999px;
  background: #eff6ff;
  color: #1d4ed8;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  line-height: 1.2;
}
.order-upload-btn:hover {
  background: #dbeafe;
  border-color: #60a5fa;
}
.order-upload-icon {
  display: inline-flex;
  width: 14px;
  height: 14px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: #2563eb;
  color: #fff;
  font-size: 11px;
  line-height: 1;
}
.order-attachment-count {
  font-size: 11px;
  color: var(--muted);
  white-space: nowrap;
}
.order-attachment-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 6px;
}
.order-attachment-chips {
  max-width: 100%;
}
.order-attachment-chip,
.order-attachment-item {
  display: flex;
  align-items: center;
  gap: 2px;
  min-width: 0;
  padding: 2px 2px 2px 8px;
  border: 1px solid #e2e8f0;
  border-radius: 999px;
  background: #f8fafc;
}
.order-attachment-chip-link,
.order-attachment-item a {
  flex: 1;
  min-width: 0;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  overflow: hidden;
  color: #334155;
  text-decoration: none;
  font-size: 12px;
}
.order-attachment-chip-link:hover,
.order-attachment-item a:hover {
  color: #1d4ed8;
}
.order-attachment-chip-icon {
  flex: 0 0 auto;
  font-size: 12px;
  line-height: 1;
}
.order-attachment-chip-name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.order-attachment-chip-remove,
.order-attachment-item .delete-order-attachment-btn {
  flex: 0 0 auto;
  width: 22px;
  height: 22px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: #94a3b8;
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
}
.order-attachment-chip-remove:hover,
.order-attachment-item .delete-order-attachment-btn:hover {
  background: #fee2e2;
  color: #dc2626;
}
.order-attachment-empty-chip,
.order-attachment-empty {
  font-size: 12px;
  padding: 4px 0;
}
.fulfillment-status-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}
.fulfillment-status-badge.production {
  background: #fef3c7;
  color: #b45309;
}
.fulfillment-status-badge.delayed {
  background: #fee2e2;
  color: #dc2626;
}
.fulfillment-status-badge.pending_shipment {
  background: #dbeafe;
  color: #1d4ed8;
}
.fulfillment-status-badge.shipped {
  background: #dcfce7;
  color: #15803d;
}
.inquiry-status-badge {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}
.inquiry-status-pending {
  background: #fef9c3;
  color: #854d0e;
}
.inquiry-status-confirmed {
  background: #dcfce7;
  color: #166534;
}
.inquiry-status-cancelled {
  background: #e2e8f0;
  color: #475569;
}
.quote-status-badge {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}
.quote-status-pending {
  background: #fef9c3;
  color: #854d0e;
}
.quote-status-quoted {
  background: #dcfce7;
  color: #166534;
}
.quote-status-purchased {
  background: #dbeafe;
  color: #1e40af;
}
.quote-status-cancelled {
  background: #e2e8f0;
  color: #475569;
}
.orders-master-row-cancelled td {
  background-image: linear-gradient(
    transparent calc(50% - 0.5px),
    rgba(239, 68, 68, 0.88) calc(50% - 0.5px),
    rgba(239, 68, 68, 0.88) calc(50% + 0.5px),
    transparent calc(50% + 0.5px)
  );
}
.orders-master-row:has(.quote-status-dropdown.open, .packaging-info-dropdown.open, .fulfillment-status-dropdown.open) {
  position: relative;
  z-index: 3;
}
.orders-master-table .orders-quote-status-cell {
  overflow: visible;
  position: relative;
  min-width: 108px;
}
.orders-master-table .orders-packaging-info-cell,
.orders-master-table .orders-fulfillment-status-cell {
  overflow: visible;
  position: relative;
  min-width: 108px;
}
.fulfillment-status-dropdown {
  position: relative;
  display: inline-block;
}
.fulfillment-status-dropdown-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 6px 2px 2px;
  border: 1px solid transparent;
  border-radius: 999px;
  background: transparent;
  cursor: pointer;
  font: inherit;
}
.fulfillment-status-dropdown-caret {
  font-size: 10px;
  color: #64748b;
  line-height: 1;
}
.fulfillment-status-dropdown-panel {
  display: none;
  position: absolute;
  top: calc(100% + 4px);
  left: 0;
  z-index: 20;
  min-width: 120px;
  padding: 4px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
}
.fulfillment-status-dropdown.open .fulfillment-status-dropdown-panel {
  display: block;
}
.fulfillment-status-dropdown-option {
  display: block;
  width: 100%;
  padding: 6px 8px;
  border: none;
  border-radius: 6px;
  background: transparent;
  text-align: left;
  cursor: pointer;
}
.fulfillment-status-dropdown-option:hover,
.fulfillment-status-dropdown-option.active {
  background: #f1f5f9;
}
.packaging-info-badge {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}
.packaging-info-pending_make,
.packaging-info-pending_review,
.packaging-info-pending_factory,
.packaging-info-pending_confirm {
  background: #fef9c3;
  color: #854d0e;
}
.packaging-info-completed {
  background: #dcfce7;
  color: #166534;
}
.packaging-info-dropdown {
  position: relative;
  display: inline-block;
  width: 100%;
  max-width: 160px;
}
.packaging-info-dropdown-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  width: 100%;
  box-sizing: border-box;
  padding: 4px 6px;
  border: 1px solid;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.packaging-info-dropdown-btn.packaging-info-pending_make,
.packaging-info-dropdown-btn.packaging-info-pending_review,
.packaging-info-dropdown-btn.packaging-info-pending_factory,
.packaging-info-dropdown-btn.packaging-info-pending_confirm {
  background: #fef9c3;
  color: #854d0e;
  border-color: #fde047;
}
.packaging-info-dropdown-btn.packaging-info-completed {
  background: #dcfce7;
  color: #166534;
  border-color: #86efac;
}
.packaging-info-dropdown-caret {
  font-size: 10px;
  opacity: 0.7;
  flex-shrink: 0;
}
.packaging-info-dropdown-panel {
  display: none;
  position: absolute;
  top: calc(100% + 2px);
  left: 0;
  right: 0;
  z-index: 30;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.12);
  padding: 4px;
  flex-direction: column;
  gap: 4px;
}
.packaging-info-dropdown.open .packaging-info-dropdown-panel {
  display: flex;
}
.packaging-info-dropdown-option {
  display: block;
  width: 100%;
  padding: 4px 6px;
  border: none;
  background: transparent;
  cursor: pointer;
  text-align: left;
  border-radius: 4px;
}
.packaging-info-dropdown-option:hover,
.packaging-info-dropdown-option.active {
  background: #f8fafc;
}
.packaging-detail-table .pick-col {
  width: 36px;
  text-align: center;
}
.packaging-detail-table .packaging-huohao-col {
  min-width: 88px;
  max-width: 120px;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 600;
}
.packaging-detail-table .pack-qty-cell,
.packaging-detail-table .pack-unit-cell {
  min-width: 72px;
  text-align: center;
}
.packaging-detail-table .pack-qty-cell .table-input,
.packaging-detail-table .pack-unit-cell .table-select {
  text-align: center;
  margin-left: auto;
  margin-right: auto;
}
.packaging-detail-table-wrap .packaging-extension-col {
  min-width: 72px;
  max-width: 84px;
  white-space: nowrap;
  font-size: 11px;
  text-align: center;
}
.packaging-detail-table-wrap .packaging-line-attachment-cell {
  min-width: 72px;
  max-width: 84px;
  vertical-align: top;
  padding: 4px 3px;
}
.packaging-detail-table-wrap .packaging-review-col,
.packaging-detail-table-wrap .packaging-confirm-col {
  min-width: 72px;
  font-size: 11px;
  text-align: center;
  vertical-align: middle;
}
.packaging-attachment-cell {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  min-height: 52px;
}
.packaging-attachment-preview-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  width: 100%;
}
.packaging-attachment-empty {
  font-size: 12px;
  color: #94a3b8;
}
.packaging-attachment-thumb-btn {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: 0;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  background: #f8fafc;
  cursor: pointer;
  overflow: hidden;
  max-width: 100%;
}
.packaging-attachment-thumb-btn:hover {
  border-color: #93c5fd;
  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.12);
}
.packaging-attachment-image-thumb {
  width: 52px;
  height: 52px;
}
.packaging-attachment-thumb {
  display: block;
  width: 52px;
  height: 52px;
  object-fit: cover;
}
.packaging-attachment-pdf-thumb {
  min-width: 52px;
  min-height: 44px;
  padding: 6px 8px;
}
.packaging-attachment-pdf-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  padding: 2px 6px;
  border-radius: 4px;
  background: #fee2e2;
  color: #b91c1c;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
}
.packaging-attachment-pdf-name {
  max-width: 72px;
  font-size: 10px;
  color: #475569;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.packaging-attachment-toolbar {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}
.packaging-attachment-upload-btn,
.packaging-attachment-remove-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
}
.packaging-attachment-upload-btn {
  border: 1px dashed #93c5fd;
  background: #eff6ff;
  color: #1d4ed8;
  font-weight: 700;
}
.packaging-attachment-upload-btn:hover {
  background: #dbeafe;
}
.packaging-attachment-remove-btn {
  border: 1px solid #fecaca;
  background: #fff1f2;
  color: #b91c1c;
}
.packaging-attachment-remove-btn:hover {
  background: #ffe4e6;
}
.packaging-review-toggle,
.packaging-confirm-toggle {
  display: inline-flex;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  overflow: hidden;
}
.packaging-review-btn,
.packaging-confirm-btn {
  border: 0;
  background: #fff;
  color: #475569;
  font-size: 11px;
  font-weight: 600;
  padding: 4px 6px;
  cursor: pointer;
  white-space: nowrap;
}
.packaging-review-btn + .packaging-review-btn,
.packaging-confirm-btn + .packaging-confirm-btn {
  border-left: 1px solid #e2e8f0;
}
.packaging-review-btn.active {
  background: #dbeafe;
  color: #1d4ed8;
}
.packaging-review-btn.active[data-value="error"] {
  background: #fee2e2;
  color: #b91c1c;
}
.packaging-confirm-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}
.packaging-confirm-label {
  font-size: 10px;
  font-weight: 700;
  color: #64748b;
  letter-spacing: 0.02em;
  line-height: 1.2;
}
.packaging-confirm-btn.active.wrong {
  background: #fee2e2;
  color: #b91c1c;
}
.packaging-confirm-btn.active.ok {
  background: #dcfce7;
  color: #166534;
}
.pdf-preview-overlay {
  z-index: 51;
}
.pdf-preview-panel {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
  width: min(92vw, 960px);
  height: min(88vh, 900px);
}
.pdf-preview-frame {
  flex: 1;
  width: 100%;
  border: 0;
  border-radius: 12px;
  background: #fff;
}
.pdf-preview-open-tab {
  align-self: flex-end;
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  text-decoration: underline;
}
.packaging-detail-table-wrap .packaging-line-status-cell {
  min-width: 108px;
  vertical-align: middle;
}
.packaging-line-status-dropdown {
  max-width: 120px;
}
.packaging-line-status-dropdown-btn.packaging-line-empty {
  background: #f8fafc;
  color: #64748b;
  border-color: #e2e8f0;
}
.packaging-line-empty-label {
  color: #64748b;
  font-size: 12px;
  font-weight: 600;
}
.orders-master-row:has(.packaging-line-status-dropdown.open) {
  position: relative;
  z-index: 3;
}
.product-table .packaging-line-status-cell .packaging-info-dropdown {
  max-width: 120px;
}
.order-transfer-badge {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}
.order-transfer-waiting {
  background: #fef9c3;
  color: #854d0e;
}
.order-transfer-bought {
  background: #dcfce7;
  color: #166534;
}
.contract-status-badge {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}
.contract-status-pending {
  background: #fef9c3;
  color: #854d0e;
}
.contract-status-signed,
.purchase-status-purchased {
  background: #dbeafe;
  color: #1e40af;
}
.orders-master-table .orders-contract-status-select.contract-status-pending {
  background: #fef9c3;
  color: #854d0e;
  border-color: #fde047;
  font-weight: 600;
}
.orders-master-table .orders-contract-status-select.contract-status-signed,
.orders-master-table .orders-contract-status-select.purchase-status-purchased {
  background: #dbeafe;
  color: #1e40af;
  border-color: #93c5fd;
  font-weight: 600;
}
.contract-audit-badge {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}
.contract-audit-pending {
  background: #e0e7ff;
  color: #3730a3;
}
.contract-audit-approved {
  background: #dcfce7;
  color: #166534;
}
.orders-audit-cell-inner {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.orders-master-table .orders-master-input {
  width: 100%;
  min-width: 72px;
  max-width: 160px;
  box-sizing: border-box;
  font-size: 12px;
  padding: 4px 6px;
}
.orders-master-table .orders-name-cell .orders-master-input {
  min-width: 140px;
  max-width: 220px;
}
.orders-master-table th.orders-customer-po-col,
.orders-master-table .orders-customer-po-cell {
  width: 96px;
  max-width: 108px;
}
.orders-master-table .orders-customer-po-cell .orders-master-input {
  min-width: 80px;
  max-width: 96px;
  padding: 4px 4px;
}
.quote-status-dropdown {
  position: relative;
  display: inline-block;
  width: 100%;
  max-width: 160px;
}
.quote-status-dropdown-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 4px;
  width: 100%;
  box-sizing: border-box;
  padding: 4px 6px;
  border: 1px solid;
  border-radius: 4px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.quote-status-dropdown-btn.quote-status-pending {
  background: #fef9c3;
  color: #854d0e;
  border-color: #fde047;
}
.quote-status-dropdown-btn.quote-status-quoted {
  background: #dcfce7;
  color: #166534;
  border-color: #86efac;
}
.quote-status-dropdown-btn.quote-status-purchased {
  background: #dbeafe;
  color: #1e40af;
  border-color: #93c5fd;
}
.quote-status-dropdown-btn.quote-status-cancelled {
  background: #e2e8f0;
  color: #475569;
  border-color: #cbd5e1;
}
.quote-status-dropdown-caret {
  font-size: 10px;
  opacity: 0.7;
  flex-shrink: 0;
}
.quote-status-dropdown-panel {
  display: none;
  position: absolute;
  top: calc(100% + 2px);
  left: 0;
  min-width: 100%;
  z-index: 40;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.12);
  padding: 4px;
  flex-direction: column;
  gap: 4px;
}
.quote-status-dropdown.open .quote-status-dropdown-panel {
  display: flex;
}
.quote-status-dropdown-option {
  display: block;
  width: 100%;
  padding: 4px 6px;
  border: none;
  background: transparent;
  cursor: pointer;
  text-align: left;
  border-radius: 4px;
}
.quote-status-dropdown-option:hover,
.quote-status-dropdown-option.active {
  background: #f8fafc;
}
.orders-master-table .orders-sgs-status-select.sgs-status-pending {
  background: #fef9c3;
  color: #854d0e;
  border-color: #fde047;
  font-weight: 600;
}
.orders-master-table .orders-sgs-status-select.sgs-status-processed {
  background: #dcfce7;
  color: #166534;
  border-color: #86efac;
  font-weight: 600;
}
.orders-master-table .orders-status-badge-cell {
  white-space: nowrap;
  vertical-align: middle;
}
.order-status-summary-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 6px;
  font-size: 12px;
  font-weight: 600;
  border: 1px solid transparent;
  line-height: 1.4;
}
.order-status-summary-badge.sgs-status-pending,
.order-status-summary-badge.payment-collection-status-pending {
  background: #fef9c3;
  color: #854d0e;
  border-color: #fde047;
}
.order-status-summary-badge.sgs-status-processed,
.order-status-summary-badge.payment-status-paid,
.order-status-summary-badge.document-sent-status-sent,
.order-status-summary-badge.payment-collection-status-complete {
  background: #dcfce7;
  color: #166534;
  border-color: #86efac;
}
.order-status-summary-badge.payment-status-unpaid,
.order-status-summary-badge.document-sent-status-not_sent {
  background: #fef9c3;
  color: #854d0e;
  border-color: #fde047;
}
.order-status-summary-badge.payment-collection-status-partial {
  background: #fee2e2;
  color: #991b1b;
  border-color: #fca5a5;
}
.order-status-summary-badge.scan-status-scanned {
  background: #dcfce7;
  color: #166534;
  border-color: #86efac;
}
.order-status-summary-badge.scan-status-not_scanned {
  background: #f1f5f9;
  color: #475569;
  border-color: #cbd5e1;
}
.orders-master-table.order-status-master-table-frozen {
  overflow: visible;
  width: max-content;
  min-width: 100%;
}
.orders-master-table.order-status-master-table th,
.orders-master-table.order-status-master-table td {
  text-align: center;
  vertical-align: middle;
}
.orders-master-table.order-status-master-table th.order-status-date-col,
.orders-master-table.order-status-master-table td.order-status-date-col {
  min-width: 108px;
  white-space: nowrap;
}
.orders-master-table.order-status-master-table th.order-status-po-col,
.orders-master-table.order-status-master-table td.order-status-po-col {
  min-width: 112px;
  max-width: 140px;
}
.orders-master-table.order-status-master-table th.order-status-supplier-col,
.orders-master-table.order-status-master-table td.order-status-supplier-col {
  min-width: 108px;
  max-width: 160px;
}
.orders-master-table.order-status-master-table th.order-status-name-col,
.orders-master-table.order-status-master-table td.order-status-name-col {
  min-width: 180px;
  max-width: 280px;
}
.orders-master-table.order-status-master-table th.order-status-bl-col,
.orders-master-table.order-status-master-table td.order-status-bl-col {
  min-width: 108px;
  max-width: 140px;
}
.orders-master-table.order-status-master-table th.order-status-shipping-date-col,
.orders-master-table.order-status-master-table td.order-status-shipping-date-col,
.orders-master-table.order-status-master-table th.order-status-courier-date-col,
.orders-master-table.order-status-master-table td.order-status-courier-date-col,
.orders-master-table.order-status-master-table th.order-status-sailing-date-col,
.orders-master-table.order-status-master-table td.order-status-sailing-date-col,
.orders-master-table.order-status-master-table th.order-status-eta-col,
.orders-master-table.order-status-master-table td.order-status-eta-col {
  min-width: 104px;
  white-space: nowrap;
}
.orders-master-table.order-status-master-table .orders-fulfillment-status-cell,
.orders-master-table.order-status-master-table .orders-status-badge-cell,
.orders-master-table.order-status-master-table .delivery-progress-cell {
  text-align: center;
  vertical-align: middle;
}
.orders-master-table.order-status-master-table-frozen .order-status-sticky-col {
  position: sticky;
  z-index: 2;
  background: #fff;
  background-clip: padding-box;
}
.orders-master-table.order-status-master-table-frozen thead .order-status-sticky-col {
  z-index: 4;
  background: #f8fafc;
  background-clip: padding-box;
}
.orders-master-table.order-status-master-table-frozen tbody tr:hover .order-status-sticky-col {
  background: #eff6ff;
}
.orders-master-table.order-status-master-table-frozen tbody tr.active .order-status-sticky-col {
  background: #eff6ff;
}
.orders-master-table.order-status-master-table-frozen .order-status-sticky-col-1 {
  left: var(--os-sticky-left-1, 0);
}
.orders-master-table.order-status-master-table-frozen .order-status-sticky-col-2 {
  left: var(--os-sticky-left-2, 108px);
}
.orders-master-table.order-status-master-table-frozen .order-status-sticky-col-3 {
  left: var(--os-sticky-left-3, 208px);
}
.orders-master-table.order-status-master-table-frozen .order-status-sticky-col-4 {
  left: var(--os-sticky-left-4, 320px);
}
.orders-master-table.order-status-master-table-frozen .order-status-sticky-col-edge {
  box-shadow: 4px 0 8px -4px rgba(15, 23, 42, 0.12);
}
.orders-master-table.order-status-master-table th.order-status-port-col,
.orders-master-table.order-status-master-table td.order-status-port-col {
  min-width: 128px;
  white-space: nowrap;
}
.orders-master-table.order-status-master-table th.order-status-discharge-port-col,
.orders-master-table.order-status-master-table td.order-status-discharge-port-col {
  min-width: 128px;
  white-space: nowrap;
}
.orders-master-table.order-status-master-table th.order-status-country-col,
.orders-master-table.order-status-master-table td.order-status-country-col {
  min-width: 72px;
  max-width: 100px;
  white-space: nowrap;
}
.orders-master-table.order-status-master-table th.order-status-company-col,
.orders-master-table.order-status-master-table td.order-status-company-col {
  min-width: 88px;
  max-width: 140px;
  white-space: nowrap;
}
.orders-master-table.order-status-master-table th.order-status-description-col,
.orders-master-table.order-status-master-table td.order-status-description-col {
  min-width: 120px;
  max-width: 200px;
}
.orders-master-table.order-status-master-table th.order-status-customer-col,
.orders-master-table.order-status-master-table td.order-status-customer-col {
  min-width: 88px;
  white-space: nowrap;
}
.voyage-progress-cell {
  min-width: 96px;
}
.voyage-progress--ontrack-1 { background: linear-gradient(90deg, #dcfce7, #bbf7d0); }
.voyage-progress--ontrack-2 { background: linear-gradient(90deg, #bbf7d0, #86efac); }
.voyage-progress--ontrack-3 { background: linear-gradient(90deg, #86efac, #4ade80); }
.voyage-progress--ontrack-4 { background: linear-gradient(90deg, #4ade80, #16a34a); }
.voyage-progress--overdue { background: linear-gradient(90deg, #fef9c3, #facc15); }
.voyage-progress--none { background: #e2e8f0; }
.order-status-documents-table .order-status-documents-header-row th {
  background: #f1f5f9;
  font-size: 12px;
}
.order-status-status-select.scan-status-scanned {
  background: #dcfce7;
  color: #166534;
  border-color: #86efac;
}
.order-status-status-select.scan-status-not_scanned {
  background: #f1f5f9;
  color: #475569;
  border-color: #cbd5e1;
}
.order-status-status-select.payment-collection-status-complete {
  background: #dcfce7;
  color: #166534;
  border-color: #86efac;
}
.order-status-status-select.payment-collection-status-partial {
  background: #fee2e2;
  color: #991b1b;
  border-color: #fca5a5;
}
.order-status-status-select.payment-status-unpaid,
.order-status-status-select.document-sent-status-not_sent {
  background: #fef9c3;
  color: #854d0e;
  border-color: #fde047;
}
.orders-master-table .orders-status-date-input {
  min-width: 118px;
  max-width: 132px;
  padding: 4px 4px;
}
.orders-master-row-locked {
  background: #f8fafc;
}
.inquiry-list-table .orders-master-row.inquiry-row-pending {
  background: #fffbeb;
}
.inquiry-list-table .orders-master-row.inquiry-row-quoted {
  background: #eff6ff;
}
.inquiry-list-table .orders-master-row.inquiry-row-confirmed {
  background: #f0fdf4;
}
.inquiry-list-table .orders-master-row.inquiry-row-pending:hover,
.inquiry-list-table .orders-master-row.inquiry-row-pending.active {
  background: #fef3c7;
}
.inquiry-list-table .orders-master-row.inquiry-row-quoted:hover,
.inquiry-list-table .orders-master-row.inquiry-row-quoted.active {
  background: #dbeafe;
}
.inquiry-list-table .orders-master-row.inquiry-row-confirmed:hover,
.inquiry-list-table .orders-master-row.inquiry-row-confirmed.active {
  background: #dcfce7;
}
.order-status-lines-section {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid #e2e8f0;
}
.order-status-lines-collapsible-head .order-status-lines-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  flex-shrink: 0;
}
.order-status-lines-hint {
  margin: 0 0 10px;
  font-size: 13px;
}
.order-status-lines-table-wrap { overflow-x: auto; }
.order-status-tracking-fields,
.order-status-shipped-fields {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid #e2e8f0;
}
.order-status-section-title {
  margin: 0 0 10px;
  font-size: 14px;
  font-weight: 600;
  color: #0f172a;
}
.fulfillment-attachments-wrap {
  display: grid;
  gap: 6px;
}
.fulfillment-attachments-wrap .order-attachment-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 4px;
}
.orders-meta-value {
  font-weight: 600;
  color: #0f172a;
}
.orders-number-cell {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 12px;
  white-space: nowrap;
}
.purchase-contract-master-table th.text-cell,
.purchase-contract-master-table td.text-cell {
  vertical-align: top;
  text-align: left;
}
.purchase-contract-master-table th.purchase-contract-work-date-col,
.purchase-contract-master-table td.purchase-contract-work-date-col {
  min-width: 108px;
}
.purchase-contract-master-table th.purchase-contract-number-col,
.purchase-contract-master-table td.purchase-contract-number-col {
  min-width: 148px;
}
.purchase-contract-master-table th.purchase-contract-delivery-col,
.purchase-contract-master-table td.purchase-contract-delivery-col {
  min-width: 108px;
}
.orders-meta-label-wide {
  grid-column: 1 / -1;
}
.orders-detail-table-wrap {
  flex: 1;
  min-height: 0;
  overflow: auto;
  max-height: none;
}
.orders-detail-table-wrap .table-wrap {
  margin-top: 0;
}
.product-table tr.cart-row-pending {
  background: #fff7ed;
}
.product-table tr.cart-row-pending .sticky-col {
  background: #fff7ed;
}
.product-table tbody tr.cart-row-pending:hover,
.product-table tbody tr.cart-row-pending:hover .sticky-col {
  background: #ffedd5;
}
.product-table tr.cart-row-sample {
  background: #fffbeb;
}
.product-table tr.cart-row-sample .sticky-col {
  background: #fffbeb;
}
.series-sku-cell.sku-with-pick {
  display: flex;
  align-items: center;
  gap: 6px;
}
.series-sku-cell.sku-with-pick .pick-box {
  flex: 0 0 auto;
}
.sample-box {
  width: 16px;
  height: 16px;
  cursor: pointer;
}
.table-thumb {
  display: block;
  width: 56px;
  height: 56px;
  object-fit: cover;
  border-radius: 6px;
  background: #eef2f7;
  margin: 0 auto;
}
.tag-cell .tag { margin-bottom: 4px; }
.thumb-clickable { cursor: zoom-in; }
.lightbox {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.82);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 50;
  padding: 24px;
}
.lightbox.hidden { display: none !important; }
.lightbox img {
  max-width: min(92vw, 960px);
  max-height: 88vh;
  object-fit: contain;
  border-radius: 12px;
  background: #fff;
}
.lightbox-close {
  position: absolute;
  top: 20px;
  right: 24px;
  width: 40px;
  height: 40px;
  border-radius: 999px;
  font-size: 24px;
  line-height: 1;
}
.group-title {
  margin: 18px 0 10px;
  padding: 8px 12px;
  background: var(--primary-soft);
  border-radius: 8px;
  font-weight: 600;
}
.pagination-size {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  white-space: nowrap;
}
.page-size-select {
  min-width: 56px;
  padding: 4px 6px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
}
.pagination-info {
  font-size: 13px;
  color: var(--muted);
  white-space: nowrap;
}
.pagination-bar {
  display: none;
}
.list-pagination-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: flex-end;
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px solid var(--line);
}
.list-pagination-bar .secondary:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.sortable-th {
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
}
.sortable-th:hover {
  background: color-mix(in srgb, var(--accent) 8%, transparent);
}
.sortable-th.sort-active {
  background: color-mix(in srgb, var(--accent) 12%, transparent);
}
.sortable-th-label {
  margin-right: 0.25em;
}
.sort-indicator {
  display: inline-block;
  min-width: 1em;
  font-size: 0.85em;
  opacity: 0.55;
  vertical-align: middle;
}
.sortable-th.sort-active .sort-indicator {
  opacity: 1;
  color: var(--accent);
}
.list-sort-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-bottom: 10px;
}
.list-sort-bar-label {
  font-size: 0.9em;
}
.list-sort-btn {
  border: 1px solid var(--line);
  background: var(--panel);
  color: inherit;
  border-radius: 6px;
  padding: 4px 10px;
  font-size: 0.85em;
  cursor: pointer;
}
.list-sort-btn:hover {
  border-color: var(--accent);
}
.list-sort-btn.active {
  border-color: var(--accent);
  background: color-mix(in srgb, var(--accent) 10%, var(--panel));
}
.cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 14px;
}
.card {
  display: grid;
  grid-template-columns: auto 84px 1fr;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: #fff;
}
.thumb {
  width: 84px;
  height: 84px;
  object-fit: cover;
  border-radius: 8px;
  background: #eef2f7;
}
.title-line { font-weight: 700; margin-bottom: 6px; }
.meta-line, .tag-line { font-size: 13px; color: var(--muted); margin-bottom: 6px; }
.card-line { font-size: 13px; color: var(--muted); margin-bottom: 4px; line-height: 1.45; }
.card-capacity { font-weight: 600; color: var(--text); margin-bottom: 6px; }
.card-dim-line { line-height: 1.4; }
.card-category { margin-bottom: 6px; }
.carton-type-cell { min-width: 88px; vertical-align: top; }
.carton-checkboxes {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 2px 0;
}
.carton-check-label {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  line-height: 1.3;
  white-space: nowrap;
  cursor: pointer;
}
.carton-check-label input { margin: 0; flex-shrink: 0; }
.carton-type-value {
  font-weight: 600;
  color: var(--text);
  white-space: nowrap;
}
.carton-type-value-wrap {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.carton-type-remove-btn {
  padding: 0 5px;
  line-height: 1.2;
  min-width: 0;
}
.tag {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 12px;
  margin-right: 6px;
}
.tag.buy { background: #dcfce7; color: #166534; }
.tag.like { background: #fef3c7; color: #92400e; }
.tag.match { background: #e0e7ff; color: #3730a3; }
.tag.sales-tag { background: #e0f2fe; color: #0369a1; }
.sales-tag-chip-group { margin-top: 4px; }
.sales-tag-chip-group .sales-tag-chip.active {
  background: #0369a1;
  border-color: #0369a1;
  color: #fff;
}
.sales-tag-chip-group-editable .sales-tag-chip { cursor: pointer; }
.product-detail-sales-tags { margin-top: 4px; }
.product-batch-edit-wide { grid-column: 1 / -1; }
.detail-modal {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.45);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 35;
  padding: 16px;
}
.detail-modal.hidden { display: none !important; }
.detail-card {
  position: relative;
  width: min(720px, 100%);
  max-height: calc(100vh - 32px);
  overflow: auto;
  padding: 20px;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.18);
}
.hidden { display: none; }
.checkbox-inline { flex-direction: row !important; align-items: center; gap: 8px !important; }
.detail-grid { display: grid; gap: 8px; font-size: 14px; }
.detail-grid div { display: flex; justify-content: space-between; gap: 12px; border-bottom: 1px dashed var(--line); padding-bottom: 6px; }
.detail-card img, .detail-thumb { width: 100%; max-height: 280px; object-fit: contain; background: #f8fafc; border-radius: 8px; }
.detail-supplier-title { margin: 0 0 4px; }
.detail-media-block { display: grid; gap: 8px; margin-bottom: 0; }
.detail-edit-tip { margin: 0 0 16px; font-size: 13px; }
.detail-form-section {
  margin-bottom: 20px;
  padding-bottom: 4px;
}
.detail-form-section-title {
  font-size: 15px;
  font-weight: 700;
  margin: 0 0 12px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--line);
}
.detail-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px 12px;
}
.detail-field-hint {
  font-size: 12px;
  font-style: normal;
}
.detail-field input:disabled {
  background: #f1f5f9;
  color: var(--muted);
  cursor: not-allowed;
}
.detail-media-section .detail-media-subsection {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px dashed var(--line);
}
.detail-media-section .detail-media-subsection:first-of-type {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}
.detail-media-subtitle {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
}
.detail-field {
  display: grid;
  gap: 4px;
  font-size: 13px;
}
.detail-field-wide { grid-column: 1 / -1; }
.detail-field span { color: var(--muted); }
.detail-field input {
  width: 100%;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font: inherit;
}
.detail-section {
  margin-bottom: 16px;
  padding-top: 4px;
  border-top: 1px solid var(--line);
}
.detail-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.detail-section-actions,
.detail-image-source-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.detail-image-source { margin: 0; font-size: 13px; }
.detail-section h4 { margin: 0; font-size: 15px; }
.detail-upload-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.detail-images-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(108px, 1fr));
  gap: 10px;
}
.detail-image-item {
  display: grid;
  gap: 6px;
}
.detail-image-thumb {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: 8px;
  background: #f8fafc;
  border: 1px solid var(--line);
}
.detail-empty-tip { margin: 0; font-size: 13px; }
.detail-video-preview { margin-top: 10px; }
.detail-video,
.detail-video-embed {
  width: 100%;
  max-height: 280px;
  border: 0;
  border-radius: 8px;
  background: #000;
}
.detail-video-embed { aspect-ratio: 16 / 9; }
.detail-video-link { word-break: break-all; font-size: 13px; }
.detail-readonly-grid {
  display: grid;
  gap: 8px;
  font-size: 14px;
  margin-bottom: 12px;
}
.detail-readonly-grid div {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 8px 12px;
  border-bottom: 1px dashed var(--line);
  padding-bottom: 6px;
}
.detail-customer-block { margin-bottom: 12px; }
.detail-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}
.modal {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.45);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 40;
  padding: 16px;
}
.modal.hidden { display: none !important; }
.modal-card {
  position: relative;
  width: min(460px, 100%);
  display: grid;
  gap: 14px;
}
.product-detail-modal-card {
  width: min(920px, 96vw);
  height: min(90vh, 680px);
  min-height: min(90vh, 680px);
  border-radius: 12px;
  padding: 20px 22px 18px;
  display: flex;
  flex-direction: column;
  gap: 0;
  overflow: hidden;
}
.product-detail-modal-head,
.product-detail-tabs,
.product-detail-modal-actions {
  flex-shrink: 0;
}
.product-detail-modal-head {
  display: flex;
  gap: 16px;
  align-items: flex-start;
  padding-right: 36px;
}
.product-detail-modal-head-text {
  flex: 1;
  min-width: 0;
}
.product-detail-modal-head-text h3 {
  margin: 0;
  font-size: 18px;
  line-height: 1.35;
}
.product-detail-modal-head-text p {
  margin: 6px 0 0;
  font-size: 13px;
  line-height: 1.45;
}
.product-detail-modal-thumb {
  width: 72px;
  height: 72px;
  object-fit: cover;
  border-radius: 8px;
  border: 1px solid var(--line);
  flex-shrink: 0;
  background: #f8fafc;
}
.product-detail-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--line);
}
.product-detail-tab {
  border: 1px solid var(--line);
  background: #f8fafc;
  color: #334155;
  border-radius: 999px;
  padding: 6px 14px;
  font-size: 13px;
  cursor: pointer;
  line-height: 1.3;
}
.product-detail-tab:hover {
  background: #eef2ff;
  border-color: #c7d2fe;
}
.product-detail-tab.active {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}
.product-detail-modal-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding: 16px 2px 8px;
}
.product-detail-tab-panel.hidden {
  display: none !important;
}
.product-detail-tab-layout {
  display: grid;
  gap: 14px;
  min-height: 100%;
  box-sizing: border-box;
}
.product-detail-readonly-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 14px 20px;
}
.product-detail-readonly-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 13px;
  line-height: 1.45;
}
.product-detail-readonly-item span {
  color: var(--muted);
  font-size: 12px;
}
.product-detail-readonly-item strong {
  font-weight: 500;
  color: #0f172a;
  word-break: break-word;
}
.product-detail-readonly-item em {
  font-style: normal;
  color: var(--muted);
  font-size: 12px;
}
.product-detail-readonly-wide {
  grid-column: 1 / -1;
}
.product-detail-tab-layout > .product-detail-readonly-item,
.product-detail-tab-layout > .detail-field,
.product-detail-tab-layout > .product-detail-readonly-inline {
  grid-column: 1 / -1;
}
.product-detail-tab-layout > .product-detail-readonly-grid,
.product-detail-tab-layout > .detail-form-grid {
  width: 100%;
}
.product-detail-field-row {
  display: grid;
  grid-template-columns: repeat(var(--pdm-cols, 4), minmax(0, 1fr));
  gap: 14px 20px;
}
.product-detail-field-row.cols-2 {
  --pdm-cols: 2;
}
.product-detail-field-row.cols-3 {
  --pdm-cols: 3;
}
.product-detail-field-row.cols-4 {
  --pdm-cols: 4;
}
.product-detail-stack-col {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  max-width: min(360px, 100%);
}
.product-detail-edit-grid .product-detail-stack-col {
  gap: 10px;
}
.product-detail-readonly-inline {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 13px;
  line-height: 1.45;
}
.product-detail-readonly-inline span {
  color: var(--muted);
  font-size: 12px;
}
.product-detail-readonly-inline strong {
  font-weight: 500;
  color: #0f172a;
  word-break: break-word;
}
.product-detail-readonly-inline em {
  font-style: normal;
  color: var(--muted);
  font-size: 12px;
}
@media (max-width: 720px) {
  .product-detail-field-row {
    grid-template-columns: 1fr;
  }
}
.product-detail-modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
  margin-top: 4px;
}
.product-detail-edit-grid {
  margin-top: 4px;
}
.product-detail-edit-tags {
  margin-top: 12px;
}
.product-detail-edit-tags > span {
  display: grid;
  gap: 6px;
}
.product-detail-edit-tags > span > span:first-child {
  color: var(--muted);
  font-size: 13px;
}
.product-detail-media-edit-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.product-detail-media-layout {
  display: grid;
  gap: 20px;
}
.product-detail-media-block {
  display: grid;
  gap: 10px;
}
.product-detail-media-title {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  color: #334155;
}
.product-detail-main-image {
  width: min(240px, 100%);
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: #f8fafc;
}
.product-detail-images-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(96px, 1fr));
  gap: 10px;
}
.product-detail-image-thumb {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  border-radius: 8px;
  border: 1px solid var(--line);
  background: #f8fafc;
}
.product-detail-video-wrap .detail-video,
.product-detail-video-wrap .detail-video-embed {
  max-width: 100%;
}
.product-detail-media-meta,
.product-detail-empty-tip {
  margin: 0;
  font-size: 12px;
}
.product-detail-customers-actions {
  margin-top: 16px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 8px;
}
.product-detail-modal-hint {
  margin: 0;
  font-size: 13px;
  line-height: 1.45;
}
.settings-modal-card {
  width: min(1100px, 94vw);
  max-height: 94vh;
  overflow: auto;
}
.settings-modal-card--wide {
  width: min(1480px, 96vw);
  max-height: 94vh;
}
.settings-modal-card--wide .settings-layout {
  min-height: 72vh;
}
.settings-modal-card--wide .company-profile-card {
  padding: 16px 18px;
}
.settings-layout {
  display: grid;
  grid-template-columns: 148px 1fr;
  gap: 16px;
  align-items: start;
}
.settings-nav {
  display: grid;
  gap: 10px;
}
.settings-nav-section {
  display: grid;
  gap: 4px;
}
.settings-nav-section.hidden {
  display: none;
}
.output-profile-grid {
  display: grid;
  gap: 10px;
}
.settings-nav-heading {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #64748b;
  padding: 2px 4px 0;
}
.group-member-checks {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 6px 12px;
  max-height: 220px;
  overflow: auto;
  padding: 8px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
}
.group-member-checks label {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  margin: 0;
}
.user-group-bindings {
  grid-column: 1 / -1;
  display: grid;
  gap: 12px;
}
.user-group-bindings h6 {
  margin: 0 0 4px;
  font-size: 13px;
}
.entity-full-width {
  grid-column: 1 / -1;
}
.settings-nav-btn {
  width: 100%;
  text-align: left;
  background: #f8fafc;
  color: var(--text);
  border: 1px solid var(--line);
  padding: 10px 12px;
  font-size: 13px;
}
.settings-nav-btn.active {
  background: var(--primary-soft);
  border-color: #93c5fd;
  color: var(--primary);
  font-weight: 600;
}
.org-settings-grid {
  display: grid;
  gap: 16px;
}
.org-settings-block h5 {
  margin: 0 0 8px;
  font-size: 14px;
}
.org-settings-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}
.org-settings-head h5 {
  margin: 0;
}
.catalog-level-badge {
  display: inline-block;
  padding: 0.1rem 0.45rem;
  border-radius: 999px;
  font-size: 0.78rem;
  background: rgba(255, 255, 255, 0.08);
  color: var(--muted, #9aa0a6);
}
.product-catalog-settings-layout {
  display: grid;
  grid-template-columns: 300px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}
.catalog-tree-sidebar {
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-height: 360px;
}
.catalog-tree-head {
  display: grid;
  gap: 4px;
  flex-shrink: 0;
}
.catalog-tree-hint {
  margin: 0;
  font-size: 12px;
  line-height: 1.45;
}
.catalog-tree-title {
  margin: 0;
  font-size: 15px;
  font-weight: 700;
  color: #0f172a;
  letter-spacing: 0.02em;
}
.catalog-tree-nav {
  display: grid;
  gap: 1px;
  padding: 6px 4px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  max-height: calc(100vh - 260px);
  overflow: auto;
  flex: 1 1 auto;
}
.catalog-tree-footer {
  flex-shrink: 0;
  padding-top: 2px;
}
.catalog-tree-footer .catalog-add-l1-btn {
  width: 100%;
}
.catalog-tree-branch-l1[draggable="true"],
.catalog-tree-branch-l2[draggable="true"],
.catalog-tree-branch-l3[draggable="true"] {
  cursor: grab;
}
.catalog-tree-branch-l1.catalog-tree-dragging,
.catalog-tree-branch-l2.catalog-tree-dragging,
.catalog-tree-branch-l3.catalog-tree-dragging {
  opacity: 0.55;
  cursor: grabbing;
}
.catalog-tree-branch-l1.catalog-tree-drop-target,
.catalog-tree-branch-l2.catalog-tree-drop-target,
.catalog-tree-branch-l3.catalog-tree-drop-target {
  outline: 2px dashed #2563eb;
  outline-offset: 2px;
  border-radius: 6px;
}
.catalog-tree-branch {
  display: grid;
  gap: 0;
}
.catalog-tree-children {
  display: grid;
  gap: 0;
  padding-left: 0;
  border-left: 1px solid #e2e8f0;
  margin-left: 14px;
}
.catalog-tree-children.collapsed {
  display: none;
}
.catalog-tree-node {
  display: flex;
  align-items: center;
  gap: 4px;
  width: 100%;
  text-align: left;
  padding: 5px 6px 5px 6px;
  border: none;
  border-left: 3px solid transparent;
  border-radius: 0 6px 6px 0;
  background: transparent;
  cursor: pointer;
  font-size: 13px;
  line-height: 1.3;
  color: inherit;
}
.catalog-tree-node:hover {
  background: #f8fafc;
}
.catalog-tree-node.active {
  background: #eff6ff;
  border-left-color: #2563eb;
  font-weight: 600;
}
.catalog-tree-node-l1 {
  font-weight: 700;
}
.catalog-tree-node-l1 .catalog-tree-label {
  color: #0f172a;
}
.catalog-tree-node-l1.active .catalog-tree-label {
  color: #1d4ed8;
}
.catalog-tree-node-l2 .catalog-tree-label {
  font-weight: 600;
  color: #1e293b;
}
.catalog-tree-node-l2.active .catalog-tree-label {
  color: #2563eb;
}
.catalog-tree-node-l3 {
  padding-left: 10px;
  font-weight: 500;
}
.catalog-tree-node-l3 .catalog-tree-label {
  color: #334155;
}
.catalog-tree-node-l3.active {
  background: #f1f5f9;
  border-left-color: #64748b;
}
.catalog-tree-node-l3.active .catalog-tree-label {
  color: #0f172a;
  font-weight: 600;
}
.catalog-tree-toggle {
  flex-shrink: 0;
  width: 16px;
  height: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #64748b;
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  border-radius: 3px;
}
.catalog-tree-toggle:hover {
  background: #e2e8f0;
  color: #334155;
}
.catalog-tree-label {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  user-select: none;
}
.catalog-tree-add {
  flex-shrink: 0;
  opacity: 1;
  width: auto;
  min-width: 28px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: 600;
  line-height: 1;
  color: #475569;
  background: #f8fafc;
  border: 1px solid #cbd5e1;
  border-radius: 3px;
  cursor: pointer;
  padding: 0 4px;
  white-space: nowrap;
}
.catalog-tree-add:hover {
  background: #e2e8f0;
  color: #1e293b;
  border-color: #94a3b8;
}
.catalog-tree-reorder {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  flex-shrink: 0;
  opacity: 0;
  transition: opacity 0.12s ease;
  margin-left: 1px;
}
.catalog-reorder-btn {
  appearance: none;
  border: none;
  background: transparent;
  color: #94a3b8;
  width: 16px;
  height: 12px;
  padding: 0;
  line-height: 1;
  font-size: 9px;
  cursor: pointer;
  border-radius: 2px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.catalog-reorder-btn:hover {
  background: #e2e8f0;
  color: #475569;
}
.catalog-tree-node:hover .catalog-tree-reorder,
.catalog-tree-node.active .catalog-tree-reorder,
.catalog-tree-branch-l3:hover .catalog-tree-reorder {
  opacity: 1;
}
.catalog-tree-empty {
  padding: 12px;
  font-size: 13px;
}
.catalog-detail-panel {
  min-height: 360px;
}
.catalog-detail-panel.hidden {
  display: none !important;
}
.catalog-detail-empty-lead {
  margin: 0 0 10px;
  font-size: 13px;
  line-height: 1.5;
}
.catalog-detail-empty-steps {
  margin: 0;
  padding-left: 18px;
  font-size: 13px;
  line-height: 1.55;
}
.catalog-detail-empty-steps li + li {
  margin-top: 6px;
}
.catalog-edit-hint {
  margin: 0 0 12px;
  font-size: 12px;
  line-height: 1.45;
}
.catalog-i18n-heading {
  margin: 0 0 8px;
  font-size: 14px;
  font-weight: 600;
  color: #334155;
}
.catalog-metadata-row {
  margin-bottom: 12px;
}
.catalog-metadata-row-no-code {
  grid-template-columns: 1fr 1fr;
}
.catalog-detail-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 16px;
}
.catalog-detail-actions-right {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-left: auto;
  flex-wrap: wrap;
}
.catalog-seo-table {
  width: 100%;
  table-layout: fixed;
}
.catalog-seo-table th,
.catalog-seo-table td {
  vertical-align: middle;
  font-size: 13px;
  text-align: center;
}
.catalog-seo-table .catalog-seo-lang {
  width: 96px;
  white-space: nowrap;
  color: #334155;
  font-weight: 600;
  background: #f8fafc;
  text-align: center;
}
.catalog-seo-table input,
.catalog-seo-table textarea {
  width: 100%;
  box-sizing: border-box;
  text-align: center;
}
.catalog-seo-table textarea {
  min-height: 52px;
  resize: vertical;
}
.catalog-i18n-toolbar {
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: 10px 12px;
  margin-bottom: 10px;
}
.catalog-add-lang-field {
  display: grid;
  gap: 4px;
  font-size: 13px;
  min-width: 180px;
}
.catalog-add-lang-field select {
  min-width: 180px;
}
.catalog-i18n-toolbar-note {
  margin: 0 0 10px;
  font-size: 12px;
}
.catalog-i18n-host {
  margin-top: 4px;
}
.catalog-seo-slug-cell {
  vertical-align: middle;
}
.catalog-seo-section {
  display: grid;
  gap: 10px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--line);
}
.catalog-seo-section h6 {
  margin: 0;
  font-size: 14px;
}
.catalog-seo-lang-block {
  display: grid;
  gap: 8px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fafafa;
}
.catalog-seo-lang-block strong {
  font-size: 13px;
}
@media (max-width: 900px) {
  .product-catalog-settings-layout {
    grid-template-columns: 1fr;
  }
}
.catalog-tree-table .catalog-tree-row {
  cursor: pointer;
}
.catalog-tree-table .catalog-tree-row.catalog-row-active td {
  background: rgba(96, 165, 250, 0.08);
}
.department-tree-table .dept-tree-name {
  white-space: nowrap;
  color: #64748b;
  font-size: 13px;
}
.department-tree-table col.dept-col-name {
  width: 10%;
}
.department-tree-table col.dept-col-role {
  width: 72px;
}
.department-tree-table col.dept-col-menu {
  width: auto;
}
.department-tree-table .dept-name-cell {
  max-width: 140px;
}
.department-tree-table .dept-name-input {
  width: 100%;
  max-width: 140px;
}
.department-tree-table .dept-note-input {
  width: 100%;
  min-width: 120px;
}
.department-tree-table .dept-row td {
  border-bottom: none;
  padding-bottom: 4px;
}
.department-tree-table .dept-role-row td {
  border-top: none;
  padding-top: 2px;
  padding-bottom: 10px;
  vertical-align: top;
}
.department-tree-table .dept-role-row + .dept-row td,
.department-tree-table .dept-row + .dept-role-row td {
  border-top: 1px solid var(--line);
}
.department-tree-table .dept-role-label-cell {
  white-space: nowrap;
  font-size: 13px;
}
.department-tree-table .dept-role-label {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 6px;
  background: #f1f5f9;
  color: #334155;
  font-weight: 600;
}
.department-tree-table .dept-menu-perms {
  min-width: 360px;
  max-width: none;
  max-height: none;
  overflow: visible;
  vertical-align: top;
}
.department-tree-table .dept-menu-perms-empty {
  font-size: 13px;
}
.department-settings-table-wrap {
  overflow-x: auto;
}
.org-settings-block--departments {
  min-width: 0;
}
.org-settings-block--roles-legend {
  margin-top: 4px;
}
.dept-role-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 20px;
  font-size: 13px;
  color: #64748b;
}
.dept-role-legend-item strong {
  color: #334155;
  margin-right: 4px;
}
.dept-menu-check-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(88px, 1fr));
  gap: 4px 10px;
}
.dept-menu-check-grid label {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  white-space: nowrap;
  cursor: pointer;
}
.dept-menu-check-grid input[type="checkbox"] {
  margin: 0;
  flex-shrink: 0;
}
.user-enabled-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
}
.user-enabled-badge.on {
  background: #dcfce7;
  color: #166534;
}
.user-enabled-badge.off {
  background: #f1f5f9;
  color: #64748b;
}
.login-modal-card {
  width: min(420px, 100%);
}
.login-screen {
  position: fixed;
  inset: 0;
  z-index: 3000;
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px 24px;
  background:
    radial-gradient(ellipse 80% 60% at 20% 10%, rgba(96, 165, 250, 0.35), transparent 55%),
    radial-gradient(ellipse 70% 50% at 90% 80%, rgba(45, 212, 191, 0.2), transparent 50%),
    linear-gradient(145deg, #0f172a 0%, #1e3a5f 42%, #1d4ed8 100%);
}
.login-screen.hidden { display: none !important; }
#appShell.hidden { display: none !important; }
body.auth-locked { overflow: hidden; }
.login-screen-inner {
  width: min(920px, 100%);
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, 400px);
  gap: clamp(32px, 6vw, 64px);
  align-items: center;
}
.login-brand {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  color: #f8fafc;
}
.login-brand-mark {
  width: 56px;
  height: 56px;
  margin-bottom: 20px;
  color: #93c5fd;
}
.login-brand-logo {
  display: block;
  width: auto;
  max-width: min(180px, 100%);
  max-height: 56px;
  margin-bottom: 20px;
  object-fit: contain;
}
.login-brand-mark svg {
  width: 100%;
  height: 100%;
}
.login-brand-title {
  margin: 0 0 10px;
  font-size: clamp(1.35rem, 3.2vw, 1.65rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  line-height: 1.15;
  text-align: center;
}
.login-brand-subtitle {
  margin: 0;
  max-width: 28ch;
  font-size: clamp(1rem, 2.6vw, 1.2rem);
  font-weight: 700;
  text-align: center;
  line-height: 1.55;
  color: rgba(248, 250, 252, 0.88);
}
.login-card {
  background: #ffffff;
  border-radius: 20px;
  padding: 32px 28px;
  box-shadow:
    0 4px 6px -1px rgba(15, 23, 42, 0.08),
    0 25px 50px -12px rgba(15, 23, 42, 0.35);
}
.login-card-title {
  margin: 0 0 6px;
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--text);
  letter-spacing: -0.02em;
}
.login-card-lead {
  margin: 0 0 22px;
  font-size: 0.95rem;
  line-height: 1.5;
  color: var(--muted);
}
.login-password-label-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.login-forgot-link {
  border: 0;
  padding: 0;
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  color: var(--primary);
  background: transparent;
  cursor: pointer;
  text-decoration: none;
}
.login-forgot-link:hover {
  text-decoration: underline;
}
.login-forgot-modal-card {
  width: min(420px, 100%);
}
#forgotPasswordModal {
  z-index: 3100;
}
.login-forgot-message {
  margin: 0;
  padding: 10px 12px;
  border-radius: 8px;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  color: #1e40af;
  font-size: 13px;
  line-height: 1.45;
}
.login-forgot-message.hidden {
  display: none !important;
}
.login-form,
.profile-form {
  display: grid;
  gap: 16px;
}
.login-field,
.login-form label,
.profile-form label {
  display: grid;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
}
.login-field span {
  font-size: 12px;
  letter-spacing: 0.02em;
}
.login-form input,
.profile-form input {
  font-weight: 400;
  padding: 11px 13px;
  border: 1px solid var(--line);
  border-radius: 10px;
  font-size: 15px;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.login-form input:focus,
.profile-form input:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.15);
}
.login-submit-btn {
  margin-top: 4px;
  width: 100%;
  padding: 12px 16px;
  font-size: 15px;
  font-weight: 600;
  border: none;
  border-radius: 10px;
  background: var(--primary);
  color: #fff;
  cursor: pointer;
  transition: background 0.15s ease, transform 0.1s ease;
}
.login-submit-btn:hover:not(:disabled) {
  background: #1e40af;
}
.login-submit-btn:active:not(:disabled) {
  transform: translateY(1px);
}
.login-submit-btn:disabled {
  opacity: 0.65;
  cursor: wait;
}
.login-error {
  margin: 0;
  padding: 10px 12px;
  border-radius: 8px;
  background: #fef2f2;
  border: 1px solid #fecaca;
  color: #b91c1c;
  font-size: 13px;
  line-height: 1.45;
}
@media (max-width: 768px) {
  .login-screen-inner {
    grid-template-columns: 1fr;
    gap: 28px;
  }
  .login-brand {
    text-align: center;
  }
  .login-brand-mark {
    margin-left: auto;
    margin-right: auto;
  }
  .login-brand-subtitle {
    max-width: none;
    margin-left: auto;
    margin-right: auto;
  }
}
.profile-settings-grid {
  display: grid;
  grid-template-columns: minmax(220px, 280px) 1fr;
  gap: 16px;
  align-items: start;
}
.panel-lite {
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #f8fafc;
}
.profile-stat-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 8px 0;
  border-bottom: 1px solid var(--line);
  font-size: 13px;
}
.profile-stat-row:last-child {
  border-bottom: 0;
}
.profile-stat-label {
  color: var(--muted);
}
.profile-password-block {
  display: grid;
  gap: 12px;
  padding-top: 4px;
  border-top: 1px dashed var(--line);
}
.profile-form-column {
  display: grid;
  gap: 16px;
}
.profile-recent-logs h5 {
  margin: 0 0 10px;
  font-size: 14px;
}
.profile-recent-log-list {
  display: grid;
  gap: 8px;
  font-size: 12px;
  line-height: 1.45;
}
.profile-recent-log-item {
  display: grid;
  gap: 2px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--line);
}
.profile-recent-log-item:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}
.usage-log-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  align-items: flex-end;
  margin-bottom: 10px;
}
.usage-log-filters label {
  display: grid;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
}
.usage-log-filters select,
.usage-log-filters input {
  min-width: 160px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font-weight: 400;
}
.usage-log-summary {
  margin: 0 0 8px;
  font-size: 13px;
}
.usage-log-table-wrap {
  max-height: 420px;
  overflow: auto;
}
.usage-log-table td,
.usage-log-table th {
  font-size: 12px;
  white-space: nowrap;
}
.usage-log-table td:last-child {
  white-space: normal;
  min-width: 180px;
}
.usage-log-pagination {
  display: flex;
  gap: 12px;
  align-items: center;
  margin-top: 12px;
}
@media (max-width: 720px) {
  .profile-settings-grid {
    grid-template-columns: 1fr;
  }
}
.settings-panel-head {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
}
.settings-panel h4,
.settings-panel-head h4 {
  margin: 0;
  font-size: 16px;
}
.settings-tip {
  margin: 0 0 12px;
  font-size: 13px;
  line-height: 1.5;
}
.settings-table-wrap {
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 10px;
}
.settings-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
}
.settings-table th,
.settings-table td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--line);
  text-align: left;
}
.settings-table th {
  background: #f8fafc;
  font-weight: 600;
}
.settings-row-actions {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}
.settings-panel-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.settings-supplier-list {
  display: grid;
  gap: 14px;
}
.settings-master-wrap {
  margin-bottom: 14px;
  max-height: calc(92vh - 220px);
  overflow: auto;
}
.settings-country-picker {
  max-width: 420px;
}
.settings-country-picker label {
  display: grid;
  gap: 6px;
  font-size: 13px;
}
.settings-country-picker select {
  padding: 8px 10px;
}
.settings-master-data-type-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 12px;
}
.settings-master-data-type-bar .master-data-type-btn.active {
  background: #1d4ed8;
  color: #fff;
  border-color: #1d4ed8;
}
.hs-codes-search-field {
  display: block;
  margin: 0 0 12px;
  max-width: 420px;
}
.hs-codes-search-field input {
  width: 100%;
  margin-top: 4px;
}
.hs-codes-table input {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}
.hs-codes-table .hs-rebate-input {
  max-width: 96px;
}
.hs-code-actions {
  width: 72px;
  white-space: nowrap;
}
.master-data-matrix-wrap {
  overflow-x: auto;
  max-width: 100%;
}
.master-data-matrix {
  min-width: 640px;
  width: max-content;
  max-width: none;
}
.master-data-matrix th,
.master-data-matrix td {
  vertical-align: middle;
}
.master-data-matrix .master-matrix-lang {
  white-space: nowrap;
  font-weight: 600;
  min-width: 88px;
}
.master-data-matrix .master-matrix-code-head {
  min-width: 0;
  max-width: 144px;
  width: 12ch;
}
.master-data-matrix .master-matrix-code-head input {
  width: 100%;
  max-width: 144px;
  min-width: 0;
  font-weight: 600;
  font-size: 12px;
  padding: 4px 5px;
}
.master-data-matrix .master-matrix-cell {
  min-width: 0;
  max-width: 144px;
  width: 12ch;
}
.master-data-matrix .master-matrix-cell input {
  width: 100%;
  max-width: 144px;
  min-width: 0;
  font-size: 12px;
  padding: 4px 5px;
}
.master-data-matrix .master-matrix-delete-col {
  margin-top: 4px;
  padding: 2px 6px;
  font-size: 11px;
}
.geo-settings-layout {
  display: grid;
  grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}
.geo-country-list {
  max-height: 520px;
  overflow: auto;
}
.geo-country-search {
  margin-bottom: 10px;
}
.geo-country-search input {
  width: 100%;
}
.geo-continent-group {
  margin-bottom: 8px;
}
.geo-continent-header {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 7px 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: #fff;
  color: var(--text);
  cursor: pointer;
  font-size: 13px;
  font-weight: 600;
  text-align: left;
}
.geo-continent-header:hover {
  background: #f1f5f9;
  border-color: #cbd5e1;
}
.geo-continent-toggle {
  width: 14px;
  color: var(--muted);
  flex-shrink: 0;
}
.geo-continent-label {
  flex: 1;
  color: var(--text);
  font-weight: 600;
}
.geo-continent-count {
  font-size: 11px;
  font-weight: 400;
  color: var(--muted);
}
.geo-continent-countries {
  display: grid;
  gap: 2px;
  margin-top: 4px;
  padding-left: 4px;
}
.geo-country-item {
  display: grid;
  gap: 2px;
  width: 100%;
  text-align: left;
  padding: 8px 10px;
  border: 1px solid transparent;
  border-radius: 6px;
  background: #fff;
  color: var(--text);
  cursor: pointer;
  font-size: 13px;
  font-weight: 400;
}
.geo-country-item-line {
  display: flex;
  align-items: baseline;
  gap: 6px;
  flex-wrap: wrap;
}
.geo-country-item:hover {
  background: #f1f5f9;
  border-color: var(--line);
}
.geo-country-item.active {
  background: #eff6ff;
  border-color: #93c5fd;
}
.geo-country-item.active .geo-country-item-name {
  color: var(--primary);
  font-weight: 600;
}
.geo-country-item-name {
  font-size: 13px;
  font-weight: 500;
  color: #1a1a1a;
}
.geo-country-item-code,
.geo-country-item-count {
  font-size: 11px;
  color: var(--muted);
}
.geo-country-item.active .geo-country-item-code,
.geo-country-item.active .geo-country-item-count {
  color: #475569;
}
.geo-country-detail {
  min-height: 200px;
}
.geo-country-detail-card h5 {
  margin: 0 0 12px;
}
.geo-country-meta-table-wrap {
  margin-bottom: 16px;
}
.geo-country-meta-table input {
  width: 100%;
  min-width: 0;
  padding: 6px 8px;
  font-size: 13px;
}
.geo-country-meta-table input[readonly] {
  background: #f8fafc;
  color: var(--muted, #64748b);
}
.geo-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 14px 0 8px;
}
.geo-section-title {
  margin: 0;
  font-size: 14px;
}
.geo-list-count {
  font-size: 12px;
}
.geo-table-wrap {
  margin-bottom: 12px;
}
.geo-col-index {
  width: 52px;
  text-align: center;
}
.geo-col-actions {
  width: 72px;
}
.geo-provinces-table input,
.geo-ports-table input {
  width: 100%;
  min-width: 0;
  padding: 6px 8px;
  font-size: 13px;
}
.geo-row-index {
  text-align: center;
  color: var(--muted, #64748b);
  font-variant-numeric: tabular-nums;
}
.settings-master-table .settings-master-row {
  cursor: pointer;
}
.settings-master-table .settings-master-row:hover,
.settings-master-table .settings-master-row.active {
  background: #eff6ff;
}
.settings-cell-wrap {
  max-width: 220px;
  word-break: break-word;
}
.settings-detail-panel {
  margin-top: 4px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}
.settings-detail-panel.hidden {
  display: none !important;
}
.template-settings-layout {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 14px;
  align-items: start;
}
.template-settings-list {
  display: grid;
  gap: 8px;
}
.template-settings-item {
  display: grid;
  gap: 4px;
  text-align: left;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  cursor: pointer;
}
.template-settings-item.active,
.template-settings-item:hover {
  border-color: #93c5fd;
  background: #eff6ff;
}
.template-settings-item-name {
  font-size: 14px;
  font-weight: 600;
}
.template-settings-item-meta {
  font-size: 12px;
  color: var(--muted);
}
.template-settings-editor {
  display: grid;
  gap: 12px;
  min-height: 420px;
}
.template-editor-head {
  display: grid;
  gap: 6px;
}
.template-editor-head h5 {
  margin: 0;
}
.template-editor-label {
  display: grid;
  gap: 6px;
  font-size: 13px;
}
.template-editor-label input,
.template-editor-label textarea {
  width: 100%;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font: inherit;
  box-sizing: border-box;
}
.template-editor-label textarea {
  font-family: Consolas, "Courier New", monospace;
  font-size: 12px;
  line-height: 1.5;
  resize: vertical;
}
.template-editor-syntax {
  margin: 0;
  font-size: 12px;
}
.template-editor-syntax code {
  font-size: 11px;
}
.customer-form-stack {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 14px;
}
.customer-form-row {
  display: grid;
  gap: 12px 16px;
}
.customer-form-row--2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.customer-form-row--4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.customer-form-row--8 {
  grid-template-columns: repeat(8, minmax(0, 1fr));
}
.customer-form-row--span2 {
  grid-column: span 2;
}
.customer-form-row--span4 {
  grid-column: span 4;
}
.customer-form-row--10 {
  grid-template-columns: repeat(10, minmax(0, 1fr));
}
.supplier-basic-section .entity-section-title {
  margin-bottom: 4px;
}
.supplier-basic-fields {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.supplier-basic-mail-row label:last-child {
  grid-column: span 2;
}
.customer-form-row--full {
  grid-template-columns: 1fr;
}
.customer-form-row label {
  display: grid;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
}
.customer-form-row input,
.customer-form-row select,
.customer-form-row textarea {
  font-weight: 400;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: 13px;
}
.customer-settings-meta {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
}
.customer-settings-meta label {
  display: grid;
  gap: 6px;
  font-size: 13px;
}
.customer-settings-meta input {
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: 13px;
}
.customer-settings-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}
.settings-detail-title {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.settings-detail-title h5 {
  margin: 0;
}
.customer-notes-label {
  display: grid;
  gap: 6px;
  font-size: 13px;
}
.customer-notes-label input {
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
}
.customer-supplier-auth {
  display: grid;
  gap: 8px;
}
.customer-supplier-auth-label {
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
}
.customer-supplier-auth-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.entity-fields-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(220px, 1fr));
  gap: 12px 16px;
  margin: 12px 0;
}
.entity-fields-grid label,
.customer-settings-meta label,
.supplier-mail-defaults label {
  display: grid;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
}
.entity-fields-grid input,
.entity-fields-grid textarea,
.customer-settings-meta input,
.supplier-mail-defaults input,
.supplier-mail-defaults select {
  font-weight: 400;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: 14px;
  width: 100%;
  box-sizing: border-box;
}
.entity-section {
  margin-top: 12px;
}
.entity-section-title {
  font-size: 14px;
  font-weight: 700;
  margin-bottom: 8px;
}
.settings-collapsible-section {
  border: 1px solid var(--line);
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
}
.settings-collapsible-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  padding: 10px 12px;
  border: 0;
  background: #f8fafc;
  color: var(--text);
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
}
.settings-collapsible-head:hover { background: #eff6ff; }
.settings-collapsible-chevron {
  flex: 0 0 auto;
  font-size: 12px;
  line-height: 1;
  color: var(--muted);
}
.settings-collapsible-body {
  display: grid;
  gap: 12px;
  padding: 12px;
}
.settings-collapsible-body.collapsed { display: none; }
.settings-collapsible-body .customer-form-stack {
  gap: 12px;
}
.attachment-list {
  list-style: none;
  padding: 0;
  margin: 0 0 10px;
  display: grid;
  gap: 8px;
}
.attachment-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
  font-size: 13px;
}
.company-default-wrap {
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
  gap: 8px;
  font-weight: 600;
}
.print-company-header {
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--line);
}
.print-company-name {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 6px;
}
.print-company-meta {
  font-size: 13px;
  color: var(--muted);
  line-height: 1.5;
}
.data-root-banner {
  display: grid;
  gap: 6px;
  margin-bottom: 14px;
}
.data-root-label {
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
}
.data-root-path {
  display: block;
  padding: 10px 12px;
  border-radius: 8px;
  background: #f8fafc;
  border: 1px solid var(--line);
  font-size: 12px;
  word-break: break-all;
  white-space: pre-wrap;
}
.print-company-setting {
  margin-bottom: 14px;
}
.print-company-setting label {
  display: grid;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
}
.print-company-setting select {
  font-weight: 400;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: 14px;
  max-width: 320px;
}
.print-company-setting .settings-tip {
  margin: 8px 0 0;
}
.backup-dir-field {
  display: grid;
  gap: 6px;
  margin: 10px 0 12px;
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
}
.backup-dir-field input {
  font-weight: 400;
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  font-size: 14px;
}
.backup-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
.backup-status {
  margin: 10px 0 0;
  white-space: pre-wrap;
  line-height: 1.5;
  font-size: 12px;
}
@media (max-width: 1100px) {
  .customer-form-row--4,
  .customer-form-row--8,
  .customer-form-row--10 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .supplier-basic-mail-row label:last-child {
    grid-column: span 1;
  }
}
@media (max-width: 900px) {
  .entity-fields-grid {
    grid-template-columns: 1fr;
  }
  .customer-form-row--2 {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 640px) {
  .customer-form-row--4,
  .customer-form-row--8,
  .customer-form-row--10 {
    grid-template-columns: 1fr;
  }
}
.customer-supplier-check-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 8px;
}
.customer-supplier-check {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  font-size: 13px;
}
.customer-supplier-check input {
  margin: 0;
}
.supplier-settings-card {
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 14px;
  background: #fff;
  display: grid;
  gap: 12px;
}
.supplier-settings-card h5 {
  margin: 0;
  font-size: 15px;
}
.customer-companies-table input,
.supplier-contacts-table input {
  width: 100%;
  box-sizing: border-box;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  font-size: 13px;
}
.supplier-mail-defaults {
  display: grid;
  gap: 10px;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
}
.supplier-mail-defaults label {
  display: grid;
  gap: 6px;
  font-size: 13px;
}
.supplier-mail-defaults select,
.supplier-mail-defaults input {
  padding: 8px 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
}
.settings-action-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 10px;
}
.settings-action-btn {
  width: 100%;
  justify-content: center;
}
.btn-mini {
  padding: 6px 10px;
  font-size: 12px;
}
.modal-close {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 32px;
  height: 32px;
  padding: 0;
  border-radius: 999px;
  font-size: 20px;
  line-height: 1;
}
.modal-fullscreen-btn {
  position: absolute;
  top: 10px;
  right: 48px;
  width: 32px;
  height: 32px;
  padding: 0;
  border-radius: 999px;
  font-size: 16px;
  line-height: 1;
}
.modal-card h3 { margin: 0; }
.save-confirm-modal {
  z-index: 120;
}
.save-confirm-modal-card {
  width: min(420px, 100%);
  text-align: center;
  padding: 22px 24px 20px;
}
.save-confirm-modal-message {
  font-size: 15px;
  color: #334155;
}
.save-confirm-modal-actions {
  justify-content: center;
  gap: 12px;
  margin-top: 4px;
}
.save-confirm-modal-actions button {
  min-width: 96px;
}
.draft-convert-confirm-modal {
  z-index: 120;
}
.draft-convert-confirm-modal-card {
  width: min(560px, 100%);
  padding: 20px 22px 18px;
}
.draft-convert-confirm-intro {
  margin: 8px 0 12px;
  color: #64748b;
  font-size: 14px;
}
.draft-convert-summary {
  margin: 0;
}
.draft-convert-summary .orders-detail-summary-grid {
  gap: 10px 20px;
}
.draft-convert-warning {
  margin: 0 0 12px;
  padding: 8px 12px;
  border: 1px solid #fcd34d;
  border-radius: 8px;
  background: #fffbeb;
  color: #92400e;
  font-size: 13px;
  line-height: 1.45;
}
.draft-convert-remarks {
  margin: 12px 0 0;
  padding-top: 10px;
  border-top: 1px solid #e2e8f0;
}
.draft-convert-remarks-text {
  margin: 6px 0 0;
  color: #334155;
  font-size: 13px;
  line-height: 1.5;
  white-space: pre-wrap;
}
.draft-convert-confirm-actions {
  justify-content: flex-end;
  gap: 12px;
  margin-top: 16px;
}
.draft-convert-confirm-actions button {
  min-width: 112px;
}
.inquiry-task-note-label {
  flex: 0 1 auto;
  max-width: none;
}
.inquiry-task-note-input {
  width: 12rem;
  min-height: 0;
  line-height: 1.45;
}
.modal-tip { margin: 0; line-height: 1.5; }
.modal-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.modal-field label {
  font-size: 14px;
  font-weight: 600;
}
.modal-field input,
.modal-field select {
  width: 100%;
  min-height: 42px;
  padding: 9px 10px;
  font-size: 14px;
  background: #fff;
  box-sizing: border-box;
}
.modal-field select {
  appearance: auto;
  cursor: pointer;
}
.modal-field input[type="file"] {
  padding: 8px;
  min-height: auto;
}

.warehouse-panel-head { align-items: center; }
.warehouse-panel-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}
.warehouse-filter-bar {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 12px;
}
#warehouseLocationFilters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}
.warehouse-filter-divider {
  width: 1px;
  height: 18px;
  background: var(--line);
  margin: 0 4px;
}
.warehouse-filter-label {
  font-size: 13px;
  color: var(--muted);
}
.warehouse-storage-fee-setting {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  margin-left: auto;
}
.warehouse-storage-fee-input {
  width: 7rem;
  padding: 4px 8px;
  font-size: 13px;
}
.warehouse-storage-fee-status {
  font-size: 12px;
  white-space: nowrap;
}
.warehouse-storage-age-warn {
  color: #c2410c;
  font-weight: 600;
}
.warehouse-storage-location-input {
  min-width: 4.5rem;
  max-width: 7.5rem;
}
.warehouse-storage-zone-cell,
.warehouse-storage-bin-cell {
  min-width: 5rem;
}
.warehouse-view-btn,
.warehouse-filter-btn {
  padding: 6px 12px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  color: var(--text);
  font-size: 13px;
  cursor: pointer;
}
.warehouse-view-btn.active,
.warehouse-filter-btn.active {
  background: #dbeafe;
  border-color: #93c5fd;
  color: #1d4ed8;
}
.warehouse-filter-btn:disabled,
.warehouse-filter-btn.is-readonly {
  opacity: 0.45;
  cursor: not-allowed;
  background: #f3f4f6;
  border-color: #e5e7eb;
  color: #9ca3af;
}
.warehouse-filter-btn:disabled.active,
.warehouse-filter-btn.is-readonly.active {
  background: #e5e7eb;
  border-color: #d1d5db;
  color: #6b7280;
}
.pre-shipment-list.is-readonly {
  opacity: 0.92;
}
.pre-shipment-list.is-readonly .pre-shipment-card-head {
  cursor: pointer;
}
.warehouse-line-row.warehouse-line-readonly td {
  color: #6b7280;
}
.warehouse-filter-btn.warehouse-pill,
.warehouse-location-btn.warehouse-pill {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  min-width: 134px;
  padding: 8px 14px;
  line-height: 1.25;
  text-align: center;
  border-radius: 12px;
}
.warehouse-location-btn.warehouse-pill {
  min-width: 152px;
  gap: 4px;
  padding: 8px 12px 6px;
}
.warehouse-pill-name {
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
}
.warehouse-pill-stats {
  font-size: 12px;
  font-weight: 500;
  line-height: 1.2;
  opacity: 0.88;
}
.warehouse-pill-stats-rows {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 2px;
  width: 100%;
}
.warehouse-pill-stats-row {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 4px;
  font-size: 11px;
  line-height: 1.15;
  white-space: nowrap;
}
.warehouse-pill-stats-label {
  flex-shrink: 0;
  font-size: 10px;
  font-weight: 600;
  opacity: 0.72;
}
.warehouse-pill-stats-value {
  font-weight: 500;
}
.warehouse-pill-stats-scheduled .warehouse-pill-stats-label {
  color: #1d4ed8;
}
.warehouse-pill-stats-actual .warehouse-pill-stats-label {
  color: #15803d;
}
.warehouse-pill-stats-expected .warehouse-pill-stats-label {
  color: #b45309;
}
.warehouse-filter-btn.warehouse-pill.active .warehouse-pill-stats,
.warehouse-location-btn.warehouse-pill.active .warehouse-pill-stats {
  opacity: 1;
}
.warehouse-location-btn.warehouse-pill.active .warehouse-pill-stats-label {
  opacity: 0.92;
}
.warehouse-location-btn.warehouse-pill.active .warehouse-pill-stats-scheduled .warehouse-pill-stats-label {
  color: inherit;
}
.warehouse-location-btn.warehouse-pill.active .warehouse-pill-stats-actual .warehouse-pill-stats-label {
  color: inherit;
}
.warehouse-location-btn.warehouse-pill.active .warehouse-pill-stats-expected .warehouse-pill-stats-label {
  color: inherit;
}
.warehouse-location-btn.warehouse-pill-all {
  background: #f8fafc;
  border-color: #cbd5e1;
  color: #334155;
}
.warehouse-location-btn.warehouse-pill-all.active {
  background: #e2e8f0;
  border-color: #94a3b8;
  color: #0f172a;
}
.warehouse-location-btn.warehouse-pill-yiwu {
  background: #f0fdf4;
  border-color: #bbf7d0;
  color: #166534;
}
.warehouse-location-btn.warehouse-pill-yiwu.active {
  background: #22c55e;
  border-color: #16a34a;
  color: #fff;
}
.warehouse-location-btn.warehouse-pill-chaoshan {
  background: #eff6ff;
  border-color: #bfdbfe;
  color: #1e40af;
}
.warehouse-location-btn.warehouse-pill-chaoshan.active {
  background: #3b82f6;
  border-color: #2563eb;
  color: #fff;
}
.warehouse-location-btn.warehouse-pill-yangjiang {
  background: #fff7ed;
  border-color: #fed7aa;
  color: #c2410c;
}
.warehouse-location-btn.warehouse-pill-yangjiang.active {
  background: #f97316;
  border-color: #ea580c;
  color: #fff;
}
.warehouse-location-btn.warehouse-pill-jiangmen {
  background: #fefce8;
  border-color: #fde047;
  color: #a16207;
}
.warehouse-location-btn.warehouse-pill-jiangmen.active {
  background: #eab308;
  border-color: #ca8a04;
  color: #fff;
}
.warehouse-location-btn.warehouse-pill-qingdao {
  background: #fef2f2;
  border-color: #fecaca;
  color: #b91c1c;
}
.warehouse-location-btn.warehouse-pill-qingdao.active {
  background: #ef4444;
  border-color: #dc2626;
  color: #fff;
}
.warehouse-location-btn.warehouse-pill-nanjing {
  background: #efebe9;
  border-color: #d7ccc8;
  color: #5d4037;
}
.warehouse-location-btn.warehouse-pill-nanjing.active {
  background: #795548;
  border-color: #6d4c41;
  color: #fff;
}
.warehouse-location-btn.warehouse-pill-chongqing {
  background: #f5f3ff;
  border-color: #ddd6fe;
  color: #6d28d9;
}
.warehouse-location-btn.warehouse-pill-chongqing.active {
  background: #7c3aed;
  border-color: #6d28d9;
  color: #fff;
}
.warehouse-orders-select-head,
.warehouse-orders-select-cell {
  width: 2.25rem;
  min-width: 2.25rem;
  max-width: 2.25rem;
  text-align: center;
  vertical-align: middle;
}
.warehouse-orders-select-head input,
.warehouse-orders-select-cell input {
  margin: 0;
}
.warehouse-order-row.active {
  background: #f8fafc;
}
.warehouse-order-detail-row td {
  padding: 0 0 12px;
  background: #fafbfc;
}
.warehouse-order-detail-wrap {
  padding: 8px 12px 4px;
}
.warehouse-order-status-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.warehouse-order-status-pill {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 12px;
  background: #f1f5f9;
  color: #475569;
}
.warehouse-status-pill-pending,
.warehouse-status-badge.not-ready {
  background: #fef3c7;
  color: #92400e;
}
.warehouse-status-pill-instock,
.warehouse-status-badge.in-stock {
  background: #dbeafe;
  color: #1e40af;
}
.warehouse-status-pill-outbound,
.warehouse-status-badge.scheduled {
  background: #dcfce7;
  color: #166534;
}
.warehouse-status-pill-returned,
.warehouse-status-badge.returned {
  background: #fee2e2;
  color: #b91c1c;
}
.warehouse-summary-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 12px;
}
.warehouse-status-filters {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
}
.warehouse-status-filters .warehouse-summary-bar {
  margin-bottom: 0;
  margin-left: 8px;
}
.warehouse-summary-row > .warehouse-summary-bar {
  margin-left: auto;
}
.warehouse-cancel-action-btn {
  border: 1px solid #2563eb;
  background: #eff6ff;
  color: #1d4ed8;
}
.warehouse-cancel-action-btn.warehouse-cancel-action-btn-idle:not(:disabled) {
  background: #2563eb;
  color: #fff;
  border-color: #2563eb;
}
.warehouse-cancel-action-btn.warehouse-cancel-action-btn-active:not(:disabled) {
  background: #2563eb;
  color: #fff;
  border-color: #2563eb;
}
.warehouse-cancel-action-btn:disabled:not(.warehouse-cancel-action-btn-idle) {
  background: #f1f5f9;
  border-color: #cbd5e1;
  color: #94a3b8;
}
.warehouse-partial-badge.return {
  background: #fee2e2;
  color: #b91c1c;
}
.warehouse-partial-badge.unstore {
  background: #fef3c7;
  color: #b45309;
}
.warehouse-summary-bar {
  padding: 10px 14px;
  border-radius: 10px;
  background: #f8fafc;
  border: 1px solid var(--line);
  font-size: 14px;
}
.warehouse-summary-bar.over-limit {
  background: #fef2f2;
  border-color: #fecaca;
  color: #b91c1c;
}
.warehouse-summary-bar.within-limit {
  background: #f0fdf4;
  border-color: #bbf7d0;
  color: #166534;
}
.warehouse-inventory-wrap { margin-bottom: 20px; }
.warehouse-status-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 12px;
  white-space: nowrap;
}
.warehouse-status-badge.budgeted {
  background: #ccfbf1;
  color: #0f766e;
}
.warehouse-return-note {
  margin-top: 4px;
  font-size: 11px;
  max-width: 160px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.warehouse-line-table-scroll {
  overflow-x: auto;
  max-width: 100%;
}
.warehouse-orders-table-scroll {
  overflow-x: auto;
  max-width: 100%;
}
.warehouse-orders-table {
  min-width: 1800px;
}
.warehouse-orders-table th,
.warehouse-orders-table td {
  vertical-align: middle;
}
.warehouse-orders-table th.warehouse-orders-text-head,
.warehouse-orders-table td.warehouse-orders-text-cell {
  text-align: center;
}
.warehouse-orders-table th.warehouse-orders-num-head,
.warehouse-orders-table td.warehouse-orders-num-cell {
  text-align: right;
}
.warehouse-orders-table th.warehouse-orders-confirm-head,
.warehouse-orders-table td.warehouse-orders-confirm-cell {
  min-width: 140px;
}
.warehouse-orders-table th.warehouse-orders-name-head,
.warehouse-orders-table td.warehouse-orders-name-cell {
  min-width: 160px;
}
.warehouse-orders-table td.warehouse-orders-name-cell {
  cursor: pointer;
  color: var(--accent, #2563eb);
}
.warehouse-orders-table td.warehouse-orders-name-cell:hover {
  text-decoration: underline;
}
.warehouse-orders-table th.warehouse-orders-po-head,
.warehouse-orders-table td.warehouse-orders-po-cell {
  min-width: 110px;
}
.warehouse-orders-table th.warehouse-orders-shipping-date-head,
.warehouse-orders-table td.warehouse-orders-shipping-date-cell {
  min-width: 120px;
}
.warehouse-orders-table th.warehouse-orders-warehouse-head,
.warehouse-orders-table td.warehouse-orders-warehouse-cell {
  min-width: 100px;
}
.warehouse-orders-table th {
  white-space: nowrap;
  font-size: 14px;
  font-weight: 600;
  background: #eef2ff;
  border-bottom: 2px solid #c7d2fe;
}
.warehouse-stocking-table {
  min-width: 1400px;
}
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) th,
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) td {
  vertical-align: middle;
}
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) .warehouse-stocking-text-head,
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) .warehouse-stocking-text-cell {
  text-align: center;
}
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) .warehouse-stocking-num-head,
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) .warehouse-stocking-num-cell {
  text-align: right;
}
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) .warehouse-stocking-input.warehouse-stocking-num {
  text-align: right;
}
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) th.warehouse-stocking-confirm-head,
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) td.warehouse-stocking-confirm-cell {
  min-width: 140px;
}
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) th.warehouse-stocking-receiving-head,
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) td.warehouse-stocking-receiving-cell {
  min-width: 120px;
}
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) th.warehouse-stocking-warehouse-head,
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) td.warehouse-stocking-warehouse-cell {
  min-width: 100px;
}
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) th.warehouse-stocking-order-name-head,
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) td.warehouse-stocking-order-name-cell {
  min-width: 240px;
}
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) th.warehouse-stocking-po-head,
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) td.warehouse-stocking-po-cell {
  min-width: 120px;
}
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) th.warehouse-stocking-huohao-head,
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) td.warehouse-stocking-huohao-col {
  min-width: 100px;
}
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) th.warehouse-stocking-image-head,
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) td.warehouse-stocking-image-col {
  width: 56px;
  min-width: 56px;
  max-width: 56px;
  text-align: center;
  padding: 4px;
}
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) .warehouse-stocking-line-thumb {
  width: 44px;
  height: 44px;
  object-fit: cover;
  border-radius: 4px;
  display: block;
  margin: 0 auto;
}
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) th.warehouse-stocking-display-name-head,
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) td.warehouse-stocking-display-name-col {
  min-width: 220px;
}
.warehouse-stocking-lines-table thead th.warehouse-stocking-group-head {
  text-align: center;
  font-size: 13px;
  font-weight: 700;
  border-bottom: 1px solid #c7d2fe;
}
.warehouse-stocking-lines-table .warehouse-stocking-actual-group-head {
  background: #ecfdf5;
  color: #065f46;
}
.warehouse-stocking-lines-table .warehouse-stocking-contract-group-head {
  background: #eff6ff;
  color: #1e40af;
}
.warehouse-stocking-lines-table .warehouse-stocking-actual-col,
.warehouse-stocking-lines-table .warehouse-stocking-actual-col .warehouse-stocking-input,
.warehouse-stocking-lines-table th.warehouse-stocking-actual-col {
  background: #f0fdf4;
}
.warehouse-stocking-lines-table .warehouse-stocking-contract-col,
.warehouse-stocking-lines-table .warehouse-stocking-contract-col .warehouse-stocking-input,
.warehouse-stocking-lines-table th.warehouse-stocking-contract-col {
  background: #f8fafc;
}
.warehouse-stocking-lines-table-frozen {
  overflow: visible;
  width: max-content;
  min-width: 100%;
}
.warehouse-stocking-lines-table-frozen .warehouse-stocking-lines-sticky-col {
  position: sticky;
  z-index: 2;
  background: #fff;
  background-clip: padding-box;
}
.warehouse-stocking-lines-table-frozen thead .warehouse-stocking-lines-sticky-col {
  z-index: 4;
  background: #eef2ff;
  background-clip: padding-box;
}
.warehouse-stocking-lines-table-frozen tbody tr:hover .warehouse-stocking-lines-sticky-col {
  background: #eff6ff;
}
.warehouse-stocking-lines-table-frozen .warehouse-stocking-lines-sticky-col-1 {
  left: var(--ws-lines-sticky-left-1, 0);
}
.warehouse-stocking-lines-table-frozen .warehouse-stocking-lines-sticky-col-2 {
  left: var(--ws-lines-sticky-left-2, 40px);
}
.warehouse-stocking-lines-table-frozen .warehouse-stocking-lines-sticky-col-3 {
  left: var(--ws-lines-sticky-left-3, 80px);
}
.warehouse-stocking-lines-table-frozen .warehouse-stocking-lines-sticky-col-4 {
  left: var(--ws-lines-sticky-left-4, 140px);
}
.warehouse-stocking-lines-table-frozen .warehouse-stocking-lines-sticky-col-5 {
  left: var(--ws-lines-sticky-left-5, 220px);
}
.warehouse-stocking-lines-table-frozen .warehouse-stocking-lines-sticky-col-6 {
  left: var(--ws-lines-sticky-left-6, 300px);
}
.warehouse-stocking-lines-table-frozen .warehouse-stocking-lines-sticky-col-7 {
  left: var(--ws-lines-sticky-left-7, 440px);
}
.warehouse-stocking-lines-table-frozen .warehouse-stocking-lines-sticky-col-8 {
  left: var(--ws-lines-sticky-left-8, 560px);
}
.warehouse-stocking-lines-table-frozen .warehouse-stocking-lines-sticky-col-9 {
  left: var(--ws-lines-sticky-left-9, 680px);
}
.warehouse-stocking-lines-table-frozen .warehouse-stocking-lines-sticky-col-10 {
  left: var(--ws-lines-sticky-left-10, 780px);
}
.warehouse-stocking-lines-table-frozen .warehouse-stocking-lines-sticky-col-edge {
  box-shadow: 2px 0 4px rgba(15, 23, 42, 0.08);
}
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) thead th {
  text-align: center;
  font-size: 13px;
  font-weight: 600;
  background: #eef2ff;
  border-bottom: 2px solid #c7d2fe;
  color: #1e293b;
  vertical-align: middle;
}
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) thead th.warehouse-stocking-num-head {
  text-align: center;
}
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) th.warehouse-stocking-recognition-head,
.warehouse-stocking-table:not(.warehouse-stocking-detail-table) td.warehouse-stocking-recognition-col {
  min-width: 240px;
  max-width: 360px;
}
.warehouse-stocking-table .warehouse-stocking-head {
  font-size: 11px;
  white-space: nowrap;
}
.warehouse-stocking-input {
  width: 72px;
  max-width: 100%;
  font-size: 12px;
  padding: 2px 4px;
}
.warehouse-stocking-input[data-field="remark"] {
  width: 100px;
}
.warehouse-stocking-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 10px;
}
.warehouse-stocking-actions-left,
.warehouse-stocking-actions-right {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px;
}
.warehouse-stocking-actions-right {
  margin-left: auto;
}
#createPreShipmentBtn.is-blocked,
#createPreShipmentBtn:disabled {
  opacity: 1;
  cursor: not-allowed;
  background: #94a3b8;
  border-color: #94a3b8;
  color: #f8fafc;
}
#createPreShipmentBtn.is-actionable:not(:disabled) {
  opacity: 1;
  cursor: pointer;
}
.warehouse-stocking-detail-modal-card {
  width: 95vw;
  max-width: 95vw;
  max-height: 90vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.warehouse-stocking-detail-modal-card.is-fullscreen {
  width: 100vw;
  max-width: 100vw;
  height: 100vh;
  max-height: 100vh;
  border-radius: 0;
}
.warehouse-stocking-detail-modal.warehouse-stocking-detail-modal-fullscreen {
  padding: 0;
  align-items: stretch;
}
#warehouseStockingDetailModalPartialFlags {
  flex-shrink: 0;
  overflow: visible;
  position: relative;
  z-index: 2;
}
.warehouse-stocking-modal-header {
  overflow: visible;
}
.warehouse-stocking-modal-header input,
.warehouse-stocking-modal-header select {
  pointer-events: auto;
}
.warehouse-stocking-modal-header-row:focus-within {
  position: relative;
  z-index: 3;
}
.warehouse-stocking-detail-modal-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
}
.warehouse-stocking-detail-modal-body .warehouse-line-table-scroll {
  max-height: none;
  overflow: auto;
}
.warehouse-stocking-detail-modal-body .warehouse-stocking-detail-table {
  overflow: visible;
}
.warehouse-stocking-detail-table.warehouse-stocking-detail-table-frozen {
  overflow: visible;
  width: max-content;
  min-width: 100%;
}
.warehouse-stocking-detail-table.warehouse-stocking-detail-table-frozen .warehouse-stocking-sticky-col {
  position: sticky;
  z-index: 2;
  background: #fff;
  background-clip: padding-box;
}
.warehouse-stocking-detail-table.warehouse-stocking-detail-table-frozen thead .warehouse-stocking-sticky-col {
  z-index: 4;
  background: #f8fafc;
  background-clip: padding-box;
}
.warehouse-stocking-detail-table.warehouse-stocking-detail-table-frozen tbody tr:hover .warehouse-stocking-sticky-col {
  background: #eff6ff;
}
.warehouse-stocking-detail-table.warehouse-stocking-detail-table-frozen tfoot .warehouse-stocking-sticky-col {
  background: #f8fafc;
  background-clip: padding-box;
}
.warehouse-stocking-detail-table.warehouse-stocking-detail-table-frozen .warehouse-stocking-sticky-col-1 {
  left: var(--ws-sticky-left-1, 0);
}
.warehouse-stocking-detail-table.warehouse-stocking-detail-table-frozen .warehouse-stocking-sticky-col-2 {
  left: var(--ws-sticky-left-2, 40px);
}
.warehouse-stocking-detail-table.warehouse-stocking-detail-table-frozen .warehouse-stocking-sticky-col-3 {
  left: var(--ws-sticky-left-3, 120px);
}
.warehouse-stocking-detail-table.warehouse-stocking-detail-table-frozen .warehouse-stocking-sticky-col-4 {
  left: var(--ws-sticky-left-4, 180px);
}
.warehouse-stocking-detail-table.warehouse-stocking-detail-table-frozen .warehouse-stocking-sticky-col-5 {
  left: var(--ws-sticky-left-5, 280px);
}
.warehouse-stocking-detail-table.warehouse-stocking-detail-table-frozen .warehouse-stocking-sticky-col-edge {
  box-shadow: 4px 0 8px -4px rgba(15, 23, 42, 0.12);
}
.warehouse-stocking-detail-modal-body .warehouse-stocking-detail-table th,
.warehouse-stocking-detail-modal-body .warehouse-stocking-detail-table td {
  vertical-align: middle;
}
.warehouse-save-stocking-btn {
  padding: 8px 22px;
  font-size: 14px;
  font-weight: 600;
  min-width: 108px;
  border-radius: 8px;
  cursor: pointer;
}
.warehouse-save-stocking-btn-dirty {
  background: #2563eb;
  color: #fff;
  border: 1px solid #2563eb;
}
.warehouse-save-stocking-btn-dirty:hover {
  background: #1d4ed8;
}
.warehouse-save-stocking-btn-clean {
  background: #e2e8f0;
  color: #475569;
  border: 1px solid #cbd5e1;
}
.warehouse-save-stocking-btn-clean:hover {
  background: #cbd5e1;
}
.warehouse-prepare-shipment-btn {
  padding: 8px 22px;
  font-size: 14px;
  font-weight: 600;
  min-width: 108px;
  border-radius: 8px;
  cursor: pointer;
  background: #2563eb;
  color: #fff;
  border: 1px solid #2563eb;
}
.warehouse-prepare-shipment-btn:hover:not(:disabled) {
  background: #1d4ed8;
}
.warehouse-prepare-shipment-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.warehouse-mark-ready-btn {
  padding: 8px 22px;
  font-size: 14px;
  font-weight: 600;
  min-width: 108px;
  border-radius: 8px;
  cursor: pointer;
}
.warehouse-mark-ready-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.warehouse-stocking-detail-modal-body .warehouse-stocking-detail-table .warehouse-stocking-text-head,
.warehouse-stocking-detail-modal-body .warehouse-stocking-detail-table .warehouse-stocking-text-cell {
  text-align: center;
}
.warehouse-stocking-detail-modal-body .warehouse-stocking-detail-table .warehouse-stocking-group-head {
  text-align: center;
  font-weight: 700;
  font-size: 13px;
  border-bottom: 1px solid #cbd5e1;
}
.warehouse-stocking-detail-modal-body .warehouse-stocking-actual-group-head {
  background: #bbf7d0;
  color: #15803d;
}
.warehouse-stocking-detail-modal-body .warehouse-stocking-contract-group-head {
  background: #eff6ff;
  color: #1e40af;
}
.warehouse-stocking-detail-modal-body .warehouse-stocking-vcenter-col {
  vertical-align: middle;
  text-align: center;
}
.warehouse-stocking-detail-modal-body .warehouse-stocking-huohao-col,
.warehouse-stocking-detail-modal-body .warehouse-stocking-huohao-head {
  min-width: 100px;
  width: 100px;
  max-width: 140px;
  text-align: center;
}
.warehouse-stocking-detail-modal-body .warehouse-stocking-display-name-head,
.warehouse-stocking-detail-modal-body .warehouse-stocking-display-name-col {
  min-width: 280px;
  width: 280px;
  max-width: 364px;
  overflow: visible;
  white-space: normal;
  word-break: break-word;
  text-align: center;
}
.warehouse-stocking-detail-modal-body .warehouse-stocking-display-name-head {
  white-space: normal;
}
.warehouse-stocking-detail-modal-body .warehouse-stocking-display-name-col .warehouse-stocking-line-identity-input {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  text-align: center;
}
.warehouse-stocking-detail-modal-body .warehouse-stocking-huohao-col .warehouse-stocking-line-identity-input,
.warehouse-stocking-detail-modal-body .warehouse-stocking-factory-model-col .warehouse-stocking-line-identity-input {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  text-align: center;
}
.warehouse-stocking-detail-modal-body .warehouse-stocking-factory-model-col,
.warehouse-stocking-detail-modal-body .warehouse-stocking-factory-model-head {
  min-width: 88px;
  width: 88px;
  max-width: 120px;
  text-align: center;
}
.warehouse-stocking-detail-modal-body .warehouse-stocking-recognition-head,
.warehouse-stocking-detail-modal-body .warehouse-stocking-recognition-col {
  min-width: 180px;
  max-width: 320px;
}
.warehouse-stocking-detail-modal-body .warehouse-stocking-purchase-price-col,
.warehouse-stocking-detail-modal-body .warehouse-stocking-actual-volume-col,
.warehouse-stocking-detail-modal-body th.warehouse-stocking-purchase-price-col,
.warehouse-stocking-detail-modal-body th.warehouse-stocking-actual-volume-col,
.warehouse-stocking-detail-modal-body .warehouse-stocking-actual-col.warehouse-stocking-purchase-price-col,
.warehouse-stocking-detail-modal-body .warehouse-stocking-actual-col.warehouse-stocking-actual-volume-col,
.warehouse-stocking-detail-modal-body th.warehouse-stocking-actual-col.warehouse-stocking-purchase-price-col,
.warehouse-stocking-detail-modal-body th.warehouse-stocking-actual-col.warehouse-stocking-actual-volume-col {
  text-align: right;
}
.warehouse-stocking-detail-modal-body .warehouse-stocking-purchase-price-col .warehouse-stocking-input,
.warehouse-stocking-detail-modal-body .warehouse-stocking-actual-volume-col .warehouse-stocking-input,
.warehouse-stocking-detail-modal-body .warehouse-stocking-actual-col.warehouse-stocking-purchase-price-col .warehouse-stocking-input,
.warehouse-stocking-detail-modal-body .warehouse-stocking-actual-col.warehouse-stocking-actual-volume-col .warehouse-stocking-input {
  text-align: right;
}
.warehouse-stocking-detail-modal-body .warehouse-stocking-actual-total-amount-col,
.warehouse-stocking-detail-modal-body .warehouse-stocking-actual-total-amount-col .warehouse-stocking-input {
  width: 102px;
  min-width: 102px;
  max-width: 118px;
}
.warehouse-stocking-detail-modal-body th.warehouse-stocking-actual-total-amount-col,
.warehouse-stocking-detail-modal-body td.warehouse-stocking-actual-total-amount-col {
  background-color: #fef9c3;
}
.warehouse-stocking-detail-modal-body td.warehouse-stocking-actual-total-amount-col .warehouse-stocking-input {
  background-color: #fef9c3;
}
.warehouse-stocking-detail-totals-row {
  background: #f8fafc;
  border-top: 2px solid #cbd5e1;
}
.warehouse-stocking-detail-totals-row td {
  font-weight: 600;
}
.warehouse-stocking-detail-totals-label {
  text-align: right;
  padding-right: 10px;
}
.warehouse-stocking-detail-totals-row [data-warehouse-detail-total="actualTotalAmount"] {
  background-color: #fef9c3;
}
#preShipmentDetailModalBody .warehouse-stocking-actual-total-amount-col,
#preShipmentDetailModalBody th.warehouse-stocking-actual-total-amount-col,
#preShipmentDetailModalBody td.warehouse-stocking-actual-total-amount-col {
  background-color: #fef9c3;
}
.pre-shipment-detail-totals-row [data-pre-shipment-detail-total="actualTotalAmount"] {
  background-color: #fef9c3;
}
.warehouse-stocking-detail-modal-body .warehouse-stocking-actual-col,
.warehouse-stocking-detail-modal-body .warehouse-stocking-actual-col .warehouse-stocking-input,
.warehouse-stocking-detail-modal-body th.warehouse-stocking-actual-col {
  width: 55px;
  min-width: 55px;
  max-width: 68px;
}
.warehouse-stocking-detail-modal-body .warehouse-stocking-contract-col,
.warehouse-stocking-detail-modal-body .warehouse-stocking-contract-col .warehouse-stocking-input,
.warehouse-stocking-detail-modal-body th.warehouse-stocking-contract-col {
  width: 55px;
  min-width: 55px;
  max-width: 68px;
}
.warehouse-stocking-detail-modal-body .warehouse-stocking-table .warehouse-stocking-num-cell,
.warehouse-stocking-detail-modal-body .warehouse-stocking-table .warehouse-stocking-num-head {
  text-align: right;
}
.warehouse-stocking-detail-modal-body .warehouse-stocking-table .warehouse-stocking-input.warehouse-stocking-num {
  text-align: right;
}
.warehouse-stocking-detail-modal-body .warehouse-stocking-actual-col.warehouse-stocking-num-cell,
.warehouse-stocking-detail-modal-body .warehouse-stocking-actual-col.warehouse-stocking-num-head,
.warehouse-stocking-detail-modal-body .warehouse-stocking-actual-col .warehouse-stocking-input.warehouse-stocking-num,
.warehouse-stocking-detail-modal-body .warehouse-stocking-contract-col.warehouse-stocking-num-cell,
.warehouse-stocking-detail-modal-body .warehouse-stocking-contract-col.warehouse-stocking-num-head,
.warehouse-stocking-detail-modal-body .warehouse-stocking-contract-col .warehouse-stocking-input.warehouse-stocking-num {
  text-align: right;
}
.warehouse-stocking-detail-modal-body .warehouse-stocking-actual-col.warehouse-stocking-text-cell,
.warehouse-stocking-detail-modal-body .warehouse-stocking-actual-col.warehouse-stocking-text-head,
.warehouse-stocking-detail-modal-body .warehouse-stocking-contract-col.warehouse-stocking-text-cell,
.warehouse-stocking-detail-modal-body .warehouse-stocking-contract-col.warehouse-stocking-text-head {
  text-align: center;
}
.warehouse-stocking-detail-modal-body th.warehouse-stocking-actual-col.warehouse-stocking-num-head,
.warehouse-stocking-detail-modal-body th.warehouse-stocking-contract-col.warehouse-stocking-num-head {
  text-align: center;
}
.warehouse-stocking-detail-modal-body .warehouse-stocking-actual-col .warehouse-stocking-input.warehouse-stocking-unit {
  min-width: 55px;
  max-width: 68px;
}
.warehouse-stocking-input.warehouse-stocking-num[type="number"]::-webkit-inner-spin-button,
.warehouse-stocking-input.warehouse-stocking-num[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.warehouse-stocking-input.warehouse-stocking-num[type="number"] {
  -moz-appearance: textfield;
  appearance: textfield;
}
.warehouse-stocking-modal-header {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 12px;
  padding: 12px 14px;
  border-radius: 10px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
}
.warehouse-stocking-modal-header-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  align-items: center;
}
.warehouse-stocking-modal-header-row-status,
.warehouse-stocking-modal-header-row-foreign {
  padding-top: 10px;
  border-top: 1px solid #e2e8f0;
}
.warehouse-stocking-modal-header-row-stats {
  margin-bottom: 0;
}
.warehouse-stocking-modal-header-main {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  align-items: center;
}
.warehouse-stocking-modal-header-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
}
.warehouse-stocking-modal-header-label {
  color: var(--text-muted, #71717a);
}
.warehouse-stocking-modal-header-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  align-items: center;
  padding-top: 10px;
  border-top: 1px solid #e2e8f0;
}
.warehouse-stocking-header-input {
  font-size: 13px;
  padding: 4px 8px;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  background: #fff;
  min-width: 0;
  max-width: 160px;
}
.warehouse-stocking-header-input.warehouse-stocking-header-receiving-status,
.warehouse-stocking-header-input.warehouse-stocking-header-shipping-invoice {
  max-width: 120px;
}
.warehouse-stocking-header-input.warehouse-stocking-header-receiving-date,
.warehouse-stocking-header-input.warehouse-stocking-header-shipping-date {
  max-width: 140px;
}
.warehouse-location-select {
  font-weight: 600;
  border-radius: 8px;
  min-width: 88px;
  max-width: 110px;
  cursor: pointer;
}
.warehouse-location-select-empty {
  background: #f8fafc;
  border-color: #cbd5e1;
  color: #64748b;
}
.warehouse-location-select-yiwu {
  background: #f0fdf4;
  border-color: #bbf7d0;
  color: #166534;
}
.warehouse-location-select-chaoshan {
  background: #eff6ff;
  border-color: #bfdbfe;
  color: #1e40af;
}
.warehouse-location-select-yangjiang {
  background: #fff7ed;
  border-color: #fed7aa;
  color: #c2410c;
}
.warehouse-location-select-jiangmen {
  background: #fefce8;
  border-color: #fde047;
  color: #a16207;
}
.warehouse-location-select-qingdao {
  background: #fef2f2;
  border-color: #fecaca;
  color: #b91c1c;
}
.warehouse-location-select-nanjing {
  background: #efebe9;
  border-color: #d7ccc8;
  color: #5d4037;
}
.warehouse-location-select-chongqing {
  background: #f5f3ff;
  border-color: #ddd6fe;
  color: #6d28d9;
}
.warehouse-amount-diff {
  font-size: 14px;
  font-weight: 700;
}
.warehouse-amount-diff.neutral {
  color: #334155;
}
.warehouse-amount-diff.over {
  color: #991b1b;
}
.warehouse-amount-diff.short {
  color: #92400e;
}
.warehouse-stocking-modal-contract-match,
.warehouse-stocking-modal-summary-variance {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.warehouse-stocking-modal-summary-item-diff {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 8px;
}
.warehouse-stocking-modal-summary-item-diff .warehouse-stocking-modal-summary-label {
  white-space: nowrap;
}
.warehouse-contract-match-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}
.warehouse-contract-match-badge.match {
  background: #dcfce7;
  color: #166534;
}
.warehouse-contract-match-badge.mismatch {
  background: #fee2e2;
  color: #991b1b;
}
.warehouse-stocking-modal-partial-badge {
  display: inline-flex;
  align-items: center;
}
.warehouse-stocking-modal-summary {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 10px 16px;
  padding: 10px 14px;
  border-radius: 10px;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
}
.warehouse-stocking-modal-summary-left {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 16px;
  flex: 1 1 auto;
  justify-content: flex-start;
}
.warehouse-stocking-modal-summary-right {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 10px 16px;
  flex: 0 1 auto;
  justify-content: flex-end;
  margin-left: auto;
}
.warehouse-stocking-modal-summary-item {
  display: inline-flex;
  align-items: baseline;
  gap: 6px;
  font-size: 13px;
}
.warehouse-stocking-modal-summary-label {
  color: var(--text-muted, #71717a);
}
.warehouse-stocking-modal-summary-item strong {
  font-size: 14px;
  color: #1e3a8a;
}
.warehouse-stocking-input.warehouse-stocking-readonly {
  background: var(--panel-muted, #f4f4f5);
  color: var(--text-muted, #71717a);
  cursor: default;
}
.warehouse-stocking-detail-modal-body [data-warehouse-actual-total-gross-weight],
.warehouse-stocking-detail-modal-body [data-warehouse-contract-total-gross-weight],
.warehouse-stocking-detail-modal-body [data-warehouse-actual-total-volume],
.warehouse-stocking-detail-modal-body [data-warehouse-contract-total-volume] {
  background: var(--panel-muted, #f4f4f5);
  color: var(--text-muted, #71717a);
}
.warehouse-stocking-input.warehouse-stocking-unit {
  min-width: 72px;
  max-width: 120px;
}
.warehouse-master-partial-flags {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}
.warehouse-variance-badge {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
}
.warehouse-variance-badge.short {
  background: #fde047;
  color: #000;
}
.warehouse-variance-badge.over {
  background: #ef4444;
  color: #000;
}
.warehouse-variance-text {
  display: inline;
  color: #ef4444;
  background: #fff;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}
.warehouse-variance-highlight {
  background: #fff7ed;
}
.inventory-ledger-balances-table tbody tr.inventory-ledger-balance-row {
  cursor: pointer;
}
.inventory-ledger-balances-table tbody tr.inventory-ledger-balance-row:hover,
.inventory-ledger-balances-table tbody tr.inventory-ledger-balance-row:focus {
  background: #f1f5f9;
}
.inventory-ledger-drilldown {
  margin-top: 8px;
}
.inventory-ledger-drilldown-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}
.inventory-ledger-drilldown-head h4 {
  margin: 0;
}
.inventory-ledger-hint {
  margin: 8px 0 0;
  font-size: 12px;
}
.warehouse-shipping-status-badge,
.warehouse-finance-audit-badge,
.warehouse-receiving-status-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
}
.warehouse-receiving-status-badge.pending {
  background: #fef9c3;
  color: #854d0e;
}
.warehouse-receiving-status-badge.received {
  background: #dcfce7;
  color: #166534;
}
.warehouse-receiving-status-badge.returned {
  background: #fee2e2;
  color: #b91c1c;
}
.warehouse-shipping-status-badge.pending {
  background: #fef9c3;
  color: #854d0e;
}
.warehouse-shipping-status-badge.shipped {
  background: #dcfce7;
  color: #166534;
}
.warehouse-finance-audit-badge.pass {
  background: #dcfce7;
  color: #166534;
}
.warehouse-finance-audit-badge.fail {
  background: #fee2e2;
  color: #b91c1c;
}
.warehouse-shipping-select-pending,
.warehouse-receiving-select-pending {
  background: #fef9c3;
  border-color: #fde047;
  color: #854d0e;
  font-weight: 600;
}
.warehouse-shipping-select-shipped,
.warehouse-receiving-select-received {
  background: #dcfce7;
  border-color: #86efac;
  color: #166534;
  font-weight: 600;
}
.warehouse-receiving-select-returned {
  background: #fee2e2;
  border-color: #fca5a5;
  color: #b91c1c;
  font-weight: 600;
}
.warehouse-finance-select-pass {
  background: #dcfce7;
  border-color: #86efac;
  color: #166534;
  font-weight: 600;
}
.warehouse-finance-select-fail {
  background: #fee2e2;
  border-color: #fca5a5;
  color: #b91c1c;
  font-weight: 600;
}
.warehouse-stocking-header-attachments {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 8px;
  max-width: 280px;
}
.warehouse-stocking-header-attachment-item {
  align-items: center;
}
.warehouse-receipt-chip-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
}
.warehouse-receipt-chip {
  display: inline-flex;
  align-items: center;
  gap: 0;
  min-width: 0;
  max-width: 100%;
  padding: 0 0 0 6px;
  border: 0;
  border-bottom: 1px solid #cbd5e1;
  border-radius: 0;
  background: transparent;
  line-height: 1.3;
}
.warehouse-receipt-chip-link {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  color: #2563eb;
  text-decoration: none;
  font-size: 12px;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.warehouse-receipt-chip-link:hover {
  color: #1d4ed8;
  text-decoration: underline;
}
.warehouse-receipt-chip-remove {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #94a3b8;
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
}
.warehouse-receipt-chip-remove:hover {
  color: #ef4444;
}
.warehouse-receipt-upload-link {
  display: inline;
  color: #64748b;
  font-size: 12px;
  cursor: pointer;
  white-space: nowrap;
  text-decoration: none;
}
.warehouse-receipt-upload-link:hover {
  color: #2563eb;
  text-decoration: underline;
}
.warehouse-stocking-order-name-item {
  flex: 1 1 auto;
  min-width: 0;
}
.warehouse-stocking-order-name-text {
  font-weight: 700;
}
.warehouse-stocking-header-receiving-tag {
  display: inline-block;
  margin-left: 8px;
  font-size: 14px;
  font-weight: 600;
  color: #dc2626;
  vertical-align: baseline;
}
.warehouse-stocking-header-receiving-tag.muted {
  font-size: 12px;
  font-weight: 500;
  color: #94a3b8;
}
.warehouse-stocking-header-receiving-no-display {
  display: inline-block;
  font-size: 20px;
  font-weight: 700;
  line-height: 1.2;
  color: #dc2626;
  letter-spacing: 0.02em;
}
.warehouse-stocking-header-receiving-no-display.muted {
  font-size: 14px;
  font-weight: 600;
  color: #94a3b8;
}
.warehouse-stocking-modal-header-item.warehouse-stocking-header-receiving-no-item {
  flex: 0 0 auto;
  margin-right: 4px;
}
.warehouse-stocking-header-input.warehouse-stocking-header-receiving-no {
  max-width: 140px;
}
.warehouse-variance-summary {
  display: inline-block;
  font-size: 12px;
  font-weight: bold;
  white-space: nowrap;
  color: #ef4444;
  background: #fff;
}
.warehouse-partial-badge {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 4px;
  font-size: 11px;
  margin-right: 4px;
}
.warehouse-partial-badge.incoming {
  background: #dbeafe;
  color: #1e40af;
}
.warehouse-partial-badge.outgoing {
  background: #fce7f3;
  color: #9d174d;
}
.warehouse-partial-badge.line {
  opacity: 0.85;
}
.warehouse-partial-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  align-items: center;
}
.warehouse-batch-tag {
  display: inline-block;
  margin-left: 4px;
  padding: 0 4px;
  border-radius: 3px;
  background: #f3f4f6;
  color: #4b5563;
  font-size: 10px;
}
.warehouse-batch-remark {
  font-size: 11px;
  color: #6b7280;
}
.warehouse-partial-flag-cell {
  white-space: nowrap;
}
.warehouse-line-flag {
  font-size: 11px;
  margin-right: 6px;
}
.stats-subnav {
  display: flex;
  gap: 8px;
  margin-bottom: 12px;
}
.stats-subnav-btn {
  padding: 6px 14px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--panel);
  cursor: pointer;
  font-size: 13px;
}
.stats-subnav-btn.active {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
}
.partner-admin-panel {
  padding: 14px 16px;
}
.partner-admin-modal-card {
  width: min(1100px, 96vw);
  max-height: calc(100vh - 32px);
  overflow: auto;
  padding: 16px 18px;
}
.customer-admin-detail-modal-card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  height: min(88vh, 820px);
}
.customer-admin-detail-modal-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  margin-top: 8px;
  padding-top: 0;
  border-top: none;
}
.customer-admin-detail-modal.customer-admin-detail-modal-fullscreen {
  padding: 0;
  align-items: stretch;
}
.customer-admin-detail-modal-card.is-fullscreen {
  width: 100vw;
  max-width: 100vw;
  height: 100vh;
  max-height: 100vh;
  border-radius: 0;
}
.customer-admin-detail-modal-card.is-fullscreen .customer-admin-detail-modal-body {
  padding: 0 0.5rem 0.75rem;
}
.customer-settings-card {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
  border: none;
  padding: 0;
  gap: 10px;
}
.customer-settings-card .customer-settings-head,
.customer-settings-card .customer-detail-tabs {
  flex-shrink: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  padding: 0 2px 8px;
  border-bottom: 1px solid #e2e8f0;
}
.customer-detail-tab {
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  color: #475569;
  border-radius: 999px;
  padding: 6px 14px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.customer-detail-tab:hover {
  background: #eff6ff;
  border-color: #bfdbfe;
}
.customer-detail-tab.active {
  background: #2563eb;
  border-color: #2563eb;
  color: #fff;
}
.customer-settings-card .customer-detail-tab-body {
  flex: 1 1 auto;
  min-height: min(52vh, 480px);
  max-height: min(52vh, 480px);
  overflow-y: auto;
  padding-right: 4px;
}
.customer-detail-tab-sections {
  display: grid;
  gap: 16px;
}
.customer-detail-tab-section-title {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 600;
  color: #334155;
}
.supplier-admin-detail-modal-card {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  height: min(88vh, 820px);
}
.partner-admin-modal-fullscreen {
  padding: 0;
  align-items: stretch;
}
.partner-admin-modal-card.is-fullscreen,
.settings-modal-card.is-fullscreen {
  width: 100vw;
  max-width: 100vw;
  height: 100vh;
  max-height: 100vh;
  border-radius: 0;
}
.reconciliation-row-unclaimed td {
  color: #b91c1c;
}
.reconciliation-row-unclaimed .reconciliation-writeoff-badge {
  background: #fee2e2;
  color: #b91c1c;
}
.detail-new-supplier-field {
  margin-bottom: 8px;
}
.supplier-admin-detail-modal-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
}
.supplier-admin-detail-modal.supplier-admin-detail-modal-fullscreen {
  padding: 0;
  align-items: stretch;
}
.supplier-admin-detail-modal-card.is-fullscreen {
  width: 100vw;
  max-width: 100vw;
  height: 100vh;
  max-height: 100vh;
  border-radius: 0;
}
.supplier-admin-detail-modal-card.is-fullscreen .supplier-admin-detail-modal-body {
  padding: 0 0.5rem 0.75rem;
}
.supplier-crm-colored-select {
  min-width: 88px;
  max-width: 100%;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  line-height: 1.35;
  font-weight: 600;
  border: 1px solid transparent;
  cursor: pointer;
}
.supplier-category-select.customer-product-empty,
.supplier-lifecycle-select.supplier-lifecycle-empty,
.supplier-factory-field.supplier-factory-empty {
  background: #f8fafc;
  color: #64748b;
  border-color: #e2e8f0;
}
.supplier-category-select.customer-product-steel { background: #e2e8f0; color: #334155; }
.supplier-category-select.customer-product-aluminum { background: #dbeafe; color: #1d4ed8; }
.supplier-category-select.customer-product-cast-iron { background: #44403c; color: #fafaf9; }
.supplier-category-select.customer-product-enamel { background: #fce7f3; color: #be185d; }
.supplier-category-select.customer-product-glass { background: #cffafe; color: #0e7490; }
.supplier-category-select.customer-product-plastic { background: #fef3c7; color: #92400e; }
.supplier-category-select.customer-product-appliance { background: #ede9fe; color: #6d28d9; }
.supplier-category-select.customer-product-other,
.supplier-category-select.customer-product-hash-0 { background: #e2e8f0; color: #334155; }
.supplier-category-select.customer-product-hash-1 { background: #dbeafe; color: #1d4ed8; }
.supplier-category-select.customer-product-hash-2 { background: #dcfce7; color: #166534; }
.supplier-category-select.customer-product-hash-3 { background: #fef3c7; color: #92400e; }
.supplier-category-select.customer-product-hash-4 { background: #fce7f3; color: #be185d; }
.supplier-category-select.customer-product-hash-5 { background: #ede9fe; color: #6d28d9; }
.supplier-category-select.customer-product-hash-6 { background: #cffafe; color: #0e7490; }
.supplier-category-select.customer-product-hash-7 { background: #fee2e2; color: #b91c1c; }
.supplier-lifecycle-select.supplier-lifecycle-prospect { background: #e0e7ff; color: #3730a3; }
.supplier-lifecycle-select.supplier-lifecycle-evaluating { background: #dbeafe; color: #1d4ed8; }
.supplier-lifecycle-select.supplier-lifecycle-sampled { background: #ccfbf1; color: #0f766e; }
.supplier-lifecycle-select.supplier-lifecycle-qualified { background: #cffafe; color: #0e7490; }
.supplier-lifecycle-select.supplier-lifecycle-active { background: #dcfce7; color: #15803d; }
.supplier-lifecycle-select.supplier-lifecycle-preferred { background: #bbf7d0; color: #166534; }
.supplier-lifecycle-select.supplier-lifecycle-on-hold { background: #f1f5f9; color: #475569; }
.supplier-lifecycle-select.supplier-lifecycle-blacklisted { background: #fee2e2; color: #b91c1c; }
.supplier-lifecycle-select.supplier-lifecycle-other { background: #e2e8f0; color: #334155; }
.supplier-performance-grade-select.supplier-performance-grade-empty {
  background: #f8fafc;
  color: #64748b;
  border-color: #e2e8f0;
}
.supplier-performance-grade-select.supplier-performance-grade-a { background: #dcfce7; color: #166534; }
.supplier-performance-grade-select.supplier-performance-grade-b { background: #dbeafe; color: #1d4ed8; }
.supplier-performance-grade-select.supplier-performance-grade-c { background: #ffedd5; color: #c2410c; }
.supplier-performance-grade-select.supplier-performance-grade-d { background: #fee2e2; color: #b91c1c; }
.supplier-default-port.order-port-select {
  min-width: 88px;
  max-width: 100%;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  line-height: 1.35;
  font-weight: 600;
  border: 1px solid transparent;
  cursor: pointer;
}
.supplier-default-warehouse.warehouse-location-select {
  min-width: 88px;
  max-width: 100%;
}
.supplier-factory-field {
  min-width: 88px;
  max-width: 100%;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  line-height: 1.35;
  font-weight: 600;
  border: 1px solid transparent;
}
.supplier-factory-field.supplier-factory-hash-0 { background: #e2e8f0; color: #334155; }
.supplier-factory-field.supplier-factory-hash-1 { background: #dbeafe; color: #1d4ed8; }
.supplier-factory-field.supplier-factory-hash-2 { background: #dcfce7; color: #166534; }
.supplier-factory-field.supplier-factory-hash-3 { background: #fef3c7; color: #92400e; }
.supplier-factory-field.supplier-factory-hash-4 { background: #fce7f3; color: #be185d; }
.supplier-factory-field.supplier-factory-hash-5 { background: #ede9fe; color: #6d28d9; }
.supplier-factory-field.supplier-factory-hash-6 { background: #cffafe; color: #0e7490; }
.supplier-factory-field.supplier-factory-hash-7 { background: #fee2e2; color: #b91c1c; }
.product-catalog-admin-modal-card {
  width: min(1200px, 96vw);
}
.product-catalog-panel-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}
.product-catalog-panel-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.product-catalog-tip {
  margin: 0;
  flex: 1 1 280px;
}
.partner-admin-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 8px;
}
.partner-admin-head h3 {
  margin: 0;
}
.partner-admin-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.partner-admin-tip {
  margin: 0 0 12px;
}
.partner-admin-toolbar {
  display: flex;
  align-items: center;
  gap: 10px 14px;
  flex-wrap: wrap;
  flex: 1 1 auto;
  min-width: 0;
}
.partner-admin-lang-options {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.partner-admin-lang-btn.active {
  background: var(--primary);
  color: #fff;
  border-color: var(--primary);
}
.partner-admin-category-btn.active {
  background: var(--primary);
  color: #fff;
  border-color: var(--primary);
}
.partner-admin-customer-filters {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 8px 12px;
  flex: 1 1 auto;
  min-width: 0;
  align-items: center;
}
.partner-admin-customer-filter-row {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: nowrap;
  min-width: 0;
}
.partner-admin-customer-filter-row .category-dropdown-wrap {
  min-width: 140px;
}
.partner-admin-customer-filter-row .category-dropdown-btn {
  min-width: 140px;
  max-width: 200px;
}
.partner-admin-customer-filter-row .topbar-filter-label {
  flex: 0 0 auto;
  min-width: 4.5em;
}
.partner-admin-customer-filter-row .chip-group {
  flex: 1 1 auto;
  min-width: 0;
}
.customer-filter-unseen-btn.active {
  background: #fef3c7;
  color: #92400e;
  border-color: #f59e0b;
}
.customer-filter-overdue-btn.active {
  background: #fee2e2;
  color: #991b1b;
  border-color: #ef4444;
}
.customer-filter-lifecycle-select {
  min-width: 140px;
  max-width: 200px;
}
.customer-readonly-field {
  display: block;
  min-height: 2rem;
  padding: 0.35rem 0.5rem;
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 4px;
  background: #f8fafc;
  font-size: 0.875rem;
}
.customer-contact-age-fresh { color: #15803d; }
.customer-contact-age-warn { color: #b45309; font-weight: 600; }
.customer-contact-age-stale { color: #b91c1c; font-weight: 600; }
.customer-followup-overdue { color: #b91c1c; font-weight: 600; }
.customer-primary-contact-cell { width: 2rem; text-align: center; }
.customer-primary-contact-label { cursor: pointer; }
.customer-activities-wrap { display: grid; gap: 1rem; }
.customer-followups-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}
.customer-followups-list-panel { margin-top: 0.5rem; }
.customer-followups-table .customer-followups-master-row { cursor: pointer; }
.customer-followups-table .customer-followups-master-row:hover { background: #eff6ff; }
.customer-followups-content-cell {
  max-width: 280px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.customer-followups-result-cell {
  max-width: 180px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.customer-followups-actions-cell { white-space: nowrap; }
.customer-followup-timeline-modal {
  padding: 0;
  align-items: stretch;
}
.customer-followup-timeline-modal-card {
  width: 100vw;
  max-width: 100vw;
  height: 100vh;
  max-height: 100vh;
  border-radius: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.customer-followup-timeline-header {
  padding: 0 1rem 0.5rem;
  border-bottom: 1px solid var(--border, #e2e8f0);
}
.customer-followup-timeline-header-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 0.75rem 1rem;
}
.customer-followup-timeline-header-grid > div {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}
.customer-followup-timeline-toolbar {
  display: flex;
  justify-content: flex-end;
  padding: 0.5rem 1rem;
  border-bottom: 1px solid var(--border, #e2e8f0);
}
.customer-followup-timeline-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  padding: 0.5rem 1rem 1rem;
}
.customer-followups-detail-table { width: 100%; }
.customer-followup-detail-modal-card {
  width: min(920px, 96vw);
  max-height: calc(100vh - 32px);
  display: flex;
  flex-direction: column;
}
.customer-followup-detail-modal-card.is-fullscreen {
  width: 100vw;
  max-width: 100vw;
  height: 100vh;
  max-height: 100vh;
  border-radius: 0;
  overflow: hidden;
}
.customer-followup-detail-modal.customer-followup-detail-modal-fullscreen {
  padding: 0;
  align-items: stretch;
}
.customer-followup-detail-modal-body {
  overflow: auto;
  flex: 1 1 auto;
  min-height: 0;
  padding: 0 0.5rem;
}
.customer-followup-detail-modal-card.is-fullscreen .customer-followup-detail-modal-body {
  padding: 0 1rem 0.75rem;
}
.customer-activity-form--detail-modal .customer-activity-content {
  min-height: 180px;
  resize: vertical;
}
.customer-followup-detail-modal-card.is-fullscreen .customer-activity-form--detail-modal .customer-activity-content {
  min-height: min(42vh, 480px);
  flex: 1 1 auto;
}
.customer-followup-detail-modal-card.is-fullscreen .customer-activity-form--detail-modal {
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 1 1 auto;
}
.customer-followup-detail-modal-card.is-fullscreen .customer-followup-detail-modal-actions {
  flex-shrink: 0;
  padding: 0.75rem 1rem 1rem;
  border-top: 1px solid var(--border, #e2e8f0);
  background: #fff;
}
.customer-followup-detail-modal-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: flex-end;
}
.customer-recent-followups {
  grid-column: 1 / -1;
  border: 1px dashed var(--border, #e2e8f0);
  border-radius: 6px;
  padding: 0.75rem;
  background: #f8fafc;
}
.customer-recent-followups-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
}
.customer-recent-followups-title { font-weight: 600; }
.customer-recent-followup-item + .customer-recent-followup-item {
  margin-top: 0.5rem;
  padding-top: 0.5rem;
  border-top: 1px solid var(--border, #e2e8f0);
}
.sample-shipments-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}
.sample-shipments-toolbar .sample-shipments-party-filter {
  min-width: 120px;
  max-width: 140px;
  width: 140px;
}
.sample-shipments-form-panel { margin: 0 0 1rem; }
.sample-shipments-form-card {
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 6px;
  padding: 0.75rem 1rem;
  background: #fff;
}
.sample-shipments-form-card h4 { margin: 0 0 0.75rem; }
.sample-shipments-form-actions { display: flex; gap: 0.5rem; margin-top: 0.5rem; }
.sample-shipments-list-panel { margin-top: 0.5rem; }
.sample-shipments-content-cell { max-width: 220px; white-space: pre-wrap; }
.sample-shipments-actions-cell { white-space: nowrap; }
.sample-shipment-items-section { margin: 0.75rem 0; }
.sample-shipment-items-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.5rem;
}
.sample-shipment-items-table-wrap { overflow-x: auto; }
.sample-shipment-header-row label {
  min-width: 0;
}
.sample-shipment-colored-select {
  font-weight: 600;
}
.sample-shipment-colored-select.sample-shipment-select-direction-out {
  background: #fef2f2;
  border-color: #fca5a5;
  color: #b91c1c;
}
.sample-shipment-colored-select.sample-shipment-select-direction-in {
  background: #ecfdf5;
  border-color: #6ee7b7;
  color: #047857;
}
.sample-shipment-colored-select.sample-shipment-select-scope-domestic {
  background: #ecfdf5;
  border-color: #6ee7b7;
  color: #047857;
}
.sample-shipment-colored-select.sample-shipment-select-scope-international {
  background: #fef2f2;
  border-color: #fca5a5;
  color: #b91c1c;
}
.sample-shipment-colored-select.sample-shipment-select-scope-empty {
  background: #f8fafc;
  border-color: #cbd5e1;
  color: #64748b;
}
.sample-shipment-colored-select.sample-shipment-select-prepaid {
  background: #dbeafe;
  border-color: #93c5fd;
  color: #1d4ed8;
}
.sample-shipment-colored-select.sample-shipment-select-cod {
  background: #fff7ed;
  border-color: #fdba74;
  color: #c2410c;
}
.sample-shipment-colored-select.sample-shipment-select-express-dhl {
  background: #fefce8;
  border-color: #fde047;
  color: #a16207;
}
.sample-shipment-colored-select.sample-shipment-select-express-fedex {
  background: #f5f3ff;
  border-color: #c4b5fd;
  color: #6d28d9;
}
.sample-shipment-colored-select.sample-shipment-select-express-ups {
  background: #fffbeb;
  border-color: #fcd34d;
  color: #92400e;
}
.sample-shipment-colored-select.sample-shipment-select-express-express {
  background: #eff6ff;
  border-color: #93c5fd;
  color: #1d4ed8;
}
.sample-shipment-colored-select.sample-shipment-select-express-ems {
  background: #ecfdf5;
  border-color: #6ee7b7;
  color: #047857;
}
.sample-shipment-colored-select.sample-shipment-select-express-sf {
  background: #f1f5f9;
  border-color: #94a3b8;
  color: #0f172a;
}
.sample-shipment-colored-select.sample-shipment-select-express-yto {
  background: #eff6ff;
  border-color: #60a5fa;
  color: #1e40af;
}
.sample-shipment-colored-select.sample-shipment-select-express-zto {
  background: #eef2ff;
  border-color: #818cf8;
  color: #3730a3;
}
.sample-shipment-colored-select.sample-shipment-select-express-sto {
  background: #fff7ed;
  border-color: #fb923c;
  color: #c2410c;
}
.sample-shipment-colored-select.sample-shipment-select-express-yunda {
  background: #fef9c3;
  border-color: #facc15;
  color: #854d0e;
}
.sample-shipment-colored-select.sample-shipment-select-express-jd {
  background: #fef2f2;
  border-color: #f87171;
  color: #b91c1c;
}
.sample-shipment-colored-select.sample-shipment-select-express-deppon {
  background: #fff7ed;
  border-color: #fdba74;
  color: #9a3412;
}
.sample-shipment-colored-select.sample-shipment-select-express-other-domestic {
  background: #f0fdf4;
  border-color: #86efac;
  color: #166534;
}
.sample-shipment-colored-select.sample-shipment-select-express-other-international {
  background: #fef2f2;
  border-color: #fca5a5;
  color: #991b1b;
}
.sample-shipment-colored-select.sample-shipment-select-express-empty {
  background: #f8fafc;
  border-color: #cbd5e1;
  color: #64748b;
}
.sample-shipment-colored-select.sample-shipment-select-status-sent {
  background: #ecfdf5;
  border-color: #6ee7b7;
  color: #047857;
}
.sample-shipment-colored-select.sample-shipment-select-status-pending {
  background: #fffbeb;
  border-color: #fcd34d;
  color: #b45309;
}
.sample-shipment-colored-select.sample-shipment-select-status-approved {
  background: #eff6ff;
  border-color: #93c5fd;
  color: #1d4ed8;
}
.sample-shipment-colored-select.sample-shipment-select-status-rejected {
  background: #fef2f2;
  border-color: #fca5a5;
  color: #b91c1c;
}
.sample-shipment-colored-select.sample-shipment-select-status-empty {
  background: #f8fafc;
  border-color: #cbd5e1;
  color: #64748b;
}
.sample-shipment-colored-select.sample-shipment-select-content-document {
  background: #ecfdf5;
  border-color: #6ee7b7;
  color: #047857;
}
.sample-shipment-colored-select.sample-shipment-select-content-sample {
  background: #fef2f2;
  border-color: #fca5a5;
  color: #b91c1c;
}
.sample-shipment-colored-select.sample-shipment-select-content-empty {
  background: #f8fafc;
  border-color: #cbd5e1;
  color: #64748b;
}
.sample-shipment-items-table th.text-center,
.sample-shipment-items-table td.text-center {
  text-align: center;
  vertical-align: middle;
}
.sample-shipment-items-table th.num-right,
.sample-shipment-items-table td.num-right {
  text-align: right;
  vertical-align: middle;
  font-variant-numeric: tabular-nums;
}
.sample-shipment-items-table th.num-right {
  text-align: center;
}
.sample-shipment-items-table td.num-right input.sample-shipment-line-num {
  text-align: right;
}
.sample-shipment-items-table .sample-shipment-name-en-col,
.sample-shipment-items-table .sample-shipment-name-en-cell {
  min-width: 14rem;
  width: 18%;
}
.sample-shipment-items-table input.sample-shipment-line-input {
  width: 100%;
  min-width: 4.5rem;
  box-sizing: border-box;
}
.sample-shipment-items-table .sample-shipment-line-actions { white-space: nowrap; }
.sample-shipment-items-actions { margin-top: 0.35rem; }
.sample-shipment-photos-panel { margin: 0.75rem 0; }
.sample-shipment-photos-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.5rem;
}
.sample-shipment-photo-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  list-style: none;
  padding: 0;
  margin: 0;
}
.sample-shipment-photo-chip {
  position: relative;
  width: 96px;
  border: 1px solid var(--border, #ddd);
  border-radius: 8px;
  overflow: hidden;
  background: var(--panel-bg, #fff);
}
.sample-shipment-photo-link {
  display: flex;
  flex-direction: column;
  color: inherit;
  text-decoration: none;
}
.sample-shipment-photo-thumb {
  width: 100%;
  height: 72px;
  object-fit: cover;
  display: block;
  background: #f5f5f5;
}
.sample-shipment-photo-name {
  display: block;
  padding: 0.25rem 0.35rem;
  font-size: 0.72rem;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.sample-shipment-photo-remove {
  position: absolute;
  top: 2px;
  right: 2px;
  width: 1.25rem;
  height: 1.25rem;
  border: none;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.55);
  color: #fff;
  cursor: pointer;
  line-height: 1;
}
.sample-shipment-photo-hint { margin: 0.35rem 0 0; font-size: 0.85rem; }
.sample-shipment-photo-upload-btn { cursor: pointer; }
.sample-shipment-detail-modal.sample-shipment-detail-modal-fullscreen {
  padding: 0;
  align-items: stretch;
}
.sample-shipment-detail-modal-card {
  width: 100vw;
  max-width: 100vw;
  height: 100vh;
  max-height: 100vh;
  border-radius: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.sample-shipment-detail-modal-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  padding: 0 0.5rem 0.75rem;
}
.sample-shipments-table .sample-shipments-main-row {
  cursor: pointer;
}
.sample-shipments-table .sample-shipments-main-row:hover {
  background: #eff6ff;
}
.sample-shipment-name-en-wrap,
.sample-shipment-hs-wrap {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}
.sample-shipment-name-en-wrap input,
.sample-shipment-hs-wrap input {
  flex: 1 1 auto;
  min-width: 0;
}
.sample-shipment-items-footer-row td {
  background: #f8fafc;
  font-weight: 600;
}
.sample-shipment-hs-lookup-card {
  width: min(720px, 95vw);
  max-height: 85vh;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.sample-shipment-hs-lookup-results {
  overflow: auto;
  flex: 1 1 auto;
  min-height: 120px;
  max-height: 55vh;
}
.customer-recent-samples {
  grid-column: 1 / -1;
  border: 1px dashed var(--border, #e2e8f0);
  border-radius: 6px;
  padding: 0.75rem;
  background: #f8fafc;
}
.customer-recent-samples-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
}
.customer-recent-samples-title { font-weight: 600; }
.customer-activity-form { display: grid; gap: 0.75rem; }
.customer-activity-form-actions { display: flex; justify-content: flex-end; }
.customer-activity-timeline { display: grid; gap: 0.75rem; }
.customer-activity-item {
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 6px;
  padding: 0.75rem;
  background: #fff;
}
.customer-activity-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.35rem;
}
.customer-activity-type-badge {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 4px;
  background: #e0f2fe;
  color: #0369a1;
  font-size: 11px;
  font-weight: 600;
}
.customer-activity-content { white-space: pre-wrap; }
.customer-business-overview-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 0.75rem;
  margin: 0 0 0.75rem;
}
.customer-business-overview-grid dt {
  font-size: 0.75rem;
  color: #64748b;
  margin-bottom: 0.15rem;
}
.customer-business-overview-grid dd {
  margin: 0;
  font-weight: 600;
}
.customer-business-overview-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.supplier-business-overview-alerts {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 0.75rem;
}
.supplier-cert-expiring-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.15rem 0.45rem;
  border-radius: 999px;
  background: #fef3c7;
  color: #b45309;
  font-size: 11px;
  font-weight: 600;
}
.supplier-followup-overdue-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.15rem 0.45rem;
  border-radius: 999px;
  background: #fee2e2;
  color: #b91c1c;
  font-size: 11px;
  font-weight: 600;
}
.supplier-workbench-banner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin: 0.75rem 0 0;
  padding: 0.65rem 0.85rem;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
}
.supplier-workbench-banner.hidden {
  display: none;
}
.supplier-workbench-banner-label {
  font-size: 0.8125rem;
  color: #64748b;
  font-weight: 600;
}
.customer-admin-badge.customer-lifecycle-potential { background: #e0e7ff; color: #3730a3; }
.customer-admin-badge.customer-lifecycle-developing { background: #dbeafe; color: #1d4ed8; }
.customer-admin-badge.customer-lifecycle-quoted { background: #cffafe; color: #0e7490; }
.customer-admin-badge.customer-lifecycle-sampled { background: #ccfbf1; color: #0f766e; }
.customer-admin-badge.customer-lifecycle-negotiating { background: #fef3c7; color: #b45309; }
.customer-admin-badge.customer-lifecycle-won { background: #dcfce7; color: #15803d; }
.customer-admin-badge.customer-lifecycle-long-term { background: #bbf7d0; color: #166534; }
.customer-admin-badge.customer-lifecycle-paused { background: #f1f5f9; color: #475569; }
.customer-admin-badge.customer-lifecycle-lost { background: #fee2e2; color: #b91c1c; }

.customer-admin-badge.supplier-lifecycle-prospect { background: #e0e7ff; color: #3730a3; }
.customer-admin-badge.supplier-lifecycle-evaluating { background: #dbeafe; color: #1d4ed8; }
.customer-admin-badge.supplier-lifecycle-sampled { background: #ccfbf1; color: #0f766e; }
.customer-admin-badge.supplier-lifecycle-qualified { background: #cffafe; color: #0e7490; }
.customer-admin-badge.supplier-lifecycle-active { background: #dcfce7; color: #15803d; }
.customer-admin-badge.supplier-lifecycle-preferred { background: #bbf7d0; color: #166534; }
.customer-admin-badge.supplier-lifecycle-on-hold { background: #f1f5f9; color: #475569; }
.customer-admin-badge.supplier-lifecycle-blacklisted { background: #fee2e2; color: #b91c1c; }

.customer-admin-badge.supplier-performance-grade-a { background: #dcfce7; color: #166534; }
.customer-admin-badge.supplier-performance-grade-b { background: #dbeafe; color: #1d4ed8; }
.customer-admin-badge.supplier-performance-grade-c { background: #ffedd5; color: #c2410c; }
.customer-admin-badge.supplier-performance-grade-d { background: #fee2e2; color: #b91c1c; }

.crm-activity-timeline { display: grid; gap: 0.75rem; margin-bottom: 1rem; }
.crm-activity-form { display: grid; gap: 0.75rem; }
.crm-activity-item {
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 6px;
  padding: 0.75rem;
  background: #fff;
}
.crm-activity-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.35rem;
}
.crm-activity-type {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 4px;
  background: #e0f2fe;
  color: #0369a1;
  font-size: 11px;
  font-weight: 600;
}
.crm-activity-meta { color: #64748b; font-size: 0.85rem; }
.crm-activity-content { white-space: pre-wrap; }
.crm-activity-subject,
.crm-activity-result,
.crm-activity-contact { font-size: 0.9rem; color: #334155; }

.supplier-certificate-list { list-style: none; padding: 0; margin: 0 0 1rem; display: grid; gap: 0.5rem; }
.supplier-certificate-item {
  display: grid;
  grid-template-columns: 7rem 1fr auto auto;
  gap: 0.75rem;
  align-items: center;
  padding: 0.5rem 0.75rem;
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 6px;
  background: #fff;
}
.supplier-certificate-type { font-size: 0.85rem; color: #475569; }
.supplier-certificate-expiry { font-size: 0.85rem; color: #64748b; white-space: nowrap; }
.customer-admin-badge {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 4px;
  font-size: 11px;
  line-height: 1.35;
  font-weight: 600;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
}
.customer-type-retail { background: #dbeafe; color: #1d4ed8; }
.customer-type-wholesale { background: #e0e7ff; color: #4338ca; }
.customer-type-agent { background: #dcfce7; color: #166534; }
.customer-type-ecommerce { background: #fce7f3; color: #be185d; }
.customer-type-importer { background: #ffedd5; color: #c2410c; }
.customer-type-other,
.customer-type-hash-0 { background: #e2e8f0; color: #334155; }
.customer-type-hash-1 { background: #dbeafe; color: #1d4ed8; }
.customer-type-hash-2 { background: #dcfce7; color: #166534; }
.customer-type-hash-3 { background: #fef3c7; color: #92400e; }
.customer-type-hash-4 { background: #fce7f3; color: #be185d; }
.customer-type-hash-5 { background: #ede9fe; color: #6d28d9; }
.customer-type-hash-6 { background: #cffafe; color: #0e7490; }
.customer-type-hash-7 { background: #fee2e2; color: #b91c1c; }
.customer-category-retail { background: #dbeafe; color: #1d4ed8; }
.customer-category-agent { background: #dcfce7; color: #166534; }
.customer-category-ecommerce { background: #fce7f3; color: #be185d; }
.customer-category-chain { background: #ede9fe; color: #6d28d9; }
.customer-category-importer { background: #ffedd5; color: #c2410c; }
.customer-category-other,
.customer-category-hash-0 { background: #e2e8f0; color: #334155; }
.customer-category-hash-1 { background: #dbeafe; color: #1d4ed8; }
.customer-category-hash-2 { background: #dcfce7; color: #166534; }
.customer-category-hash-3 { background: #fef3c7; color: #92400e; }
.customer-category-hash-4 { background: #fce7f3; color: #be185d; }
.customer-category-hash-5 { background: #ede9fe; color: #6d28d9; }
.customer-category-hash-6 { background: #cffafe; color: #0e7490; }
.customer-category-hash-7 { background: #fee2e2; color: #b91c1c; }
.customer-product-steel { background: #e2e8f0; color: #334155; }
.customer-product-aluminum { background: #dbeafe; color: #1d4ed8; }
.customer-product-cast-iron { background: #44403c; color: #fafaf9; }
.customer-product-enamel { background: #fce7f3; color: #be185d; }
.customer-product-glass { background: #cffafe; color: #0e7490; }
.customer-product-plastic { background: #fef3c7; color: #92400e; }
.customer-product-appliance { background: #ede9fe; color: #6d28d9; }
.customer-product-other,
.customer-product-hash-0 { background: #e2e8f0; color: #334155; }
.customer-product-hash-1 { background: #dbeafe; color: #1d4ed8; }
.customer-product-hash-2 { background: #dcfce7; color: #166534; }
.customer-product-hash-3 { background: #fef3c7; color: #92400e; }
.customer-product-hash-4 { background: #fce7f3; color: #be185d; }
.customer-product-hash-5 { background: #ede9fe; color: #6d28d9; }
.customer-product-hash-6 { background: #cffafe; color: #0e7490; }
.customer-product-hash-7 { background: #fee2e2; color: #b91c1c; }
.customer-seen-badge {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 4px;
  font-size: 11px;
  line-height: 1.35;
  font-weight: 600;
}
.customer-seen-yes { background: #dcfce7; color: #166534; }
.customer-seen-no { background: #fee2e2; color: #b91c1c; }
.customer-crm-dashboard-cards {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-top: 10px;
}
.customer-crm-dashboard-cards-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.customer-crm-dashboard-card {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 120px;
  padding: 8px 12px;
  border-radius: 8px;
}
.customer-crm-dashboard-card strong {
  font-size: 1.1rem;
}
.customer-crm-dashboard-card--info {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
}
.customer-crm-dashboard-label {
  font-size: 0.85rem;
  color: #64748b;
}
.customer-crm-dashboard-extra {
  display: grid;
  gap: 12px;
}
.customer-crm-funnel {
  display: grid;
  gap: 8px;
  padding: 12px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #fff;
}
.customer-crm-funnel-step {
  display: grid;
  grid-template-columns: 72px 1fr 48px;
  gap: 10px;
  align-items: center;
}
.customer-crm-funnel-label {
  font-size: 0.85rem;
  color: #475569;
}
.customer-crm-funnel-bar-wrap {
  height: 10px;
  background: #e2e8f0;
  border-radius: 999px;
  overflow: hidden;
}
.customer-crm-funnel-bar {
  height: 100%;
  background: linear-gradient(90deg, #3b82f6, #6366f1);
  border-radius: 999px;
}
.customer-crm-dashboard-top-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
}
.customer-crm-top-list {
  padding: 12px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #fff;
}
.customer-crm-top-list h6 {
  margin: 0 0 8px;
  font-size: 0.9rem;
}
.customer-crm-top-list ol {
  margin: 0;
  padding-left: 1.2rem;
  display: grid;
  gap: 6px;
}
.customer-crm-top-list li {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
}
.customer-crm-dashboard-only-tip {
  padding: 12px 0;
}
.customer-crm-dashboard-section {
  margin-top: 10px;
}
.customer-crm-dashboard-body .customer-crm-dashboard-cards {
  margin-top: 0;
}
.supplier-crm-dashboard-section {
  margin-top: 10px;
}
.supplier-crm-dashboard-body {
  gap: 12px;
}
.supplier-crm-dashboard-cards {
  margin-top: 0;
}
.supplier-crm-dashboard-top-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
}
.supplier-crm-dashboard-top-panel {
  padding: 12px;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #fff;
}
.supplier-crm-dashboard-top-panel h4 {
  margin: 0 0 8px;
  font-size: 0.9rem;
}
.supplier-crm-dashboard-top-list {
  margin: 0;
  padding-left: 1.2rem;
  display: grid;
  gap: 6px;
}
.supplier-crm-dashboard-top-list li {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  align-items: center;
}
.customer-opportunities-wrap .settings-table { margin-bottom: 1rem; }
.customer-opportunity-form { display: grid; gap: 0.75rem; }
.customer-score-badge { min-width: 56px; justify-content: center; }
.customer-tag-hash-0 { background: #dbeafe; color: #1d4ed8; }
.customer-tag-hash-1 { background: #dcfce7; color: #166534; }
.customer-tag-hash-2 { background: #fef3c7; color: #92400e; }
.customer-tag-hash-3 { background: #fce7f3; color: #be185d; }
.customer-tag-hash-4 { background: #ede9fe; color: #6d28d9; }
.customer-tag-hash-5 { background: #cffafe; color: #0e7490; }
.customer-tag-hash-6 { background: #fee2e2; color: #b91c1c; }
.customer-tag-hash-7 { background: #f1f5f9; color: #475569; }
.customer-attachment-item { list-style: none; }
.customer-sample-requests-wrap .settings-table { margin-bottom: 1rem; }
.customer-seen-toggle {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  user-select: none;
}
.customer-seen-toggle input {
  margin: 0;
}
.customer-importance-select {
  min-width: 72px;
  max-width: 96px;
  padding: 2px 6px;
  border-radius: 999px;
  font-size: 11px;
  line-height: 1.35;
  font-weight: 600;
  border: 1px solid transparent;
  cursor: pointer;
}
.customer-importance-select.customer-importance-empty {
  background: #f8fafc;
  color: #64748b;
  border-color: #e2e8f0;
}
.customer-importance-select.customer-importance-critical,
.customer-admin-badge.customer-importance-critical { background: #dc2626; color: #fff; }
.customer-importance-select.customer-importance-important,
.customer-admin-badge.customer-importance-important { background: #ea580c; color: #fff; }
.customer-importance-select.customer-importance-normal,
.customer-admin-badge.customer-importance-normal { background: #e2e8f0; color: #475569; }
.customer-importance-select.customer-importance-other,
.customer-admin-badge.customer-importance-other { background: #e2e8f0; color: #334155; }
.customer-browse-yes { background: #dcfce7; color: #166534; }
.customer-browse-no { background: #e2e8f0; color: #64748b; }
.customer-browse-empty,
.customer-browse-other { background: #f1f5f9; color: #64748b; }
.customer-contact-done { background: #dcfce7; color: #166534; }
.customer-contact-none { background: #e2e8f0; color: #64748b; }
.customer-contact-pending { background: #ffedd5; color: #c2410c; }
.customer-contact-empty,
.customer-contact-other { background: #f1f5f9; color: #64748b; }

.customer-field-select {
  min-width: 88px;
  max-width: 100%;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  line-height: 1.35;
  font-weight: 600;
  border: 1px solid transparent;
  cursor: pointer;
  appearance: auto;
}
.customer-field-select.customer-field-empty {
  background: #f8fafc;
  color: #64748b;
  border-color: #e2e8f0;
}
.customer-field-select.customer-field-other {
  background: #e2e8f0;
  color: #334155;
}
.customer-field-chip {
  display: inline-block;
  padding: 1px 8px;
  border-radius: 999px;
  font-size: 11px;
  line-height: 1.4;
  font-weight: 600;
  white-space: nowrap;
}
.customer-field-placeholder {
  color: #94a3b8;
  font-weight: 500;
}
.customer-settings-card .customer-field-multiselect-btn.has-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  align-items: center;
  min-height: 32px;
  height: auto;
  white-space: normal;
  overflow: visible;
  text-overflow: unset;
}
.customer-settings-card .category-dropdown-panel label .customer-field-chip {
  margin-left: 2px;
}

.customer-field-select.customer-importance-empty,
.customer-importance-select.customer-importance-empty {
  background: #f8fafc;
  color: #64748b;
  border-color: #e2e8f0;
}
.customer-field-select.customer-importance-critical,
.customer-importance-select.customer-importance-critical,
.customer-admin-badge.customer-importance-critical { background: #dc2626; color: #fff; }
.customer-field-select.customer-importance-important,
.customer-importance-select.customer-importance-important,
.customer-admin-badge.customer-importance-important { background: #ea580c; color: #fff; }
.customer-field-select.customer-importance-normal,
.customer-importance-select.customer-importance-normal,
.customer-admin-badge.customer-importance-normal { background: #e2e8f0; color: #475569; }
.customer-field-select.customer-importance-other,
.customer-importance-select.customer-importance-other,
.customer-admin-badge.customer-importance-other { background: #e2e8f0; color: #334155; }

.customer-field-select.customer-browse-yes,
.customer-field-chip.customer-browse-yes,
.customer-admin-badge.customer-browse-yes { background: #dcfce7; color: #166534; }
.customer-field-select.customer-browse-no,
.customer-field-chip.customer-browse-no,
.customer-admin-badge.customer-browse-no { background: #e2e8f0; color: #64748b; }
.customer-field-select.customer-browse-empty,
.customer-field-select.customer-browse-other,
.customer-field-chip.customer-browse-empty,
.customer-field-chip.customer-browse-other { background: #f1f5f9; color: #64748b; }

.customer-field-select.customer-contact-done,
.customer-field-chip.customer-contact-done,
.customer-admin-badge.customer-contact-done { background: #dcfce7; color: #166534; }
.customer-field-select.customer-contact-none,
.customer-field-chip.customer-contact-none,
.customer-admin-badge.customer-contact-none { background: #e2e8f0; color: #64748b; }
.customer-field-select.customer-contact-pending,
.customer-field-chip.customer-contact-pending,
.customer-admin-badge.customer-contact-pending { background: #ffedd5; color: #c2410c; }
.customer-field-select.customer-contact-empty,
.customer-field-select.customer-contact-other,
.customer-field-chip.customer-contact-empty,
.customer-field-chip.customer-contact-other { background: #f1f5f9; color: #64748b; }

.customer-field-select.customer-lifecycle-potential,
.customer-field-chip.customer-lifecycle-potential,
.customer-admin-badge.customer-lifecycle-potential { background: #e0e7ff; color: #3730a3; }
.customer-field-select.customer-lifecycle-developing,
.customer-field-chip.customer-lifecycle-developing,
.customer-admin-badge.customer-lifecycle-developing { background: #dbeafe; color: #1d4ed8; }
.customer-field-select.customer-lifecycle-quoted,
.customer-field-chip.customer-lifecycle-quoted,
.customer-admin-badge.customer-lifecycle-quoted { background: #cffafe; color: #0e7490; }
.customer-field-select.customer-lifecycle-sampled,
.customer-field-chip.customer-lifecycle-sampled,
.customer-admin-badge.customer-lifecycle-sampled { background: #ccfbf1; color: #0f766e; }
.customer-field-select.customer-lifecycle-negotiating,
.customer-field-chip.customer-lifecycle-negotiating,
.customer-admin-badge.customer-lifecycle-negotiating { background: #fef3c7; color: #b45309; }
.customer-field-select.customer-lifecycle-won,
.customer-field-chip.customer-lifecycle-won,
.customer-admin-badge.customer-lifecycle-won { background: #dcfce7; color: #15803d; }
.customer-field-select.customer-lifecycle-long-term,
.customer-field-chip.customer-lifecycle-long-term,
.customer-admin-badge.customer-lifecycle-long-term { background: #bbf7d0; color: #166534; }
.customer-field-select.customer-lifecycle-paused,
.customer-field-chip.customer-lifecycle-paused,
.customer-admin-badge.customer-lifecycle-paused { background: #f1f5f9; color: #475569; }
.customer-field-select.customer-lifecycle-lost,
.customer-field-chip.customer-lifecycle-lost,
.customer-admin-badge.customer-lifecycle-lost { background: #fee2e2; color: #b91c1c; }
.customer-field-select.customer-lifecycle-other,
.customer-field-chip.customer-lifecycle-other { background: #e2e8f0; color: #334155; }

.customer-field-chip.customer-tag-vip,
.customer-field-select.customer-tag-vip { background: #fef3c7; color: #92400e; border: 1px solid #fcd34d; }
.customer-field-chip.customer-tag-agent,
.customer-field-select.customer-tag-agent { background: #dcfce7; color: #166534; }
.customer-field-chip.customer-tag-retail,
.customer-field-select.customer-tag-retail { background: #dbeafe; color: #1d4ed8; }
.customer-field-chip.customer-tag-oem,
.customer-field-select.customer-tag-oem { background: #ede9fe; color: #6d28d9; }
.customer-field-chip.customer-tag-odm,
.customer-field-select.customer-tag-odm { background: #fce7f3; color: #be185d; }
.customer-field-chip.customer-tag-ecommerce,
.customer-field-select.customer-tag-ecommerce { background: #fce7f3; color: #be185d; }
.customer-field-chip.customer-tag-brand,
.customer-field-select.customer-tag-brand { background: #ffedd5; color: #c2410c; }
.customer-field-chip.customer-tag-trader,
.customer-field-select.customer-tag-trader { background: #e0e7ff; color: #4338ca; }
.customer-field-chip.customer-tag-focus,
.customer-field-select.customer-tag-focus { background: #fee2e2; color: #b91c1c; }
.customer-field-chip.customer-tag-new,
.customer-field-select.customer-tag-new { background: #ccfbf1; color: #0f766e; }
.customer-field-chip.customer-tag-us,
.customer-field-select.customer-tag-us { background: #dbeafe; color: #1d4ed8; }
.customer-field-chip.customer-tag-eu,
.customer-field-select.customer-tag-eu { background: #ede9fe; color: #6d28d9; }
.customer-field-chip.customer-tag-sea,
.customer-field-select.customer-tag-sea { background: #dcfce7; color: #166534; }
.customer-field-chip.customer-tag-me,
.customer-field-select.customer-tag-me { background: #ffedd5; color: #c2410c; }

.customer-field-select.customer-field-lang-zh { background: #fee2e2; color: #b91c1c; }
.customer-field-select.customer-field-lang-en { background: #dbeafe; color: #1d4ed8; }
.customer-field-select.customer-field-lang-es { background: #ffedd5; color: #c2410c; }
.customer-field-select.customer-field-lang-pt { background: #dcfce7; color: #166534; }
.customer-field-select.customer-field-lang-fr { background: #e0e7ff; color: #3730a3; }
.customer-field-select.customer-field-lang-de { background: #f1f5f9; color: #334155; }
.customer-field-select.customer-field-lang-ja { background: #fce7f3; color: #be185d; }
.customer-field-select.customer-field-lang-ru { background: #cffafe; color: #0e7490; }
.customer-field-select.customer-field-lang-ar { background: #bbf7d0; color: #166534; }
.customer-field-select.customer-field-lang-other { background: #e2e8f0; color: #334155; }

.customer-field-select.customer-field-province-hash-0,
.customer-field-chip.customer-field-province-hash-0 { background: #dbeafe; color: #1d4ed8; }
.customer-field-select.customer-field-province-hash-1,
.customer-field-chip.customer-field-province-hash-1 { background: #dcfce7; color: #166534; }
.customer-field-select.customer-field-province-hash-2,
.customer-field-chip.customer-field-province-hash-2 { background: #fef3c7; color: #92400e; }
.customer-field-select.customer-field-province-hash-3,
.customer-field-chip.customer-field-province-hash-3 { background: #fce7f3; color: #be185d; }
.customer-field-select.customer-field-province-hash-4,
.customer-field-chip.customer-field-province-hash-4 { background: #ede9fe; color: #6d28d9; }
.customer-field-select.customer-field-province-hash-5,
.customer-field-chip.customer-field-province-hash-5 { background: #cffafe; color: #0e7490; }
.customer-field-select.customer-field-province-hash-6,
.customer-field-chip.customer-field-province-hash-6 { background: #fee2e2; color: #b91c1c; }
.customer-field-select.customer-field-province-hash-7,
.customer-field-chip.customer-field-province-hash-7 { background: #f1f5f9; color: #475569; }

.customer-field-select.country-cn { background: #fef2f2; color: #dc2626; border-color: #fca5a5; }
.customer-field-select.country-us { background: #eff6ff; color: #2563eb; border-color: #93c5fd; }
.customer-field-select.country-uk { background: #f5f3ff; color: #7c3aed; border-color: #c4b5fd; }
.customer-field-select.country-de { background: #f9fafb; color: #374151; border-color: #d1d5db; }
.customer-field-select.country-jp { background: #fff1f2; color: #e11d48; border-color: #fda4af; }
.customer-field-select.country-au { background: #ecfdf5; color: #059669; border-color: #6ee7b7; }
.customer-field-select.country-fr { background: #eff6ff; color: #1d4ed8; border-color: #93c5fd; }
.customer-field-select.country-kr { background: #ecfeff; color: #0891b2; border-color: #67e8f9; }
.customer-field-select.country-in { background: #fff7ed; color: #ea580c; border-color: #fdba74; }
.customer-field-select.country-ca { background: #fef2f2; color: #b91c1c; border-color: #fca5a5; }
.customer-field-select.country-mx { background: #f0fdf4; color: #16a34a; border-color: #86efac; }
.customer-field-select.country-es { background: #fffbeb; color: #d97706; border-color: #fcd34d; }
.customer-field-select.country-it { background: #ecfdf5; color: #047857; border-color: #6ee7b7; }
.customer-field-select.country-br { background: #fefce8; color: #ca8a04; border-color: #fde047; }
.customer-field-select.country-nl { background: #fff7ed; color: #f97316; border-color: #fdba74; }
.customer-field-select.country-sg { background: #f0fdfa; color: #0d9488; border-color: #5eead4; }
.customer-field-select.country-hk { background: #fdf2f8; color: #db2777; border-color: #f9a8d4; }
.customer-field-select.country-tw { background: #eef2ff; color: #4f46e5; border-color: #a5b4fc; }
.customer-field-select.country-ae { background: #f0fdf4; color: #15803d; border-color: #86efac; }
.customer-field-select.country-sa { background: #f0fdf4; color: #166534; border-color: #86efac; }
.customer-field-select.country-ru { background: #eff6ff; color: #1e40af; border-color: #93c5fd; }
.customer-field-select.country-vn { background: #fffbeb; color: #b45309; border-color: #fcd34d; }
.customer-field-select.country-th { background: #faf5ff; color: #9333ea; border-color: #d8b4fe; }
.customer-field-select.country-my { background: #f0f9ff; color: #0369a1; border-color: #7dd3fc; }
.customer-field-select.country-id { background: #fff1f2; color: #be123c; border-color: #fda4af; }
.customer-field-select.country-ph { background: #f0f9ff; color: #0284c7; border-color: #7dd3fc; }

.customer-field-select.port-ningbo { background: #f0fdf4; color: #16a34a; border-color: #86efac; }
.customer-field-select.port-shanghai { background: #eff6ff; color: #2563eb; border-color: #93c5fd; }
.customer-field-select.port-shenzhen { background: #fff7ed; color: #ea580c; border-color: #fdba74; }
.customer-field-select.port-qingdao { background: #f5f3ff; color: #7c3aed; border-color: #c4b5fd; }
.customer-field-select.port-tianjin { background: #f0fdfa; color: #0d9488; border-color: #5eead4; }
.customer-field-select.port-guangzhou { background: #fffbeb; color: #d97706; border-color: #fcd34d; }
.customer-field-select.port-xiamen { background: #eef2ff; color: #4f46e5; border-color: #a5b4fc; }
.customer-field-select.port-dalian { background: #fff1f2; color: #e11d48; border-color: #fda4af; }
.customer-field-select.port-chongqing { background: #ecfeff; color: #0891b2; border-color: #67e8f9; }
.customer-field-select.port-nanjing { background: #faf5ff; color: #9333ea; border-color: #d8b4fe; }
.customer-field-select.port-yantian { background: #ecfdf5; color: #059669; border-color: #6ee7b7; }
.customer-field-select.port-shekou { background: #fdf2f8; color: #db2777; border-color: #f9a8d4; }

.supplier-evaluation-select {
  min-width: 72px;
  max-width: 96px;
  padding: 2px 6px;
  border-radius: 999px;
  font-size: 11px;
  line-height: 1.35;
  font-weight: 600;
  border: 1px solid transparent;
  cursor: pointer;
}
.supplier-evaluation-select.supplier-evaluation-empty {
  background: #f8fafc;
  color: #64748b;
  border-color: #e2e8f0;
}
.supplier-evaluation-select.supplier-evaluation-skip { background: #f1f5f9; color: #64748b; }
.supplier-evaluation-select.supplier-evaluation-backup { background: #dbeafe; color: #1d4ed8; }
.supplier-evaluation-select.supplier-evaluation-priority { background: #ffedd5; color: #c2410c; }
.supplier-evaluation-select.supplier-evaluation-partnered { background: #dcfce7; color: #166534; }
.supplier-evaluation-select.supplier-evaluation-other { background: #e2e8f0; color: #334155; }
.settings-master-table .customer-website-link {
  color: var(--primary);
  text-decoration: none;
}
.settings-master-table .customer-website-link:hover {
  text-decoration: underline;
}
.supplier-image-gallery-section {
  margin-top: 12px;
}
.supplier-image-gallery-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 10px;
}
.supplier-gallery-item {
  position: relative;
  width: 96px;
}
.supplier-gallery-thumb {
  width: 96px;
  height: 96px;
  object-fit: cover;
  border-radius: 8px;
  border: 1px solid var(--border, #e2e8f0);
  background: #f8fafc;
  display: block;
}
.supplier-gallery-item .delete-supplier-gallery-btn {
  position: absolute;
  top: 4px;
  right: 4px;
  min-width: 24px;
  padding: 0 6px;
  line-height: 1.4;
}
.partner-admin-toolbar-actions {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.partner-admin-toolbar-actions.hidden,
.partner-admin-customer-filters.hidden,
.partner-admin-category-options.hidden,
.partner-admin-lang-options.hidden {
  display: none !important;
}
.partner-search-empty {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 12px;
}
.partner-search-empty .muted {
  margin: 0;
}
.partner-search-quick-add-btn {
  flex-shrink: 0;
}
.partner-admin-panel-head .partner-admin-tip {
  margin: 4px 0 0;
}
.reconciliation-form-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 10px 16px;
  margin-bottom: 12px;
}
.reconciliation-form-grid label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 13px;
}
.reconciliation-readonly {
  background: #f8fafc;
  color: var(--muted);
}
.reconciliation-panel-subtitle {
  margin: 2px 0 0;
  font-size: 12px;
}
.reconciliation-view-toggle {
  display: inline-flex;
  border: 1px solid var(--border, #cbd5e1);
  border-radius: 6px;
  overflow: hidden;
  flex-shrink: 0;
}
.reconciliation-view-toggle-btn {
  border: none;
  background: #f8fafc;
  color: #475569;
  font-size: 12px;
  padding: 6px 10px;
  cursor: pointer;
}
.reconciliation-view-toggle-btn.active {
  background: #2563eb;
  color: #fff;
}
.reconciliation-view-toggle-btn:hover:not(.active) {
  background: #e2e8f0;
}
.reconciliation-exchange-rate-pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  grid-column: 1 / -1;
}
.reconciliation-detail-section--summary {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 12px;
}
.reconciliation-detail-summary-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.reconciliation-payment-badge,
.reconciliation-writeoff-badge {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 4px;
  font-size: 10px;
  line-height: 1.35;
  font-weight: 600;
  white-space: nowrap;
}
.reconciliation-payment-pending {
  background: #fef3c7;
  color: #92400e;
}
.reconciliation-payment-partial {
  background: #dbeafe;
  color: #1d4ed8;
}
.reconciliation-payment-received {
  background: #dcfce7;
  color: #166534;
}
.reconciliation-payment-over {
  background: #fee2e2;
  color: #b91c1c;
}
.reconciliation-writeoff-unclaimed {
  background: #f1f5f9;
  color: #475569;
}
.reconciliation-writeoff-claimed {
  background: #e0e7ff;
  color: #4338ca;
}
.reconciliation-writeoff-written_off {
  background: #dcfce7;
  color: #166534;
}
.reconciliation-status-cell {
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
  align-items: center;
}
.reconciliation-amount-gap-positive {
  color: #b45309;
  font-weight: 600;
}
.reconciliation-col-bank-entries {
  min-width: 108px;
  max-width: 160px;
}
.reconciliation-bank-entry-line {
  display: flex;
  flex-direction: column;
  gap: 1px;
  line-height: 1.25;
}
.reconciliation-bank-entry-line + .reconciliation-bank-entry-line {
  margin-top: 4px;
  padding-top: 4px;
  border-top: 1px dashed var(--border, #e2e8f0);
}
.reconciliation-bank-entry-date {
  font-size: 12px;
  color: var(--muted, #64748b);
}
.reconciliation-bank-entry-amount {
  font-variant-numeric: tabular-nums;
}
.reconciliation-slip-upload-cell {
  white-space: nowrap;
}
.reconciliation-slip-upload-cell .order-upload-btn {
  margin-top: 4px;
}
.reconciliation-attachment-count-badge {
  display: inline-block;
  padding: 1px 5px;
  border-radius: 4px;
  font-size: 10px;
  background: #e2e8f0;
  color: #334155;
}
.reconciliation-panel-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
}
.reconciliation-filter-entity {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
}
.reconciliation-toolbar-dropdown .toolbar-dropdown-panel {
  min-width: 168px;
}
.reconciliation-type-filter-option {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  font-size: 13px;
  cursor: pointer;
  white-space: nowrap;
}
.reconciliation-type-filter-option:hover {
  background: #f1f5f9;
}
.reconciliation-type-filter-option input {
  margin: 0;
}
.reconciliation-single-panel {
  padding: 8px 12px;
}
.reconciliation-add-modal-card {
  width: min(1200px, 98vw);
  max-height: calc(100vh - 32px);
  overflow: auto;
}
.reconciliation-detail-modal-card {
  width: min(1100px, 98vw);
  max-height: calc(100vh - 32px);
  overflow: auto;
}
.booking-detail-modal-card {
  width: min(1100px, 98vw);
  max-height: calc(100vh - 32px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.booking-detail-modal.booking-detail-modal-fullscreen {
  padding: 0;
  align-items: stretch;
}
.booking-detail-modal-card.is-fullscreen {
  width: 100vw;
  max-width: 100vw;
  height: 100vh;
  max-height: 100vh;
  border-radius: 0;
}
.booking-detail-modal-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  padding: 0 0.5rem 0.75rem;
}
.booking-detail-form-fields {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 16px;
}
.booking-detail-form-fields .customer-form-row input,
.booking-detail-form-fields .customer-form-row select {
  width: 100%;
  text-align: center;
  text-align-last: center;
}
.booking-detail-form-fields .customer-form-row label {
  text-align: center;
}
.booking-detail-attachment-section h4,
.booking-detail-attachment-row label,
.booking-detail-attachment-row .order-attachment-list {
  text-align: center;
  justify-content: center;
}
.booking-payment-terms-select option[value="collect"] {
  color: #15803d;
}
.booking-payment-terms-select option[value="prepaid"] {
  color: #b91c1c;
}
.booking-payment-terms-select[data-payment-terms="collect"] {
  color: #15803d;
  font-weight: 600;
}
.booking-payment-terms-select[data-payment-terms="prepaid"] {
  color: #b91c1c;
  font-weight: 600;
}
.booking-forwarder-fees-section {
  margin-top: 12px;
}
.booking-forwarder-fees-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}
.booking-forwarder-fees-table th,
.booking-forwarder-fees-table td {
  text-align: center;
  vertical-align: middle;
}
.booking-forwarder-fees-table input,
.booking-forwarder-fees-table select {
  width: 100%;
  text-align: center;
}
.booking-attachment-send-picker {
  margin: 12px 0;
}
.booking-attachment-send-picker-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 8px 12px;
}
.booking-attachment-send-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 8px;
  background: var(--panel-lite-bg, #fafafa);
}
.product-export-format-modal-card {
  max-width: 520px;
}
.product-export-format-grid {
  display: grid;
  gap: 12px;
  margin: 16px 0;
}
.product-export-format-card {
  display: block;
  cursor: pointer;
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 12px;
  padding: 0;
  transition: border-color 0.15s, box-shadow 0.15s;
}
.product-export-format-card:has(input:checked) {
  border-color: var(--accent, #2563eb);
  box-shadow: 0 0 0 1px var(--accent, #2563eb);
}
.product-export-format-card input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.product-export-format-card-body {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 14px 16px;
}
.pending-tasks-reminder-settings {
  margin-bottom: 16px;
}
.pending-tasks-reminder-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 12px 16px;
  align-items: start;
}
.pending-tasks-reminder-weekdays,
.pending-tasks-reminder-channels {
  border: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
}
.pending-tasks-reminder-weekdays legend,
.pending-tasks-reminder-channels legend {
  width: 100%;
  font-size: 0.85rem;
  color: var(--muted, #6b7280);
  margin-bottom: 4px;
}
.pending-tasks-reminder-customer-select {
  min-width: 220px;
  width: 100%;
  min-height: 88px;
}
.pending-tasks-smtp-settings {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--border, #e5e7eb);
}
.pending-tasks-smtp-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 10px 14px;
  margin: 10px 0;
}
.pending-tasks-smtp-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  align-items: flex-end;
  margin-top: 8px;
}
.pending-tasks-reminder-run-status {
  margin-top: 8px;
  white-space: pre-wrap;
}
.header-app-version,
.login-app-version {
  font-size: 0.78rem;
  font-weight: 500;
  margin-left: 8px;
}
.login-app-version {
  margin-top: 6px;
}
.login-locale-row {
  margin-top: 12px;
}
.ui-locale-switch {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.85rem;
}
.ui-locale-switch select {
  min-width: 108px;
}
.mail-center-layout {
  display: grid;
  grid-template-columns: minmax(280px, 1fr) minmax(320px, 1.2fr);
  gap: 16px;
  margin-top: 12px;
}
.mail-center-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(180px, 1fr));
  gap: 10px 14px;
}
.mail-center-subject-field,
.mail-center-body-field,
.mail-center-attachments-field {
  grid-column: 1 / -1;
}
.mail-center-attachments-list {
  margin: 6px 0 0;
  padding: 0;
  list-style: none;
}
.mail-center-attachments-list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 4px 0;
}
.mail-center-attachments-list button {
  font-size: 12px;
}
.mail-center-body-field textarea {
  width: 100%;
  min-height: 160px;
  resize: vertical;
}
.mail-center-actions {
  margin-top: 10px;
}
.pending-tasks-channel-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
  margin: 10px 0;
}
.pending-tasks-channel-grid fieldset {
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 8px;
  padding: 10px 12px;
}
.pending-tasks-channel-grid label {
  display: block;
  margin: 6px 0;
}
@media (max-width: 960px) {
  .mail-center-layout {
    grid-template-columns: 1fr;
  }
}
.email-send-chooser-actions {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin: 12px 0;
}
.email-send-chooser-remember {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.9rem;
}
.booking-forwarder-custom-input {
  margin-top: 6px;
  width: 100%;
}
  margin-top: 6px;
  width: 100%;
}
  margin-top: 6px;
  width: 100%;
}
.customer-display-languages {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 6px;
}
.customer-display-language-dropdown {
  position: relative;
  margin-top: 6px;
  width: 100%;
}
.customer-display-language-trigger {
  width: 100%;
  text-align: left;
  justify-content: flex-start;
}
.customer-display-language-panel {
  position: absolute;
  z-index: 30;
  left: 0;
  right: 0;
  top: calc(100% + 4px);
  max-height: 220px;
  overflow: auto;
  padding: 8px;
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 8px;
  background: var(--panel, #fff);
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.customer-display-language-option {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.92rem;
}
.customer-display-language-check {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 10px;
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 999px;
  font-size: 0.9rem;
}
.customer-country-select option {
  font-family: inherit;
}
.booking-detail-form-fields .customer-form-row input[type="date"] {
  text-align: center;
}
.booking-detail-numeric-input {
  text-align: right !important;
}
.booking-eta-readonly {
  background: #f9fafb;
  color: #374151;
  cursor: default;
}
.booking-field-span-2 {
  grid-column: span 2;
}
.booking-field-span-3 {
  grid-column: span 3;
}
.booking-detail-attachments-row {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px 16px;
  margin-bottom: 16px;
  padding-top: 8px;
  border-top: 1px solid var(--border, #e5e7eb);
}
.booking-detail-attachments-row .booking-detail-attachment-section {
  margin-bottom: 0;
  min-width: 0;
  padding-top: 0;
  border-top: none;
}
.booking-colored-select {
  font-weight: 600;
}
.booking-colored-select.booking-container-type-20gp {
  background: #ecfdf5;
  border-color: #6ee7b7;
  color: #047857;
}
.booking-colored-select.booking-container-type-40gp {
  background: #eff6ff;
  border-color: #93c5fd;
  color: #1d4ed8;
}
.booking-colored-select.booking-container-type-40hq {
  background: #ecfdf5;
  border-color: #6ee7b7;
  color: #047857;
}
.booking-colored-select.booking-status-applied,
.booking-colored-select.booking-status-booked {
  background: #ecfdf5;
  border-color: #6ee7b7;
  color: #047857;
}
.booking-application-date-input.booking-field-green,
input.booking-field-green {
  background: #ecfdf5;
  border-color: #6ee7b7;
  color: #047857;
  font-weight: 600;
}
.booking-detail-progress {
  margin: 4px 0 16px;
  padding: 12px 14px;
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 8px;
  background: #fafafa;
}
.booking-progress-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.booking-progress-title {
  font-weight: 600;
  color: #111827;
}
.booking-progress-summary {
  font-size: 0.9rem;
  color: #6b7280;
}
.booking-progress-track {
  position: relative;
  height: 6px;
  margin-bottom: 14px;
  border-radius: 999px;
  background: #e5e7eb;
  overflow: hidden;
}
.booking-progress-track-fill {
  display: block;
  height: 100%;
  border-radius: inherit;
  background: linear-gradient(90deg, #34d399, #059669);
  transition: width 0.2s ease;
}
.booking-progress-steps {
  display: grid;
  grid-template-columns: repeat(9, minmax(0, 1fr));
  gap: 8px 6px;
}
.booking-progress-step {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  min-width: 0;
  text-align: center;
}
.booking-progress-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  border: 2px solid #d1d5db;
  background: #fff;
  flex-shrink: 0;
}
.booking-progress-step.is-done .booking-progress-dot {
  border-color: #059669;
  background: #34d399;
}
.booking-progress-label {
  font-size: 0.72rem;
  line-height: 1.2;
  color: #6b7280;
  word-break: break-word;
}
.booking-progress-step.is-done .booking-progress-label {
  color: #047857;
  font-weight: 600;
}
.booking-progress-date {
  font-size: 0.68rem;
  color: #9ca3af;
  word-break: break-word;
}
.booking-progress-step.is-done .booking-progress-date {
  color: #065f46;
}
.booking-detail-attachment-section {
  margin-bottom: 14px;
  padding-top: 8px;
  border-top: 1px solid var(--border, #e5e7eb);
}
.booking-detail-attachment-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 16px;
}
.booking-detail-zone-above-progress,
.booking-detail-zone-below-progress {
  margin-top: 12px;
}
.booking-detail-zone-below-progress.booking-detail-attachments-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px 16px;
}
.booking-detail-send-row {
  margin-top: 16px;
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.booking-detail-send-contacts label {
  min-width: 0;
}
.booking-attachment-status-select.booking-attachment-status-done {
  color: #15803d;
  border-color: #86efac;
  font-weight: 600;
}
.booking-fee-group + .booking-fee-group {
  margin-top: 16px;
  padding-top: 12px;
  border-top: 1px solid var(--border, #e5e7eb);
}
.booking-fee-file-cell {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 120px;
}
.booking-fee-file-cell input[type="text"] {
  width: 100%;
  font-size: 12px;
}
.booking-fee-file-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
}
.booking-fee-file-chip {
  display: inline-block;
  max-width: 140px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  color: #2563eb;
}
.booking-fee-file-upload {
  cursor: pointer;
  margin: 0;
}
.booking-fee-file-remove {
  padding: 0 6px;
  line-height: 1.2;
}
.order-status-filter-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  margin: 0 0 12px;
  padding: 8px 0;
}
.order-status-view-btn,
.order-status-lane-btn {
  border: 1px solid var(--border, #e5e7eb);
  background: #fff;
  border-radius: 999px;
  padding: 4px 12px;
  font-size: 13px;
  cursor: pointer;
}
.order-status-view-btn.active,
.order-status-lane-btn.active {
  background: #eff6ff;
  border-color: #93c5fd;
  color: #1d4ed8;
  font-weight: 600;
}
.order-status-lines-master-table td {
  vertical-align: middle;
}
.booking-list-wrap .booking-table-wrap {
  overflow-x: auto;
}
.booking-table th,
.booking-table td {
  text-align: center;
  vertical-align: middle;
}
.booking-remarks-label {
  grid-column: span 4;
}
@media (max-width: 1200px) {
  .booking-detail-attachments-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .booking-progress-steps {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (max-width: 720px) {
  .booking-detail-attachments-row {
    grid-template-columns: 1fr;
  }
  .booking-progress-steps {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .booking-field-span-2,
  .booking-field-span-3 {
    grid-column: span 1;
  }
}
.booking-mixed-badge {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 7px;
  border-radius: 999px;
  font-size: 11px;
  line-height: 1.5;
  color: #7c2d12;
  background: #ffedd5;
  border: 1px solid #fdba74;
  vertical-align: middle;
}
.booking-supplier-mixed-label {
  color: var(--muted, #6b7280);
}
.reconciliation-amount-input {
  width: 100%;
}
.reconciliation-add-sections {
  display: grid;
  grid-template-columns: minmax(150px, 0.85fr) minmax(260px, 1.15fr) minmax(260px, 1.15fr);
  gap: 14px;
  align-items: stretch;
  margin-bottom: 14px;
}
.reconciliation-add-sections.reconciliation-add-sections--finance {
  grid-template-columns: minmax(0, 1.5fr) minmax(280px, 1fr);
  width: 100%;
}
.reconciliation-add-bank-grid {
  margin: 0;
}
.reconciliation-add-modal-card .reconciliation-add-section {
  min-width: 0;
}
.reconciliation-add-modal-card .reconciliation-add-section-grid label,
.reconciliation-add-modal-card .reconciliation-add-attachment-field,
.reconciliation-add-modal-card .reconciliation-detail-form-grid label,
.reconciliation-add-modal-card .reconciliation-exchange-rate-field {
  min-width: 0;
}
.reconciliation-exchange-rate-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 13px;
  min-width: 0;
}
.reconciliation-exchange-rate-label {
  font-weight: 600;
  color: #334155;
}
.reconciliation-exchange-rate-display {
  margin: 0;
  font-size: 13px;
  line-height: 1.4;
}
.reconciliation-exchange-rate-display.reconciliation-exchange-rate-error {
  color: #b45309;
}
.reconciliation-exchange-rate-manual {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.reconciliation-exchange-rate-input {
  width: 100%;
  max-width: 10rem;
}
.reconciliation-col-rate {
  min-width: 4.5rem;
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.reconciliation-add-section {
  border: 1px solid var(--line);
  border-radius: 8px;
  padding: 14px 16px;
  background: #fafbfc;
  min-height: 100%;
}
.reconciliation-add-section-title {
  margin: 0 0 12px;
  font-size: 13px;
  font-weight: 600;
  color: #334155;
}
.reconciliation-add-section-grid {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 100%;
}
.reconciliation-add-section-grid label,
.reconciliation-add-attachment-field {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 13px;
  min-width: 0;
}
.reconciliation-add-section-grid label input,
.reconciliation-add-section-grid label select {
  width: 100%;
  box-sizing: border-box;
}
.reconciliation-add-field-label {
  font-size: 13px;
}
.reconciliation-add-attachment-field .order-upload-btn {
  align-self: stretch;
  justify-content: center;
}
.reconciliation-order-desc-hint {
  margin: -4px 0 2px;
  font-size: 12px;
  line-height: 1.4;
}
.reconciliation-add-section--basic .reconciliation-add-section-grid {
  padding-top: 4px;
}
@media (max-width: 1100px) {
  .reconciliation-add-sections.reconciliation-add-sections--finance {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 960px) {
  .reconciliation-add-sections {
    grid-template-columns: 1fr;
  }
  .reconciliation-add-modal-card .reconciliation-detail-form-grid.reconciliation-add-bank-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 640px) {
  .reconciliation-add-modal-card .reconciliation-detail-form-grid.reconciliation-add-bank-grid {
    grid-template-columns: 1fr;
  }
}
.reconciliation-table {
  font-size: 12px;
}
.reconciliation-table th,
.reconciliation-table td {
  text-align: center;
  vertical-align: middle;
}
.reconciliation-table th.num-right,
.reconciliation-table td.num-right {
  text-align: center;
}
.reconciliation-table th.reconciliation-col-amount {
  text-align: center;
}
.reconciliation-table td.reconciliation-col-amount {
  text-align: right;
}
.reconciliation-table .reconciliation-col-compact {
  max-width: 72px;
  width: 72px;
  padding: 4px 5px;
  font-size: 11px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.reconciliation-table .reconciliation-col-narrow {
  max-width: 36px;
  width: 4ch;
  padding: 4px 3px;
}
.reconciliation-table .reconciliation-col-order-desc {
  min-width: 80px;
  max-width: 140px;
}
.reconciliation-table th.reconciliation-col-compact {
  font-size: 11px;
  font-weight: 600;
}
.reconciliation-type-badge,
.reconciliation-entity-badge,
.reconciliation-bank-badge {
  display: inline-block;
  padding: 1px 5px;
  border-radius: 4px;
  font-size: 10px;
  line-height: 1.3;
  font-weight: 600;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
}
.reconciliation-type-deposit {
  background: #dcfce7;
  color: #166534;
}
.reconciliation-type-final {
  background: #dbeafe;
  color: #1d4ed8;
}
.reconciliation-type-commission {
  background: #fee2e2;
  color: #b91c1c;
}
.reconciliation-type-other {
  background: #e2e8f0;
  color: #334155;
}
.reconciliation-type-ocean_freight {
  background: #ccfbf1;
  color: #0f766e;
}
.reconciliation-type-inland_freight {
  background: #ffedd5;
  color: #c2410c;
}
.reconciliation-type-mold_fee {
  background: #ede9fe;
  color: #6d28d9;
}
.reconciliation-bank-icbc {
  background: #dcfce7;
  color: #166534;
}
.reconciliation-bank-ccb {
  background: #dbeafe;
  color: #1d4ed8;
}
.reconciliation-bank-boc {
  background: #fee2e2;
  color: #b91c1c;
}
.reconciliation-bank-abc {
  background: #d1fae5;
  color: #047857;
}
.reconciliation-bank-cmb {
  background: #ffe4e6;
  color: #be123c;
}
.reconciliation-bank-bocom {
  background: #e0e7ff;
  color: #4338ca;
}
.reconciliation-bank-spdb {
  background: #e0f2fe;
  color: #0369a1;
}
.reconciliation-bank-cib {
  background: #f3e8ff;
  color: #7e22ce;
}
.reconciliation-bank-cmbc {
  background: #fef3c7;
  color: #92400e;
}
.reconciliation-bank-ceb {
  background: #fce7f3;
  color: #be185d;
}
.reconciliation-bank-pab {
  background: #fed7aa;
  color: #c2410c;
}
.reconciliation-bank-hash-0 {
  background: #dbeafe;
  color: #1d4ed8;
}
.reconciliation-bank-hash-1 {
  background: #dcfce7;
  color: #166534;
}
.reconciliation-bank-hash-2 {
  background: #ede9fe;
  color: #6d28d9;
}
.reconciliation-bank-hash-3 {
  background: #fef3c7;
  color: #92400e;
}
.reconciliation-bank-hash-4 {
  background: #fce7f3;
  color: #be185d;
}
.reconciliation-bank-hash-5 {
  background: #ccfbf1;
  color: #0f766e;
}
.reconciliation-bank-hash-6 {
  background: #ffedd5;
  color: #c2410c;
}
.reconciliation-bank-hash-7 {
  background: #e0e7ff;
  color: #4338ca;
}
.reconciliation-bank-hash-8 {
  background: #fef9c3;
  color: #a16207;
}
.reconciliation-bank-hash-9 {
  background: #f3e8ff;
  color: #7e22ce;
}
.reconciliation-entity-0 {
  background: #dbeafe;
  color: #1d4ed8;
}
.reconciliation-entity-1 {
  background: #dcfce7;
  color: #166534;
}
.reconciliation-entity-2 {
  background: #ede9fe;
  color: #6d28d9;
}
.reconciliation-entity-3 {
  background: #fef3c7;
  color: #92400e;
}
.reconciliation-entity-4 {
  background: #fce7f3;
  color: #be185d;
}
.reconciliation-entity-5 {
  background: #ccfbf1;
  color: #0f766e;
}
.reconciliation-entity-6 {
  background: #ffedd5;
  color: #c2410c;
}
.reconciliation-entity-7 {
  background: #e0e7ff;
  color: #4338ca;
}
.reconciliation-entity-8 {
  background: #fef9c3;
  color: #a16207;
}
.reconciliation-entity-9 {
  background: #f3e8ff;
  color: #7e22ce;
}
.reconciliation-claim-badge {
  display: inline-block;
  padding: 1px 5px;
  border-radius: 4px;
  font-size: 10px;
  line-height: 1.3;
}
.reconciliation-claim-pending {
  background: #fef3c7;
  color: #92400e;
}
.reconciliation-claim-claimed {
  background: #dcfce7;
  color: #166534;
}
.reconciliation-usage-badge {
  display: inline-block;
  padding: 1px 5px;
  border-radius: 4px;
  font-size: 10px;
  line-height: 1.3;
  font-weight: 600;
}
.reconciliation-usage-unused {
  background: #dcfce7;
  color: #166534;
}
.reconciliation-usage-used {
  background: #fee2e2;
  color: #b91c1c;
}
.reconciliation-usage-completed {
  background: #dbeafe;
  color: #1d4ed8;
}
.reconciliation-completion-badge {
  display: inline-block;
  margin-left: 4px;
  padding: 1px 5px;
  border-radius: 4px;
  font-size: 10px;
  line-height: 1.3;
  font-weight: 600;
  background: #e2e8f0;
  color: #334155;
}
.order-status-deposit-usage-section {
  margin-bottom: 12px;
}
.order-status-deposit-usage-wrap {
  overflow-x: auto;
}
.order-status-deposit-table {
  margin-top: 6px;
}
.order-status-deposit-table .deposit-usage-amount {
  width: 100%;
  min-width: 88px;
}
.order-status-deposit-applied {
  margin-top: 8px;
  font-size: 12px;
}
.order-status-detail-modal-card {
  width: min(1180px, 96vw);
  max-height: 92vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.order-status-detail-modal-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
}
.order-status-detail-modal-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}
.order-status-detail-meta {
  flex-direction: column;
  align-items: stretch;
  margin-top: 8px;
  gap: 10px;
  overflow: visible;
  position: relative;
  z-index: 2;
}
.order-status-detail-meta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  align-items: center;
  overflow: visible;
  position: relative;
}
.order-status-detail-meta .orders-meta-label {
  font-size: 12px;
  position: relative;
  z-index: 1;
  flex: 0 1 auto;
}
.order-status-detail-meta .orders-meta-label:focus-within {
  z-index: 5;
}
.order-status-detail-meta .orders-meta-input,
.order-status-detail-meta select,
.order-status-detail-meta input[type="date"] {
  min-width: 6.5rem;
  max-width: 9rem;
  position: relative;
  z-index: 1;
  pointer-events: auto;
}
.order-status-detail-meta select {
  appearance: auto;
  -webkit-appearance: menulist;
  cursor: pointer;
}
.order-status-order-name-en-label {
  flex: 0 1 auto;
  min-width: 10rem;
}
.order-status-order-name-en-input {
  min-width: 10rem;
  max-width: 18rem;
  width: 100%;
}
.order-status-save-btn {
  padding: 8px 18px;
  font-size: 14px;
  font-weight: 600;
  min-width: 72px;
  border-radius: 8px;
}
.order-status-save-btn-dirty {
  background: var(--primary);
  color: #fff;
  border-color: var(--primary);
}
.order-status-save-btn-dirty:hover {
  background: #1e40af;
  border-color: #1e40af;
}
.order-status-save-btn-clean {
  background: #94a3b8;
  color: #fff;
  border-color: #94a3b8;
}
.order-status-save-btn-clean:hover {
  background: #64748b;
  border-color: #64748b;
}
.order-status-save-btn:disabled {
  opacity: 0.55;
  cursor: not-allowed;
}
.order-status-payment-rows {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.order-status-payment-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 14px;
  align-items: center;
  overflow: visible;
}
.order-status-payment-row .orders-meta-label {
  font-size: 12px;
  position: relative;
  z-index: 1;
  flex: 0 1 auto;
}
.order-status-payment-row .orders-meta-label:focus-within {
  z-index: 5;
}
.order-status-payment-row .orders-meta-input,
.order-status-payment-row select,
.order-status-payment-row input[type="date"] {
  min-width: 6.5rem;
  max-width: 9rem;
  position: relative;
  z-index: 1;
  pointer-events: auto;
}
.order-status-payment-row select {
  appearance: auto;
  -webkit-appearance: menulist;
  cursor: pointer;
}
.order-status-collapsible-section {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid #e2e8f0;
}
.order-status-collapsible-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  margin: 0 0 10px;
  padding: 6px 8px;
  border: 0;
  border-radius: 8px;
  background: #f8fafc;
  color: #0f172a;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.order-status-collapsible-head:hover { background: #eff6ff; }
.order-status-collapsible-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex: 1;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.order-status-lines-collapsible-head {
  padding: 6px 8px;
  border-radius: 8px;
  background: #f8fafc;
}
.order-status-lines-collapsible-head:hover { background: #eff6ff; }
.order-status-collapsible-title {
  font-size: 14px;
  font-weight: 600;
  color: #0f172a;
}
.order-status-collapsible-chevron {
  flex-shrink: 0;
  font-size: 11px;
  color: #64748b;
}
.order-status-collapsible-body.collapsed { display: none; }
.order-status-collapsible-body:not(.collapsed) {
  overflow: visible;
}
.order-status-payment-section,
.order-status-sgs-section,
.order-status-documents-section {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid #e2e8f0;
}
.order-status-documents-table-wrap {
  overflow-x: auto;
}
.order-status-documents-table .orders-attachment-cell {
  min-width: 150px;
  vertical-align: top;
}
.order-status-documents-table .order-status-document-sent-cell {
  min-width: 110px;
  vertical-align: middle;
}
.order-status-status-select {
  min-width: 108px;
  font-weight: 600;
  border-radius: 6px;
}
.order-status-status-select.sgs-status-pending,
.order-status-status-select.payment-collection-status-pending {
  background: #fef9c3;
  color: #854d0e;
  border-color: #fde047;
}
.order-status-status-select.sgs-status-processed,
.order-status-status-select.payment-status-paid,
.order-status-status-select.document-sent-status-sent {
  background: #dcfce7;
  color: #166534;
  border-color: #86efac;
}
.order-status-status-select.payment-collection-status-partial {
  background: #fee2e2;
  color: #991b1b;
  border-color: #fca5a5;
}
.order-status-status-select.payment-collection-status-complete {
  background: #dcfce7;
  color: #166534;
  border-color: #86efac;
}
.order-status-status-select.payment-status-unpaid,
.order-status-status-select.document-sent-status-not_sent {
  background: #fef9c3;
  color: #854d0e;
  border-color: #fde047;
}
.reconciliation-master-row {
  cursor: pointer;
}
.reconciliation-master-row:hover td {
  background: #f8fafc;
}
.reconciliation-detail-actions button:disabled {
  cursor: not-allowed;
  opacity: 0.72;
}
.reconciliation-detail-section {
  margin-bottom: 14px;
}
.reconciliation-detail-form-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(200px, 1fr));
  gap: 10px 16px;
  margin: 12px 0;
}
.reconciliation-add-modal-card .reconciliation-detail-form-grid.reconciliation-add-bank-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 0;
}
.reconciliation-detail-trade-grid {
  grid-template-columns: repeat(4, minmax(160px, 1fr));
}
.reconciliation-detail-trade-grid .reconciliation-remarks-label {
  grid-column: span 2;
}
.reconciliation-detail-attachment-inline {
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  font-size: 13px;
}
.reconciliation-detail-attachment-inline .reconciliation-detail-attachment-label {
  font-size: 13px;
  font-weight: 600;
}
.reconciliation-detail-attachment-inline .order-upload-btn {
  align-self: stretch;
  justify-content: center;
}
.reconciliation-detail-form-grid label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 13px;
  min-width: 0;
}
.reconciliation-detail-form-grid label input,
.reconciliation-detail-form-grid label select {
  width: 100%;
  box-sizing: border-box;
}
.reconciliation-detail-readonly-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(160px, 1fr));
  gap: 8px 16px;
  margin-top: 8px;
}
.reconciliation-detail-readonly-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: 13px;
}
.reconciliation-detail-readonly-label {
  color: #64748b;
  font-size: 11px;
}
.reconciliation-detail-attachments {
  display: grid;
  gap: 14px;
  margin: 12px 0 16px;
}
.reconciliation-detail-attachment-block {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.reconciliation-detail-attachment-label {
  font-size: 13px;
  font-weight: 600;
}
.reconciliation-detail-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
@media (max-width: 960px) {
  .reconciliation-detail-modal-card .reconciliation-detail-form-grid,
  .reconciliation-detail-modal-card .reconciliation-detail-readonly-grid {
    grid-template-columns: repeat(2, minmax(160px, 1fr));
  }
  .reconciliation-detail-modal-card .reconciliation-detail-trade-grid {
    grid-template-columns: repeat(2, minmax(160px, 1fr));
  }
  .reconciliation-detail-summary-grid {
    grid-template-columns: repeat(2, minmax(140px, 1fr));
  }
  .reconciliation-exchange-rate-pair {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 640px) {
  .reconciliation-detail-modal-card .reconciliation-detail-form-grid,
  .reconciliation-detail-modal-card .reconciliation-detail-readonly-grid {
    grid-template-columns: 1fr;
  }
  .reconciliation-detail-summary-grid {
    grid-template-columns: 1fr;
  }
}
.inquiry-draft-list-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #f8fafc;
}
.inquiry-draft-list-label {
  font-size: 13px;
  color: var(--muted);
  white-space: nowrap;
}
.inquiry-draft-chip {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: #fff;
  overflow: hidden;
}
.inquiry-draft-chip.active {
  border-color: var(--accent);
  box-shadow: 0 0 0 1px var(--accent);
}
.inquiry-draft-load-btn {
  border: none;
  background: transparent;
  padding: 4px 10px;
  font-size: 12px;
  cursor: pointer;
}
.inquiry-draft-delete-btn {
  border: none;
  background: transparent;
  color: #94a3b8;
  padding: 2px 8px 2px 0;
  font-size: 14px;
  cursor: pointer;
}
.inquiry-draft-delete-btn:hover {
  color: #dc2626;
}
.inquiry-detail-attachments-wrap,
.inquiry-inquiry-attachments-wrap {
  min-width: 0;
  max-width: 100%;
}
.inquiry-inquiry-attachments-label {
  min-width: 0;
}
.orders-meta-attachments-label {
  min-width: 0;
}
.reconciliation-table-wrap {
  overflow-x: auto;
}
.reconciliation-table .reconciliation-diff-cell {
  font-weight: 600;
}
.reconciliation-total-row td {
  border-top: 2px solid var(--line);
  background: #f8fafc;
}
.reconciliation-attachments-cell {
  min-width: 120px;
}
.reconciliation-record-attachments {
  margin: 0;
  padding: 0;
}
.reconciliation-attachment-label {
  grid-column: 1 / -1;
  max-width: 480px;
}
.reconciliation-invoice-link {
  color: var(--accent, #2563eb);
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.reconciliation-invoice-link:hover {
  color: #1d4ed8;
}
.reconciliation-reminder-badge {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
  background: #fef3c7;
  color: #92400e;
  border: 1px solid #fcd34d;
}
.reconciliation-reminder-due {
  background: transparent;
  border: none;
  padding: 0;
  color: #dc2626;
  font-weight: 700;
}
.reconciliation-deposit-warning {
  margin-bottom: 10px;
  padding: 10px 12px;
  border-radius: 6px;
  background: #fff7ed;
  border: 1px solid #fdba74;
  color: #9a3412;
  font-size: 13px;
  line-height: 1.5;
}
.reconciliation-table .reconciliation-col-remarks {
  min-width: 120px;
  max-width: 180px;
}
.reconciliation-detail-form-grid .reconciliation-remarks-label {
  grid-column: 1 / -1;
}
.reconciliation-checkbox-label {
  display: flex;
  align-items: center;
  gap: 6px;
}
.shipping-budget-mode-bar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}
.shipping-budget-inventory-table th,
.shipping-budget-inventory-table td {
  vertical-align: middle;
}
.shipping-budget-inventory-table th.shipping-budget-text-head,
.shipping-budget-inventory-table td.shipping-budget-text-cell {
  text-align: center;
}
.shipping-budget-inventory-table th.shipping-budget-num-head,
.shipping-budget-inventory-table td.shipping-budget-num-cell {
  text-align: right;
}
.shipping-budget-inventory-table th.shipping-budget-check-head,
.shipping-budget-inventory-table td.shipping-budget-check-cell {
  text-align: center;
}
.shipping-budget-inventory-table th.shipping-budget-receiving-head,
.shipping-budget-inventory-table td.shipping-budget-receiving-cell {
  min-width: 120px;
}
.shipping-budget-inventory-table th.shipping-budget-po-head,
.shipping-budget-inventory-table td.shipping-budget-po-cell {
  min-width: 120px;
}
.shipping-budget-inventory-table th.shipping-budget-confirm-head,
.shipping-budget-inventory-table td.shipping-budget-confirm-cell {
  min-width: 140px;
}
.shipping-budget-inventory-table th.shipping-budget-warehouse-head,
.shipping-budget-inventory-table td.shipping-budget-warehouse-cell {
  min-width: 80px;
}
.shipping-budget-inventory-table th.shipping-budget-total-amount-head,
.shipping-budget-inventory-table td.shipping-budget-total-amount-cell {
  min-width: 96px;
}
.shipping-budget-inventory-table th.shipping-budget-order-name-head,
.shipping-budget-inventory-table td.shipping-budget-order-name-cell {
  min-width: 240px;
}
.shipping-budget-inventory-table th.shipping-budget-huohao-head,
.shipping-budget-inventory-table td.shipping-budget-huohao-cell {
  min-width: 100px;
}
.shipping-budget-inventory-table th.shipping-budget-customer-head,
.shipping-budget-inventory-table td.shipping-budget-customer-cell {
  min-width: 72px;
}
.recognition-item-no-cell {
  font-size: 12px;
  max-width: 200px;
  word-break: break-all;
}
.pre-shipment-list {
  margin-top: 8px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}
.pre-shipment-list-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 10px;
}
.pre-shipment-list-head h4 { margin: 0; }
.pre-shipment-card {
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  margin-bottom: 10px;
  overflow: hidden;
}
.pre-shipment-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  background: #f8fafc;
  cursor: pointer;
}
.pre-shipment-card-head:hover { background: #eff6ff; }
.pre-shipment-card-title { font-weight: 600; }
.pre-shipment-card-meta {
  font-size: 12px;
  color: var(--muted);
}
.pre-shipment-card-body {
  padding: 0 12px 12px;
}
.pre-shipment-card-body.hidden { display: none; }
.pre-shipment-items-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}
.pre-shipment-items-table th,
.pre-shipment-items-table td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
  text-align: center;
  vertical-align: middle;
}
.pre-shipment-items-table th.pre-shipment-num-head,
.pre-shipment-items-table td.pre-shipment-num-cell {
  text-align: right;
}

.shipping-budget-detail-modal-card {
  width: min(1560px, 98vw);
  max-height: calc(100vh - 32px);
  display: flex;
  flex-direction: column;
}
.shipping-budget-detail-modal-card.is-fullscreen {
  width: 100vw;
  max-width: 100vw;
  height: 100vh;
  max-height: 100vh;
  border-radius: 0;
}
.shipping-budget-detail-modal.shipping-budget-detail-modal-fullscreen {
  padding: 0;
  align-items: stretch;
}
.pre-shipment-detail-modal-card {
  width: min(1560px, 98vw);
  max-height: calc(100vh - 32px);
  display: flex;
  flex-direction: column;
}
.pre-shipment-detail-modal-card.is-fullscreen {
  width: 100vw;
  max-width: 100vw;
  height: 100vh;
  max-height: 100vh;
  border-radius: 0;
}
.pre-shipment-detail-modal.pre-shipment-detail-modal-fullscreen {
  padding: 0;
  align-items: stretch;
}
.pre-shipment-main-table td.pre-shipment-main-name-cell {
  cursor: pointer;
  color: var(--link, #2563eb);
}
.pre-shipment-main-table td.pre-shipment-main-name-cell:hover {
  text-decoration: underline;
}
.pre-shipment-main-table .pre-shipment-main-row {
  cursor: pointer;
}
.pre-shipment-main-table .pre-shipment-main-row:hover {
  background: #eff6ff;
}
.pre-shipment-main-table .pre-shipment-main-row.active {
  background: #dbeafe;
}
.shipping-budget-detail-modal-body {
  overflow: auto;
  flex: 1 1 auto;
  min-height: 200px;
}
.shipping-budget-detail-body-wrap {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 200px;
  margin-top: 4px;
}
.shipping-budget-detail-body-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 6px;
}
.shipping-budget-detail-body-title {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  color: #0f172a;
}
.shipping-budget-detail-body-fullscreen-btn {
  flex-shrink: 0;
  font-size: 12px;
  padding: 4px 10px;
}
.shipping-budget-detail-modal-card.shipping-budget-detail-body-fullscreen > h3,
.shipping-budget-detail-modal-card.shipping-budget-detail-body-fullscreen > .modal-tip,
.shipping-budget-detail-modal-card.shipping-budget-detail-body-fullscreen > .shipping-budget-detail-header,
.shipping-budget-detail-modal-card.shipping-budget-detail-body-fullscreen > .shipping-budget-deposit-section,
.shipping-budget-detail-modal-card.shipping-budget-detail-body-fullscreen > .shipping-budget-modal-summary-wrap,
.shipping-budget-detail-modal-card.shipping-budget-detail-body-fullscreen > .shipping-budget-modal-pagination,
.shipping-budget-detail-modal-card.shipping-budget-detail-body-fullscreen > .shipping-budget-modal-footer {
  display: none;
}
.shipping-budget-detail-modal-card.shipping-budget-detail-body-fullscreen .shipping-budget-detail-body-wrap {
  flex: 1 1 auto;
  min-height: 0;
  margin-top: 0;
}
.shipping-budget-detail-modal-card.shipping-budget-detail-body-fullscreen .shipping-budget-detail-modal-body {
  flex: 1 1 auto;
  min-height: 0;
}
.pre-shipment-detail-modal-body {
  overflow: auto;
  flex: 1 1 auto;
  min-height: 200px;
}
.shipping-budget-modal-toolbar,
.shipping-budget-modal-footer,
.pre-shipment-modal-toolbar,
.pre-shipment-modal-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 12px 0;
}
.shipping-budget-modal-footer,
.pre-shipment-modal-footer {
  justify-content: flex-end;
  margin-top: auto;
}
.shipping-budget-modal-pagination .list-pagination-bar,
.pre-shipment-modal-pagination .list-pagination-bar {
  margin-top: 8px;
}
.shipping-budget-modal-table,
.pre-shipment-modal-table {
  width: 100%;
  min-width: 1200px;
}
.shipping-budget-modal-summary-wrap {
  margin-top: 10px;
}
.shipping-budget-modal-summary {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px 24px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--panel-2, rgba(0, 0, 0, 0.02));
}
.shipping-budget-modal-summary-stacked {
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
}
.shipping-budget-modal-summary-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 20px;
  padding: 6px 0;
  border-top: 1px solid var(--line);
}
.shipping-budget-modal-summary-row:first-child {
  border-top: none;
  padding-top: 0;
}
.shipping-budget-modal-summary-bl-row {
  flex-wrap: wrap;
}
.shipping-budget-modal-summary-bl-row .shipping-budget-modal-summary-row-items {
  flex: 1 1 auto;
  min-width: 0;
}
.shipping-budget-modal-summary-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  flex-shrink: 0;
  margin-left: auto;
}
.shipping-budget-modal-summary-row-label {
  flex: 0 0 36px;
  font-size: 13px;
  font-weight: 600;
  color: var(--muted);
}
.shipping-budget-modal-summary-row-items {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px 24px;
  flex: 1 1 auto;
}
.shipping-budget-modal-summary-item {
  display: flex;
  align-items: baseline;
  gap: 8px;
  font-size: 13px;
}
.shipping-budget-modal-summary-label {
  color: var(--muted);
}
.shipping-budget-modal-summary-item strong {
  font-weight: 600;
}
.shipping-budget-modal-table th,
.shipping-budget-modal-table td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
  vertical-align: middle;
}
.shipping-budget-modal-table th.shipping-budget-modal-text-head,
.shipping-budget-modal-table td.shipping-budget-modal-text-cell {
  text-align: center;
}
.shipping-budget-modal-table th.shipping-budget-modal-num-head,
.shipping-budget-modal-table td.shipping-budget-modal-num-cell {
  text-align: right;
}
.shipping-budget-modal-table th.shipping-budget-modal-check-head,
.shipping-budget-modal-table td.shipping-budget-modal-check-cell {
  text-align: center;
  width: 40px;
}
.shipping-budget-modal-table th.shipping-budget-modal-pi-head,
.shipping-budget-modal-table td.shipping-budget-modal-pi-cell {
  min-width: 130px;
}
.shipping-budget-modal-table th.shipping-budget-modal-po-head,
.shipping-budget-modal-table td.shipping-budget-modal-po-cell {
  min-width: 130px;
}
.shipping-budget-modal-table th.shipping-budget-modal-image-head,
.shipping-budget-modal-table td.shipping-budget-modal-image-cell {
  width: 56px;
  min-width: 56px;
  max-width: 56px;
  text-align: center;
  padding: 4px;
}
.shipping-budget-modal-table .shipping-budget-modal-line-thumb {
  width: 44px;
  height: 44px;
  object-fit: cover;
  border-radius: 4px;
  display: block;
  margin: 0 auto;
}
.shipping-budget-modal-table th.shipping-budget-modal-huohao-head,
.shipping-budget-modal-table td.shipping-budget-modal-huohao-cell {
  min-width: 84px;
}
.shipping-budget-modal-table th.shipping-budget-modal-customer-sku-head,
.shipping-budget-modal-table td.shipping-budget-modal-customer-sku-cell {
  min-width: 100px;
}
.shipping-budget-modal-table th.shipping-budget-modal-name-head,
.shipping-budget-modal-table td.shipping-budget-modal-name-cell {
  min-width: 126px;
}
.shipping-budget-modal-table th.shipping-budget-modal-recognition-head,
.shipping-budget-modal-table td.shipping-budget-modal-recognition-cell {
  min-width: 260px;
}
.shipping-budget-modal-table th.shipping-budget-modal-shipment-desc-head,
.shipping-budget-modal-table td.shipping-budget-modal-shipment-desc-cell {
  min-width: 280px;
}
.shipping-budget-modal-table th.shipping-budget-modal-foreign-shipment-desc-head,
.shipping-budget-modal-table td.shipping-budget-modal-foreign-shipment-desc-cell {
  min-width: 280px;
}
.shipping-budget-detail-totals-row {
  background: #f8fafc;
  border-top: 2px solid #cbd5e1;
}
.shipping-budget-detail-totals-row td {
  font-weight: 600;
}
.shipping-budget-detail-totals-label {
  text-align: right;
  padding-right: 10px;
}
#shippingBudgetDetailModalBody .shipping-budget-detail-total-amount-col,
#shippingBudgetDetailModalBody th.shipping-budget-detail-total-amount-col,
#shippingBudgetDetailModalBody td.shipping-budget-detail-total-amount-col,
#shippingBudgetDetailModalBody th.shipping-budget-detail-usd-total-amount-col,
#shippingBudgetDetailModalBody td.shipping-budget-detail-usd-total-amount-col {
  background-color: #fef9c3;
}
.shipping-budget-detail-totals-row [data-shipping-budget-detail-total="budgetTotalAmount"],
.shipping-budget-detail-totals-row [data-shipping-budget-detail-total="budgetUsdTotalAmount"] {
  background-color: #fef9c3;
}
.shipping-budget-modal-carton-input,
.shipping-budget-modal-bl-input,
.shipping-budget-modal-num-input,
.shipping-budget-detail-header-input[type="text"].shipping-budget-detail-num-input {
  width: 72px;
  text-align: right;
  padding: 4px 6px;
}
.shipping-budget-modal-bl-input {
  width: 120px;
  min-width: 120px;
  font-size: 13px;
  padding: 4px 8px;
  position: relative;
  z-index: 2;
}
.shipping-budget-modal-summary-bl-row .shipping-budget-modal-summary-row-items {
  flex: 1 1 auto;
  min-width: 0;
  position: relative;
  z-index: 2;
}
.shipping-budget-modal-summary-bl-row .shipping-budget-modal-summary-item {
  flex-shrink: 0;
}
.shipping-budget-modal-summary-bl-row .shipping-budget-modal-summary-actions {
  position: relative;
  z-index: 1;
  pointer-events: auto;
}
.shipping-budget-detail-fees-grid .shipping-budget-detail-num-input {
  width: 100%;
  text-align: right;
}
.shipping-budget-modal-carton-input::-webkit-outer-spin-button,
.shipping-budget-modal-carton-input::-webkit-inner-spin-button,
.shipping-budget-modal-bl-input::-webkit-outer-spin-button,
.shipping-budget-modal-bl-input::-webkit-inner-spin-button,
.shipping-budget-modal-num-input::-webkit-outer-spin-button,
.shipping-budget-modal-num-input::-webkit-inner-spin-button,
.shipping-budget-detail-num-input::-webkit-outer-spin-button,
.shipping-budget-detail-num-input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.shipping-budget-modal-carton-input,
.shipping-budget-modal-bl-input,
.shipping-budget-modal-num-input,
.shipping-budget-detail-num-input {
  -moz-appearance: textfield;
  appearance: textfield;
}
.shipping-budget-detail-header {
  margin: 6px 0 8px;
  padding: 8px 10px;
  border: 1px solid var(--border-color, #d8dee9);
  border-radius: 8px;
  background: var(--panel-bg, #f8fafc);
}
.shipping-budget-detail-header-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px 16px;
}
.shipping-budget-detail-header-grid-compact {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px 10px;
}
.shipping-budget-detail-header-grid-6col {
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 6px 10px;
}
.shipping-budget-detail-header-grid-8col {
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: 6px 10px;
}
.shipping-budget-detail-header-rows {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.shipping-budget-detail-header-row-primary {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px 12px;
}
.shipping-budget-detail-header-row-primary .shipping-budget-detail-header-item {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
  min-width: 0;
}
.shipping-budget-detail-header-row-primary .shipping-budget-detail-header-label {
  flex: 0 0 auto;
  white-space: nowrap;
}
.shipping-budget-detail-header-row-primary .shipping-budget-detail-header-input-compact,
.shipping-budget-detail-header-row-primary select.shipping-budget-detail-header-input-compact {
  flex: 0 0 9.5ch;
  width: 9.5ch;
  min-width: 9.5ch;
  max-width: 9.5ch;
}
.shipping-budget-detail-header-row-primary .shipping-budget-detail-header-input-wide,
.shipping-budget-detail-header-row-primary select.shipping-budget-detail-header-input-wide {
  flex: 0 0 16ch;
  width: 16ch;
  min-width: 16ch;
  max-width: 16ch;
}
.shipping-budget-detail-header-row-primary .shipping-budget-detail-header-input-wide-date,
.shipping-budget-detail-header-row-primary input[type="date"].shipping-budget-detail-header-input-wide-date {
  flex: 0 0 16ch;
  width: 16ch;
  min-width: 16ch;
  max-width: 16ch;
}
.shipping-budget-detail-fees-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 6px 10px;
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px dashed var(--border-color, #d8dee9);
}
.shipping-budget-detail-header-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.shipping-budget-detail-header-grid-compact .shipping-budget-detail-header-item,
.shipping-budget-detail-header-grid-6col .shipping-budget-detail-header-item,
.shipping-budget-detail-header-grid-8col .shipping-budget-detail-header-item {
  flex-direction: row;
  align-items: center;
  gap: 6px;
}
.shipping-budget-detail-fees-grid .shipping-budget-detail-header-item {
  flex-direction: row;
  align-items: center;
  gap: 6px;
}
.shipping-budget-detail-header-input {
  flex: 1 1 auto;
  min-width: 0;
  width: 100%;
  padding: 3px 6px;
  font-size: 13px;
}
.shipping-budget-detail-header-readonly strong {
  font-weight: 600;
}
.shipping-budget-modal-summary-variance-row .shipping-budget-modal-summary-item strong {
  font-weight: 600;
}
.shipping-budget-variance-ok {
  color: #15803d;
  font-weight: 600;
}
.shipping-budget-variance-diff {
  color: #dc2626;
  font-weight: 600;
}
.shipping-budget-deposit-table .shipping-budget-deposit-input {
  width: 100%;
  min-width: 0;
  padding: 3px 6px;
  font-size: 12px;
  box-sizing: border-box;
}
.shipping-budget-deposit-table td.num-right .shipping-budget-deposit-input {
  text-align: right;
}
.shipping-budget-deposit-table .shipping-budget-deposit-status-select {
  min-width: 88px;
  font-weight: 600;
}
.shipping-budget-deposit-table .shipping-budget-deposit-status-select.deposit-status-used {
  background: #fee2e2;
  color: #b91c1c;
  border-color: #fecaca;
}
.shipping-budget-deposit-table .shipping-budget-deposit-status-select.deposit-status-unused {
  background: #dcfce7;
  color: #166534;
  border-color: #bbf7d0;
}
.shipping-budget-deposit-table .shipping-budget-deposit-amount-input {
  min-width: 96px;
}
.shipping-budget-deposit-table-actions {
  display: flex;
  justify-content: flex-start;
  margin-top: 8px;
}
.shipping-budget-deposit-add-row-btn {
  margin: 0;
}
.shipping-budget-detail-readonly-input {
  background: var(--input-readonly-bg, #f1f5f9);
  color: var(--text-color, #1e293b);
  cursor: default;
}
.shipping-budget-receivable-commission-item .shipping-budget-detail-readonly-input {
  min-width: 110px;
}
.shipping-budget-deposit-applied-line {
  flex-wrap: wrap;
  gap: 8px 16px;
}
.shipping-budget-deposit-unused-inline {
  font-size: 12px;
  color: var(--muted);
}
.shipping-budget-deposit-unused-inline strong {
  color: #166534;
}
.shipping-budget-modal-footer #shippingBudgetModalSaveBtn {
  min-width: 88px;
}
.shipping-budget-detail-header-item-wide {
  grid-column: 1 / -1;
}
.shipping-budget-detail-header-label {
  font-size: 12px;
  color: var(--muted-color, #64748b);
}
.shipping-budget-detail-header-item strong {
  font-weight: 600;
  word-break: break-word;
}
.shipping-budget-deposit-section {
  margin-top: 12px;
}
.shipping-budget-deposit-panel {
  border: 1px solid var(--border-color, #d8dee9);
  border-radius: 8px;
  padding: 12px 14px;
  background: #fff;
}
.shipping-budget-deposit-deduction-panel {
  margin-top: 10px;
}
.shipping-budget-deposit-invoice-block {
  margin-top: 12px;
  border: 1px solid var(--border-color, #d8dee9);
  border-radius: 8px;
  padding: 12px 14px;
  background: #fff;
}
.shipping-budget-deposit-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  margin: 0;
  padding: 4px 6px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: #0f172a;
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.shipping-budget-deposit-head:hover {
  background: #eff6ff;
}
.shipping-budget-deposit-title {
  font-size: 15px;
  font-weight: 600;
  margin: 0;
}
.shipping-budget-deposit-chevron {
  flex-shrink: 0;
  font-size: 11px;
  color: #64748b;
}
.shipping-budget-deposit-body.collapsed {
  display: none;
}
.shipping-budget-deposit-body:not(.collapsed) {
  margin-top: 8px;
}
.shipping-budget-deposit-table th,
.shipping-budget-deposit-table td {
  white-space: nowrap;
  text-align: center;
  vertical-align: middle;
}
.shipping-budget-deposit-table th.num-right,
.shipping-budget-deposit-table td.num-right {
  text-align: right;
  font-variant-numeric: tabular-nums;
}
.shipping-budget-deposit-table .shipping-budget-deposit-input:not(.shipping-budget-deposit-amount-input) {
  text-align: center;
}
.shipping-budget-deposit-table .shipping-budget-deposit-status-select {
  text-align: center;
  text-align-last: center;
}
.shipping-budget-deposit-check-cell {
  text-align: center;
}
.shipping-budget-deposit-deduction-summary {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 10px;
  font-size: 13px;
}
.shipping-budget-deposit-deduction-summary strong {
  font-variant-numeric: tabular-nums;
  color: #b45309;
}
.shipping-budget-deposit-table th.shipping-budget-deposit-desc-head,
.shipping-budget-deposit-table td.shipping-budget-deposit-desc-cell {
  white-space: normal;
  min-width: 120px;
  max-width: 220px;
}
.shipping-budget-deposit-table th.shipping-budget-deposit-time-head,
.shipping-budget-deposit-table td.shipping-budget-deposit-time-cell {
  min-width: 96px;
}
.shipping-budget-deposit-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px 16px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--border-color, #d8dee9);
}
.shipping-budget-deposit-summary-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.shipping-budget-deposit-summary-item-wide {
  grid-column: span 1;
}
.shipping-budget-deposit-summary-item span {
  font-size: 12px;
  color: var(--muted-color, #64748b);
}
.shipping-budget-deposit-summary-item strong {
  font-weight: 600;
  word-break: break-word;
}
.shipping-budget-deposit-summary-english {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--border-color, #d8dee9);
}
.shipping-budget-deposit-invoice-line {
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.shipping-budget-deposit-invoice-label {
  font-size: 12px;
  color: var(--muted-color, #64748b);
  font-weight: 600;
}
.shipping-budget-deposit-invoice-line strong {
  font-weight: 600;
  word-break: break-word;
}
.shipping-budget-deposit-summary-stack {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.shipping-budget-deposit-summary-line {
  display: flex;
  align-items: baseline;
  gap: 8px;
  font-size: 13px;
}
.shipping-budget-deposit-summary-line span {
  color: var(--muted-color, #64748b);
  min-width: 168px;
}
.shipping-budget-deposit-summary-line strong {
  font-weight: 600;
}
.shipping-budget-po-summary-block {
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.shipping-budget-po-summary-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 16px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed var(--border-color, #d8dee9);
}
.shipping-budget-po-summary-fees {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 16px;
  flex: 1 1 auto;
  min-width: 0;
}
.shipping-budget-po-summary-fees .shipping-budget-detail-header-item {
  flex-direction: row;
  align-items: center;
  gap: 6px;
  min-width: 0;
}
.shipping-budget-po-summary-block strong {
  font-weight: 600;
  word-break: break-word;
}
@media (max-width: 900px) {
  .shipping-budget-detail-header-grid,
  .shipping-budget-detail-header-grid-compact,
  .shipping-budget-detail-header-grid-6col,
  .shipping-budget-detail-header-grid-8col,
  .shipping-budget-detail-fees-grid,
  .shipping-budget-deposit-summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .shipping-budget-detail-header-row-primary {
    flex-wrap: wrap;
  }
  .shipping-budget-modal-summary-bl-row {
    flex-wrap: wrap;
  }
  .shipping-budget-modal-summary-actions {
    width: 100%;
    margin-left: 0;
    justify-content: flex-start;
  }
  .shipping-budget-deposit-summary-line span {
    min-width: 0;
  }
}
.shipping-budget-list-table-scroll {
  margin-top: 4px;
}
.shipping-budget-list-table th,
.shipping-budget-list-table td {
  white-space: nowrap;
  vertical-align: middle;
}
.shipping-budget-list-table th.shipping-budget-list-text-head,
.shipping-budget-list-table td.shipping-budget-list-text-cell {
  min-width: 72px;
  text-align: center;
  vertical-align: middle;
}
.shipping-budget-list-table th.shipping-budget-list-num-head,
.shipping-budget-list-table td.shipping-budget-list-num-cell {
  min-width: 88px;
  text-align: right;
  vertical-align: middle;
}
.shipping-budget-list-table th.shipping-budget-list-warehouse-head,
.shipping-budget-list-table td.shipping-budget-list-warehouse-cell {
  min-width: 72px;
  color: #0284c7;
}
.shipping-budget-list-table th.shipping-budget-list-confirm-carton-head,
.shipping-budget-list-table td.shipping-budget-list-confirm-carton-cell {
  color: #b45309;
}
.shipping-budget-list-table th.shipping-budget-list-overseas-confirm-head,
.shipping-budget-list-table td.shipping-budget-list-overseas-confirm-cell {
  color: #059669;
}
.shipping-budget-list-table th.shipping-budget-list-apply-booking-head,
.shipping-budget-list-table td.shipping-budget-list-apply-booking-cell {
  color: #7c3aed;
}
.shipping-budget-list-table th.shipping-budget-list-so-status-head,
.shipping-budget-list-table td.shipping-budget-list-so-status-cell {
  color: #db2777;
}
.shipping-budget-list-table th.shipping-budget-list-content-head,
.shipping-budget-list-table td.shipping-budget-list-content-cell {
  min-width: 120px;
  max-width: 220px;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: center;
  vertical-align: middle;
}
.shipping-budget-list-table th.shipping-budget-list-action-head,
.shipping-budget-list-table td.shipping-budget-list-action-cell {
  min-width: 220px;
  text-align: center;
  vertical-align: middle;
}
.shipping-budget-list-table .shipping-budget-list-row {
  cursor: pointer;
}
.shipping-budget-list-table .shipping-budget-list-row:hover {
  background: #eff6ff;
}
.shipping-budget-list-action-cell .btn-mini + .btn-mini {
  margin-left: 4px;
}
.pre-shipment-modal-table th,
.pre-shipment-modal-table td {
  padding: 8px 10px;
  border-bottom: 1px solid var(--line);
  vertical-align: middle;
}
.pre-shipment-modal-table th.pre-shipment-modal-text-head,
.pre-shipment-modal-table td.pre-shipment-modal-text-cell {
  text-align: center;
}
.pre-shipment-modal-table th.pre-shipment-modal-num-head,
.pre-shipment-modal-table td.pre-shipment-modal-num-cell {
  text-align: right;
}
.pre-shipment-modal-table th.pre-shipment-modal-check-head,
.pre-shipment-modal-table td.pre-shipment-modal-check-cell {
  text-align: center;
  width: 40px;
}
.pre-shipment-modal-carton-input {
  width: 72px;
  text-align: right;
  padding: 4px 6px;
}
.warehouse-stocking-cancel-actions {
  border-top: 1px solid var(--line);
  margin-top: 12px;
  padding-top: 12px;
}
.warehouse-stocking-cancel-actions .warehouse-stocking-actions-right {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.warehouse-cancel-scheduled-toolbar-btn:not(.hidden) {
  border-color: #b45309;
  color: #92400e;
}
.warehouse-orders-action-head,
.warehouse-orders-action-cell {
  text-align: center;
  white-space: nowrap;
}
.pre-shipment-main-wrap {
  margin-top: 8px;
}
.warehouse-inventory-wrap.pre-shipment-main-wrap {
  margin-top: 0;
}

.pending-tasks-btn {
  position: relative;
}
.header-business-nav-btn.pending-tasks-btn {
  display: inline-flex;
  align-items: center;
  gap: 2px;
}
.pending-tasks-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  margin-left: 4px;
  border-radius: 999px;
  background: #dc2626;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
}
.pending-tasks-badge.hidden { display: none !important; }
.pending-tasks-panel-actions {
  flex-wrap: wrap;
  align-items: center;
}
.pending-tasks-category-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
}
.pending-tasks-category-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.pending-tasks-category-chip .pending-tasks-section-count {
  margin-left: 2px;
}
.pending-tasks-master-table th,
.pending-tasks-master-table td {
  text-align: center;
  vertical-align: middle;
}
.pending-tasks-master-table td.text-cell .pending-tasks-field-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.pending-tasks-master-table .pending-tasks-title-cell {
  font-weight: 600;
  max-width: 280px;
}
.pending-tasks-master-row.pending-task-done td {
  opacity: 0.55;
  text-decoration: line-through;
}
.pending-tasks-master-row.pending-task-done .pending-tasks-title-cell {
  text-decoration: line-through;
}
.pending-tasks-detail-content {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 0 16px 16px;
}
.pending-tasks-detail-form {
  display: grid;
  gap: 12px;
  max-width: 920px;
}
.pending-tasks-detail-form .detail-field {
  display: grid;
  gap: 4px;
}
.pending-tasks-detail-form .detail-field input,
.pending-tasks-detail-form .detail-field textarea,
.pending-tasks-detail-form .detail-field select {
  width: 100%;
}
.pending-tasks-detail-meta {
  margin-bottom: 4px;
}
.pending-tasks-detail-actions {
  gap: 8px;
  flex-wrap: wrap;
  padding-top: 8px;
  border-top: 1px solid var(--line);
}
.pending-tasks-bill-detail {
  padding: 8px 10px;
  border-radius: 8px;
  background: #f8fafc;
  font-size: 13px;
  line-height: 1.5;
}
.pending-tasks-detail-drawer .orders-detail-drawer-inner {
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.pending-tasks-modal-card {
  width: min(960px, 100%);
  max-height: calc(100vh - 32px);
  overflow: auto;
}
.quote-history-modal-card {
  width: min(920px, 100%);
  max-height: calc(100vh - 32px);
  overflow: auto;
}
.quote-history-modal-body {
  max-height: min(60vh, 520px);
  overflow: auto;
}
.quote-history-table th,
.quote-history-table td {
  white-space: nowrap;
}
.quote-history-link {
  cursor: pointer;
  color: var(--link, #2563eb);
  text-decoration: underline;
  text-underline-offset: 2px;
}
.inquiry-pricing-computed {
  background: #f8fafc;
  color: #334155;
}
.inquiry-pricing-input {
  min-width: 64px;
}
.pending-tasks-modal-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}
.pending-tasks-sections {
  display: grid;
  gap: 10px;
}
.pending-tasks-section {
  border: 1px solid var(--line);
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
}
.pending-tasks-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  width: 100%;
  padding: 10px 12px;
  border: 0;
  background: #f8fafc;
  color: var(--text);
  font: inherit;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
}
.pending-tasks-section-head:hover { background: #eff6ff; }
.pending-tasks-section-count {
  font-size: 12px;
  font-weight: 700;
  color: #1e293b;
  background: #cbd5e1;
  border-radius: 999px;
  padding: 2px 8px;
}
.pending-tasks-section-body {
  display: grid;
  gap: 8px;
  padding: 10px 12px 12px;
}
.pending-tasks-section-body.collapsed { display: none; }
.pending-tasks-table {
  display: grid;
  gap: 6px;
}
.pending-tasks-table-head,
.pending-tasks-row {
  display: grid;
  grid-template-columns: 52px minmax(0, 1.4fr) minmax(140px, 1fr) minmax(120px, 0.85fr);
  gap: 8px 10px;
  align-items: start;
}
.pending-tasks-table-head {
  padding: 0 10px 4px;
  font-size: 11px;
  font-weight: 700;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  border-bottom: 1px solid var(--line);
}
.pending-tasks-row {
  padding: 10px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  text-align: left;
}
.pending-tasks-row:hover {
  border-color: #93c5fd;
  background: #f8fbff;
}
.pending-tasks-col-read,
.pending-tasks-col-content,
.pending-tasks-col-remarks,
.pending-tasks-col-fields {
  min-width: 0;
}
.pending-task-viewed-label {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  font-size: 11px;
  color: var(--muted);
  cursor: pointer;
  user-select: none;
}
.pending-task-viewed-label input {
  margin: 0;
  cursor: pointer;
}
.pending-task-viewed-label input:disabled {
  cursor: default;
}
.pending-tasks-col-fields {
  display: grid;
  gap: 4px;
  font-size: 12px;
}
.pending-tasks-field-badge {
  display: inline-block;
  width: fit-content;
  padding: 2px 8px;
  border-radius: 999px;
  background: #e2e8f0;
  color: #334155;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.04em;
}
.pending-tasks-field-meta {
  color: var(--muted);
  line-height: 1.45;
}
.pending-tasks-source-notes {
  font-size: 12px;
  color: var(--muted);
  margin-bottom: 4px;
  line-height: 1.4;
  word-break: break-word;
}
.pending-tasks-item {
  display: grid;
  gap: 4px;
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  cursor: pointer;
  text-align: left;
}
.pending-tasks-item:hover {
  border-color: #93c5fd;
  background: #f8fbff;
}
.pending-tasks-item-title {
  font-weight: 600;
  line-height: 1.4;
}
.pending-tasks-row.pending-task-done .pending-tasks-item-title,
.pending-tasks-row.pending-task-done .pending-tasks-item-meta,
.pending-tasks-row.pending-task-done .pending-tasks-field-meta,
.pending-tasks-row.pending-task-done .pending-tasks-source-notes,
.pending-tasks-item.pending-task-done .pending-tasks-item-title,
.pending-tasks-item.pending-task-done .pending-tasks-item-meta {
  text-decoration: line-through;
  color: var(--muted);
}
.pending-tasks-item-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  font-size: 12px;
  color: var(--muted);
}
.pending-tasks-item-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 4px;
}
.pending-tasks-item-actions button {
  font-size: 12px;
  padding: 4px 8px;
}
.pending-task-reply {
  display: grid;
  gap: 4px;
  margin-top: 0;
  cursor: text;
}
.pending-task-reply-label {
  font-size: 11px;
  font-weight: 600;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
.pending-task-reply-input {
  width: 100%;
  min-height: 44px;
  padding: 6px 8px;
  border: 1px solid var(--line);
  border-radius: 6px;
  font: inherit;
  font-size: 13px;
  line-height: 1.4;
  resize: vertical;
  background: #fafafa;
}
.pending-task-reply-input:focus {
  outline: none;
  border-color: #93c5fd;
  background: #fff;
}
.pending-tasks-empty {
  margin: 0;
  font-size: 13px;
  color: var(--muted);
}
.pending-tasks-manual-form {
  display: grid;
  gap: 8px;
  padding: 10px;
  border: 1px dashed var(--line);
  border-radius: 8px;
  background: #fafafa;
}
.pending-tasks-manual-form label {
  display: grid;
  gap: 4px;
  font-size: 13px;
}
.pending-tasks-manual-form input,
.pending-tasks-manual-form textarea,
.pending-tasks-manual-form select {
  width: 100%;
}
.pending-tasks-manual-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 8px;
}
.pending-tasks-modal-actions {
  justify-content: flex-end;
}

.permission-editor-wrap {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.permission-profile-picker select {
  min-width: 220px;
}
.permission-section h6 {
  margin: 0 0 8px;
}
.permission-check-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: 6px 12px;
}
.permission-check-grid-wide {
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
}
.permission-check-grid label,
.permission-star-row {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
}
.permission-star-row {
  grid-column: 1 / -1;
  font-weight: 600;
}
.permission-summary {
  margin: 0 0 8px;
}
.permission-profile-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px;
}
.permission-new-form {
  margin-bottom: 16px;
  padding: 12px;
  border: 1px solid var(--border, #ddd);
  border-radius: 6px;
  background: var(--panel-lite-bg, #f8f9fa);
}
.permission-new-form .entity-fields-grid {
  margin-bottom: 10px;
}
.permission-new-form-actions {
  display: flex;
  gap: 8px;
}

.user-field-perms-table .user-field-perm-cell {
  text-align: center;
  width: 72px;
}
.user-field-perms-table .user-field-perm-cell input {
  margin: 0;
}
.user-permission-detail .permission-section + .permission-section {
  margin-top: 12px;
}
.user-permission-sources {
  margin-bottom: 4px;
}

.packaging-share-modal-card {
  width: min(560px, calc(100vw - 32px));
}
.packaging-share-result {
  margin-top: 12px;
}
.packaging-share-copy-row {
  display: flex;
  gap: 8px;
  align-items: center;
}
.packaging-share-copy-row input {
  flex: 1;
  min-width: 0;
}
.packaging-share-action-cell {
  white-space: nowrap;
}

.share-packaging-page {
  margin: 0;
  min-height: 100vh;
  background: var(--page-bg, #eef2f7);
}
.share-packaging-shell {
  max-width: 960px;
  margin: 24px auto;
  padding: 20px;
}
.share-packaging-head h1 {
  margin: 0 0 8px;
}
.share-packaging-meta-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  margin-bottom: 20px;
}
.share-packaging-meta-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.share-packaging-meta-label {
  color: var(--muted, #64748b);
  font-size: 12px;
}
.share-packaging-line-card {
  border: 1px solid var(--border, #dbe3ee);
  border-radius: 10px;
  padding: 14px;
  margin-bottom: 14px;
  background: #fff;
}
.share-packaging-line-head {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  margin-bottom: 12px;
}
.share-packaging-line-title {
  font-weight: 600;
}
.share-packaging-line-qty {
  margin-top: 4px;
  font-size: 13px;
}
.share-packaging-attachments {
  display: grid;
  gap: 10px;
}
.share-packaging-attachment-item {
  padding-top: 8px;
  border-top: 1px solid var(--border, #e2e8f0);
}
.share-packaging-attachment-label {
  font-size: 13px;
  font-weight: 600;
  margin-bottom: 4px;
}
.share-packaging-review-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 4px;
  font-size: 12px;
}
.share-packaging-status {
  margin-top: 16px;
}

.supplier-bank-accounts-grid {
  display: grid;
  gap: 16px;
  margin-bottom: 12px;
}
.supplier-bank-account-block {
  padding: 12px;
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 8px;
  background: #fafafa;
}
.supplier-bank-account-block .entity-section-subtitle {
  font-weight: 600;
  margin-bottom: 8px;
  color: #111827;
}
.company-bank-accounts-grid {
  display: grid;
  gap: 16px;
  margin-bottom: 12px;
}
.company-bank-account-block {
  padding: 12px;
  border: 1px solid var(--border, #e5e7eb);
  border-radius: 8px;
  background: #fafafa;
}
.company-bank-account-head {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.company-bank-account-head .entity-section-subtitle {
  flex: 1;
  font-weight: 600;
  color: #111827;
}
.company-bank-default-label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
}
.company-profile-head-actions {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
.settings-form-table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 8px;
}
.settings-form-table th.settings-form-label {
  width: 110px;
  text-align: right;
  padding: 8px 14px 8px 0;
  font-weight: 600;
  font-size: 13px;
  vertical-align: middle;
  white-space: nowrap;
  color: #334155;
}
.settings-form-table td.settings-form-field {
  padding: 6px 0;
  vertical-align: middle;
}
.settings-form-table input,
.settings-form-table select,
.settings-form-table textarea {
  width: 100%;
  max-width: 520px;
}
.company-profile-card.settings-collapsible-section {
  margin-bottom: 12px;
}
.company-bank-accounts-table {
  min-width: 900px;
}
.company-bank-accounts-table input,
.company-bank-accounts-table select {
  width: 100%;
  min-width: 72px;
  font-size: 13px;
}
.company-bank-accounts-table .company-bank-attachment-cell {
  white-space: nowrap;
  font-size: 12px;
}
.partner-form-table-6 {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px 12px;
  align-items: end;
}
.partner-form-table-6 label {
  display: grid;
  gap: 4px;
  font-size: 13px;
  font-weight: 600;
}
.partner-form-table-6 label input,
.partner-form-table-6 label select,
.partner-form-table-6 label textarea {
  font-weight: 400;
}
.partner-form-table-row {
  display: contents;
}
.partner-form-left-label-row {
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr);
  gap: 10px 14px;
  align-items: center;
  margin-bottom: 8px;
}
.partner-form-left-label-row > span {
  text-align: right;
  font-weight: 600;
  font-size: 13px;
  color: #334155;
}
.partner-form-left-label-row > label,
.partner-form-left-label-row > .partner-form-left-field {
  min-width: 0;
}
.payment-terms-collect {
  color: #15803d;
  font-weight: 600;
}
.forwarder-booking-count-col {
  text-align: center;
  font-weight: 600;
  color: #1d4ed8;
}
.library-import-actions {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.library-toolbar-group {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.library-toolbar-divider {
  width: 1px;
  height: 22px;
  background: var(--line);
  margin: 0 2px;
}
.library-toolbar-dropdown {
  position: relative;
  display: inline-flex;
}
.library-toolbar-dropdown-panel {
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  z-index: 40;
  min-width: 168px;
  padding: 6px;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
  display: grid;
  gap: 4px;
}
.library-toolbar-dropdown-panel.hidden {
  display: none !important;
}
.library-toolbar-dropdown-panel .secondary,
.library-toolbar-dropdown-panel .file-btn {
  width: 100%;
  justify-content: flex-start;
  text-align: left;
}
.detail-modal.detail-modal-fullscreen .detail-card.product-detail-modal-card {
  width: min(96vw, 1180px);
  height: min(96vh, 900px);
  max-height: none;
}
.detail-modal[data-prevent-backdrop-close="1"] {
  cursor: default;
}

@media print {
  .topbar, .tabs-toolbar, .customer-bar, .tab-panel, .detail-modal, .pick { display: none !important; }
  body { background: #fff; }
}