/* Compact radius scale for shared storefront surfaces. Pills and true circles stay semantic. */
:root {
  --st-space-1: 4px;
  --st-space-2: 8px;
  --st-space-3: 12px;
  --st-space-4: 16px;
  --st-space-5: 24px;
  --st-radius-control: 8px;
  --st-radius-card: 12px;
  --st-radius-panel: 14px;
  --st-radius-sheet: 16px;
  --st-font-caption: 12px;
  --st-font-body: 14px;
  --st-font-subheading: 16px;
  --st-font-heading: 22px;
  --st-control-height: 44px;
  --st-color-action-ink: #081f80;
}

/* Contact position is owned by the dock's data-pop placement rules. */

/* Keep glass headers consistent with the tighter surface scale. */
body .brandbar.wrap.st-page-header,
body .commerce-dialog .dialog-head.st-page-header {
  border-radius: 0 0 var(--st-radius-card) var(--st-radius-card) !important;
}

/* Compact dialogs and filter sheets have a clearly rounded top edge. */
body .commerce-dialog:not(.commerce-page):not(.lightbox) {
  border-radius: var(--st-radius-panel) !important;
}

body .catalog-sheet-dialog {
  border-radius: var(--st-radius-panel) !important;
}

/* Normalize prominent cards and panels across home, catalog, inquiry, account, and history. */
body .goods-card,
body .goods-section .goods-card,
body .commerce-dialog .product-card.card-paired,
body .commerce-dialog .history-card,
body .commerce-dialog.page-history .history-card,
body .commerce-dialog.page-workbench .history-card,
body .commerce-dialog .account-links > button,
body .commerce-dialog .account-explainer,
body .commerce-dialog.page-account .account-explainer,
body .commerce-dialog .order-contact,
body .commerce-dialog.page-history .order-contact,
body .commerce-dialog.page-workbench .order-contact,
body .commerce-dialog .catalog-empty,
body.catalog-mode .catalog-empty,
body.catalog-mode .goods-grid > p,
body .commerce-dialog .empty-inquiry,
body .commerce-dialog.page-inquiry .empty-inquiry,
body .commerce-dialog .success-receipt,
body .commerce-dialog .workbench-sync-item,
body .commerce-dialog .inquiry-bulk-toolbar,
body .commerce-dialog.page-inquiry .inquiry-bulk-toolbar,
body .commerce-dialog.page-inquiry .inquiry-promise,
body .commerce-dialog.page-inquiry .inquiry-footer {
  border-radius: var(--st-radius-card) !important;
}

body .category-link,
body .category-link:first-child,
body .st-category-card,
body .commerce-dialog.page-account .account-links > button {
  border-radius: 10px !important;
}

body .category-link .category-icon {
  border-radius: 10px 10px 0 0 !important;
}

body .goods-image,
body .goods-section .goods-image {
  border-radius: 9px 9px 0 0 !important;
}


body .commerce-dialog .history-thumb,
body .commerce-dialog .order-art {
  border-radius: 8px !important;
}

body .editorial,
body .hero,
body .st-home-hero,
body .st-home-carousel {
  border-radius: var(--st-radius-sheet) !important;
}

body .service,
body .service#supply,
body .st-retail-card,
body .commerce-dialog .account-cover,
body .commerce-dialog .workbench-entry {
  border-radius: var(--st-radius-panel) !important;
}

body .catalog-load-state,
body .catalog-empty,
body .st-contact-detail,
body .commerce-dialog .workbench-sync,
body .commerce-dialog .wb-status-panel,
body .commerce-dialog .quote-preview,
body .commerce-dialog.page-workbench .wb-status-panel,
body .commerce-dialog.page-workbench .quote-preview,
body .contact-block {
  border-radius: var(--st-radius-card) !important;
}

body .catalog-filter-open,
body .catalog-sort-open,
body .catalog-filter-actions button,
body .commerce-dialog .price-tier,
body .commerce-dialog .checkout-form input:not([type="radio"]):not([type="checkbox"]),
body .commerce-dialog .checkout-form textarea,
body .commerce-dialog .checkout-form select,
body .commerce-dialog .delivery-choices label > span,
body .commerce-dialog.page-detail .detail-footer .stepper,
body .commerce-dialog.page-detail .detail-footer .round-control,
body .commerce-dialog.page-detail .detail-footer .button,
body .commerce-dialog.page-inquiry .currency-switch,
body .commerce-dialog.page-inquiry .unit-select-shell,
body .commerce-dialog.page-inquiry .card-paired .stepper,
body .commerce-dialog .workbench-stock-cell,
body .st-search-dialog .search {
  border-radius: var(--st-radius-control) !important;
}

body .st-contact-popover,
body #st-contact-popover,
body .st-search-glass,
body .st-search-dialog .search-suggest,
body .st-scan-panel,
body .commerce-dialog .detail-layout,
body .commerce-dialog .detail-photo {
  border-radius: var(--st-radius-panel) !important;
}

body .st-contact-channels .contact-channel {
  border-radius: 10px !important;
}

/* The account cover intentionally bleeds behind its glass header. */
body .commerce-dialog.page-account .account-cover {
  border-radius: 0 !important;
}

body nav.st-bottom-navigation {
  border-radius: var(--st-radius-sheet) !important;
}

body nav.st-bottom-navigation > button {
  border-radius: var(--st-radius-card) !important;
}

body .st-select-pop,
body .st-select-pop.is-mobile,
body .st-scan-stage {
  border-radius: var(--st-radius-card) !important;
}

body .st-select-pop .st-option {
  border-radius: var(--st-radius-control) !important;
}

@media (min-width: 721px) {
  body .commerce-dialog.commerce-page:not(.page-workbench) {
    border-radius: var(--st-radius-sheet) !important;
  }

  body .commerce-dialog.page-detail .detail-layout {
    border-radius: var(--st-radius-sheet) !important;
  }
}

@media (max-width: 720px) {
  body .commerce-dialog:not(.commerce-page):not(.lightbox),
  body .catalog-sheet-dialog {
    border-radius: var(--st-radius-sheet) var(--st-radius-sheet) 0 0 !important;
  }

  body .commerce-dialog.page-detail .detail-layout {
    border-radius: 0 !important;
  }

  body .commerce-dialog.page-detail .detail-content {
    border-radius: var(--st-radius-sheet) var(--st-radius-sheet) 0 0 !important;
  }
}

/* Shared spacing rhythm: controls 4px, compact groups 8px, cards 12px, sections 16/24px. */
body .commerce-dialog.page-inquiry .dialog-body {
  padding-top: var(--st-space-2);
}

body .commerce-dialog.page-inquiry .quote-meta {
  padding-block: var(--st-space-1);
}

body .commerce-dialog.page-inquiry .inquiry-notice {
  margin: var(--st-space-2) var(--st-space-4) var(--st-space-1);
  padding: var(--st-space-2) var(--st-space-3);
}

body .commerce-dialog.page-inquiry .inquiry-bulk-toolbar {
  margin-bottom: var(--st-space-2);
}

body.catalog-mode .catalog-toolbar {
  margin-top: var(--st-space-1);
  margin-bottom: var(--st-space-2);
}

body .commerce-dialog.page-account .account-content {
  padding-top: var(--st-space-3);
}

body .commerce-dialog.page-account .account-links {
  gap: var(--st-space-2);
  margin-bottom: var(--st-space-4);
}

body .commerce-dialog.page-workbench .history-heading {
  padding-top: var(--st-space-4);
}

body .commerce-dialog.page-workbench .workbench-tiles {
  gap: var(--st-space-2);
  padding-top: var(--st-space-4);
}

body .commerce-dialog .checkout-layout {
  gap: var(--st-space-5);
}

body .commerce-dialog .form-heading {
  gap: var(--st-space-2);
  margin-block: var(--st-space-4) var(--st-space-3);
}

body .commerce-dialog .checkout-form > label {
  margin-bottom: var(--st-space-3);
}

body .commerce-dialog .history-card {
  margin-bottom: var(--st-space-3);
  padding: var(--st-space-4);
}

body .commerce-dialog .history-thumbnails {
  margin-block: var(--st-space-3);
}

body .commerce-dialog .order-contact h3 {
  margin-bottom: var(--st-space-3);
}

body .commerce-dialog .order-contact dl > div {
  margin-top: var(--st-space-2);
}

body .commerce-dialog .order-line {
  gap: var(--st-space-3);
  padding-block: var(--st-space-4);
}


body .commerce-dialog .auth-subtitle {
  margin-bottom: var(--st-space-4);
}

body .commerce-dialog.page-detail .detail-note {
  margin-block: var(--st-space-2) var(--st-space-3);
}

body .commerce-dialog.page-detail .price-tiers {
  gap: var(--st-space-2);
}

body .commerce-dialog.page-detail .unit-line {
  margin-top: var(--st-space-4);
}

body .commerce-dialog.page-detail .detail-footer {
  padding-top: var(--st-space-4);
}

/* The catalog cart prompt and inquiry estimate are the same floating dock. */
:root {
  --st-cart-dock-width: min(510px, calc(100% - 24px));
  --st-cart-dock-min-height: 48px;
}

body.catalog-mode .catalog-inquiry-dock:not([hidden]),
body .commerce-dialog.page-inquiry .inquiry-footer.estimate-dock {
  position: fixed !important;
  z-index: 6 !important;
  left: 50% !important;
  right: auto !important;
  bottom: 24px !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 10px !important;
  box-sizing: border-box !important;
  width: var(--st-cart-dock-width) !important;
  min-height: var(--st-cart-dock-min-height) !important;
  height: auto !important;
  margin: 0 !important;
  padding: 5px 6px 5px 14px !important;
  border: 1px solid #1b3797 !important;
  border-radius: 12px !important;
  background: linear-gradient(110deg, #071744, #052675) !important;
  color: #fff !important;
  box-shadow: 0 7px 20px rgba(8, 31, 128, .18), inset 0 1px 0 rgba(255, 255, 255, .14) !important;
  transform: translateX(-50%) !important;
}

body.catalog-mode .catalog-inquiry-dock:not([hidden]) > span {
  display: flex !important;
  min-width: 0 !important;
  align-items: center !important;
  gap: 8px !important;
  color: #fff !important;
}

body.catalog-mode .catalog-inquiry-dock:not([hidden]) > span > svg {
  width: 23px !important;
  height: 25px !important;
  flex: 0 0 auto !important;
}

body.catalog-mode .catalog-inquiry-dock:not([hidden]) > span > svg {
  fill: none;
  stroke: #d9e3ff;
  stroke-width: 1.55;
  stroke-linecap: round;
  stroke-linejoin: round;
}

body.catalog-mode .catalog-inquiry-dock:not([hidden]) strong {
  display: block !important;
  min-width: 0 !important;
  overflow: hidden !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 780 !important;
  letter-spacing: -.35px !important;
  line-height: 1.15 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-variant-numeric: tabular-nums;
}

body.catalog-mode .catalog-inquiry-dock:not([hidden]) > button {
  display: flex !important;
  width: auto !important;
  max-width: 100% !important;
  min-width: 0 !important;
  min-height: 40px !important;
  flex: 0 1 auto !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 0 13px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: linear-gradient(110deg, #ef841a, #f27008) !important;
  color: #fff !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .24), 0 2px 7px rgba(239, 125, 17, .2) !important;
  font-size: 12px !important;
  font-weight: 720 !important;
  letter-spacing: 0 !important;
  line-height: 1.2 !important;
  text-align: center !important;
  white-space: normal !important;
  overflow-wrap: anywhere !important;
}

body.catalog-mode .catalog-inquiry-dock:not([hidden]) > button > i {
  display: grid !important;
  width: 28px !important;
  height: 28px !important;
  flex: 0 0 28px !important;
  place-items: center !important;
  margin: 0 !important;
  border-radius: 6px !important;
  background: rgba(255, 255, 255, .16) !important;
  font-style: normal;
}

body.catalog-mode .catalog-inquiry-dock:not([hidden]) > button > i svg {
  display: block !important;
  width: 17px !important;
  height: 17px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.8 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
}

/* 内部工作台标题靠左（2026-09-29 第二轮）。
   ❌ 原来只写了 `justify-self:start` —— 那只是「在本列内靠左」，而本列前面
      还有 40px 的返回键 + gap，标题实际起点比内容左边缘右移约 80px，
      用户看到的就是「标题没有靠左」。
   ✅ 桌面（≥721px）栅格是 `auto minmax(0,1fr) auto`。让标题跨列会与返回键重叠，
      所以改为：用负外边距把标题拉回到与 .dialog-body 相同的左内边距上。
      数值来自实测：容器 padding-left 28px、返回键 40px、gap 12px。
      移动端栅格是 40px|1fr|40px，退回普通左对齐即可，
      所以负边距一律包在 (min-width:721px) 里。 */
body .commerce-dialog.page-workbench .dialog-head > .st-page-heading-copy {
  justify-self: start;
  text-align: left;
  min-width: 0;
}

body .commerce-dialog.page-workbench .dialog-head #st-dialog-title {
  text-align: left;
}

@media (min-width: 721px) {
  body .commerce-dialog.page-workbench .dialog-head > .st-page-heading-copy {
    margin-left: calc(-1 * (40px + 12px));
  }
}

@media (max-width: 720px) {
  :root {
    --st-cart-dock-min-height: 44px;
  }

  body.catalog-mode .catalog-inquiry-dock:not([hidden]),
  body .commerce-dialog.page-inquiry .inquiry-footer.estimate-dock {
    bottom: calc(var(--inq-nav-inset, 10px) + env(safe-area-inset-bottom, 0px) + var(--inq-nav-h, 60px) + var(--inq-bar-gap, 9px)) !important;
    padding: 4px 6px 4px 14px !important;
    border-radius: 9px !important;
    box-shadow: 0 3px 10px rgba(11, 33, 73, .14), inset 0 1px 0 rgba(255, 255, 255, .13) !important;
  }

  body.catalog-mode .catalog-inquiry-dock:not([hidden]) > button {
    min-height: 34px !important;
    padding: 0 10px !important;
    border-radius: 7px !important;
    font-size: 11px !important;
  }
}
