/* Product Catalog -- catalog A2 (R2b).
 *
 * Platform tokens only. See .claude/rules/modules-lessons.md for the
 * canonical token set.
 */

/* Full-bleed override -- the Quotes tab needs every pixel between
   the platform sidebar and the viewport edge for its 3-panel layout
   (rail + quote list + PDF). The default .strata-module-container
   caps width at 1200px and centers; that crushes the PDF column down
   to ~600px even on a wide monitor. Match the DAM full-bleed pattern. */
.strata-content:has([data-module="product-catalog"]) { padding: 0; }
.strata-module-container[data-module="product-catalog"] {
  max-width: none;
  margin: 0;
  padding: 0;
  height: 100%;
}

/* Root ---------------------------------------------------------------- */

[data-module="product-catalog"] {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  color: var(--text-primary);
}

[data-module="product-catalog"] .pc-root {
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 1;
  background: var(--bg);
  /* Height of the sticky navigator-list <thead> row (padding 0.5rem top+bottom
     + ~0.6875rem label line + 1px border-bottom ~= 29-30px). Shared so the
     compact sticky group-header can pin JUST beneath it without a drifting
     magic number (N5). Adjust here if the thead padding/font changes. */
  --pc-nav-thead-h: 30px;
}

/* Topbar -------------------------------------------------------------- */

[data-module="product-catalog"] .pc-topbar {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.6875rem 1.125rem 0.5625rem;
  border-bottom: 1px solid var(--border);
  background: var(--panel);
  flex-shrink: 0;
}

[data-module="product-catalog"] .pc-panel-toggle {
  width: 28px;
  height: 28px;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: transparent;
  color: var(--text-secondary);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  padding: 0;
}

[data-module="product-catalog"] .pc-panel-toggle.is-active {
  background: var(--accent-soft);
  color: var(--accent);
  border-color: var(--accent-line);
}

[data-module="product-catalog"] .pc-panel-toggle:hover {
  background: var(--row-hover);
  color: var(--text-primary);
}

[data-module="product-catalog"] .pc-title {
  margin: 0;
  font-size: 1.0625rem;
  font-weight: 600;
  letter-spacing: -0.3px;
  color: var(--text-primary);
}

[data-module="product-catalog"] .pc-count {
  font-size: 0.75rem;
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-muted {
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-active-chip {
  margin-left: 0.375rem;
  padding: 0.125rem 0.5rem;
  border-radius: 10px;
  background: var(--accent-soft);
  color: var(--accent);
  border: 1px solid var(--accent-line);
  font-size: 0.6875rem;
  font-weight: 600;
}

[data-module="product-catalog"] .pc-topbar-actions {
  margin-left: auto;
  display: flex;
  gap: 0.375rem;
}

/* Buttons: use the platform's .btn-primary / .btn-secondary classes */

/* Body 2-col ---------------------------------------------------------- */

[data-module="product-catalog"] .pc-body {
  flex: 1;
  display: flex;
  overflow: hidden;
  min-height: 0;
}

[data-module="product-catalog"] .pc-main {
  flex: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  min-width: 0;
}

/* ====================================================================
   Split-pane navigator + detail (PR2)
   ==================================================================== */

/* Navigator column (list). Full-width when no selection; fixed (resizable)
   width in the split view via an inline style from state.navWidth. */
[data-module="product-catalog"] .pc-nav {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  min-width: 0;
  min-height: 0;
  background: var(--panel);
}
[data-module="product-catalog"] .pc-nav-full {
  flex: 1;
}
[data-module="product-catalog"] .pc-nav-compact {
  flex-shrink: 0;
  /* width comes from the inline style (state.navWidth); this is the fallback. */
  width: 290px;
  border-right: 1px solid var(--border);
}

/* Navigator header: search + facet trigger + active-filter badges. */
[data-module="product-catalog"] .pc-nav-head {
  position: relative;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.375rem;
  padding: 0.4375rem 0.625rem;
  border-bottom: 1px solid var(--border);
  background: var(--panel-2);
  flex-shrink: 0;
}
[data-module="product-catalog"] .pc-nav-search {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 0.3125rem;
  min-width: 0;
  height: 28px;
  padding: 0 0.5rem;
  background: var(--input-bg);
  border: 1px solid var(--border);
  border-radius: 6px;
}
[data-module="product-catalog"] .pc-nav-search .pc-search-icon {
  flex-shrink: 0;
  color: var(--text-tertiary);
}
[data-module="product-catalog"] .pc-nav-search .pc-search-input {
  flex: 1;
  min-width: 0;
  background: none;
  border: none;
  outline: none;
  color: var(--text-primary);
  font-size: 0.75rem;
  font-family: inherit;
}
[data-module="product-catalog"] .pc-nav-search .pc-search-input::placeholder {
  color: var(--text-tertiary);
}

/* Facet trigger chip */
[data-module="product-catalog"] .pc-facet-trigger {
  display: inline-flex;
  align-items: center;
  gap: 0.3125rem;
  height: 28px;
  padding: 0 0.5rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: transparent;
  color: var(--text-secondary);
  font-size: 0.71875rem;
  font-family: inherit;
  cursor: pointer;
  white-space: nowrap;
  flex-shrink: 0;
}
[data-module="product-catalog"] .pc-facet-trigger:hover {
  background: var(--row-hover);
  color: var(--text-primary);
}
[data-module="product-catalog"] .pc-facet-trigger.is-open,
[data-module="product-catalog"] .pc-facet-trigger.has-active {
  background: var(--accent-soft);
  color: var(--accent);
  border-color: var(--accent-line);
}
[data-module="product-catalog"] .pc-facet-trigger svg {
  flex-shrink: 0;
}

/* Active-filter badges (visible whether or not the popover is open) */
[data-module="product-catalog"] .pc-nav-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  width: 100%;
}
[data-module="product-catalog"] .pc-fbadge {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.125rem 0.4375rem;
  border-radius: 10px;
  border: 1px solid var(--accent-line);
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 0.6875rem;
  font-family: inherit;
  cursor: pointer;
}
[data-module="product-catalog"] .pc-fbadge:hover {
  filter: brightness(1.1);
}
[data-module="product-catalog"] .pc-fbadge-k {
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 0.625rem;
  opacity: 0.8;
}
[data-module="product-catalog"] .pc-fbadge-x {
  font-size: 0.8125rem;
  line-height: 1;
}
[data-module="product-catalog"] .pc-fbadge-clear-all {
  display: inline-flex;
  align-items: center;
  padding: 0.125rem 0.4375rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: transparent;
  color: var(--text-tertiary);
  font-size: 0.6875rem;
  font-family: inherit;
  cursor: pointer;
}
[data-module="product-catalog"] .pc-fbadge-clear-all:hover {
  color: var(--text-primary);
  background: var(--row-hover);
}

/* Facet popover.
   Anchored right within .pc-nav-head (position:relative, spans the nav width).
   The nav column can be as narrow as 200px (state.navWidth min) and .pc-nav
   has overflow:hidden, so a fixed 260px popover would be clipped ~70px at the
   narrowest width. Cap the width to the nav's content box (max-width relative
   to the offset parent = nav-head width) so every control + Clear All stays
   fully reachable at navWidth=200; it opens out to 260px on wider columns. */
[data-module="product-catalog"] .pc-facet-popover {
  position: absolute;
  top: calc(100% + 0.25rem);
  right: 0.625rem;
  z-index: 20;
  width: 260px;
  max-width: calc(100% - 0.625rem);
  max-height: 60vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--panel);
  border: 1px solid var(--border-strong);
  border-radius: var(--panel-radius);
  box-shadow: var(--shadow-lg);
}
[data-module="product-catalog"] .pc-facet-tabs {
  display: flex;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}
[data-module="product-catalog"] .pc-facet-tab {
  flex: 1;
  padding: 0.5rem 0;
  border: none;
  background: transparent;
  color: var(--text-secondary);
  font-size: 0.75rem;
  font-family: inherit;
  cursor: pointer;
}
[data-module="product-catalog"] .pc-facet-tab.is-active {
  color: var(--accent);
  font-weight: 600;
  box-shadow: inset 0 -2px 0 var(--accent);
}
[data-module="product-catalog"] .pc-facet-list {
  overflow-y: auto;
  padding: 0.25rem;
  flex: 1;
  min-height: 0;
}
[data-module="product-catalog"] .pc-facet-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  width: 100%;
  padding: 0.375rem 0.5rem;
  border: none;
  border-radius: 6px;
  background: transparent;
  color: var(--text-secondary);
  font-size: 0.75rem;
  font-family: inherit;
  cursor: pointer;
  text-align: left;
}
[data-module="product-catalog"] .pc-facet-item:hover {
  background: var(--row-hover);
  color: var(--text-primary);
}
[data-module="product-catalog"] .pc-facet-item.is-active {
  background: var(--accent-soft);
  color: var(--accent);
}
[data-module="product-catalog"] .pc-facet-item-label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
[data-module="product-catalog"] .pc-facet-item-count {
  flex-shrink: 0;
  color: var(--text-tertiary);
  font-variant-numeric: tabular-nums;
}
[data-module="product-catalog"] .pc-facet-item.is-active .pc-facet-item-count {
  color: var(--accent);
}
[data-module="product-catalog"] .pc-facet-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 1.25rem;
  color: var(--text-tertiary);
  font-size: 0.75rem;
}
[data-module="product-catalog"] .pc-facet-controls {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 0.625rem;
  border-top: 1px solid var(--border);
  flex-shrink: 0;
}
[data-module="product-catalog"] .pc-facet-ctl {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  font-size: 0.75rem;
  color: var(--text-secondary);
}
[data-module="product-catalog"] .pc-facet-check {
  justify-content: flex-start;
  gap: 0.375rem;
  cursor: pointer;
}
[data-module="product-catalog"] .pc-facet-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.5rem 0.625rem;
  border-top: 1px solid var(--border);
  flex-shrink: 0;
}
[data-module="product-catalog"] .pc-facet-clearall-btn {
  border: none;
  background: none;
  color: var(--text-tertiary);
  font-size: 0.75rem;
  font-family: inherit;
  cursor: pointer;
  padding: 0;
}
[data-module="product-catalog"] .pc-facet-clearall-btn:hover {
  color: var(--text-primary);
}

/* Split body layout */
[data-module="product-catalog"] .pc-body-split {
  display: flex;
  align-items: stretch;
}

/* Drag handle between navigator and detail */
[data-module="product-catalog"] .pc-nav-resize {
  width: 6px;
  flex-shrink: 0;
  background: var(--panel-2);
  border-left: 1px solid var(--border);
  border-right: 1px solid var(--border);
  cursor: col-resize;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 3px;
  touch-action: none;
}
[data-module="product-catalog"] .pc-nav-resize:hover,
[data-module="product-catalog"] .pc-nav-resize.is-active {
  background: var(--accent-soft);
}
[data-module="product-catalog"] .pc-nav-resize-dot {
  width: 2px;
  height: 2px;
  border-radius: 50%;
  background: var(--border-strong);
}
[data-module="product-catalog"] .pc-nav-resize:hover .pc-nav-resize-dot,
[data-module="product-catalog"] .pc-nav-resize.is-active .pc-nav-resize-dot {
  background: var(--accent);
}
/* While dragging, suppress text selection + iframe pointer capture. */
[data-module="product-catalog"].pc-nav-resizing,
[data-module="product-catalog"].pc-nav-resizing * {
  cursor: col-resize !important;
  user-select: none;
}

/* Detail column (PR2 stand-in hosts renderFullDetail). The stand-in's
   .pc-fullroot is itself a flex column with internal scroll panes
   (.pc-fullbody-left/right), so this column is a non-scrolling flex container
   that lets the nested fullroot fill + manage its own scroll -- matching how
   the full-page detail already lays out. PR3 swaps the stand-in for the
   compact preview. */
[data-module="product-catalog"] .pc-detailcol {
  flex: 1;
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--bg);
  animation: pc-detailcol-enter 0.16s ease;
}
@keyframes pc-detailcol-enter {
  from { opacity: 0; transform: translateY(4px); }
  to { opacity: 1; transform: none; }
}
/* The stand-in's .pc-fullroot fills the detail column (flex:1 already); it
   keeps its own internal scroll panes. Suppress its slide-in-right keyframe
   here since .pc-detailcol has its own gentle enter animation. Pinned above
   the fullroot, the "not in current results" hint must not be pushed out, so
   the fullroot flexes within remaining space. */
[data-module="product-catalog"] .pc-detailcol .pc-fullroot {
  animation: none;
  min-height: 0;
}

/* Pinned-selection hint (selected product dropped from current results) */
[data-module="product-catalog"] .pc-pinned-hint {
  display: flex;
  align-items: center;
  gap: 0.4375rem;
  padding: 0.4375rem 1.25rem;
  background: var(--accent-soft);
  border-bottom: 1px solid var(--accent-line);
  color: var(--accent);
  font-size: 0.75rem;
}
[data-module="product-catalog"] .pc-pinned-hint-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--accent);
  flex-shrink: 0;
}

/* Split preview (PR3) -- compact read-only quick-look inside .pc-detailcol.
   The root fills the (non-scrolling flex) detail column and owns its own
   vertical scroll. Purpose-built for the narrow column: single-column body,
   image-led header, small stat strip, read-only detail rows, compact SKU +
   pricing + usage summary + the static cutsheet card. */
[data-module="product-catalog"] .pc-previewroot {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  overflow-x: hidden;
  background: var(--bg);
  /* S5: drive the wide/narrow split on the detail COLUMN width, not the
     viewport -- the navigator is user-resizable, so the same viewport can
     be wide or narrow here. Container query below keys on this. */
  container-type: inline-size;
  container-name: pc-preview;
}
/* S5 two-region wrapper. Default (narrow) = single scroll column, so the
   breadcrumb + left content stack and the PDF pane is hidden. The wide
   container query (below) turns this into a left/right flex row. */
[data-module="product-catalog"] .pc-preview-regions {
  display: flex;
  flex-direction: column;
  min-height: 0;
}
[data-module="product-catalog"] .pc-preview-left {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
/* Keep the read-only quick-look comfortable in the NARROW single-column
   layout: each band caps its inner content to a readable measure and
   left-aligns it rather than stretching stats / rows edge to edge. This cap
   is lifted in wide two-region mode (the left column is already bounded, and
   the PDF pane earns the rest of the width). */
[data-module="product-catalog"] .pc-preview-head,
[data-module="product-catalog"] .pc-preview-stats,
[data-module="product-catalog"] .pc-preview-actions,
[data-module="product-catalog"] .pc-preview-body {
  max-width: 680px;
}

/* S5: the right-hand inline PDF pane -- hidden in the narrow layout (the
   left-column thumbnail card is the fallback), revealed by the wide
   container query. */
[data-module="product-catalog"] .pc-preview-pdfpane {
  display: none;
}
/* Minimal fixed header above the scroll: page count (left) + Download / Open
   full (right). Stays put while pages scroll under it. */
[data-module="product-catalog"] .pc-preview-pdfpane-head {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.5rem 0.75rem;
  border-bottom: 1px solid var(--border);
  background: var(--panel);
}
[data-module="product-catalog"] .pc-pdfpane-label {
  display: inline-flex;
  align-items: baseline;
  gap: 0.5rem;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-secondary);
}
[data-module="product-catalog"] .pc-pdfpane-pages {
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
  color: var(--text-tertiary);
}
[data-module="product-catalog"] .pc-pdfpane-pages:empty {
  display: none;
}
[data-module="product-catalog"] .pc-pdfpane-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
}
[data-module="product-catalog"] .pc-pdfpane-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.3125rem;
  padding: 0.25rem 0.5rem;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: var(--panel-2);
  color: var(--text-primary);
  font: inherit;
  font-size: 0.75rem;
  line-height: 1;
  text-decoration: none;
  cursor: pointer;
}
[data-module="product-catalog"] .pc-pdfpane-btn:hover {
  border-color: var(--accent);
  color: var(--accent);
}
[data-module="product-catalog"] .pc-pdfpane-btn svg,
[data-module="product-catalog"] .pc-pdfpane-iconbtn svg {
  flex-shrink: 0;
}
/* The display:inline-flex on the button classes would otherwise override the
   [hidden] attribute (author rule beats the UA [hidden]{display:none}), so the
   Download link would flash before its object URL is wired. Re-hide it. */
[data-module="product-catalog"] .pc-pdfpane-btn[hidden],
[data-module="product-catalog"] .pc-pdfpane-iconbtn[hidden] {
  display: none;
}
/* Zoom control group: [-] [NNN%] [+]. */
[data-module="product-catalog"] .pc-pdfpane-zoom {
  display: inline-flex;
  align-items: center;
  gap: 0.125rem;
  margin-right: 0.125rem;
}
[data-module="product-catalog"] .pc-pdfpane-iconbtn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  /* Comfortable touch target. This pane only renders on a wide detail column
     (desktop / tablet landscape), so it does not hit the 375px phone layout;
     32px balances the compact toolbar against touch reachability. */
  width: 32px;
  height: 32px;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: var(--panel-2);
  color: var(--text-primary);
  cursor: pointer;
}
[data-module="product-catalog"] .pc-pdfpane-iconbtn:hover {
  border-color: var(--accent);
  color: var(--accent);
}
[data-module="product-catalog"] .pc-pdfpane-zoomval {
  min-width: 46px;
  min-height: 32px;
  padding: 0.25rem 0.25rem;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: var(--panel-2);
  color: var(--text-primary);
  font: inherit;
  font-size: 0.6875rem;
  line-height: 1;
  text-align: center;
  cursor: pointer;
  font-variant-numeric: tabular-nums;
}
[data-module="product-catalog"] .pc-pdfpane-zoomval:hover {
  border-color: var(--accent);
  color: var(--accent);
}
/* When ANY available pointer is coarse (touch), grow every pane control to the
   44px minimum touch target -- covers hybrid touchscreen laptops whose PRIMARY
   pointer is a fine mouse. Mouse-only devices keep the compact 32px toolbar. */
@media (any-pointer: coarse) {
  [data-module="product-catalog"] .pc-pdfpane-iconbtn {
    width: 44px;
    height: 44px;
  }
  [data-module="product-catalog"] .pc-pdfpane-zoomval,
  [data-module="product-catalog"] .pc-pdfpane-btn {
    min-height: 44px;
  }
}
[data-module="product-catalog"] .pc-preview-pdfpane-scroll {
  flex: 1 1 auto;
  min-height: 0;
  /* Both axes scroll: a zoomed-in page can exceed the pane width and must be
     reachable horizontally (a flex column + align-self:center would clip the
     left edge unreachably). Block flow + margin:0 auto on the pages centers
     them when they fit and left-aligns + scrolls when zoomed past fit. */
  overflow: auto;
  padding: 0.75rem;
  background: var(--panel-2);
  /* Pan both axes with one finger (needed once zoomed); 2-finger pinch is not
     a listed action, so the browser hands it to our touchmove handler (inline
     zoom) instead of zooming the whole page. */
  touch-action: pan-x pan-y;
}
[data-module="product-catalog"] .pc-preview-pdfpane-loading,
[data-module="product-catalog"] .pc-preview-pdfpane-error {
  color: var(--text-secondary);
  font-size: 0.8125rem;
  padding: 1rem;
  text-align: center;
}
[data-module="product-catalog"] .pc-inline-pdf-page {
  /* Size to the (possibly zoomed) canvas; center when it fits, left-align +
     horizontal-scroll when it is wider than the pane. No max-width cap here --
     zoom controls the width; the JS fit-width baseline keeps the default sane. */
  width: -moz-fit-content;
  width: fit-content;
  max-width: none;
  margin: 0 auto 0.75rem;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: var(--panel);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.18);
  min-height: 40px;
}
[data-module="product-catalog"] .pc-inline-pdf-page:last-child {
  margin-bottom: 0;
}
[data-module="product-catalog"] .pc-inline-pdf-canvas {
  display: block;
}
[data-module="product-catalog"] .pc-linkbtn {
  background: none;
  border: none;
  color: var(--accent);
  cursor: pointer;
  padding: 0;
  font: inherit;
  text-decoration: underline;
}

/* S5: wide two-region layout. Breakpoint = PC_PDF_SPLIT_MIN (render.js) =
   340 (left col) + 16 (gap) + 400 (usable pane) = 756px of detail-column
   width. Above it, metadata LEFT / scrollable PDF RIGHT; below it, the
   single-column narrow layout above (with the thumbnail-card fallback). */
@container pc-preview (min-width: 756px) {
  /* The two-region row is scoped to .pc-preview-haspdf: a product WITHOUT a
     cutsheet has no right pane, so it must stay a single column here -- without
     this scoping a cutsheet-less detail would get a 460px-capped left column, a
     dangling right border, and an empty right region. */
  [data-module="product-catalog"] .pc-preview-haspdf .pc-preview-regions {
    flex: 1;
    flex-direction: row;
    align-items: stretch;
    min-height: 0;
  }
  [data-module="product-catalog"] .pc-preview-haspdf .pc-preview-left {
    flex: 0 1 460px;
    min-width: 340px;
    overflow-y: auto;
    border-right: 1px solid var(--border);
  }
  [data-module="product-catalog"] .pc-preview-haspdf .pc-preview-pdfpane {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-width: 400px;
    min-height: 0;
  }
  /* In wide mode the left band caps are lifted -- the left column is already
     width-bounded by its flex-basis, so let bands fill it. */
  [data-module="product-catalog"] .pc-preview-haspdf .pc-preview-head,
  [data-module="product-catalog"] .pc-preview-haspdf .pc-preview-stats,
  [data-module="product-catalog"] .pc-preview-haspdf .pc-preview-actions,
  [data-module="product-catalog"] .pc-preview-haspdf .pc-preview-body {
    max-width: none;
  }
  /* The left-column thumbnail CARD is redundant with the pane in wide mode;
     hide just the card + its body, keep the head + source link + freshness. */
  [data-module="product-catalog"] .pc-preview-haspdf .pc-preview-cutsheet-haspdf .pc-fullsection-cutsheet-body .pc-cutsheet-card {
    display: none;
  }
}
/* Mouse-visible close/back at the top of the preview. Reuses .pc-breadcrumb
   colours; adds the column's horizontal padding + top gap so it aligns with
   the head band below and sits clear of the top edge. align-self:flex-start
   keeps the hit target tight to the text (the previewroot is a flex column). */
[data-module="product-catalog"] .pc-preview-breadcrumb {
  align-self: flex-start;
  margin-bottom: 0;
  padding: 0.75rem 1.25rem 0.25rem;
}
[data-module="product-catalog"] .pc-preview-head {
  display: flex;
  gap: 0.875rem;
  align-items: flex-start;
  padding: 0.25rem 1.25rem 0.75rem;
}
[data-module="product-catalog"] .pc-preview-head-media {
  flex-shrink: 0;
}
[data-module="product-catalog"] .pc-preview-img {
  width: 96px;
  height: 96px;
  border-radius: 8px;
  border: 1px solid var(--border);
  object-fit: cover;
  background: var(--panel-2);
  display: block;
}
[data-module="product-catalog"] .pc-preview-img-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  color: var(--text-tertiary);
  font-size: 0.6875rem;
}
[data-module="product-catalog"] .pc-preview-img-empty {
  border-style: dashed;
}
[data-module="product-catalog"] .pc-preview-head-text {
  min-width: 0;
  flex: 1;
}
[data-module="product-catalog"] .pc-preview-mfr {
  font-size: 0.75rem;
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
[data-module="product-catalog"] .pc-preview-name {
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--text-primary);
  line-height: 1.25;
  margin: 0.125rem 0 0.4375rem;
  word-break: break-word;
}
[data-module="product-catalog"] .pc-preview-chips {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.375rem;
}
[data-module="product-catalog"] .pc-preview-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 0 1.25rem 0.75rem;
}
[data-module="product-catalog"] .pc-preview-stat {
  flex: 1 1 auto;
  min-width: 84px;
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
  padding: 0.5rem 0.625rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--panel);
}
[data-module="product-catalog"] .pc-preview-stat-v {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--text-primary);
}
[data-module="product-catalog"] .pc-preview-stat-l {
  font-size: 0.625rem;
  color: var(--text-tertiary);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
[data-module="product-catalog"] .pc-preview-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4375rem;
  padding: 0 1.25rem 0.875rem;
  border-bottom: 1px solid var(--border);
}
[data-module="product-catalog"] .pc-preview-body {
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
  padding: 0.875rem 1.25rem 1.5rem;
}
[data-module="product-catalog"] .pc-preview-section {
  margin: 0;
}
/* Read-only detail rows (label / value) -- no inline-edit affordance. */
[data-module="product-catalog"] .pc-preview-detailgrid {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
[data-module="product-catalog"] .pc-preview-detail-row {
  display: grid;
  grid-template-columns: 88px 1fr;
  gap: 0.625rem;
  align-items: start;
}
[data-module="product-catalog"] .pc-preview-detail-label {
  font-size: 0.6875rem;
  color: var(--text-tertiary);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  padding-top: 0.0625rem;
}
[data-module="product-catalog"] .pc-preview-detail-val {
  font-size: 0.8125rem;
  color: var(--text-primary);
  white-space: pre-wrap;
  word-break: break-word;
}
[data-module="product-catalog"] .pc-preview-detail-empty {
  color: var(--text-tertiary);
}
/* Compact SKU list (part # + current price). */
[data-module="product-catalog"] .pc-preview-sku-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
}
[data-module="product-catalog"] .pc-preview-sku-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.375rem 0;
  border-top: 1px solid var(--border);
  font-size: 0.8125rem;
}
[data-module="product-catalog"] .pc-preview-sku-row:first-child {
  border-top: none;
}
[data-module="product-catalog"] .pc-preview-sku-part {
  color: var(--text-primary);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
[data-module="product-catalog"] .pc-preview-sku-price {
  color: var(--text-secondary);
  font-variant-numeric: tabular-nums;
  flex-shrink: 0;
}
[data-module="product-catalog"] .pc-preview-pricing {
  font-size: 0.875rem;
}
/* S5: price provenance strip (source / supplier / received date) + stale
   badge, under the Current pricing range. */
[data-module="product-catalog"] .pc-price-prov {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.375rem;
}
[data-module="product-catalog"] .pc-prov-meta {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.75rem;
  color: var(--text-secondary);
}
[data-module="product-catalog"] .pc-prov-sep {
  color: var(--text-tertiary);
}
[data-module="product-catalog"] .pc-prov-source {
  color: var(--text-primary);
  font-weight: 500;
}
[data-module="product-catalog"] .pc-stale-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.0625rem 0.375rem;
  border-radius: 4px;
  font-size: 0.625rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--warning);
  background: var(--warning-soft);
  border: 1px solid var(--warning);
}
/* S5: Expand -> "Open full detail" primary affordance. */
[data-module="product-catalog"] .pc-preview-expand-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
}
[data-module="product-catalog"] .pc-preview-expand-btn svg {
  flex-shrink: 0;
}
/* Usage summary (counts, not a per-project list). */
[data-module="product-catalog"] .pc-preview-usage-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
[data-module="product-catalog"] .pc-preview-usage-cell {
  flex: 1 1 auto;
  min-width: 90px;
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
}
[data-module="product-catalog"] .pc-preview-usage-v {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--text-primary);
}
[data-module="product-catalog"] .pc-preview-usage-l {
  font-size: 0.6875rem;
  color: var(--text-tertiary);
}

/* Compact navigator list schema (thumb / product / manufacturer) */
[data-module="product-catalog"] .pc-list-compact td.pc-cell,
[data-module="product-catalog"] .pc-list-compact th {
  padding: 0.375rem 0.75rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 0;
}
/* Thumb column must be wide enough to hold the 28px .pc-row-thumb PLUS its
   left/right padding. With border-box the column `width` INCLUDES padding, so a
   34px column left only ~20px of content box -- and the shared compact-cell
   rule above adds overflow:hidden, which then CLIPPED the 28px image down to
   the cell's content width (it rendered as a ~22px-wide vertical sliver, not a
   28px square). Size the column to fit 28px + 16px padding = 44px, drop the
   thumb's trailing margin here (cell padding supplies the gap), and let the
   thumb cell show its overflow so the square image is never clipped. */
/* NOTE the `td.`/`th.` type qualifier: the shared compact-cell rule above is
   `.pc-list-compact td.pc-cell` (specificity 0,3,1). A plain `.pc-cell-thumb`
   selector (0,3,0) LOSES to it, so its padding/overflow/max-width never
   applied -- that is why the 28px image was clipped to the 22px content box
   (max-width:0 + overflow:hidden inherited from the shared rule) and rendered
   as a narrow vertical sliver. Qualifying with `td`/`th` gives the thumb rule
   `.pc-list-compact td.pc-cell-thumb` -- the SAME (0,3,1) specificity as the
   shared rule, so it wins by later SOURCE ORDER (it is declared below), not by
   higher specificity. Keep this rule after the shared one. */
[data-module="product-catalog"] .pc-list-compact th.pc-col-thumb {
  width: 44px;
  padding: 0.25rem 0.375rem 0.25rem 0.625rem;
}
[data-module="product-catalog"] .pc-list-compact td.pc-cell-thumb {
  width: 44px;
  padding: 0.25rem 0.375rem 0.25rem 0.625rem;
  max-width: none;
  overflow: visible;
  text-overflow: clip;
}
[data-module="product-catalog"] .pc-list-compact td.pc-cell-thumb .pc-row-thumb {
  margin-right: 0;
  display: block;
}
[data-module="product-catalog"] .pc-list-compact .pc-cell-name {
  display: table-cell;
}
[data-module="product-catalog"] .pc-list-compact .pc-row-name-main {
  display: block;
  font-weight: 500;
  color: var(--text-primary);
  overflow: hidden;
  text-overflow: ellipsis;
}
[data-module="product-catalog"] .pc-list-compact .pc-row-name-meta {
  display: block;
  font-size: 0.6875rem;
  color: var(--text-tertiary);
  overflow: hidden;
  text-overflow: ellipsis;
}
[data-module="product-catalog"] .pc-list-compact .pc-cell-mfr {
  color: var(--text-secondary);
}
/* Focused row (roving tabindex) gets a visible focus ring. */
[data-module="product-catalog"] .pc-row:focus-visible,
[data-module="product-catalog"] .pc-row:focus {
  outline: 2px solid var(--accent);
  outline-offset: -2px;
}

/* Left rail ----------------------------------------------------------- */

[data-module="product-catalog"] .pc-rail {
  width: 192px;
  flex-shrink: 0;
  border-right: 1px solid var(--border);
  background: var(--panel);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

[data-module="product-catalog"] .pc-rail-head {
  padding: 0.5625rem 0.75rem 0.5rem;
  border-bottom: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}

[data-module="product-catalog"] .pc-rail-head-label {
  font-size: 0.625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-rail-toggle {
  display: flex;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  overflow: hidden;
}

[data-module="product-catalog"] .pc-rail-toggle button {
  flex: 1;
  padding: 0.3125rem 0;
  border: none;
  background: transparent;
  color: var(--text-secondary);
  font-size: 0.71875rem;
  font-family: inherit;
  font-weight: 400;
  cursor: pointer;
}

[data-module="product-catalog"] .pc-rail-toggle button + button {
  border-left: 1px solid var(--border);
}

[data-module="product-catalog"] .pc-rail-toggle button.is-active {
  background: var(--accent-soft);
  color: var(--accent);
  font-weight: 600;
}

[data-module="product-catalog"] .pc-rail-list {
  flex: 1;
  overflow-y: auto;
  padding: 0.25rem 0;
}

[data-module="product-catalog"] .pc-rail-sep {
  height: 1px;
  background: var(--border);
  margin: 0.1875rem 0;
}

[data-module="product-catalog"] .pc-rail-item {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  width: 100%;
  padding: 0.375rem 0.75rem;
  border: none;
  background: transparent;
  color: var(--text-secondary);
  font-size: 0.78125rem;
  font-family: inherit;
  font-weight: 400;
  text-align: left;
  cursor: pointer;
}

[data-module="product-catalog"] .pc-rail-item:hover {
  background: var(--row-hover);
  color: var(--text-primary);
}

[data-module="product-catalog"] .pc-rail-item.is-active {
  background: var(--accent-soft);
  color: var(--accent);
  font-weight: 600;
}

[data-module="product-catalog"] .pc-rail-label {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

[data-module="product-catalog"] .pc-rail-count {
  padding: 0.0625rem 0.375rem;
  border-radius: 8px;
  background: var(--panel-2);
  border: 1px solid var(--border);
  font-size: 0.65625rem;
  color: var(--text-tertiary);
  flex-shrink: 0;
}

[data-module="product-catalog"] .pc-rail-item.is-active .pc-rail-count {
  background: var(--accent-soft);
  border-color: var(--accent-line);
  color: var(--accent);
}

/* Filter strip -------------------------------------------------------- */

[data-module="product-catalog"] .pc-filterbar {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.5rem 1rem;
  border-bottom: 1px solid var(--border);
  background: var(--panel);
  flex-shrink: 0;
  flex-wrap: wrap;
}

[data-module="product-catalog"] .pc-search {
  flex: 0 1 260px;
  min-width: 180px;
  display: flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.375rem 0.625rem;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: var(--input-bg);
}

[data-module="product-catalog"] .pc-search:focus-within {
  border-color: var(--accent);
  box-shadow: 0 0 0 2px var(--accent-soft);
}

[data-module="product-catalog"] .pc-search-icon {
  color: var(--text-tertiary);
  flex-shrink: 0;
}

[data-module="product-catalog"] .pc-search-input {
  flex: 1;
  border: none;
  background: transparent;
  color: var(--text-primary);
  font-size: 0.8125rem;
  font-family: inherit;
  padding: 0;
}

[data-module="product-catalog"] .pc-search-input:focus {
  outline: none;
}

[data-module="product-catalog"] .pc-filter-label {
  display: inline-flex;
  align-items: center;
  gap: 0.3125rem;
  font-size: 0.75rem;
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-filter-check {
  color: var(--text-secondary);
  cursor: pointer;
}

[data-module="product-catalog"] .pc-filter-select {
  padding: 0.25rem 0.5rem;
  border: 1px solid var(--border);
  border-radius: 5px;
  background: var(--input-bg);
  color: var(--text-primary);
  font-size: 0.75rem;
  font-family: inherit;
}

/* List + table -------------------------------------------------------- */

[data-module="product-catalog"] .pc-listwrap {
  flex: 1;
  min-height: 0;
  overflow: auto;
}

[data-module="product-catalog"] .pc-list {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.78125rem;
}

[data-module="product-catalog"] .pc-list thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  text-align: left;
  padding: 0.5rem 0.6875rem;
  font-weight: 600;
  font-size: 0.6875rem;
  color: var(--text-secondary);
  background: var(--panel-2);
  border-bottom: 1px solid var(--border);
  white-space: nowrap;
}

[data-module="product-catalog"] .pc-col-num {
  text-align: right;
}

[data-module="product-catalog"] .pc-row {
  cursor: pointer;
}

[data-module="product-catalog"] .pc-row:hover {
  background: var(--row-hover);
}

[data-module="product-catalog"] .pc-row-retired {
  opacity: 0.55;
}

[data-module="product-catalog"] .pc-row-matched {
  background: var(--accent-soft);
}

[data-module="product-catalog"] .pc-row-matched:hover {
  background: var(--accent-soft);
  filter: brightness(1.05);
}

[data-module="product-catalog"] .pc-cell {
  padding: 0.5625rem 0.6875rem;
  border-bottom: 1px solid var(--border);
  vertical-align: middle;
}

[data-module="product-catalog"] .pc-cell-name {
  font-weight: 600;
  font-size: 0.8125rem;
  color: var(--text-primary);
}

[data-module="product-catalog"] .pc-cell-mfr {
  color: var(--text-secondary);
  font-size: 0.75rem;
}

[data-module="product-catalog"] .pc-cell-projects,
[data-module="product-catalog"] .pc-cell-lastspec {
  color: var(--text-secondary);
  font-variant-numeric: tabular-nums;
}

[data-module="product-catalog"] .pc-cell-lastspec {
  color: var(--text-tertiary);
  font-size: 0.75rem;
}

/* Group header -------------------------------------------------------- */

[data-module="product-catalog"] .pc-grp-head td {
  padding: 0.4375rem 0.6875rem 0.375rem;
  background: var(--panel-2);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-secondary);
}

/* Sticky type-group headers in the compact navigator (PR2). The thead th is
   sticky at top:0; the group banner sticks just beneath it (offset by the
   shared --pc-nav-thead-h) so the current type stays visible while scrolling
   the narrow column. Using the shared var keeps this from drifting if the
   thead height changes (N5). */
[data-module="product-catalog"] .pc-list-compact .pc-grp-head td {
  position: sticky;
  top: var(--pc-nav-thead-h);
  z-index: 1;
}

[data-module="product-catalog"] .pc-grp-head-count {
  display: inline-flex;
  align-items: center;
  padding: 0 0.3125rem;
  height: 16px;
  margin-left: 0.4375rem;
  border-radius: 8px;
  background: var(--panel);
  border: 1px solid var(--border);
  font-size: 0.625rem;
  font-weight: 600;
  color: var(--text-tertiary);
  text-transform: none;
  letter-spacing: 0;
}

/* Components ---------------------------------------------------------- */

[data-module="product-catalog"] .pc-type-chip {
  display: inline-flex;
  align-items: center;
  padding: 0.125rem 0.4375rem;
  border-radius: 10px;
  background: var(--accent-soft);
  color: var(--accent);
  border: 1px solid var(--accent-line);
  font-size: 0.65625rem;
  white-space: nowrap;
}

[data-module="product-catalog"] .pc-sku-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.1875rem;
  padding: 0.125rem 0.4375rem;
  border-radius: 4px;
  background: var(--panel-2);
  border: 1px solid var(--border);
  font-size: 0.6875rem;
  color: var(--text-secondary);
  font-variant-numeric: tabular-nums;
}

[data-module="product-catalog"] .pc-price {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  font-variant-numeric: tabular-nums;
}

[data-module="product-catalog"] .pc-price-lo {
  font-weight: 500;
  color: var(--text-primary);
}

[data-module="product-catalog"] .pc-price-dash {
  color: var(--text-tertiary);
  font-size: 0.6875rem;
}

[data-module="product-catalog"] .pc-price-hi {
  color: var(--text-secondary);
  font-size: 0.75rem;
}

[data-module="product-catalog"] .pc-price-delta {
  display: inline-flex;
  align-items: center;
  padding: 0.0625rem 0.3125rem;
  border-radius: 4px;
  background: var(--panel-2);
  border: 1px solid var(--border);
  font-size: 0.625rem;
  color: var(--text-tertiary);
  white-space: nowrap;
}

[data-module="product-catalog"] .pc-retired {
  display: inline-block;
  margin-left: 0.375rem;
  padding: 0.05rem 0.375rem;
  background: var(--panel-2);
  border: 1px solid var(--border);
  border-radius: 4px;
  font-size: 0.625rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-empty {
  padding: 3rem 1.25rem;
  text-align: center;
  color: var(--text-tertiary);
}

/* Detail C: inline accordion expansion -------------------------------- */

[data-module="product-catalog"] .pc-row-active {
  background: var(--accent-soft);
  cursor: pointer;
}

[data-module="product-catalog"] .pc-row-active:hover {
  background: var(--accent-soft);
  filter: brightness(1.05);
}

[data-module="product-catalog"] .pc-row-active .pc-cell {
  border-bottom: none;
}

[data-module="product-catalog"] .pc-row-active .pc-cell-name {
  color: var(--accent);
  border-left: 2px solid var(--accent);
}

[data-module="product-catalog"] .pc-row-chevron {
  display: inline-flex;
  margin-right: 0.3125rem;
  color: var(--accent);
  vertical-align: middle;
}

[data-module="product-catalog"] .pc-row-thumb {
  display: inline-block;
  width: 28px;
  height: 28px;
  margin-right: 8px;
  border-radius: 4px;
  border: 1px solid var(--border);
  vertical-align: middle;
  object-fit: cover;
  background: var(--panel-2);
  flex-shrink: 0;
}
[data-module="product-catalog"] .pc-row-thumb-loading {
  background: linear-gradient(var(--row-hover), var(--row-hover)), var(--panel-2);
}
[data-module="product-catalog"] .pc-row-thumb-empty {
  border-style: dashed;
  opacity: 0.5;
}

/* List loading skeleton + infinite-scroll sentinel ------------------- */
[data-module="product-catalog"] .pc-row-skeleton td {
  padding: 10px 12px;
}
[data-module="product-catalog"] .pc-skel-bar {
  display: block;
  height: 14px;
  border-radius: 6px;
  background: linear-gradient(
    90deg,
    var(--panel-2) 0%,
    var(--row-hover) 50%,
    var(--panel-2) 100%
  );
  background-size: 200% 100%;
  animation: pc-skel-shimmer 1.2s ease-in-out infinite;
}
@keyframes pc-skel-shimmer {
  from { background-position: 200% 0; }
  to   { background-position: -200% 0; }
}
[data-module="product-catalog"] .pc-scroll-sentinel td,
[data-module="product-catalog"] .pc-scroll-end td {
  padding: 14px 12px;
  text-align: center;
  color: var(--text-tertiary);
  font-size: 12px;
}
[data-module="product-catalog"] .pc-scroll-more {
  margin-left: 8px;
  vertical-align: middle;
}
[data-module="product-catalog"] .pc-scroll-spinner {
  display: inline-block;
  width: 13px;
  height: 13px;
  border: 2px solid var(--border-strong);
  border-top-color: var(--accent);
  border-radius: 50%;
  vertical-align: middle;
  animation: pc-fresh-spin 0.7s linear infinite;
}
[data-module="product-catalog"] .pc-full-loading {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  color: var(--text-tertiary);
  font-size: 13px;
}

[data-module="product-catalog"] .pc-thumb-block {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 6px 0 12px;
  border-bottom: 1px solid var(--border);
  margin-bottom: 12px;
}
[data-module="product-catalog"] .pc-thumb-img {
  width: 96px;
  height: 96px;
  object-fit: cover;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--panel-2);
  flex-shrink: 0;
}
[data-module="product-catalog"] .pc-thumb-placeholder {
  width: 96px;
  height: 96px;
  border-radius: 6px;
  border: 1px dashed var(--border);
  background: var(--panel-2);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  color: var(--text-tertiary);
  flex-shrink: 0;
}
[data-module="product-catalog"] .pc-thumb-actions {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
}
[data-module="product-catalog"] .pc-thumb-btn {
  appearance: none;
  border: 1px solid var(--border);
  background: var(--input-bg);
  color: var(--text-primary);
  padding: 6px 10px;
  border-radius: 4px;
  cursor: pointer;
  font-size: 12px;
  font-weight: 600;
}
[data-module="product-catalog"] .pc-thumb-btn:hover {
  background: var(--row-hover);
  border-color: var(--border-strong);
}
[data-module="product-catalog"] .pc-thumb-btn-danger {
  color: var(--error);
}

[data-module="product-catalog"] .pc-row-expand > td {
  padding: 0;
  border-bottom: 1px solid var(--border);
  border-top: 1px solid var(--accent-line);
}

[data-module="product-catalog"] .pc-row-expand:hover > td {
  background: transparent;
}

[data-module="product-catalog"] .pc-expand {
  background: var(--panel);
  border-left: 2px solid var(--accent);
}

[data-module="product-catalog"] .pc-expand-grid {
  display: grid;
  grid-template-columns: 1fr 220px 240px;
}

[data-module="product-catalog"] .pc-expand-section {
  padding: 0.875rem 1rem;
  border-right: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  min-width: 0;
}

[data-module="product-catalog"] .pc-expand-section:last-child {
  border-right: none;
}

[data-module="product-catalog"] .pc-expand-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-expand-action {
  font-size: 0.6875rem !important;
  padding: 0.125rem 0.5rem !important;
  text-transform: none;
  letter-spacing: 0;
}

[data-module="product-catalog"] .pc-expand-empty {
  padding: 0.5rem 0;
  font-size: 0.75rem;
  color: var(--text-tertiary);
}

/* SKU sub-table */

[data-module="product-catalog"] .pc-skutable-wrap {
  overflow-x: auto;
}

[data-module="product-catalog"] .pc-skutable {
  width: max-content;
  min-width: 100%;
  border-collapse: collapse;
  font-size: 0.71875rem;
}

[data-module="product-catalog"] .pc-skutable thead th {
  position: static;
  padding: 0.25rem 0.4375rem;
  text-align: left;
  font-size: 0.625rem;
  font-weight: 600;
  color: var(--text-secondary);
  border-bottom: 1px solid var(--border);
  background: transparent;
  text-transform: none;
  letter-spacing: 0;
  min-width: 4.5rem;
  white-space: nowrap;
}

[data-module="product-catalog"] .pc-skurow td {
  padding: 0.3125rem 0.4375rem;
  border-bottom: 1px solid var(--border);
}

[data-module="product-catalog"] .pc-skurow:last-child td {
  border-bottom: none;
}

[data-module="product-catalog"] .pc-skurow-part {
  font-family: monospace;
  font-size: 0.65625rem;
  color: var(--text-secondary);
}

[data-module="product-catalog"] .pc-skurow-matched {
  background: var(--accent-soft);
}

[data-module="product-catalog"] .pc-skurow-retired {
  opacity: 0.55;
}

[data-module="product-catalog"] .pc-delta-base {
  color: var(--text-tertiary);
  font-size: 0.65625rem;
}

[data-module="product-catalog"] .pc-delta-up {
  color: var(--text-primary);
  font-weight: 500;
}

[data-module="product-catalog"] .pc-delta-down {
  color: var(--accent);
  font-weight: 500;
}

/* Option ∆ pricing */

[data-module="product-catalog"] .pc-expand-options {
  background: var(--panel-2);
}

/* Configurator section -- option ladder picker. */
[data-module="product-catalog"] .pc-expand-config {
  background: var(--panel-2);
}
[data-module="product-catalog"] .pc-config-group {
  margin-bottom: 0.625rem;
}
[data-module="product-catalog"] .pc-config-group:last-of-type {
  margin-bottom: 0.5rem;
}
[data-module="product-catalog"] .pc-config-group-head {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  margin-bottom: 0.25rem;
}
[data-module="product-catalog"] .pc-config-group-label {
  font-size: 0.6875rem;
  color: var(--text-secondary);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
[data-module="product-catalog"] .pc-config-clear {
  width: 16px;
  height: 16px;
  border: 1px solid transparent;
  border-radius: 50%;
  background: transparent;
  color: var(--text-tertiary);
  font-size: 0.875rem;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
[data-module="product-catalog"] .pc-config-clear:hover {
  border-color: var(--border);
  color: var(--text-primary);
}
[data-module="product-catalog"] .pc-config-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3125rem;
}
[data-module="product-catalog"] .pc-config-chip {
  padding: 0.25rem 0.5625rem;
  border-radius: 14px;
  border: 1px solid var(--border);
  background: var(--panel);
  color: var(--text-secondary);
  font-size: 0.71875rem;
  font-family: ui-monospace, SFMono-Regular, monospace;
  cursor: pointer;
  transition: background-color 0.12s ease, color 0.12s ease, border-color 0.12s ease;
}
[data-module="product-catalog"] .pc-config-chip:hover {
  background: var(--row-hover);
  color: var(--text-primary);
}
[data-module="product-catalog"] .pc-config-chip.is-active {
  background: var(--accent-soft);
  color: var(--accent);
  border-color: var(--accent);
  font-weight: 600;
}
[data-module="product-catalog"] .pc-config-preview {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-top: 0.5rem;
  padding: 0.4375rem 0.5625rem;
  border: 1px dashed var(--border);
  border-radius: var(--button-radius);
  background: var(--panel);
}
[data-module="product-catalog"] .pc-config-preview-label {
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-tertiary);
  font-weight: 600;
}
[data-module="product-catalog"] .pc-config-preview-code {
  font-family: ui-monospace, SFMono-Regular, monospace;
  font-size: 0.8125rem;
  color: var(--text-primary);
  font-weight: 600;
  flex: 1 1 auto;
}
[data-module="product-catalog"] .pc-config-preview-count {
  font-size: 0.6875rem;
  color: var(--text-tertiary);
  font-variant-numeric: tabular-nums;
}
[data-module="product-catalog"] .pc-config-actions {
  display: flex;
  justify-content: flex-end;
  gap: 0.375rem;
  margin-top: 0.5rem;
}

[data-module="product-catalog"] .pc-opt-group {
  margin-bottom: 0.625rem;
}

[data-module="product-catalog"] .pc-opt-group:last-child {
  margin-bottom: 0;
}

[data-module="product-catalog"] .pc-opt-key {
  font-size: 0.6875rem;
  color: var(--text-secondary);
  margin-bottom: 0.25rem;
  font-weight: 500;
}

[data-module="product-catalog"] .pc-opt-row {
  display: grid;
  grid-template-columns: 1fr 22px auto;
  align-items: center;
  gap: 0.4375rem;
  padding: 0.1875rem 0;
  font-size: 0.71875rem;
  border-bottom: 1px solid var(--border);
}

[data-module="product-catalog"] .pc-opt-row:last-child {
  border-bottom: none;
}

[data-module="product-catalog"] .pc-opt-val {
  color: var(--text-primary);
  font-weight: 500;
}

[data-module="product-catalog"] .pc-opt-count {
  font-size: 0.625rem;
  color: var(--text-tertiary);
  text-align: right;
  font-variant-numeric: tabular-nums;
}

[data-module="product-catalog"] .pc-opt-delta {
  text-align: right;
  font-variant-numeric: tabular-nums;
  font-size: 0.71875rem;
}

/* Side panel: cutsheet + quick actions */

[data-module="product-catalog"] .pc-cutsheet-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.1875rem;
  width: 64px;
  height: 80px;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: var(--panel-2);
  color: var(--accent);
  cursor: pointer;
  font-family: inherit;
}

[data-module="product-catalog"] .pc-cutsheet-card:hover {
  border-color: var(--accent-line);
  background: var(--accent-soft);
}

[data-module="product-catalog"] .pc-cutsheet-empty {
  color: var(--text-tertiary);
  border-style: dashed;
}

[data-module="product-catalog"] .pc-cutsheet-meta {
  font-size: 0.625rem;
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-cutsheet-replace {
  background: transparent;
  border: none;
  padding: 0;
  font-family: inherit;
  font-size: 0.625rem;
  color: var(--accent);
  cursor: pointer;
  text-transform: none;
  letter-spacing: 0;
  font-weight: 500;
}

[data-module="product-catalog"] .pc-cutsheet-replace:hover {
  text-decoration: underline;
}

[data-module="product-catalog"] .pc-cutsheet-head-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.4375rem;
}

[data-module="product-catalog"] .pc-cutsheet-delete {
  color: var(--error);
}

[data-module="product-catalog"] .pc-cutsheet-delete:hover {
  text-decoration: underline;
}

/* Cutsheet thumbnail variants -------------------------------------- */

[data-module="product-catalog"] .pc-cutsheet-thumb {
  display: block;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 3px;
  margin: 0 auto 0.375rem;
  /* Aspect ratio holds the layout slot until PDF.js paints. The
     placeholder has a portrait letter ratio so it matches the
     incoming bitmap closely. */
  aspect-ratio: 8.5 / 11;
}

[data-module="product-catalog"] .pc-cutsheet-compact .pc-cutsheet-thumb {
  width: 96px;
  max-width: 100%;
}

[data-module="product-catalog"] .pc-cutsheet-large .pc-cutsheet-thumb {
  width: 100%;
  max-width: 240px;
}

[data-module="product-catalog"] .pc-cutsheet-card.pc-cutsheet-large {
  padding: 0.75rem;
}

[data-module="product-catalog"] .pc-cutsheet-card.pc-cutsheet-empty .pc-cutsheet-thumb {
  display: none;
}

/* Source-URL link beneath the cutsheet card ------------------------ */

[data-module="product-catalog"] .pc-cutsheet-source-link {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  margin-top: 0.4375rem;
  padding: 0.1875rem 0;
  font-size: 0.6875rem;
  color: var(--text-secondary);
  text-decoration: none;
  word-break: break-all;
}

[data-module="product-catalog"] .pc-cutsheet-source-link:hover {
  color: var(--accent);
  text-decoration: underline;
}

[data-module="product-catalog"] .pc-cutsheet-source-link svg {
  flex-shrink: 0;
  opacity: 0.7;
}

/* Detail B (full-page) cutsheet section ---------------------------- */

[data-module="product-catalog"] .pc-fullsection-cutsheet-body {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.5rem;
}

[data-module="product-catalog"] .pc-fullsection-cutsheet-meta {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}

[data-module="product-catalog"] .pc-fullsection-action {
  font-size: 0.71875rem;
  padding: 0.25rem 0.5rem;
}

/* Verify-now button loading state ---------------------------------- */

[data-module="product-catalog"] .pc-fresh-action.is-loading {
  position: relative;
  color: var(--text-tertiary);
  cursor: default;
}

[data-module="product-catalog"] .pc-fresh-action.is-loading::before {
  content: '';
  display: inline-block;
  width: 9px;
  height: 9px;
  margin-right: 0.3125rem;
  vertical-align: -1px;
  border: 1.5px solid var(--border-strong);
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: pc-fresh-spin 0.8s linear infinite;
}

@keyframes pc-fresh-spin {
  to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
  [data-module="product-catalog"] .pc-fresh-action.is-loading::before {
    animation: none;
  }
}

/* Cutsheet freshness strip ----------------------------------------- */

[data-module="product-catalog"] .pc-fresh {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  margin-top: 0.5rem;
  padding: 0.4375rem 0.5rem;
  background: var(--panel-2);
  border-radius: var(--button-radius);
  font-size: 0.6875rem;
}

[data-module="product-catalog"] .pc-fresh-line {
  color: var(--text-tertiary);
  display: flex;
  flex-wrap: wrap;
  gap: 0.1875rem;
  align-items: baseline;
}

[data-module="product-catalog"] .pc-fresh-label {
  color: var(--text-tertiary);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 0.5625rem;
  font-weight: 600;
}

[data-module="product-catalog"] .pc-fresh-when {
  color: var(--text-secondary);
  font-variant-numeric: tabular-nums;
}

[data-module="product-catalog"] .pc-fresh-result {
  color: var(--text-secondary);
}

[data-module="product-catalog"] .pc-fresh-changed .pc-fresh-result {
  color: var(--accent);
  font-weight: 500;
}

[data-module="product-catalog"] .pc-fresh-unreachable .pc-fresh-result {
  color: var(--text-tertiary);
  font-style: italic;
}

[data-module="product-catalog"] .pc-fresh-manual {
  color: var(--text-secondary);
}

[data-module="product-catalog"] .pc-fresh-manual .pc-fresh-label {
  color: var(--accent);
  font-weight: 700;
}

[data-module="product-catalog"] .pc-fresh-manual .pc-fresh-when {
  color: var(--text-primary);
}

[data-module="product-catalog"] .pc-fresh-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  margin-top: 0.25rem;
}

[data-module="product-catalog"] .pc-fresh-action {
  background: transparent;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  padding: 0.1875rem 0.4375rem;
  font-size: 0.625rem;
  color: var(--text-secondary);
  cursor: pointer;
  white-space: nowrap;
}

[data-module="product-catalog"] .pc-fresh-action:hover {
  border-color: var(--border-strong);
  color: var(--text-primary);
  background: var(--row-hover);
}

[data-module="product-catalog"] .pc-fresh-action-mark {
  border-color: var(--accent-line);
  color: var(--accent);
}

[data-module="product-catalog"] .pc-fresh-action-mark:hover {
  background: var(--accent-soft);
  border-color: var(--accent);
}

[data-module="product-catalog"] .pc-expand-quick-actions {
  display: flex;
  flex-direction: column;
  gap: 0.3125rem;
  margin-top: auto;
}

[data-module="product-catalog"] .pc-expand-quick-btn {
  font-size: 0.71875rem !important;
  padding: 0.3125rem 0.625rem !important;
  text-align: center;
}

[data-module="product-catalog"] .pc-expand-close-btn {
  padding: 0.25rem 0.625rem;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: transparent;
  color: var(--text-tertiary);
  font-size: 0.6875rem;
  font-family: inherit;
  cursor: pointer;
  align-self: stretch;
  margin-top: 0.125rem;
}

[data-module="product-catalog"] .pc-expand-close-btn:hover {
  background: var(--row-hover);
  color: var(--text-secondary);
}

/* Animations: catalog <-> Detail B transitions ------------------------ */
/*
 * Animations only fire when render.js detects a real view transition
 * (catalog <-> full) and emits the .pc-anim-enter marker class. Plain
 * re-renders (filter changes, accordion toggles, refreshAndRender after
 * a mutation) leave the marker off so the page does not flash on every
 * tick.
 */

@keyframes pc-slidein-right {
  from { transform: translateX(2.5%); opacity: 0; }
  to   { transform: translateX(0);    opacity: 1; }
}

@keyframes pc-fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}

[data-module="product-catalog"] .pc-fullroot {
  background: var(--bg);
}

[data-module="product-catalog"] .pc-fullroot.pc-anim-enter {
  animation: pc-slidein-right 0.22s ease-out;
}

[data-module="product-catalog"] .pc-root.pc-anim-enter:not(.pc-fullroot) {
  animation: pc-fadein 0.18s ease-out;
}

@media (prefers-reduced-motion: reduce) {
  [data-module="product-catalog"] .pc-anim-enter {
    animation: none;
  }
  /* The split detail column's gentle enter animation must also be suppressed
     under reduced-motion (N2). */
  [data-module="product-catalog"] .pc-detailcol {
    animation: none;
  }
}

/* Quote Import slide-in (R3-3) --------------------------------------- */

@keyframes pc-qi-slidein {
  from { transform: translateX(100%); }
  to   { transform: translateX(0); }
}

@keyframes pc-qi-fadein-backdrop {
  from { opacity: 0; }
  to   { opacity: 1; }
}

[data-module="product-catalog"] .pc-qi-backdrop {
  position: fixed;
  inset: 0;
  background: var(--overlay-bg);
  z-index: 99;
}
[data-module="product-catalog"] .pc-qi-backdrop.is-entering {
  animation: pc-qi-fadein-backdrop 0.18s ease-out;
}

[data-module="product-catalog"] .pc-qi {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  width: 560px;
  max-width: calc(100vw - var(--sidebar-width));
  background: var(--panel);
  border-left: 1px solid var(--border);
  box-shadow: -4px 0 28px rgba(0, 0, 0, 0.4);
  z-index: 110;
  display: flex;
  flex-direction: column;
  /* Prevent trackpad horizontal-swipe from triggering the browser's
     back / forward navigation gesture while interacting with the
     panel. Without this, two-finger pan inside the PDF preview shows
     the OS-level nav indicator and flickers the page. */
  overscroll-behavior: contain;
}
[data-module="product-catalog"] .pc-qi.is-entering {
  animation: pc-qi-slidein 0.22s ease-out;
}

@media (prefers-reduced-motion: reduce) {
  [data-module="product-catalog"] .pc-qi-backdrop,
  [data-module="product-catalog"] .pc-qi {
    animation: none;
  }
}

[data-module="product-catalog"] .pc-qi-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  padding: 0.875rem 1.125rem 0.75rem;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
}

[data-module="product-catalog"] .pc-qi-title {
  margin: 0 0 0.125rem 0;
  font-size: 0.9375rem;
  font-weight: 600;
}

[data-module="product-catalog"] .pc-qi-sub {
  margin: 0;
  font-size: 0.6875rem;
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-qi-close {
  width: 26px;
  height: 26px;
  border-radius: var(--button-radius);
  border: 1px solid var(--border);
  background: transparent;
  color: var(--text-tertiary);
  font-size: 0.875rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
}

[data-module="product-catalog"] .pc-qi-close:hover {
  background: var(--row-hover);
  color: var(--text-primary);
}

[data-module="product-catalog"] .pc-qi-body {
  flex: 1;
  overflow-y: auto;
  padding: 0.875rem 1.125rem;
}

[data-module="product-catalog"] .pc-qi-section {
  margin-bottom: 1rem;
}

[data-module="product-catalog"] .pc-qi-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.5rem;
  font-size: 0.625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-qi-add {
  padding: 0.125rem 0.5625rem;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: transparent;
  color: var(--text-secondary);
  font-size: 0.65625rem;
  font-family: inherit;
  cursor: pointer;
  text-transform: none;
  letter-spacing: 0;
}

[data-module="product-catalog"] .pc-qi-add:hover {
  background: var(--row-hover);
  color: var(--text-primary);
}

[data-module="product-catalog"] .pc-qi-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.625rem;
  margin-bottom: 0.5rem;
}

[data-module="product-catalog"] .pc-qi-section .pc-qi-grid {
  grid-template-columns: 1fr 1fr;
}

[data-module="product-catalog"] .pc-qi-line .pc-qi-grid {
  grid-template-columns: 1fr 1fr 1fr;
}

[data-module="product-catalog"] .pc-qi-field {
  display: flex;
  flex-direction: column;
  gap: 0.1875rem;
  font-size: 0.65625rem;
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-qi-field span {
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-secondary);
}

[data-module="product-catalog"] .pc-qi-input {
  padding: 0.375rem 0.5625rem;
  background: var(--input-bg);
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  color: var(--text-primary);
  font-size: 0.78125rem;
  font-family: inherit;
}

[data-module="product-catalog"] .pc-qi-input:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 2px var(--accent-soft);
}

[data-module="product-catalog"] .pc-qi-line {
  border: 1px solid var(--border);
  border-radius: var(--panel-radius);
  padding: 0.625rem 0.75rem;
  background: var(--panel-2);
  margin-bottom: 0.5rem;
}

[data-module="product-catalog"] .pc-qi-line[data-status="matched"] {
  border-color: var(--accent-line);
  background: var(--accent-soft);
}

[data-module="product-catalog"] .pc-qi-line[data-status="error"] {
  border-color: var(--error);
  background: var(--error-soft);
}

[data-module="product-catalog"] .pc-qi-line-head {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
}

[data-module="product-catalog"] .pc-qi-line-num {
  font-size: 0.625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-qi-status {
  padding: 0.0625rem 0.4375rem;
  border-radius: 10px;
  font-size: 0.625rem;
  font-weight: 600;
  border: 1px solid var(--border);
  background: var(--panel);
  color: var(--text-secondary);
}

[data-module="product-catalog"] .pc-qi-status-matched {
  background: var(--accent-soft);
  border-color: var(--accent-line);
  color: var(--accent);
}

[data-module="product-catalog"] .pc-qi-status-new_product,
[data-module="product-catalog"] .pc-qi-status-new_sku {
  background: var(--panel);
  color: var(--text-primary);
  border-color: var(--border-strong);
}

[data-module="product-catalog"] .pc-qi-status-error {
  background: var(--error-soft);
  border-color: var(--error);
  color: var(--error);
}

[data-module="product-catalog"] .pc-qi-line-remove {
  margin-left: auto;
  width: 22px;
  height: 22px;
  border: none;
  background: transparent;
  color: var(--text-tertiary);
  font-size: 1rem;
  line-height: 1;
  cursor: pointer;
  border-radius: var(--button-radius);
}

[data-module="product-catalog"] .pc-qi-line-remove:hover {
  background: var(--row-hover);
  color: var(--error);
}

[data-module="product-catalog"] .pc-qi-name-field {
  margin-bottom: 0.5rem;
}

[data-module="product-catalog"] .pc-qi-matched {
  display: flex;
  align-items: center;
  gap: 0.4375rem;
  padding: 0.375rem 0.5rem;
  border-radius: var(--button-radius);
  background: var(--panel);
  border: 1px solid var(--accent-line);
  font-size: 0.71875rem;
  color: var(--accent);
}

[data-module="product-catalog"] .pc-qi-matched-name {
  color: var(--text-primary);
}

[data-module="product-catalog"] .pc-qi-foot {
  display: flex;
  justify-content: flex-end;
  gap: 0.4375rem;
  padding: 0.75rem 1.125rem;
  border-top: 1px solid var(--border);
  background: var(--panel-2);
  flex-shrink: 0;
}

[data-module="product-catalog"] .pc-qi-att {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
  padding: 0.5rem 0.625rem;
  border: 1px dashed var(--border-strong);
  border-radius: var(--panel-radius);
  background: var(--panel-2);
  font-size: 0.71875rem;
  color: var(--text-secondary);
  transition: border-color 0.12s ease, background 0.12s ease;
}

[data-module="product-catalog"] .pc-qi-att-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

[data-module="product-catalog"] .pc-qi-att-eml .pc-qi-att-icon {
  color: var(--text-tertiary);
}

/* When the user is dragging a quote file (PDF or .eml) over the panel,
   lift the dropzone and dim the rest of the panel. Highlight applies
   to the whole panel so the affordance is obvious from anywhere
   inside. */
[data-module="product-catalog"] .pc-qi.is-drag-over::after {
  content: 'Drop PDF or .eml to attach';
  position: absolute;
  inset: 16px;
  border: 2px dashed var(--accent);
  border-radius: var(--panel-radius);
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 1rem;
  font-weight: 600;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  z-index: 1;
}

[data-module="product-catalog"] .pc-qi.is-drag-over .pc-qi-att {
  border-color: var(--accent);
  background: var(--accent-soft);
  color: var(--accent);
}

[data-module="product-catalog"] .pc-qi-att.has-file {
  border-style: solid;
  border-color: var(--accent-line);
  background: var(--accent-soft);
}

[data-module="product-catalog"] .pc-qi-att-icon {
  display: inline-flex;
  align-items: center;
  color: var(--accent);
}

[data-module="product-catalog"] .pc-qi-att-name {
  font-weight: 600;
  color: var(--text-primary);
  max-width: 18rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

[data-module="product-catalog"] .pc-qi-att-size {
  color: var(--text-tertiary);
  font-size: 0.65625rem;
}

[data-module="product-catalog"] .pc-qi-att-hint {
  flex: 1 1 auto;
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-qi-att-pending {
  color: var(--text-secondary);
  font-style: italic;
}

[data-module="product-catalog"] .pc-qi-att-pick,
[data-module="product-catalog"] .pc-qi-att-clear {
  margin-left: auto;
  padding: 0.1875rem 0.625rem;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: var(--panel);
  color: var(--text-secondary);
  font-size: 0.65625rem;
  font-family: inherit;
  cursor: pointer;
}

[data-module="product-catalog"] .pc-qi-att-pick:hover,
[data-module="product-catalog"] .pc-qi-att-clear:hover {
  background: var(--row-hover);
  color: var(--text-primary);
}

[data-module="product-catalog"] .pc-qi-parsed-chip {
  padding: 0.0625rem 0.375rem;
  border-radius: 10px;
  font-size: 0.5625rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  background: var(--panel);
  border: 1px solid var(--border-strong);
  color: var(--text-tertiary);
}

/* Section header actions cluster (+ Add line, Use preparer, ...) */
[data-module="product-catalog"] .pc-qi-section-actions {
  display: flex;
  gap: 0.375rem;
}

/* Quote Preparer mode toggle ---------------------------------------- */

[data-module="product-catalog"] .pc-qi-preparer-field .pc-qi-preparer-head {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

[data-module="product-catalog"] .pc-qi-mode-toggle {
  display: inline-flex;
  margin-left: 0.25rem;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  overflow: hidden;
}

[data-module="product-catalog"] .pc-qi-mode-opt {
  padding: 0.0625rem 0.5rem;
  border: none;
  background: transparent;
  color: var(--text-tertiary);
  font-size: 0.5625rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-family: inherit;
  cursor: pointer;
}

[data-module="product-catalog"] .pc-qi-mode-opt + .pc-qi-mode-opt {
  border-left: 1px solid var(--border);
}

[data-module="product-catalog"] .pc-qi-mode-opt:hover {
  color: var(--text-secondary);
  background: var(--row-hover);
}

[data-module="product-catalog"] .pc-qi-mode-opt.is-active {
  background: var(--accent-soft);
  color: var(--accent);
}

[data-module="product-catalog"] .pc-qi-field-locked input {
  background: var(--panel-2);
  color: var(--text-tertiary);
  cursor: not-allowed;
  opacity: 0.85;
}

/* Linked-to-previous affordance ------------------------------------- */

[data-module="product-catalog"] .pc-qi-link-btn {
  margin-left: 0.25rem;
  padding: 0.0625rem 0.4375rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: transparent;
  color: var(--text-tertiary);
  font-size: 0.5625rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-family: inherit;
  cursor: pointer;
}

[data-module="product-catalog"] .pc-qi-link-btn:hover {
  border-color: var(--border-strong);
  color: var(--text-secondary);
}

[data-module="product-catalog"] .pc-qi-link-btn.is-active {
  background: var(--accent-soft);
  border-color: var(--accent-line);
  color: var(--accent);
}

[data-module="product-catalog"] .pc-qi-linked-chip {
  padding: 0.0625rem 0.375rem;
  border-radius: 10px;
  font-size: 0.5625rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  background: var(--accent-soft);
  border: 1px solid var(--accent-line);
  color: var(--accent);
}

/* Linked line visual nesting -- indent + left border to show the
   parent/child grouping. The (idx > 0) gate is handled in JS. */
[data-module="product-catalog"] .pc-qi-line.is-linked {
  margin-left: 1rem;
  border-left: 2px solid var(--accent-line);
  background: var(--panel-2);
}

/* Wide split-pane mode (PDF preview attached) ----------------------- */

[data-module="product-catalog"] .pc-qi.pc-qi-wide {
  /* Don't extend under the platform sidebar. min() picks the
     smallest of the three: large screens cap at 1600px, small
     screens scale to 96vw, anywhere a sidebar is mounted we leave
     a 16px breathing strip between sidebar and panel. */
  width: min(96vw, calc(100vw - var(--sidebar-width) - 16px), 1600px);
  max-width: none;
}

[data-module="product-catalog"] .pc-qi-body.pc-qi-split {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  gap: 0;
  padding: 0;
  overflow: hidden;
}

[data-module="product-catalog"] .pc-qi-pdf-pane {
  border-right: 1px solid var(--border);
  background: var(--bg);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-width: 0;
}

[data-module="product-catalog"] .pc-qi-pdf-host {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
}

/* .eml read-only preview pane (mirrors PDF pane sizing) ----------- */

[data-module="product-catalog"] .pc-qi-eml-pane {
  border-right: 1px solid var(--border);
  background: var(--bg);
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

[data-module="product-catalog"] .pc-qi-eml-headers {
  flex: 0 0 auto;
  padding: 0.875rem 1rem;
  border-bottom: 1px solid var(--border);
  background: var(--panel);
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

[data-module="product-catalog"] .pc-qi-eml-h {
  display: flex;
  gap: 0.5rem;
  align-items: baseline;
  font-size: 0.71875rem;
  line-height: 1.4;
}

[data-module="product-catalog"] .pc-qi-eml-h-label {
  flex: 0 0 56px;
  color: var(--text-tertiary);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 0.625rem;
  font-weight: 600;
  padding-top: 0.0625rem;
}

[data-module="product-catalog"] .pc-qi-eml-h-value {
  flex: 1 1 auto;
  color: var(--text-primary);
  word-break: break-word;
}

[data-module="product-catalog"] .pc-qi-eml-body {
  flex: 1 1 auto;
  margin: 0;
  padding: 0.875rem 1rem;
  overflow: auto;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.75rem;
  line-height: 1.5;
  color: var(--text-primary);
  white-space: pre-wrap;
  word-wrap: break-word;
}

[data-module="product-catalog"] .pc-qi-eml-atts {
  flex: 0 0 auto;
  padding: 0.625rem 1rem;
  border-top: 1px solid var(--border);
  background: var(--panel-2);
  font-size: 0.6875rem;
}

[data-module="product-catalog"] .pc-qi-eml-atts-head {
  color: var(--text-tertiary);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 600;
  margin-bottom: 0.25rem;
}

[data-module="product-catalog"] .pc-qi-eml-att-row {
  display: flex;
  gap: 0.5rem;
  align-items: baseline;
  padding: 0.125rem 0;
}

[data-module="product-catalog"] .pc-qi-eml-att-name {
  color: var(--text-secondary);
  flex: 1 1 auto;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

[data-module="product-catalog"] .pc-qi-eml-att-meta {
  color: var(--text-tertiary);
  flex: 0 0 auto;
  font-variant-numeric: tabular-nums;
}

[data-module="product-catalog"] .pc-qi-form-pane {
  overflow-y: auto;
  padding: 1rem 1.125rem;
  min-width: 0;
}

/* Pick button + dot indicator on header / line fields --------------- */

[data-module="product-catalog"] .pc-qi-field.has-pick > span {
  display: flex;
  align-items: center;
  gap: 0.3125rem;
}

[data-module="product-catalog"] .pc-qi-pick-btn {
  margin-left: auto;
  padding: 0.0625rem 0.375rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--panel);
  color: var(--text-secondary);
  font-size: 0.5625rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  font-family: inherit;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
}

[data-module="product-catalog"] .pc-qi-pick-btn:hover {
  background: var(--accent-soft);
  color: var(--accent);
  border-color: var(--accent-line);
}

[data-module="product-catalog"] .pc-qi-pick-dot {
  display: inline-block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--accent);
}

[data-module="product-catalog"] .pc-qi-line-page {
  margin-left: auto;
  padding: 0.0625rem 0.4375rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--panel);
  color: var(--text-tertiary);
  font-size: 0.5625rem;
  font-family: inherit;
  cursor: pointer;
  letter-spacing: 0.04em;
}

[data-module="product-catalog"] .pc-qi-line-page:hover {
  color: var(--accent);
  border-color: var(--accent-line);
}

[data-module="product-catalog"] .pc-qi-line.is-flash {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
  transition: outline 0.4s ease-out;
}

@media (max-width: 900px) {
  [data-module="product-catalog"] .pc-qi.pc-qi-wide {
    width: 100vw;
  }
  [data-module="product-catalog"] .pc-qi-body.pc-qi-split {
    grid-template-columns: 1fr;
    grid-template-rows: 50vh 1fr;
  }
  [data-module="product-catalog"] .pc-qi-pdf-pane,
  [data-module="product-catalog"] .pc-qi-eml-pane {
    border-right: none;
    border-bottom: 1px solid var(--border);
  }
}

@media (max-width: 640px) {
  [data-module="product-catalog"] .pc-qi {
    width: 100vw;
  }
  [data-module="product-catalog"] .pc-qi-grid,
  [data-module="product-catalog"] .pc-qi-line .pc-qi-grid {
    grid-template-columns: 1fr;
  }
  [data-module="product-catalog"] .pc-qi-input {
    font-size: 16px;
  }
}

/* Detail B: full-page expansion -------------------------------------- */

[data-module="product-catalog"] .pc-fullhead {
  padding: 0.875rem 1.5rem 1rem;
  border-bottom: 1px solid var(--border);
  background: var(--panel);
  border-top: 2px solid var(--accent-line);
  flex-shrink: 0;
}

[data-module="product-catalog"] .pc-breadcrumb {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  margin-bottom: 0.5rem;
  padding: 0.25rem 0;
  border: none;
  background: transparent;
  color: var(--accent);
  font-size: 0.71875rem;
  font-family: inherit;
  cursor: pointer;
}

[data-module="product-catalog"] .pc-breadcrumb:hover {
  filter: brightness(1.1);
}

[data-module="product-catalog"] .pc-breadcrumb-sep {
  color: var(--text-tertiary);
  margin: 0 0.25rem;
}

[data-module="product-catalog"] .pc-breadcrumb-tail {
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-fullhead-row {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  /* Wrap the title/actions row at narrow widths so the admin action buttons
     are never cut off. In the split stand-in the detail column can be as
     narrow as ~340px across 641-1100px, and the routed full view can be narrow
     on small screens; without wrap the non-shrinking actions block overflowed
     the clipped detail column. Minimal fix only -- PR3 replaces this content
     with the compact preview. */
  flex-wrap: wrap;
}

[data-module="product-catalog"] .pc-fullhead-title {
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
  min-width: 0;
}

[data-module="product-catalog"] .pc-fullhead-mfr {
  font-size: 0.71875rem;
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-fullhead-name {
  margin: 0;
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: -0.6px;
  color: var(--text-primary);
}

[data-module="product-catalog"] .pc-btn-danger {
  color: var(--error);
  border-color: var(--error-soft);
}

[data-module="product-catalog"] .pc-btn-danger:hover {
  background: var(--error-soft);
}

[data-module="product-catalog"] .pc-fullhead-chips {
  display: flex;
  align-items: center;
  gap: 0.375rem;
}

[data-module="product-catalog"] .pc-fullhead-actions {
  display: flex;
  gap: 0.375rem;
  /* Allow the action buttons themselves to wrap onto multiple lines so no
     single button is pushed off the edge of a narrow detail column (F5). */
  flex-wrap: wrap;
}

[data-module="product-catalog"] .pc-bigstats {
  display: inline-flex;
  margin-top: 0.875rem;
  border: 1px solid var(--border);
  border-radius: var(--panel-radius);
  background: var(--panel-2);
  overflow: hidden;
}

[data-module="product-catalog"] .pc-bigstat {
  padding: 0.625rem 1.125rem;
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
  border-right: 1px solid var(--border);
  white-space: nowrap;
}

[data-module="product-catalog"] .pc-bigstat:last-child {
  border-right: none;
}

[data-module="product-catalog"] .pc-bigstat-v {
  font-size: 1.125rem;
  font-weight: 600;
  letter-spacing: -0.3px;
  color: var(--text-primary);
  font-variant-numeric: tabular-nums;
}

[data-module="product-catalog"] .pc-bigstat-l {
  font-size: 0.625rem;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-fullbody {
  flex: 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  overflow: hidden;
  min-height: 0;
}

[data-module="product-catalog"] .pc-fullbody-left,
[data-module="product-catalog"] .pc-fullbody-right {
  overflow-y: auto;
  padding: 1.125rem 1.375rem;
}

[data-module="product-catalog"] .pc-fullbody-left {
  border-right: 1px solid var(--border);
}

[data-module="product-catalog"] .pc-fullsection {
  margin-bottom: 1.25rem;
}

[data-module="product-catalog"] .pc-fullsection:last-child {
  margin-bottom: 0;
}

[data-module="product-catalog"] .pc-fullsection-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 0.625rem;
  font-size: 0.65625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-fullsection-meta {
  text-transform: none;
  letter-spacing: 0;
  font-weight: 400;
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-fullopt-group {
  margin-bottom: 0.875rem;
}

[data-module="product-catalog"] .pc-fullopt-group-title {
  font-size: 0.75rem;
  color: var(--text-secondary);
  margin-bottom: 0.375rem;
}

[data-module="product-catalog"] .pc-fullopt-row {
  display: grid;
  grid-template-columns: 56px 1fr auto 28px;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.3125rem;
  font-size: 0.71875rem;
}

[data-module="product-catalog"] .pc-fullopt-key {
  text-align: right;
  color: var(--text-primary);
  font-weight: 500;
}

[data-module="product-catalog"] .pc-fullopt-bar {
  height: 7px;
  background: var(--border);
  border-radius: 4px;
  overflow: hidden;
}

[data-module="product-catalog"] .pc-fullopt-bar-fill {
  height: 100%;
  background: var(--accent);
  border-radius: 4px;
}

[data-module="product-catalog"] .pc-fullopt-bar-fill.pc-fullopt-bar-base {
  background: var(--accent-line);
}

[data-module="product-catalog"] .pc-fullopt-delta {
  text-align: right;
  font-variant-numeric: tabular-nums;
  min-width: 56px;
}

[data-module="product-catalog"] .pc-fullopt-count {
  text-align: right;
  font-size: 0.65625rem;
  color: var(--text-tertiary);
  font-variant-numeric: tabular-nums;
}

[data-module="product-catalog"] .pc-pricechart {
  display: flex;
  align-items: flex-end;
  gap: 0.25rem;
  height: 70px;
  margin-bottom: 0.625rem;
  padding: 0.5rem;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
}

[data-module="product-catalog"] .pc-pricechart-bar {
  flex: 1;
  min-width: 4px;
  border-radius: 2px 2px 0 0;
  background: var(--accent-line);
}

[data-module="product-catalog"] .pc-pricechart-bar-latest {
  background: var(--accent);
}

[data-module="product-catalog"] .pc-pricechart-bar-empty {
  height: 0 !important;
}

[data-module="product-catalog"] .pc-pricelist {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
}

[data-module="product-catalog"] .pc-pricerow {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  padding: 0.4375rem 0;
  border-bottom: 1px solid var(--border);
  font-size: 0.75rem;
}

[data-module="product-catalog"] .pc-pricerow:last-child {
  border-bottom: none;
}

[data-module="product-catalog"] .pc-pricerow-date {
  flex-shrink: 0;
  width: 78px;
  color: var(--text-tertiary);
  font-size: 0.71875rem;
  font-variant-numeric: tabular-nums;
}

[data-module="product-catalog"] .pc-pricerow-body {
  flex: 1;
  min-width: 0;
}

[data-module="product-catalog"] .pc-pricerow-part {
  font-family: monospace;
  font-size: 0.65625rem;
  color: var(--text-secondary);
  margin-bottom: 0.125rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

[data-module="product-catalog"] .pc-pricerow-meta {
  font-size: 0.6875rem;
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-pricerow-flag {
  margin-left: 0.25rem;
  padding: 0.0625rem 0.3125rem;
  border-radius: 3px;
  background: var(--panel-2);
  border: 1px solid var(--border);
  font-size: 0.5625rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-pricerow-superseded {
  opacity: 0.6;
}

[data-module="product-catalog"] .pc-pricerow-price {
  flex-shrink: 0;
  font-weight: 500;
  color: var(--text-primary);
  font-variant-numeric: tabular-nums;
}

[data-module="product-catalog"] .pc-pricerow-actions {
  flex-shrink: 0;
  display: inline-flex;
  gap: 0.25rem;
  margin-left: 0.5rem;
}

[data-module="product-catalog"] .pc-pricerow-action {
  width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: transparent;
  color: var(--text-tertiary);
  cursor: pointer;
}

[data-module="product-catalog"] .pc-pricerow-action:hover {
  border-color: var(--border-strong);
  color: var(--text-primary);
  background: var(--row-hover);
}

/* PDF viewer modal -------------------------------------------------- */

/* Body-mounted: needs the self-attribute selector alternative so the
   styles apply (descendant combinator alone doesn't match the
   data-module-bearing element itself). See the .pc-cb-menu rule
   below for the same pattern. */
[data-module="product-catalog"] .pc-pdf-modal-backdrop,
.pc-pdf-modal-backdrop[data-module="product-catalog"] {
  position: fixed;
  inset: 0;
  /* Match the platform modal z-index (9000) so we sit above sidebar
     (200), topbar (300), and any module overlays. The previous 110
     left us beneath the sidebar -- modal looked "behind" the chrome. */
  z-index: 9000;
  background: var(--overlay-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px;
  animation: pc-qi-fadein-backdrop 0.18s ease-out;
}

[data-module="product-catalog"] .pc-pdf-modal {
  width: 100%;
  max-width: 1200px;
  height: 100%;
  max-height: 90vh;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--panel-radius);
  box-shadow: var(--shadow-lg);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

[data-module="product-catalog"] .pc-pdf-modal-head {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.625rem 0.875rem;
  border-bottom: 1px solid var(--border);
  background: var(--panel-2);
  flex-shrink: 0;
}

[data-module="product-catalog"] .pc-pdf-modal-title {
  flex: 1 1 auto;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--text-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

[data-module="product-catalog"] .pc-pdf-modal-newtab {
  font-size: 0.71875rem;
  color: var(--accent);
  text-decoration: none;
}

[data-module="product-catalog"] .pc-pdf-modal-newtab:hover {
  text-decoration: underline;
}

[data-module="product-catalog"] .pc-pdf-modal-close {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: transparent;
  color: var(--text-secondary);
  font-size: 1.125rem;
  line-height: 1;
  cursor: pointer;
}

[data-module="product-catalog"] .pc-pdf-modal-close:hover {
  background: var(--row-hover);
  color: var(--text-primary);
}

[data-module="product-catalog"] .pc-pdf-modal-body {
  flex: 1 1 auto;
  display: flex;
  min-height: 0;
  background: var(--bg);
}

[data-module="product-catalog"] .pc-pdf-modal-pages {
  flex: 1 1 auto;
  overflow-y: auto;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.875rem;
  background: var(--bg);
}

[data-module="product-catalog"] .pc-pdf-modal-page-wrap {
  background: white;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.18);
  max-width: 100%;
}

[data-module="product-catalog"] .pc-pdf-modal-page {
  display: block;
  max-width: 100%;
  height: auto;
}

[data-module="product-catalog"] .pc-pdf-modal-loading,
[data-module="product-catalog"] .pc-pdf-modal-error {
  margin: auto;
  padding: 2rem;
  text-align: center;
  font-size: 0.8125rem;
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-pdf-modal-error {
  color: var(--error);
}

[data-module="product-catalog"] .pc-pdf-modal-eml {
  margin: auto;
  padding: 1.5rem;
  text-align: center;
  font-size: 0.8125rem;
  color: var(--text-secondary);
}

/* Submit-button spinner --------------------------------------------- */

[data-module="product-catalog"] .pc-qi-spinner {
  display: inline-block;
  width: 11px;
  height: 11px;
  margin-right: 0.4375rem;
  border: 1.5px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  vertical-align: -1px;
  animation: pc-qi-spinner-rot 0.65s linear infinite;
}

[data-module="product-catalog"] .pc-qi-foot button.is-loading {
  cursor: progress;
  opacity: 0.85;
}

@keyframes pc-qi-spinner-rot {
  to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
  [data-module="product-catalog"] .pc-qi-spinner {
    animation: none;
    border-right-color: currentColor;
    opacity: 0.4;
  }
}

[data-module="product-catalog"] .pc-pricelist-more {
  margin-top: 0.5rem;
  padding: 0.375rem 0.5rem;
  text-align: center;
  font-size: 0.6875rem;
  color: var(--text-tertiary);
}

/* Samples section -- Sample Tracker integration --------------------- */

[data-module="product-catalog"] .pc-samples-group {
  margin-bottom: 0.625rem;
}

[data-module="product-catalog"] .pc-samples-group:last-of-type {
  margin-bottom: 0.375rem;
}

[data-module="product-catalog"] .pc-samples-group-head {
  font-family: monospace;
  font-size: 0.6875rem;
  color: var(--text-secondary);
  margin-bottom: 0.25rem;
  padding-bottom: 0.1875rem;
  border-bottom: 1px solid var(--border);
}

[data-module="product-catalog"] .pc-samples-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
}

[data-module="product-catalog"] .pc-samples-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.375rem 0.25rem;
  border-radius: 4px;
  font-size: 0.71875rem;
  cursor: pointer;
}

[data-module="product-catalog"] .pc-samples-row:hover {
  background: var(--row-hover);
}

[data-module="product-catalog"] .pc-samples-status {
  flex-shrink: 0;
  padding: 0.0625rem 0.4375rem;
  border-radius: 3px;
  font-size: 0.5625rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  white-space: nowrap;
}

[data-module="product-catalog"] .pc-samples-status-available {
  background: var(--accent-soft);
  color: var(--accent);
}

[data-module="product-catalog"] .pc-samples-status-checked-out {
  background: var(--panel-2);
  color: var(--text-secondary);
  border: 1px solid var(--border);
}

[data-module="product-catalog"] .pc-samples-status-returned {
  background: var(--panel-2);
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-samples-status-lost {
  background: var(--error-soft);
  color: var(--error);
}

[data-module="product-catalog"] .pc-samples-status-default {
  background: var(--panel-2);
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-samples-body {
  display: flex;
  align-items: baseline;
  gap: 0.4375rem;
  flex: 1;
  min-width: 0;
  overflow: hidden;
}

[data-module="product-catalog"] .pc-samples-fixture {
  font-family: monospace;
  font-size: 0.6875rem;
  color: var(--text-primary);
  flex-shrink: 0;
}

[data-module="product-catalog"] .pc-samples-location {
  color: var(--text-secondary);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

[data-module="product-catalog"] .pc-samples-checkout {
  color: var(--text-tertiary);
  font-size: 0.6875rem;
  flex-shrink: 0;
}

[data-module="product-catalog"] .pc-samples-open-tracker {
  margin-top: 0.5rem;
  width: 100%;
  padding: 0.4375rem 0.5rem;
  background: transparent;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  color: var(--text-secondary);
  font-size: 0.71875rem;
  font-weight: 500;
  cursor: pointer;
  text-align: center;
}

[data-module="product-catalog"] .pc-samples-open-tracker:hover {
  background: var(--row-hover);
  border-color: var(--border-strong);
  color: var(--text-primary);
}

@media (max-width: 1024px) {
  [data-module="product-catalog"] .pc-fullbody {
    grid-template-columns: 1fr;
  }
  [data-module="product-catalog"] .pc-fullbody-left {
    border-right: none;
    border-bottom: 1px solid var(--border);
  }
  [data-module="product-catalog"] .pc-bigstats {
    flex-wrap: wrap;
  }
}

@media (max-width: 640px) {
  [data-module="product-catalog"] .pc-fullhead-row {
    flex-direction: column;
    gap: 0.625rem;
  }
}

/* Inbox card layout (capture-inbox renderItem path) -------------------
   Each capture renders as a self-contained editable card -- no Process
   modal. The .strata-capture-inbox-item.is-custom class is applied by
   the helper when renderItem is provided.
*/
[data-module="product-catalog"] .strata-capture-inbox-item.is-custom {
  display: grid;
  grid-template-columns: 220px minmax(0, 1fr);
  gap: 1rem;
  padding: 0.875rem;
  border: 1px solid var(--border);
  border-radius: var(--panel-radius);
  background: var(--panel);
  margin-bottom: 0.625rem;
  align-items: flex-start;
}
@media (max-width: 720px) {
  [data-module="product-catalog"] .strata-capture-inbox-item.is-custom {
    grid-template-columns: 1fr;
  }
}
[data-module="product-catalog"] .pc-inbox-card-thumb {
  position: relative;
  width: 100%;
  min-height: 280px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--button-radius);
  background: var(--panel-2);
  border: 1px solid var(--border);
  color: var(--text-tertiary);
  overflow: hidden;
}
[data-module="product-catalog"] .pc-inbox-card-thumb-canvas {
  display: block;
  max-width: 100%;
  height: auto;
  background: white;  /* PDF page background; transparent canvas shows panel-2 underneath which looks wrong for white pages */
}
[data-module="product-catalog"] .pc-inbox-card-thumb-img {
  display: block;
  max-width: 100%;
  height: auto;
  background: white;
}
[data-module="product-catalog"] .pc-inbox-card-thumb-loading {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.4375rem;
  color: var(--text-tertiary);
  font-size: 0.71875rem;
  pointer-events: none;
}
[data-module="product-catalog"] .pc-inbox-card-thumb-loading svg {
  animation: pc-spin 1.2s linear infinite;
}
@keyframes pc-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  [data-module="product-catalog"] .pc-inbox-card-thumb-loading svg { animation: none; }
}
[data-module="product-catalog"] .pc-inbox-card-thumb-fallback {
  color: var(--text-tertiary);
}
[data-module="product-catalog"] .pc-inbox-card-body {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
[data-module="product-catalog"] .pc-inbox-card-head {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
[data-module="product-catalog"] .pc-inbox-card-intent {
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--accent);
  background: var(--accent-soft);
  padding: 0.125rem 0.5rem;
  border-radius: 12px;
}
[data-module="product-catalog"] .pc-inbox-card-statuspill {
  font-size: 0.625rem;
  font-weight: 600;
  text-transform: uppercase;
  color: var(--text-tertiary);
  background: var(--panel-2);
  padding: 0.125rem 0.4375rem;
  border-radius: 10px;
}
[data-module="product-catalog"] .pc-inbox-card-statuspill.is-failed {
  color: var(--error);
  background: var(--error-soft);
}
[data-module="product-catalog"] .pc-inbox-card-detected {
  margin-left: auto;
  font-size: 0.625rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-tertiary);
}
[data-module="product-catalog"] .pc-inbox-card-target {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--text-primary);
}

/* Key-value field grid -- label on the left, input on the right.
   Each row reads as a single "Detected: <value>" pair so the designer
   can scan the captured fields top-to-bottom. */
[data-module="product-catalog"] .pc-inbox-fields {
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr);
  column-gap: 0.875rem;
  row-gap: 0.5rem;
  align-items: start;
  padding: 0.5rem 0.75rem;
  background: var(--panel-2);
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
}
[data-module="product-catalog"] .pc-inbox-row {
  display: contents;
}
[data-module="product-catalog"] .pc-inbox-row-label {
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-tertiary);
  padding-top: 0.4375rem;
  white-space: nowrap;
}
[data-module="product-catalog"] .pc-inbox-row-control {
  min-width: 0;
}
[data-module="product-catalog"] .pc-inbox-input {
  width: 100%;
  padding: 0.4375rem 0.625rem;
  background: var(--input-bg);
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  color: var(--text-primary);
  font-size: 0.8125rem;
  font-family: inherit;
  line-height: 1.4;
  box-sizing: border-box;
}
[data-module="product-catalog"] .pc-inbox-input:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 2px var(--accent-soft);
}
[data-module="product-catalog"] .pc-inbox-input::placeholder {
  color: var(--text-tertiary);
}
[data-module="product-catalog"] .pc-inbox-textarea {
  resize: vertical;
  min-height: 56px;
}
@media (max-width: 640px) {
  [data-module="product-catalog"] .pc-inbox-fields {
    grid-template-columns: 1fr;
    row-gap: 0.25rem;
  }
  [data-module="product-catalog"] .pc-inbox-row-label {
    padding-top: 0;
    padding-bottom: 0.125rem;
  }
}

/* Source / cutsheet URL chips */
[data-module="product-catalog"] .pc-inbox-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  font-size: 0.71875rem;
}
[data-module="product-catalog"] .pc-inbox-card-source {
  display: inline-flex;
  align-items: center;
  gap: 0.3125rem;
  padding: 0.1875rem 0.5rem;
  border-radius: var(--button-radius);
  background: var(--panel-2);
  color: var(--text-secondary);
  text-decoration: none;
  word-break: break-all;
}
[data-module="product-catalog"] .pc-inbox-card-source:hover {
  background: var(--row-hover);
  color: var(--accent);
}
[data-module="product-catalog"] .pc-inbox-card-source svg {
  flex-shrink: 0;
}

/* Option ladder details (collapsible) */
[data-module="product-catalog"] .pc-inbox-ladder {
  font-size: 0.71875rem;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: var(--panel-2);
}
[data-module="product-catalog"] .pc-inbox-ladder-summary {
  display: flex;
  align-items: center;
  gap: 0.4375rem;
  padding: 0.4375rem 0.625rem;
  cursor: pointer;
  list-style: none;
  user-select: none;
  color: var(--text-secondary);
  font-weight: 500;
}
[data-module="product-catalog"] .pc-inbox-ladder-summary::-webkit-details-marker {
  display: none;
}
[data-module="product-catalog"] .pc-inbox-ladder-chev {
  transition: transform 0.15s ease;
  flex-shrink: 0;
}
[data-module="product-catalog"] .pc-inbox-ladder[open] .pc-inbox-ladder-chev {
  transform: rotate(90deg);
}
[data-module="product-catalog"] .pc-inbox-ladder-body {
  padding: 0.25rem 0.625rem 0.5rem;
  border-top: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: 0.4375rem;
}
[data-module="product-catalog"] .pc-inbox-ladder-row {
  display: flex;
  flex-direction: column;
  gap: 0.1875rem;
  padding: 0.3125rem 0;
}
[data-module="product-catalog"] .pc-inbox-ladder-row + .pc-inbox-ladder-row {
  border-top: 1px solid var(--border);
}
[data-module="product-catalog"] .pc-inbox-ladder-key {
  display: flex;
  align-items: center;
  gap: 0.4375rem;
}
[data-module="product-catalog"] .pc-inbox-ladder-segkey {
  font-family: ui-monospace, SFMono-Regular, monospace;
  font-weight: 600;
  color: var(--text-primary);
  font-size: 0.71875rem;
}
[data-module="product-catalog"] .pc-inbox-ladder-seglabel {
  color: var(--text-secondary);
  font-size: 0.6875rem;
}
[data-module="product-catalog"] .pc-inbox-ladder-count {
  margin-left: auto;
  font-size: 0.625rem;
  font-weight: 600;
  color: var(--text-tertiary);
  background: var(--panel);
  padding: 0.0625rem 0.4375rem;
  border-radius: 10px;
  border: 1px solid var(--border);
}
[data-module="product-catalog"] .pc-inbox-ladder-codes {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  align-items: center;
}
[data-module="product-catalog"] .pc-inbox-ladder-code {
  font-family: ui-monospace, SFMono-Regular, monospace;
  font-size: 0.6875rem;
  background: var(--panel);
  padding: 0.0625rem 0.375rem;
  border-radius: 3px;
  border: 1px solid var(--border);
  color: var(--text-secondary);
}
[data-module="product-catalog"] .pc-inbox-ladder-more {
  font-size: 0.6875rem;
  color: var(--text-tertiary);
}

/* Auto-fill SKUs: assembly-template authoring sub-card */
[data-module="product-catalog"] .pc-inbox-tpl {
  display: flex;
  flex-direction: column;
  gap: 0.4375rem;
  padding: 0.5625rem 0.6875rem;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
}
[data-module="product-catalog"] .pc-inbox-tpl-head {
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-tertiary);
}
[data-module="product-catalog"] .pc-inbox-tpl-input {
  font-family: ui-monospace, SFMono-Regular, monospace;
}
[data-module="product-catalog"] .pc-inbox-tpl-preview {
  font-size: 0.75rem;
  color: var(--text-secondary);
  display: flex;
  align-items: baseline;
  gap: 0.375rem;
  flex-wrap: wrap;
}
[data-module="product-catalog"] .pc-inbox-tpl-preview-label {
  font-weight: 600;
  color: var(--text-tertiary);
  text-transform: uppercase;
  font-size: 0.6875rem;
  letter-spacing: 0.04em;
}
[data-module="product-catalog"] .pc-inbox-tpl-preview-value {
  font-family: ui-monospace, SFMono-Regular, monospace;
  font-size: 0.8125rem;
  color: var(--text-primary);
  background: var(--panel-2);
  padding: 0.0625rem 0.375rem;
  border-radius: 3px;
  border: 1px solid var(--border);
}
[data-module="product-catalog"] .pc-inbox-tpl-errors {
  list-style: none;
  margin: 0;
  padding: 0.4375rem 0.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  background: var(--error-soft);
  border-radius: var(--button-radius);
  font-size: 0.71875rem;
  color: var(--error);
}
[data-module="product-catalog"] .pc-inbox-tpl-required-section {
  display: flex;
  flex-direction: column;
  gap: 0.3125rem;
}
[data-module="product-catalog"] .pc-inbox-tpl-required-label {
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-tertiary);
}
[data-module="product-catalog"] .pc-inbox-tpl-required-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
[data-module="product-catalog"] .pc-inbox-tpl-req {
  display: inline-flex;
  align-items: center;
  gap: 0.3125rem;
  font-size: 0.75rem;
  color: var(--text-secondary);
  cursor: pointer;
}
[data-module="product-catalog"] .pc-inbox-tpl-req input[type="checkbox"] {
  accent-color: var(--accent);
}

[data-module="product-catalog"] .pc-inbox-card-statusreason {
  font-size: 0.71875rem;
  color: var(--error);
  padding: 0.3125rem 0.5rem;
  background: var(--error-soft);
  border-radius: var(--button-radius);
}
[data-module="product-catalog"] .pc-inbox-card-actions {
  display: flex;
  gap: 0.4375rem;
  margin-top: 0.25rem;
}

/* Promotion pre-linked card (S5-clipper-attention): the "For: <mfr> <name>
   (cutsheet queue)" badge line on a capture already linked to a queued family. */
[data-module="product-catalog"] .pc-inbox-card-prelink {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--text-primary);
  padding: 0.375rem 0.5rem;
  background: var(--accent-soft);
  border-radius: var(--button-radius);
}
[data-module="product-catalog"] .pc-inbox-card-prelink svg {
  color: var(--accent);
  flex: none;
}
[data-module="product-catalog"] .pc-inbox-card-prelink-label {
  min-width: 0;
  overflow-wrap: anywhere;
}
/* Downgrade note: shown when a fresh guard unlinked a promotion capture
   (target retired / already cutsheeted) and it fell back to a normal card. */
[data-module="product-catalog"] .pc-inbox-card-downgrade {
  font-size: 0.71875rem;
  color: var(--warning);
  padding: 0.3125rem 0.5rem;
  background: var(--warning-soft);
  border-radius: var(--button-radius);
}

/* Batch select mode -- floating action bar + row checkboxes ----------- */
[data-module="product-catalog"] .pc-list-batch .pc-row {
  cursor: pointer;
}
[data-module="product-catalog"] .pc-col-checkbox {
  width: 36px;
  text-align: center;
}
[data-module="product-catalog"] .pc-row-checkbox {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  border-radius: 3px;
  border: 1.5px solid var(--border-strong);
  background: var(--input-bg);
  color: transparent;
  vertical-align: middle;
  transition: background-color 0.12s ease, border-color 0.12s ease, color 0.12s ease;
}
[data-module="product-catalog"] .pc-row-checkbox.is-checked {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--bg);
}
[data-module="product-catalog"] .pc-row-selected {
  background: var(--accent-soft);
}
[data-module="product-catalog"] .pc-row-selected:hover {
  background: var(--accent-soft);
}

[data-module="product-catalog"] .pc-batchbar {
  position: fixed;
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 110;
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 0.5rem 0.875rem;
  background: var(--panel);
  border: 1px solid var(--border-strong);
  border-radius: var(--panel-radius);
  box-shadow: var(--shadow-lg);
  font-size: 0.8125rem;
  max-width: calc(100vw - 32px);
}
[data-module="product-catalog"] .pc-batchbar-count {
  color: var(--text-secondary);
  white-space: nowrap;
}
[data-module="product-catalog"] .pc-batchbar-count strong {
  color: var(--text-primary);
  font-weight: 600;
}
[data-module="product-catalog"] .pc-batchbar-actions {
  display: flex;
  gap: 0.375rem;
}
[data-module="product-catalog"] .pc-batchbar-actions button[disabled] {
  opacity: 0.45;
  cursor: not-allowed;
}

/* Inline edit cells (full-detail page) ---------------------------------
   Each editable field renders as a borderless button that hints at
   editability on hover. Click swaps in an input/textarea/select via
   PC.activateInlineEdit. Keep visual weight low so the page reads as
   a normal detail view, not a form.
*/
[data-module="product-catalog"] .pc-ie {
  display: inline-block;
  appearance: none;
  background: transparent;
  border: 1px solid transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: text;
  padding: 0.0625rem 0.3125rem;
  margin: -0.0625rem -0.3125rem;
  border-radius: 4px;
  max-width: 100%;
  white-space: pre-wrap;
  word-break: break-word;
}
[data-module="product-catalog"] .pc-ie:hover {
  background: var(--row-hover);
  border-color: var(--border);
}
[data-module="product-catalog"] .pc-ie:focus-visible {
  outline: none;
  background: var(--row-hover);
  border-color: var(--accent);
  box-shadow: 0 0 0 2px var(--accent-soft);
}
[data-module="product-catalog"] .pc-ie-empty {
  color: var(--text-tertiary);
  font-style: italic;
}
[data-module="product-catalog"] .pc-ie-mfr {
  font-size: 0.875rem;
  color: var(--text-secondary);
}
[data-module="product-catalog"] .pc-ie-name {
  font-size: inherit;
  font-weight: inherit;
  color: inherit;
}
[data-module="product-catalog"] .pc-ie-select {
  background: var(--accent-soft);
  color: var(--accent);
  border-color: var(--accent-line);
  padding: 0.1875rem 0.5625rem;
  border-radius: 14px;
  font-size: 0.71875rem;
  font-weight: 600;
  cursor: pointer;
}
[data-module="product-catalog"] .pc-ie-select:hover {
  background: var(--accent-soft);
  border-color: var(--accent);
}
[data-module="product-catalog"] .pc-ie-select.pc-ie-empty {
  background: transparent;
  color: var(--text-tertiary);
  border-color: var(--border);
  font-weight: 500;
}
[data-module="product-catalog"] .pc-ie-skucell {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, monospace;
  font-size: 0.8125rem;
}
[data-module="product-catalog"] .pc-ie-multi {
  display: block;
  width: 100%;
  min-height: 1.75rem;
  line-height: 1.45;
}

/* The active editor (input/textarea/select) replaces the button in DOM. */
[data-module="product-catalog"] .pc-ie-editor {
  font: inherit;
  color: var(--text-primary);
  background: var(--input-bg);
  border: 1px solid var(--accent);
  border-radius: 4px;
  padding: 0.125rem 0.3125rem;
  margin: -0.125rem -0.3125rem;
  box-shadow: 0 0 0 2px var(--accent-soft);
}
[data-module="product-catalog"] .pc-ie-editor-input {
  width: 100%;
}
[data-module="product-catalog"] .pc-ie-editor-multi {
  width: 100%;
  min-height: 3rem;
  resize: vertical;
  font-family: inherit;
}
[data-module="product-catalog"] .pc-ie-editor-select {
  padding: 0.1875rem 0.3125rem;
}
[data-module="product-catalog"] .pc-ie-readonly-multi {
  white-space: pre-wrap;
  word-break: break-word;
  color: var(--text-primary);
}
[data-module="product-catalog"] .pc-ie-readonly-multi.pc-ie-empty {
  color: var(--text-tertiary);
  font-style: italic;
}

/* Details panel (full-detail page) ------------------------------------- */
[data-module="product-catalog"] .pc-fullsection-details .pc-detailgrid {
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr);
  gap: 0.5rem 0.875rem;
  padding: 0.5rem 0;
}
[data-module="product-catalog"] .pc-detailgrid-row {
  display: contents;
}
[data-module="product-catalog"] .pc-detailgrid-label {
  font-size: 0.6875rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-tertiary);
  padding-top: 0.1875rem;
}
[data-module="product-catalog"] .pc-detailgrid-val {
  color: var(--text-primary);
  font-size: 0.875rem;
  min-width: 0;
}
@media (max-width: 640px) {
  [data-module="product-catalog"] .pc-fullsection-details .pc-detailgrid {
    grid-template-columns: 1fr;
    gap: 0.125rem 0.5rem;
  }
  [data-module="product-catalog"] .pc-detailgrid-row {
    display: block;
    margin-bottom: 0.5rem;
  }
}

/* Create A wizard (body-mounted, unscoped) --------------------------- */

.pc-wiz {
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
  min-width: 480px;
}

.pc-wiz-indicator {
  display: grid;
  grid-template-columns: 22px 1fr 22px;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.25rem;
}

.pc-wiz-step-num {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.6875rem;
  font-weight: 700;
  background: var(--panel-2);
  border: 1px solid var(--border);
  color: var(--text-tertiary);
}

.pc-wiz-step-num.is-active {
  background: var(--accent);
  color: var(--accent-soft);
  border-color: var(--accent);
}

.pc-wiz-step-line {
  height: 1px;
  background: var(--border);
}

.pc-wiz-step-labels {
  grid-column: 1 / -1;
  display: flex;
  justify-content: space-between;
  font-size: 0.6875rem;
  color: var(--text-tertiary);
  margin-top: 0.25rem;
}

.pc-wiz-step {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.pc-wiz-step[hidden] {
  display: none;
}

.pc-wiz-field {
  display: flex;
  flex-direction: column;
  gap: 0.3125rem;
}

.pc-wiz-field-label {
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-secondary);
}

.pc-wiz-hint {
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
  color: var(--text-tertiary);
}

.pc-wiz-input {
  width: 100%;
  padding: 0.4375rem 0.625rem;
  background: var(--input-bg);
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  color: var(--text-primary);
  font-size: 0.8125rem;
  font-family: inherit;
}

.pc-wiz-input:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 2px var(--accent-soft);
}

.pc-wiz-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.625rem;
}

.pc-wiz-intro {
  margin: 0;
  padding: 0.625rem 0.75rem;
  border-radius: var(--button-radius);
  background: var(--panel-2);
  color: var(--text-secondary);
  font-size: 0.78125rem;
}

.pc-wiz-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3125rem;
}

.pc-wiz-chip {
  padding: 0.3125rem 0.6875rem;
  border-radius: 20px;
  border: 1px solid var(--border);
  background: transparent;
  color: var(--text-secondary);
  font-size: 0.75rem;
  font-family: inherit;
  cursor: pointer;
}

.pc-wiz-chip:hover {
  background: var(--row-hover);
  color: var(--text-primary);
}

.pc-wiz-chip.is-active {
  background: var(--accent-soft);
  color: var(--accent);
  border-color: var(--accent);
  font-weight: 600;
}

.pc-wiz-similar {
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  overflow: hidden;
  background: var(--panel);
}

.pc-wiz-similar-head {
  padding: 0.3125rem 0.625rem;
  font-size: 0.625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--text-tertiary);
  border-bottom: 1px solid var(--border);
  background: var(--panel-2);
}

.pc-wiz-similar-row {
  display: grid;
  grid-template-columns: auto 1fr auto auto;
  align-items: center;
  gap: 0.625rem;
  padding: 0.5rem 0.625rem;
  cursor: pointer;
  border-bottom: 1px solid var(--border);
  font-size: 0.78125rem;
}

.pc-wiz-similar-row:last-child {
  border-bottom: none;
}

.pc-wiz-similar-row:hover {
  background: var(--row-hover);
}

.pc-wiz-similar-mfr {
  font-size: 0.6875rem;
  color: var(--text-tertiary);
}

.pc-wiz-similar-name {
  font-weight: 500;
  color: var(--text-primary);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pc-wiz-similar-skus {
  font-size: 0.6875rem;
  color: var(--text-tertiary);
}

.pc-wiz-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 0.5rem;
  padding-top: 0.625rem;
  border-top: 1px solid var(--border);
}

.pc-wiz-foot-right {
  display: flex;
  gap: 0.4375rem;
}

@media (max-width: 640px) {
  .pc-wiz {
    min-width: 0;
  }
  .pc-wiz-grid {
    grid-template-columns: 1fr;
  }
  .pc-wiz-input {
    font-size: 16px;
  }
  .pc-wiz-foot {
    flex-direction: column;
    gap: 0.5rem;
    align-items: stretch;
  }
  .pc-wiz-foot-right {
    flex-direction: column;
  }
}

/* Extraction-cost telemetry modal (body-mounted, unscoped) ----------- */

.pc-telemetry {
  display: flex;
  flex-direction: column;
  gap: 14px;
  font-size: 13px;
  color: var(--text-primary);
}

.pc-telemetry-summary {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
}

.pc-telemetry-card {
  background: var(--panel-2);
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.pc-telemetry-card-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-secondary);
  font-weight: 600;
}

.pc-telemetry-card-value {
  font-size: 22px;
  font-weight: 700;
  color: var(--text-primary);
  font-variant-numeric: tabular-nums;
}

.pc-telemetry-card-sub {
  font-size: 12px;
}

.pc-telemetry-card-statuses {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12px;
  color: var(--text-secondary);
  font-variant-numeric: tabular-nums;
}

.pc-telemetry-card-statuses > div {
  display: flex;
  align-items: center;
  gap: 6px;
}

.pc-telemetry-section {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.pc-telemetry-section-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-secondary);
  font-weight: 600;
}

.pc-telemetry-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}

.pc-telemetry-table th {
  text-align: left;
  font-weight: 600;
  color: var(--text-secondary);
  padding: 6px 8px;
  border-bottom: 1px solid var(--border);
  background: var(--panel-2);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.pc-telemetry-table td {
  padding: 6px 8px;
  border-bottom: 1px solid var(--border);
  vertical-align: top;
}

.pc-telemetry-num {
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.pc-telemetry-current td {
  background: var(--accent-soft);
}

.pc-telemetry-cap-note {
  font-size: 11px;
  line-height: 1.5;
  margin: 0;
}

.pc-telemetry-cap-note code {
  background: var(--panel-2);
  padding: 1px 4px;
  border-radius: 3px;
  font-size: 11px;
}

/* Add-product modal content (body-mounted, unscoped on purpose) ------- */

.pc-modal-form {
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
}

/* Batch-edit modal summary line (body-mounted, unscoped) */
.pc-batch-summary {
  margin: 0;
  padding: 0.5rem 0.625rem;
  border-radius: var(--button-radius);
  background: var(--panel-2);
  color: var(--text-secondary);
  font-size: 0.8125rem;
}
.pc-batch-summary strong {
  color: var(--text-primary);
}

/* Hard-delete confirmation modal (body-mounted, unscoped) */
.pc-hd-warn {
  margin: 0;
  padding: 0.625rem 0.75rem;
  border-radius: var(--button-radius);
  background: var(--error-soft);
  color: var(--text-primary);
  font-size: 0.8125rem;
  border: 1px solid var(--error);
}
.pc-hd-summary {
  margin: 0;
  padding: 0 0 0 1rem;
  font-size: 0.8125rem;
  color: var(--text-secondary);
}
.pc-hd-summary li {
  margin: 0.25rem 0;
}

.pc-modal-form .pc-form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.875rem;
}

.pc-modal-form .pc-field {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

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

.pc-modal-form .pc-field-label {
  font-size: 0.8rem;
  color: var(--text-secondary);
}

.pc-modal-form .pc-input {
  width: 100%;
  padding: 0.5rem 0.625rem;
  background: var(--input-bg);
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  color: var(--text-primary);
  font-size: 0.9rem;
  font-family: inherit;
}

.pc-modal-form .pc-input:focus {
  outline: 2px solid var(--accent);
  outline-offset: -1px;
  border-color: transparent;
}

.pc-modal-form .pc-form-grid-3 {
  grid-template-columns: 1fr 1fr 1fr;
}

.pc-modal-form .pc-textarea {
  resize: vertical;
  min-height: 56px;
  font-family: inherit;
}

.pc-modal-form .pc-readonly-row {
  display: flex;
  flex-direction: column;
  gap: 0.1875rem;
  padding: 0.5rem 0.625rem;
  background: var(--panel-2);
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
}

.pc-modal-form .pc-readonly-label {
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-tertiary);
}

.pc-modal-form .pc-readonly-val {
  color: var(--text-primary);
  font-size: 0.8125rem;
  font-weight: 500;
}

.pc-modal-form .pc-form-section {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  padding: 0.625rem 0.75rem;
  border: 1px dashed var(--border);
  border-radius: var(--button-radius);
  background: var(--panel-2);
}

.pc-modal-form .pc-form-section-head {
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-secondary);
}

/* Set-cutsheet modal */

.pc-set-cutsheet .pc-textarea {
  resize: vertical;
  min-height: 2.5rem;
}

.pc-set-cutsheet-status {
  font-size: 0.75rem;
  color: var(--text-tertiary);
  min-height: 1rem;
}

.pc-set-cutsheet-status.is-ok {
  color: var(--accent);
}

.pc-set-cutsheet-status.is-error {
  color: var(--error);
}

.pc-set-cutsheet-fallback-modal {
  margin-top: 0.5rem;
}

.pc-set-cutsheet-fetch-error {
  padding: 0.5rem 0.625rem;
  background: var(--error-soft);
  border-radius: var(--button-radius);
  color: var(--error);
  font-size: 0.78125rem;
  margin-bottom: 0.5rem;
}

.pc-set-cutsheet-steps {
  margin: 0;
  padding-left: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  font-size: 0.8125rem;
  color: var(--text-secondary);
}

.pc-set-cutsheet-dl-link {
  color: var(--accent);
  text-decoration: underline;
}

.pc-set-cutsheet-drop {
  margin-top: 0.4375rem;
  padding: 1rem 0.75rem;
  border: 2px dashed var(--border-strong);
  border-radius: var(--panel-radius);
  background: var(--panel-2);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.4375rem;
  text-align: center;
  transition: border-color 0.12s ease, background 0.12s ease;
}

.pc-set-cutsheet-drop.is-drag-over {
  border-color: var(--accent);
  background: var(--accent-soft);
}

.pc-set-cutsheet-drop-text {
  font-size: 0.8125rem;
  color: var(--text-secondary);
}

.pc-set-cutsheet-pick {
  background: transparent;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  padding: 0.25rem 0.625rem;
  font-size: 0.71875rem;
  color: var(--text-secondary);
  cursor: pointer;
}

.pc-set-cutsheet-pick:hover {
  border-color: var(--border-strong);
  color: var(--text-primary);
}

/* Merge modal */

.pc-merge-options {
  display: flex;
  flex-direction: column;
  gap: 0.4375rem;
}

.pc-merge-option {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0.625rem;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  cursor: pointer;
  background: var(--panel-2);
}

.pc-merge-option:hover {
  background: var(--row-hover);
}

.pc-merge-option-body {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
  flex: 1;
  min-width: 0;
}

.pc-merge-option-body strong {
  color: var(--text-primary);
  font-size: 0.8125rem;
}

.pc-merge-type {
  font-size: 0.65625rem;
  color: var(--accent);
}

.pc-merge-meta {
  font-size: 0.65625rem;
  color: var(--text-tertiary);
}

.pc-merge-canonical-pick {
  display: flex;
  gap: 0.625rem;
  padding: 0.5rem 0.625rem;
  background: var(--panel-2);
  border-radius: var(--button-radius);
}

.pc-merge-canonical-opt {
  display: inline-flex;
  align-items: center;
  gap: 0.4375rem;
  font-size: 0.78125rem;
  color: var(--text-secondary);
  cursor: pointer;
}

.pc-merge-canonical-opt strong {
  color: var(--text-primary);
}

.pc-merge-diff {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.71875rem;
}

.pc-merge-diff th,
.pc-merge-diff td {
  padding: 0.3125rem 0.5rem;
  border-bottom: 1px solid var(--border);
  text-align: left;
}

.pc-merge-diff thead th {
  font-weight: 600;
  color: var(--text-secondary);
}

.pc-merge-diff tbody th {
  font-weight: 500;
  color: var(--text-tertiary);
  width: 110px;
}

.pc-merge-diff-differ {
  background: var(--accent-soft);
}

.pc-modal-form .pc-hint {
  margin: 0;
  padding: 0.5rem 0.625rem;
  background: var(--panel-2);
  border-radius: var(--button-radius);
  color: var(--text-secondary);
  font-size: 0.78125rem;
}

/* Retired-via-merge banner on the detail panel ---------------------- */

[data-module="product-catalog"] .pc-merge-banner {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.625rem 0.875rem;
  margin-bottom: 0.75rem;
  background: var(--accent-soft);
  border: 1px solid var(--accent-line);
  border-radius: var(--panel-radius);
  color: var(--accent);
  font-size: 0.8125rem;
}

[data-module="product-catalog"] .pc-merge-banner-icon {
  flex-shrink: 0;
  color: var(--accent);
}

[data-module="product-catalog"] .pc-merge-banner-text {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 0.0625rem;
  min-width: 0;
}

[data-module="product-catalog"] .pc-merge-banner-text strong {
  color: var(--text-primary);
  font-weight: 500;
}

[data-module="product-catalog"] .pc-merge-banner-meta {
  font-size: 0.71875rem;
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-merge-banner-actions {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 0.375rem;
}

[data-module="product-catalog"] .pc-merge-banner-undo {
  display: inline-flex;
  align-items: center;
  gap: 0.4375rem;
}

[data-module="product-catalog"] .pc-merge-banner-window {
  font-size: 0.6875rem;
  color: var(--text-tertiary);
  font-weight: 400;
}

/* Recent merges modal ----------------------------------------------- */

.pc-recent-merges-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.78125rem;
}

.pc-recent-merges-table th,
.pc-recent-merges-table td {
  padding: 0.5rem 0.625rem;
  border-bottom: 1px solid var(--border);
  text-align: left;
  vertical-align: top;
}

.pc-recent-merges-table th {
  font-weight: 600;
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-tertiary);
}

.pc-recent-merges-table tbody tr:last-child td {
  border-bottom: none;
}

.pc-recent-merges-pair {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  gap: 0.5rem;
  align-items: center;
}

.pc-recent-merges-merged,
.pc-recent-merges-canonical {
  font-weight: 500;
  color: var(--text-primary);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pc-recent-merges-arrow {
  font-size: 0.6875rem;
  color: var(--text-tertiary);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.pc-recent-merges-reason {
  margin-top: 0.25rem;
  font-style: italic;
  color: var(--text-tertiary);
  font-size: 0.71875rem;
}

.pc-recent-merges-action {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.25rem;
  white-space: nowrap;
}

.pc-recent-merges-window {
  font-size: 0.6875rem;
}

/* Phone --------------------------------------------------------------- */

@media (max-width: 768px) {
  [data-module="product-catalog"] .pc-rail {
    display: none;
  }
}

/* ---- Split-pane responsive (PR2) ---------------------------------------
   641-1100px is the immediate failure range: the compact navigator + the
   renderFullDetail stand-in both want horizontal room. Cap the navigator
   narrower and let the detail column flex; the drag handle stays usable.
   Below 640px the navigator goes full-width and the detail column becomes a
   slide-in overlay (the stand-in already ships a Back/close affordance). */
@media (max-width: 1100px) {
  [data-module="product-catalog"] .pc-nav-compact {
    /* Cap the inline width so a wide persisted navWidth doesn't crush the
       detail column. Inline style still wins below the cap. */
    max-width: 300px;
  }
}

@media (max-width: 640px) {
  [data-module="product-catalog"] .pc-body-split {
    position: relative;
  }
  /* Navigator fills the width; ignore the persisted/resized width. */
  [data-module="product-catalog"] .pc-nav-compact {
    width: 100% !important;
    max-width: none;
    border-right: none;
  }
  /* Drag handle is meaningless at phone width. */
  [data-module="product-catalog"] .pc-nav-resize {
    display: none;
  }
  /* Detail column overlays the navigator (slide-in), full-viewport-ish. */
  [data-module="product-catalog"] .pc-detailcol {
    position: absolute;
    inset: 0;
    z-index: 15;
    background: var(--bg);
    box-shadow: var(--shadow-lg);
  }
  /* The navigator sits UNDER the absolute, opaque detail overlay on phone.
     The detail column (position:absolute; inset:0; background) fully covers
     it, so make the navigator inert underneath: visibility:hidden removes it
     from the tab order AND hides it from assistive tech, so nothing behind the
     overlay is focusable/announced. It reappears the moment the split detail
     closes (the .pc-body-split overlay is gone, so this rule no longer
     applies). (N3) */
  [data-module="product-catalog"] .pc-body-split .pc-nav-compact {
    visibility: hidden;
  }
}

@media (max-width: 1024px) {
  [data-module="product-catalog"] .pc-expand-grid {
    grid-template-columns: 1fr 220px;
  }
  [data-module="product-catalog"] .pc-expand-side {
    grid-column: 1 / -1;
    border-top: 1px solid var(--border);
  }
}

@media (max-width: 640px) {
  [data-module="product-catalog"] .pc-filterbar {
    flex-direction: column;
    align-items: stretch;
  }
  [data-module="product-catalog"] .pc-search-input,
  [data-module="product-catalog"] .pc-filter-select {
    font-size: 16px;
  }
  [data-module="product-catalog"] .pc-list {
    font-size: 0.78125rem;
  }
  [data-module="product-catalog"] .pc-expand-grid {
    grid-template-columns: 1fr;
  }
  [data-module="product-catalog"] .pc-expand-section {
    border-right: none;
    border-bottom: 1px solid var(--border);
  }
  [data-module="product-catalog"] .pc-expand-section:last-child {
    border-bottom: none;
  }
  .pc-modal-form .pc-form-grid {
    grid-template-columns: 1fr;
  }
  .pc-modal-form .pc-input {
    font-size: 16px;
  }
}

/* ----------------------------------------------------------------- */
/* Tabs (Catalog / Quotes)                                            */
/* ----------------------------------------------------------------- */

[data-module="product-catalog"] .pc-tabs {
  display: flex;
  gap: 0.25rem;
  align-items: center;
}

[data-module="product-catalog"] .pc-tab {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: 0.375rem 0.75rem;
  border: 1px solid transparent;
  border-radius: var(--button-radius);
  background: transparent;
  color: var(--text-secondary);
  font-size: 0.8125rem;
  font-weight: 500;
  cursor: pointer;
}

[data-module="product-catalog"] .pc-tab:hover {
  color: var(--text-primary);
  background: var(--row-hover);
}

[data-module="product-catalog"] .pc-tab.is-active {
  color: var(--text-primary);
  background: var(--accent-soft);
  border-color: var(--accent-line);
}

[data-module="product-catalog"] .pc-tab-count {
  display: inline-block;
  min-width: 1.4em;
  padding: 0 0.375rem;
  border-radius: 999px;
  background: var(--panel-2);
  color: var(--text-tertiary);
  font-size: 0.6875rem;
  text-align: center;
  line-height: 1.4em;
}

[data-module="product-catalog"] .pc-tab.is-active .pc-tab-count {
  background: var(--panel);
  color: var(--text-secondary);
}

/* Inbox tab badge -- accent color to draw attention to pending captures. */
[data-module="product-catalog"] .pc-tab-count-accent {
  background: var(--accent);
  color: var(--on-accent, #fff);
}

/* Inbox subview breadcrumb */
[data-module="product-catalog"] .pc-inbox-crumbs {
  padding: 0.75rem 1rem 0.25rem;
}

[data-module="product-catalog"] .pc-inbox-crumbs .btn-link {
  background: transparent;
  border: none;
  padding: 0.25rem 0;
  color: var(--text-secondary);
  font-size: 0.8125rem;
  cursor: pointer;
  font-family: inherit;
}

[data-module="product-catalog"] .pc-inbox-crumbs .btn-link:hover {
  color: var(--text-primary);
}

/* ----------------------------------------------------------------- */
/* Quotes list                                                         */
/* ----------------------------------------------------------------- */


[data-module="product-catalog"] .pc-qd-loading,
[data-module="product-catalog"] .pc-qd-empty {
  padding: 1rem;
  font-size: 0.75rem;
  color: var(--text-tertiary);
  text-align: center;
}

[data-module="product-catalog"] .pc-qd-notes {
  width: 100%;
  resize: vertical;
  font-family: inherit;
}

[data-module="product-catalog"] .pc-qd-lines {
  margin-top: 0.25rem;
  border: 1px solid var(--border);
  border-radius: var(--panel-radius);
  overflow: hidden;
}

[data-module="product-catalog"] .pc-qd-lines-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.75rem;
}

[data-module="product-catalog"] .pc-qd-lines-table thead th {
  padding: 0.4375rem 0.5rem;
  text-align: left;
  background: var(--panel-2);
  color: var(--text-tertiary);
  font-size: 0.625rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  border-bottom: 1px solid var(--border);
}

[data-module="product-catalog"] .pc-qd-lines-table td {
  padding: 0.4375rem 0.5rem;
  border-top: 1px solid var(--border);
  vertical-align: middle;
}

[data-module="product-catalog"] .pc-qd-line-superseded td {
  color: var(--text-tertiary);
  text-decoration: line-through;
}

[data-module="product-catalog"] .pc-qd-line-superseded .pc-pricerow-flag {
  text-decoration: none;
}

[data-module="product-catalog"] .pc-qd-line-mfr {
  color: var(--text-secondary);
  max-width: 18rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

[data-module="product-catalog"] .pc-qd-line-part {
  font-variant-numeric: tabular-nums;
  font-family: monospace;
}

[data-module="product-catalog"] .pc-qd-line-bundle {
  display: inline-block;
  margin-left: 0.375rem;
  padding: 0.0625rem 0.375rem;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--text-secondary);
  font-size: 0.625rem;
  font-family: var(--font-sans, inherit);
}

[data-module="product-catalog"] .pc-qd-line-live {
  display: inline-block;
  padding: 0.0625rem 0.4375rem;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--text-primary);
  font-size: 0.625rem;
}

[data-module="product-catalog"] .pc-qd-line-actions {
  white-space: nowrap;
  text-align: right;
}

[data-module="product-catalog"] .pc-qd-line-action {
  width: 22px;
  height: 22px;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: transparent;
  color: var(--text-tertiary);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: 0.1875rem;
}

[data-module="product-catalog"] .pc-qd-line-action:hover {
  background: var(--row-hover);
  color: var(--text-primary);
}


/* ----------------------------------------------------------------- */
/* SKU bundles                                                         */
/* ----------------------------------------------------------------- */

[data-module="product-catalog"] .pc-bundle-pill {
  display: inline-block;
  margin-left: 0.375rem;
  padding: 0.0625rem 0.4375rem;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--text-secondary);
  font-size: 0.625rem;
  font-weight: 600;
  white-space: nowrap;
}

[data-module="product-catalog"] .pc-bundle-section {
  margin-top: 0.875rem;
  border-top: 1px solid var(--border);
  padding-top: 0.75rem;
}

[data-module="product-catalog"] .pc-bundle-block {
  border: 1px solid var(--border);
  border-radius: var(--panel-radius);
  background: var(--panel);
  margin-bottom: 0.5rem;
  overflow: hidden;
}

[data-module="product-catalog"] .pc-bundle-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0.4375rem 0.625rem;
  background: var(--panel-2);
  border-bottom: 1px solid var(--border);
  font-size: 0.6875rem;
}

[data-module="product-catalog"] .pc-bundle-head-label {
  font-weight: 600;
  color: var(--text-primary);
}

[data-module="product-catalog"] .pc-bundle-head-total {
  color: var(--text-secondary);
  font-variant-numeric: tabular-nums;
}

[data-module="product-catalog"] .pc-bundle-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.75rem;
}

[data-module="product-catalog"] .pc-bundle-table th,
[data-module="product-catalog"] .pc-bundle-table td {
  padding: 0.3125rem 0.5rem;
  border-top: 1px solid var(--border);
  text-align: left;
}

[data-module="product-catalog"] .pc-bundle-table thead th {
  background: var(--panel-2);
  color: var(--text-tertiary);
  font-size: 0.625rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

[data-module="product-catalog"] .pc-bundle-row-part {
  font-family: monospace;
  font-variant-numeric: tabular-nums;
}

[data-module="product-catalog"] .pc-bundle-row-actions {
  text-align: right;
}

[data-module="product-catalog"] .pc-bundle-remove {
  padding: 0.125rem 0.5rem;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: transparent;
  color: var(--text-secondary);
  font-size: 0.6875rem;
  cursor: pointer;
}

[data-module="product-catalog"] .pc-bundle-remove:hover {
  background: var(--row-hover);
  color: var(--text-primary);
}

/* ================================================================== */
/* Quotes tab -- 3-panel layout                                        */
/* ================================================================== */

[data-module="product-catalog"] .pc-quotes-tab {
  display: flex;
  flex-direction: column;
  height: 100%;
}

[data-module="product-catalog"] .pc-q-3pane {
  flex: 1 1 auto;
  display: grid;
  /* minmax(0, 1fr) on the right column so the PDF host can't push
     the grid wider than the viewport (causing the right pane to spill
     off-screen). Default 1fr has min-content sizing, which fights
     overflow:hidden on the host. */
  grid-template-columns: 180px 300px minmax(0, 1fr);
  min-height: 0;
  min-width: 0;
  overflow: hidden;
  border-top: 1px solid var(--border);
}

/* Manufacturer rail (left column) ---------------------------------- */

[data-module="product-catalog"] .pc-q-rail {
  display: flex;
  flex-direction: column;
  min-height: 0;
  border-right: 1px solid var(--border);
  background: var(--panel-2);
}

[data-module="product-catalog"] .pc-q-rail-head {
  padding: 0.5rem 0.75rem;
  font-size: 0.625rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--text-tertiary);
  border-bottom: 1px solid var(--border);
}

[data-module="product-catalog"] .pc-q-rail-list {
  flex: 1 1 auto;
  overflow-y: auto;
  padding: 0.25rem 0;
}

[data-module="product-catalog"] .pc-q-rail-item {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  padding: 0.4375rem 0.75rem;
  border: 0;
  background: transparent;
  color: var(--text-secondary);
  font-size: 0.8125rem;
  text-align: left;
  cursor: pointer;
}

[data-module="product-catalog"] .pc-q-rail-item:hover {
  background: var(--row-hover);
  color: var(--text-primary);
}

[data-module="product-catalog"] .pc-q-rail-item.is-active {
  background: var(--accent-soft);
  color: var(--text-primary);
  font-weight: 600;
}

[data-module="product-catalog"] .pc-q-rail-label {
  flex: 1 1 auto;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

[data-module="product-catalog"] .pc-q-rail-count {
  flex: 0 0 auto;
  font-variant-numeric: tabular-nums;
  font-size: 0.6875rem;
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-q-rail-item.is-active .pc-q-rail-count {
  color: var(--text-secondary);
}

/* Quote list (middle column) --------------------------------------- */

[data-module="product-catalog"] .pc-q-list-col {
  display: flex;
  flex-direction: column;
  min-height: 0;
  border-right: 1px solid var(--border);
}

[data-module="product-catalog"] .pc-q-list-head {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0.75rem;
  border-bottom: 1px solid var(--border);
  background: var(--panel);
}

[data-module="product-catalog"] .pc-q-list-head .pc-search {
  flex: 1 1 auto;
}

[data-module="product-catalog"] .pc-q-count {
  font-size: 0.6875rem;
  color: var(--text-tertiary);
  white-space: nowrap;
}

[data-module="product-catalog"] .pc-q-list-scroll {
  flex: 1 1 auto;
  overflow-y: auto;
  padding: 0.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  background: var(--panel-2);
}

/* Quote card (one per quote in the list) --------------------------- */

[data-module="product-catalog"] .pc-q-row {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  padding: 0.5rem 0.625rem;
  border: 1px solid var(--border);
  border-radius: var(--panel-radius);
  background: var(--panel);
  text-align: left;
  cursor: pointer;
  font-size: 0.8125rem;
}

[data-module="product-catalog"] .pc-q-row:hover {
  border-color: var(--border-strong);
}

[data-module="product-catalog"] .pc-q-row.is-selected {
  border-color: var(--accent);
  background: var(--accent-soft);
}

[data-module="product-catalog"] .pc-q-row-top {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem;
}

[data-module="product-catalog"] .pc-q-row-supplier {
  font-weight: 600;
  color: var(--text-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

[data-module="product-catalog"] .pc-q-row-date {
  flex: 0 0 auto;
  font-size: 0.6875rem;
  color: var(--text-tertiary);
  font-variant-numeric: tabular-nums;
}

[data-module="product-catalog"] .pc-q-row-mid {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.5rem;
}

[data-module="product-catalog"] .pc-q-row-lines {
  font-size: 0.6875rem;
  color: var(--text-secondary);
}

[data-module="product-catalog"] .pc-q-row-total {
  font-weight: 600;
  font-variant-numeric: tabular-nums;
  color: var(--text-primary);
}

[data-module="product-catalog"] .pc-q-row-ref {
  font-size: 0.6875rem;
  color: var(--text-tertiary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

[data-module="product-catalog"] .pc-q-row-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
}

[data-module="product-catalog"] .pc-q-row-chip {
  display: inline-block;
  padding: 0.0625rem 0.4375rem;
  border-radius: 999px;
  background: var(--panel-2);
  color: var(--text-secondary);
  font-size: 0.625rem;
  white-space: nowrap;
  max-width: 14ch;
  overflow: hidden;
  text-overflow: ellipsis;
}

[data-module="product-catalog"] .pc-q-row.is-selected .pc-q-row-chip {
  background: var(--panel);
}

[data-module="product-catalog"] .pc-q-row-chip-project {
  background: var(--accent-soft);
  color: var(--text-primary);
}

/* Right pane (PDF + collapsibles) ---------------------------------- */

[data-module="product-catalog"] .pc-q-right-pane {
  display: flex;
  flex-direction: column;
  min-height: 0;
  background: var(--panel);
}

[data-module="product-catalog"] .pc-q-right-empty {
  align-items: center;
  justify-content: center;
}

[data-module="product-catalog"] .pc-q-empty-state {
  max-width: 360px;
  padding: 2rem;
  text-align: center;
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-q-empty-state-title {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--text-secondary);
  margin-bottom: 0.375rem;
}

[data-module="product-catalog"] .pc-q-empty-state-body {
  font-size: 0.8125rem;
  line-height: 1.5;
}

/* Collapsible region head (used by both header bar + lines panel) */

[data-module="product-catalog"] .pc-q-region-head {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0.875rem;
  background: var(--panel-2);
  border-bottom: 1px solid var(--border);
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--text-primary);
  cursor: pointer;
  user-select: none;
}

[data-module="product-catalog"] .pc-q-region-head:hover {
  background: var(--row-hover);
}

[data-module="product-catalog"] .pc-q-chevron {
  flex: 0 0 auto;
  transition: transform 0.15s ease;
}

[data-module="product-catalog"] .pc-q-chevron.is-collapsed {
  transform: rotate(-90deg);
}

/* Compact header bar -- inline-editable fields. Each field is a real
   <input> always rendered; CSS makes it look like a label until
   hovered or focused, at which point full input chrome appears. */

[data-module="product-catalog"] .pc-q-header-bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.375rem;
  padding: 0.4375rem 0.625rem;
  background: var(--panel);
  border-bottom: 1px solid var(--border);
}

[data-module="product-catalog"] .pc-q-header-fields {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.25rem;
  flex: 1 1 auto;
  min-width: 0;
}

[data-module="product-catalog"] .pc-q-header-actions {
  display: flex;
  gap: 0.25rem;
  flex: 0 0 auto;
}

[data-module="product-catalog"] .pc-q-header-action {
  padding: 0.1875rem 0.5rem;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: var(--panel);
  color: var(--text-secondary);
  font-size: 0.6875rem;
  cursor: pointer;
}

[data-module="product-catalog"] .pc-q-header-action:hover {
  background: var(--row-hover);
  color: var(--text-primary);
}

[data-module="product-catalog"] .pc-q-header-action[disabled] {
  opacity: 0.5;
  cursor: default;
}

[data-module="product-catalog"] .pc-q-header-action-primary:not([disabled]) {
  background: var(--accent-soft);
  color: var(--text-primary);
  border-color: var(--accent-line);
}

[data-module="product-catalog"] .pc-q-header-action-danger {
  color: var(--error);
}

[data-module="product-catalog"] .pc-q-header-action-danger:hover {
  background: var(--error-soft);
}

/* Inline-editable inputs (look like labels, become inputs on focus) */

[data-module="product-catalog"] .pc-q-inline {
  border: 1px solid transparent;
  background: transparent;
  padding: 0.1875rem 0.375rem;
  border-radius: 4px;
  font-family: inherit;
  font-size: 0.8125rem;
  color: var(--text-primary);
  cursor: text;
  min-width: 0;
}

[data-module="product-catalog"] .pc-q-inline:hover:not(:focus) {
  border-color: var(--border);
  background: var(--row-hover);
}

[data-module="product-catalog"] .pc-q-inline:focus {
  border-color: var(--accent);
  background: var(--input-bg);
  outline: none;
}

[data-module="product-catalog"] .pc-q-inline::placeholder {
  color: var(--text-tertiary);
  font-style: italic;
}

[data-module="product-catalog"] .pc-q-inline-supplier {
  font-weight: 600;
  min-width: 140px;
}

[data-module="product-catalog"] .pc-q-inline-date {
  font-size: 0.75rem;
  color: var(--text-secondary);
  font-variant-numeric: tabular-nums;
  width: 130px;
}

[data-module="product-catalog"] .pc-q-inline-select {
  font-size: 0.75rem;
  color: var(--text-secondary);
  width: auto;
  cursor: pointer;
}

[data-module="product-catalog"] .pc-q-inline-ref,
[data-module="product-catalog"] .pc-q-inline-project {
  flex: 1 1 80px;
  min-width: 80px;
  font-size: 0.75rem;
  color: var(--text-secondary);
}

/* Notes textarea -- collapsed to one line until focused, then grows.
   width:100% so it sits across the full header bar on its own line. */
[data-module="product-catalog"] .pc-q-inline-notes {
  flex: 1 1 100%;
  width: 100%;
  resize: none;
  font-size: 0.75rem;
  color: var(--text-secondary);
  line-height: 1.4;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

[data-module="product-catalog"] .pc-q-inline-notes:focus {
  white-space: normal;
  resize: vertical;
  min-height: 3em;
}

/* PDF region (middle of right pane, fills available space) */

[data-module="product-catalog"] .pc-q-pdf-region {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  background: var(--bg);
  padding: 0.5rem;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.625rem;
}

[data-module="product-catalog"] .pc-q-pdf-host {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.625rem;
}

[data-module="product-catalog"] .pc-q-pdf-page-wrap {
  background: white;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.18);
  max-width: 100%;
}

[data-module="product-catalog"] .pc-q-pdf-page {
  display: block;
  max-width: 100%;
  height: auto;
}

[data-module="product-catalog"] .pc-q-pdf-empty,
[data-module="product-catalog"] .pc-q-pdf-loading,
[data-module="product-catalog"] .pc-q-pdf-error {
  margin: auto;
  padding: 2rem;
  text-align: center;
  font-size: 0.8125rem;
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-q-pdf-error {
  color: var(--error);
}

/* Lines region (collapsible at bottom of right pane) */

[data-module="product-catalog"] .pc-q-lines-region {
  flex: 0 0 auto;
  max-height: 50%;
  display: flex;
  flex-direction: column;
  border-top: 1px solid var(--border);
}

[data-module="product-catalog"] .pc-q-region-body {
  overflow-y: auto;
  padding: 0.5rem;
  background: var(--panel);
}

/* Collapse the layout to two columns when narrow + stack on mobile. */
@media (max-width: 1024px) {
  [data-module="product-catalog"] .pc-q-3pane {
    grid-template-columns: 160px minmax(0, 1fr);
  }
  [data-module="product-catalog"] .pc-q-list-col {
    border-right: 0;
    border-bottom: 1px solid var(--border);
  }
  [data-module="product-catalog"] .pc-q-right-pane {
    grid-column: 1 / -1;
  }
}
@media (max-width: 768px) {
  [data-module="product-catalog"] .pc-q-3pane {
    grid-template-columns: minmax(0, 1fr);
  }
  [data-module="product-catalog"] .pc-q-rail {
    border-right: 0;
    border-bottom: 1px solid var(--border);
    max-height: 200px;
  }
}

/* SKU row action affordances (admin-only, in catalog detail tables) */
[data-module="product-catalog"] .pc-skurow-action-col {
  width: 56px;
  text-align: right;
  white-space: nowrap;
}
[data-module="product-catalog"] .pc-skurow-edit,
[data-module="product-catalog"] .pc-skurow-retire {
  width: 22px;
  height: 22px;
  border: 1px solid transparent;
  border-radius: var(--button-radius);
  background: transparent;
  color: var(--text-tertiary);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  /* Hidden by default; revealed on row hover or keyboard focus so the
     action stays accessible. opacity rather than display:none keeps the
     column width stable across hover states. */
  opacity: 0;
  transition: opacity 0.12s ease, background-color 0.12s ease, color 0.12s ease;
}
[data-module="product-catalog"] .pc-skurow:hover .pc-skurow-edit,
[data-module="product-catalog"] .pc-skurow:hover .pc-skurow-retire,
[data-module="product-catalog"] .pc-skurow-edit:focus-visible,
[data-module="product-catalog"] .pc-skurow-retire:focus-visible {
  opacity: 1;
}
[data-module="product-catalog"] .pc-skurow-edit:hover {
  border-color: var(--border);
  background: var(--accent-soft);
  color: var(--accent);
}
[data-module="product-catalog"] .pc-skurow-retire:hover {
  border-color: var(--border);
  background: var(--error-soft);
  color: var(--error);
}

/* Bundle parent part-number cell -- joined parent + children with " + ". */
[data-module="product-catalog"] .pc-skurow-bundle-parts {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.125rem;
  align-items: baseline;
}
[data-module="product-catalog"] .pc-skurow-bundle-part {
  font-variant-numeric: tabular-nums;
  font-family: monospace;
}
[data-module="product-catalog"] .pc-skurow-bundle-sep {
  color: var(--text-tertiary);
  font-family: inherit;
}

/* ----------------------------------------------------------------- */
/* Shared combobox (PC.combobox.attach) -- input + filtered menu      */
/* with optional "+ Create" affordance.                                */
/* ----------------------------------------------------------------- */

/* The menu is body-mounted (see combobox.js) with data-module
   stamped on the menu element itself. The plain descendant selector
   `[data-module="product-catalog"] .pc-cb-menu` does NOT match an
   element that IS the data-module ancestor -- descendant combinators
   require a separate ancestor element. So we add the self-attribute
   variant `.pc-cb-menu[data-module="product-catalog"]` as the second
   selector. The child item selectors below still work via the
   descendant combinator because they ARE descendants of the menu
   (which has the attribute), even though the menu itself isn't. */
[data-module="product-catalog"] .pc-cb-menu,
.pc-cb-menu[data-module="product-catalog"] {
  position: fixed;
  z-index: 9100;
  overflow-y: auto;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  box-shadow: var(--shadow);
  font-size: 0.8125rem;
}

[data-module="product-catalog"] .pc-cb-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.3125rem 0.5rem;
  color: var(--text-primary);
  cursor: pointer;
}

[data-module="product-catalog"] .pc-cb-item:hover,
[data-module="product-catalog"] .pc-cb-item.is-active {
  background: var(--row-hover);
}

[data-module="product-catalog"] .pc-cb-item-dot {
  flex: 0 0 auto;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--accent);
}

[data-module="product-catalog"] .pc-cb-item-label {
  flex: 1 1 auto;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

[data-module="product-catalog"] .pc-cb-item-sub {
  flex: 0 0 auto;
  font-size: 0.6875rem;
  color: var(--text-tertiary);
  font-variant-numeric: tabular-nums;
}

[data-module="product-catalog"] .pc-cb-item-create {
  border-top: 1px solid var(--border);
  color: var(--accent);
}

[data-module="product-catalog"] .pc-cb-item-create strong {
  color: var(--text-primary);
  font-weight: 500;
}

[data-module="product-catalog"] .pc-cb-empty {
  padding: 0.5rem 0.625rem;
  font-size: 0.6875rem;
  color: var(--text-tertiary);
  font-style: italic;
}

/* Quote Import line items: secondary row holds product family + qty.
   Product family takes most of the width; qty stays narrow. When
   product family is hidden (matched line), qty is the only cell. */
[data-module="product-catalog"] .pc-qi-grid-secondary {
  grid-template-columns: 1fr 100px;
  gap: 0.5rem;
  margin-top: 0.375rem;
}
[data-module="product-catalog"] .pc-qi-grid-secondary .pc-qi-name-field {
  min-width: 0;
}
[data-module="product-catalog"] .pc-qi-field-qty {
  min-width: 80px;
}

/* Quote Import line item: main row needs 3 columns (mfr / part / price)
   instead of inheriting the 2-col default which forces a wrap. Mfr +
   part get more room, price stays narrow since it's typically a short
   number. The default pc-qi-grid (2-col) is still used for the quote
   header (label + date / source-type + reference / project + notes). */
[data-module="product-catalog"] .pc-qi-grid-line {
  grid-template-columns: 1.3fr 1.3fr 0.9fr;
}

/* ---------------------------------------------------------------- */
/* Configurations section (Phase 3 -- spec section 8.4)             */
/* Detail-panel section showing per-product configuration history.  */
/* ---------------------------------------------------------------- */

[data-module="product-catalog"] .pc-config-history {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

[data-module="product-catalog"] .pc-config-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  font-size: 12px;
  color: var(--text-secondary);
  padding: 8px 12px;
  background: var(--panel-2);
  border-radius: var(--button-radius);
}

[data-module="product-catalog"] .pc-config-stats strong {
  color: var(--text-primary);
  font-weight: 600;
}

[data-module="product-catalog"] .pc-config-groupby {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--text-secondary);
}

[data-module="product-catalog"] .pc-config-groupby select {
  background: var(--input-bg);
  color: var(--text-primary);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 2px 6px;
  font-size: 12px;
}

[data-module="product-catalog"] .pc-config-grouptable {
  width: 100%;
  border-collapse: collapse;
  font-size: 12px;
}

[data-module="product-catalog"] .pc-config-grouptable th,
[data-module="product-catalog"] .pc-config-grouptable td {
  padding: 4px 8px;
  border-bottom: 1px solid var(--border);
  text-align: left;
  color: var(--text-primary);
}

[data-module="product-catalog"] .pc-config-grouptable th {
  font-weight: 500;
  color: var(--text-tertiary);
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

[data-module="product-catalog"] .pc-config-recenthead {
  margin: 12px 0 4px;
  font-size: 11px;
  color: var(--text-tertiary);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 500;
}

[data-module="product-catalog"] .pc-config-recentlist {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

[data-module="product-catalog"] .pc-config-recordrow {
  display: grid;
  grid-template-columns: 80px minmax(0, 1.4fr) minmax(0, 1.6fr);
  gap: 8px;
  padding: 4px 8px;
  font-size: 12px;
  color: var(--text-primary);
  cursor: pointer;
  border-radius: 4px;
}

[data-module="product-catalog"] .pc-config-recordrow:hover {
  background: var(--row-hover);
}

[data-module="product-catalog"] .pc-config-recorddate {
  color: var(--text-tertiary);
  font-variant-numeric: tabular-nums;
}

[data-module="product-catalog"] .pc-config-recordsummary {
  color: var(--text-secondary);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ----------------------------------------------------------------
   Cutsheet ladder extraction surface (Tier 1 -- container-rendered).
   Spec: docs/product-catalog/cutsheet-ladder-extraction-kickoff.md.
   ---------------------------------------------------------------- */

[data-module="product-catalog"] .pc-ladder-extraction {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

[data-module="product-catalog"] .pc-ladder-cta {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  padding: 12px 0 4px;
}

[data-module="product-catalog"] .pc-ladder-cta-hint {
  font-size: 12px;
  color: var(--text-tertiary);
  flex: 1 1 240px;
}

[data-module="product-catalog"] .pc-ladder-live {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 8px 12px;
  background: var(--panel-2);
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
}

[data-module="product-catalog"] .pc-ladder-live-title {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-ladder-live-comp-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 6px 0 2px;
  margin-top: 6px;
  border-top: 1px dashed var(--border);
  font-size: 12px;
}

[data-module="product-catalog"] .pc-ladder-live-comp-head:first-child {
  border-top: none;
  margin-top: 0;
  padding-top: 0;
}

[data-module="product-catalog"] .pc-ladder-live-comp-label {
  font-weight: 600;
  color: var(--text-primary);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

[data-module="product-catalog"] .pc-ladder-live-role {
  display: inline-block;
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 700;
  padding: 1px 5px;
  border-radius: 3px;
}

[data-module="product-catalog"] .pc-ladder-live-role-leader {
  background: var(--accent-soft);
  color: var(--accent);
}

[data-module="product-catalog"] .pc-ladder-live-role-child {
  background: var(--row-alt);
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-ladder-live-tpl {
  font-family: var(--font-mono, monospace);
  font-size: 11px;
  color: var(--text-secondary);
  padding: 1px 6px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 3px;
}

[data-module="product-catalog"] .pc-ladder-live-row {
  display: grid;
  grid-template-columns: minmax(120px, 160px) minmax(0, 1fr);
  gap: 12px;
  align-items: center;
  font-size: 13px;
}

[data-module="product-catalog"] .pc-ladder-live-key {
  font-weight: 500;
  color: var(--text-primary);
}

[data-module="product-catalog"] .pc-ladder-live-codes,
[data-module="product-catalog"] .pc-ladder-seg-codes {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

/* Editable code rows inside the review modal (v0.9.27). */
[data-module="product-catalog"] .pc-ladder-seg-codes-edit {
  flex-direction: column;
  gap: 4px;
}

[data-module="product-catalog"] .pc-ladder-code-edit {
  display: flex;
  align-items: center;
  gap: 6px;
}

[data-module="product-catalog"] .pc-ladder-code-edit-code,
[data-module="product-catalog"] .pc-ladder-code-edit-label {
  font-size: 12px;
  padding: 4px 6px;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: var(--input-bg);
  color: var(--text-primary);
  font-family: inherit;
}

[data-module="product-catalog"] .pc-ladder-code-edit-code {
  flex: 0 0 90px;
  font-family: var(--font-mono, monospace);
}

[data-module="product-catalog"] .pc-ladder-code-edit-label {
  flex: 1 1 auto;
}

[data-module="product-catalog"] .pc-ladder-code-edit-code:focus,
[data-module="product-catalog"] .pc-ladder-code-edit-label:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 2px var(--accent-soft);
}

[data-module="product-catalog"] .pc-ladder-code-edit-delete {
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: var(--panel);
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
  flex-shrink: 0;
}

[data-module="product-catalog"] .pc-ladder-code-edit-delete:hover {
  background: var(--error-soft);
  color: var(--error);
  border-color: var(--error);
}

[data-module="product-catalog"] .pc-ladder-add-code {
  align-self: flex-start;
  font-size: 11px;
  padding: 3px 10px;
  margin-top: 2px;
}

[data-module="product-catalog"] .pc-ladder-code {
  display: inline-block;
  padding: 2px 6px;
  border: 1px solid var(--border);
  border-radius: 4px;
  font-size: 12px;
  color: var(--text-primary);
  background: var(--panel);
  font-family: var(--font-mono, monospace);
}

[data-module="product-catalog"] .pc-ladder-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  border-bottom: 1px solid var(--border);
  margin: 8px 0;
}

[data-module="product-catalog"] .pc-ladder-tab {
  appearance: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  background: transparent;
  border: 1px solid transparent;
  border-bottom: 2px solid transparent;
  color: var(--text-secondary);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  border-radius: 6px 6px 0 0;
}

[data-module="product-catalog"] .pc-ladder-tab:hover {
  color: var(--text-primary);
  background: var(--row-hover);
}

[data-module="product-catalog"] .pc-ladder-tab-active {
  color: var(--text-primary);
  border-bottom-color: var(--accent);
  background: var(--panel);
}

[data-module="product-catalog"] .pc-ladder-tab-role {
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 700;
  padding: 1px 5px;
  border-radius: 3px;
}

[data-module="product-catalog"] .pc-ladder-tab-role-leader {
  background: var(--accent-soft);
  color: var(--accent);
}

[data-module="product-catalog"] .pc-ladder-tab-role-child {
  background: var(--row-alt);
  color: var(--text-tertiary);
}

[data-module="product-catalog"] .pc-ladder-tab-rejected {
  font-size: 10px;
  padding: 1px 5px;
  border-radius: 3px;
  background: var(--error-soft);
  color: var(--error);
}

[data-module="product-catalog"] .pc-ladder-segments {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

[data-module="product-catalog"] .pc-ladder-seg {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: var(--panel-2);
}

[data-module="product-catalog"] .pc-ladder-seg-rejected {
  opacity: 0.5;
}

[data-module="product-catalog"] .pc-ladder-seg-accepted {
  border-color: var(--accent-line);
}

[data-module="product-catalog"] .pc-ladder-seg-head {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

[data-module="product-catalog"] .pc-ladder-seg-toggle {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  user-select: none;
}

[data-module="product-catalog"] .pc-ladder-seg-toggle input[type="checkbox"] {
  width: 16px;
  height: 16px;
  cursor: pointer;
}

[data-module="product-catalog"] .pc-ladder-seg-key {
  font-weight: 600;
  color: var(--text-primary);
  font-family: var(--font-mono, monospace);
  font-size: 13px;
}

[data-module="product-catalog"] .pc-ladder-seg-label {
  color: var(--text-secondary);
  font-size: 13px;
}

[data-module="product-catalog"] .pc-ladder-conf {
  display: inline-block;
  padding: 1px 6px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 500;
  font-variant-numeric: tabular-nums;
  margin-left: 4px;
}

[data-module="product-catalog"] .pc-ladder-conf-high {
  background: var(--accent-soft);
  color: var(--accent);
}

[data-module="product-catalog"] .pc-ladder-conf-mid {
  background: rgba(255, 180, 60, 0.12);
  color: var(--text-secondary);
  border: 1px solid rgba(255, 180, 60, 0.3);
}

[data-module="product-catalog"] .pc-ladder-conf-low {
  background: var(--error-soft);
  color: var(--error);
}

[data-module="product-catalog"] .pc-ladder-desc {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: var(--panel-2);
}

[data-module="product-catalog"] .pc-ladder-desc-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 12px;
}

[data-module="product-catalog"] .pc-ladder-desc-side-label {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-tertiary);
  margin-bottom: 4px;
}

[data-module="product-catalog"] .pc-ladder-desc-side-value {
  font-size: 13px;
  color: var(--text-primary);
  line-height: 1.4;
}

[data-module="product-catalog"] .pc-ladder-template {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

[data-module="product-catalog"] .pc-ladder-template-label {
  display: flex;
  flex-direction: column;
  gap: 4px;
  font-size: 12px;
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

[data-module="product-catalog"] .pc-ladder-template-input {
  background: var(--input-bg);
  color: var(--text-primary);
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  padding: 6px 8px;
  font-family: var(--font-mono, monospace);
  font-size: 13px;
}

[data-module="product-catalog"] .pc-ladder-template-hint {
  font-size: 11px;
}

[data-module="product-catalog"] .pc-ladder-notes {
  font-size: 12px;
  color: var(--text-secondary);
  padding: 8px 12px;
  background: var(--panel-2);
  border-left: 3px solid var(--accent-line);
  border-radius: 4px;
  line-height: 1.4;
}

[data-module="product-catalog"] .pc-ladder-cost {
  font-size: 11px;
  font-variant-numeric: tabular-nums;
}

[data-module="product-catalog"] .pc-ladder-actions {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  padding-top: 4px;
}

/* Loading state for the extraction call. Two-line layout: animated
   spinner on the left, title + sub-copy on the right. */
[data-module="product-catalog"] .pc-ladder-loading {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px 16px;
  background: var(--panel-2);
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
}

[data-module="product-catalog"] .pc-ladder-spinner {
  width: 24px;
  height: 24px;
  flex: 0 0 auto;
  border: 2px solid var(--border-strong);
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: pc-ladder-spin 0.9s linear infinite;
}

@keyframes pc-ladder-spin {
  to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
  [data-module="product-catalog"] .pc-ladder-spinner {
    animation: pc-ladder-pulse 1.6s ease-in-out infinite;
  }
}

@keyframes pc-ladder-pulse {
  0%, 100% { opacity: 0.4; }
  50% { opacity: 1; }
}

[data-module="product-catalog"] .pc-ladder-loading-title {
  font-weight: 600;
  font-size: 14px;
  color: var(--text-primary);
  margin-bottom: 4px;
}

[data-module="product-catalog"] .pc-ladder-loading-sub {
  font-size: 12px;
  line-height: 1.4;
}

/* Empty-ladder state (model returned [] -- couldn't parse). */
[data-module="product-catalog"] .pc-ladder-empty {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 16px;
  background: var(--panel-2);
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
}

[data-module="product-catalog"] .pc-ladder-empty-title {
  font-size: 14px;
  font-weight: 600;
  color: var(--text-primary);
}

[data-module="product-catalog"] .pc-ladder-empty-body {
  font-size: 13px;
  line-height: 1.5;
}

[data-module="product-catalog"] .pc-ladder-empty-notes {
  margin-top: 4px;
}

/* ----------------------------------------------------------------------
   Ladder extraction region-select modal (v0.9.22)
   ---------------------------------------------------------------------- */

/* Body-mounted -- needs the dual selector so the root itself matches.
   Mirror the pc-pdf-modal-backdrop pattern for z-index / layout. */
[data-module="product-catalog"] .pc-ladder-region-backdrop,
.pc-ladder-region-backdrop[data-module="product-catalog"] {
  position: fixed;
  inset: 0;
  z-index: 9000;
  background: var(--overlay-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px;
  animation: pc-qi-fadein-backdrop 0.18s ease-out;
}

[data-module="product-catalog"] .pc-ladder-region-modal {
  width: 100%;
  max-width: 1200px;
  height: 100%;
  max-height: 92vh;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--panel-radius);
  box-shadow: var(--shadow-lg);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

[data-module="product-catalog"] .pc-ladder-region-head {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.625rem 0.875rem;
  border-bottom: 1px solid var(--border);
  background: var(--panel-2);
  flex-shrink: 0;
}

[data-module="product-catalog"] .pc-ladder-region-title {
  flex: 1 1 auto;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--text-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

[data-module="product-catalog"] .pc-ladder-region-hint {
  flex-shrink: 0;
  padding: 8px 14px;
  background: var(--panel-2);
  border-bottom: 1px solid var(--border);
  font-size: 12px;
  color: var(--text-secondary);
  line-height: 1.4;
}

[data-module="product-catalog"] .pc-ladder-region-body {
  flex: 1 1 auto;
  display: flex;
  min-height: 0;
  background: var(--bg);
}

[data-module="product-catalog"] .pc-ladder-region-pages {
  flex: 1 1 auto;
  overflow-y: auto;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.875rem;
  background: var(--bg);
}

[data-module="product-catalog"] .pc-ladder-region-page-wrap {
  position: relative;
  background: white;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.18);
  max-width: 100%;
  /* line-height:0 keeps an inline canvas + drag layer from leaving
     a stray text baseline gap below the canvas. */
  line-height: 0;
}

[data-module="product-catalog"] .pc-ladder-region-page {
  display: block;
  max-width: 100%;
  height: auto;
}

/* Drag layer overlays the canvas exactly. CSS pixel size matches
   the canvas's CSS size, so pointer coords are 1:1 with the
   canvas's display space. */
[data-module="product-catalog"] .pc-ladder-region-drag {
  position: absolute;
  inset: 0;
  cursor: crosshair;
  user-select: none;
  touch-action: none;
}

/* Selection rectangle. Bordered + lightly tinted so the user can
   see the chosen region against any cutsheet background. */
[data-module="product-catalog"] .pc-ladder-region-rect {
  position: absolute;
  border: 2px solid var(--accent);
  background: var(--accent-soft);
  pointer-events: none;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.7);
}

[data-module="product-catalog"] .pc-ladder-region-foot {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  border-top: 1px solid var(--border);
  background: var(--panel-2);
  flex-shrink: 0;
}

[data-module="product-catalog"] .pc-ladder-region-status {
  flex: 1 1 auto;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

[data-module="product-catalog"] .pc-ladder-region-status-error {
  color: var(--error);
}

[data-module="product-catalog"] .pc-ladder-region-actions {
  display: flex;
  gap: 8px;
  flex-shrink: 0;
}

/* ----------------------------------------------------------------------
   Ladder review modal: side-by-side cutsheet + segments (v0.9.23)
   ---------------------------------------------------------------------- */

[data-module="product-catalog"] .pc-ladder-review-backdrop,
.pc-ladder-review-backdrop[data-module="product-catalog"] {
  position: fixed;
  inset: 0;
  z-index: 9000;
  background: var(--overlay-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  animation: pc-qi-fadein-backdrop 0.18s ease-out;
}

[data-module="product-catalog"] .pc-ladder-review-modal {
  width: 100%;
  max-width: 1500px;
  height: 100%;
  max-height: 94vh;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--panel-radius);
  box-shadow: var(--shadow-lg);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

[data-module="product-catalog"] .pc-ladder-review-head {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.625rem 0.875rem;
  border-bottom: 1px solid var(--border);
  background: var(--panel-2);
  flex-shrink: 0;
}

[data-module="product-catalog"] .pc-ladder-review-title {
  flex: 1 1 auto;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--text-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

[data-module="product-catalog"] .pc-ladder-review-body {
  flex: 1 1 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  min-height: 0;
  background: var(--bg);
}

[data-module="product-catalog"] .pc-ladder-review-pane {
  min-height: 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

[data-module="product-catalog"] .pc-ladder-review-pane-left {
  border-right: 1px solid var(--border);
}

[data-module="product-catalog"] .pc-ladder-review-cutsheet-pages {
  flex: 1 1 auto;
  overflow-y: auto;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.875rem;
  background: var(--bg);
}

[data-module="product-catalog"] .pc-ladder-review-page-wrap {
  position: relative;
  background: white;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.18);
  max-width: 100%;
  line-height: 0;
}

[data-module="product-catalog"] .pc-ladder-review-page {
  display: block;
  max-width: 100%;
  height: auto;
}

[data-module="product-catalog"] .pc-ladder-review-drag {
  position: absolute;
  inset: 0;
  cursor: crosshair;
  user-select: none;
  touch-action: none;
}

[data-module="product-catalog"] .pc-ladder-review-rect {
  position: absolute;
  border: 2px solid var(--accent);
  background: var(--accent-soft);
  pointer-events: none;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.7);
}

[data-module="product-catalog"] .pc-ladder-review-pane-right {
  overflow-y: auto;
  padding: 16px;
  background: var(--panel);
  display: flex;
  flex-direction: column;
  gap: 14px;
}

[data-module="product-catalog"] .pc-ladder-review-empty {
  padding: 24px;
  text-align: center;
  font-size: 13px;
}

[data-module="product-catalog"] .pc-ladder-review-foot {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  border-top: 1px solid var(--border);
  background: var(--panel-2);
  flex-shrink: 0;
}

[data-module="product-catalog"] .pc-ladder-review-region-status {
  flex: 1 1 auto;
  font-size: 12px;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

[data-module="product-catalog"] .pc-ladder-review-region-status-error {
  color: var(--error);
}

[data-module="product-catalog"] .pc-ladder-review-region-actions {
  display: flex;
  gap: 8px;
  flex-shrink: 0;
}

/* ----------------------------------------------------------------------
   Inline summary card (replaces the in-section reviewer in v0.9.23).
   ---------------------------------------------------------------------- */

[data-module="product-catalog"] .pc-ladder-summary {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 14px 16px;
  background: var(--panel-2);
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
}

[data-module="product-catalog"] .pc-ladder-summary-text {
  flex: 1 1 auto;
  min-width: 0;
}

[data-module="product-catalog"] .pc-ladder-summary-title {
  font-weight: 600;
  font-size: 13px;
  color: var(--text-primary);
  margin-bottom: 4px;
}

[data-module="product-catalog"] .pc-ladder-summary-sub {
  font-size: 12px;
  line-height: 1.4;
}

[data-module="product-catalog"] .pc-ladder-summary-notes {
  margin-top: 6px;
}

[data-module="product-catalog"] .pc-ladder-summary-actions {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 6px;
  flex-shrink: 0;
}

[data-module="product-catalog"] .pc-ladder-summary-cost {
  font-size: 11px;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

/* ----------------------------------------------------------------------
   Required / optional segmented control on each segment row (v0.9.23).
   Two pills sharing a track; the active state is highlighted so both
   choices stay visible without forcing the user to infer the toggle's
   meaning from a single label.
   ---------------------------------------------------------------------- */

[data-module="product-catalog"] .pc-ladder-req-seg {
  display: inline-flex;
  align-items: stretch;
  gap: 0;
  margin-left: auto;
  flex-shrink: 0;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--panel-2);
  padding: 2px;
  overflow: hidden;
}

[data-module="product-catalog"] .pc-ladder-req-seg-btn {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 3px 10px;
  font-size: 10.5px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--text-tertiary);
  cursor: pointer;
  border-radius: 999px;
  transition: background-color 0.12s ease, color 0.12s ease;
}

[data-module="product-catalog"] .pc-ladder-req-seg-btn:hover {
  color: var(--text-primary);
}

[data-module="product-catalog"] .pc-ladder-req-seg-btn.is-active {
  background: var(--accent);
  color: var(--bg);
  cursor: default;
}

[data-module="product-catalog"] .pc-ladder-req-seg-btn.is-active:hover {
  color: var(--bg);
}

/* The required toggle sits as a sibling of .pc-ladder-seg-toggle inside
   .pc-ladder-seg-head. The base seg-head rule already has flex layout. */
[data-module="product-catalog"] .pc-ladder-seg-head .pc-ladder-seg-toggle {
  flex: 1 1 auto;
  min-width: 0;
}

[data-module="product-catalog"] .pc-ladder-author-detachable {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-top: 8px;
  padding: 10px 12px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--panel-2);
  color: var(--text-primary);
  cursor: pointer;
}

[data-module="product-catalog"] .pc-ladder-author-detachable input {
  width: 18px;
  height: 18px;
  margin-top: 1px;
}

[data-module="product-catalog"] .pc-ladder-author-detachable span {
  display: grid;
  gap: 2px;
}

[data-module="product-catalog"] .pc-ladder-author-detachable small {
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.35;
}

@media (max-width: 1100px) {
  [data-module="product-catalog"] .pc-ladder-review-body {
    grid-template-columns: 1fr;
    grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
  }
  [data-module="product-catalog"] .pc-ladder-review-pane-left {
    border-right: none;
    border-bottom: 1px solid var(--border);
  }
}

/* ----------------------------------------------------------------------
   Manual ladder authoring modal (v0.9.25). Body-mounted overlay; same
   z-index + dual-selector pattern as the review modal.
   ---------------------------------------------------------------------- */

[data-module="product-catalog"] .pc-ladder-author-backdrop,
.pc-ladder-author-backdrop[data-module="product-catalog"] {
  position: fixed;
  inset: 0;
  z-index: 9000;
  background: var(--overlay-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  animation: pc-qi-fadein-backdrop 0.18s ease-out;
}

[data-module="product-catalog"] .pc-ladder-author-modal {
  width: 100%;
  max-width: 1000px;
  height: 100%;
  max-height: 92vh;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: var(--panel-radius);
  box-shadow: var(--shadow-lg);
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

[data-module="product-catalog"] .pc-ladder-author-head {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.625rem 0.875rem;
  border-bottom: 1px solid var(--border);
  background: var(--panel-2);
  flex-shrink: 0;
}

[data-module="product-catalog"] .pc-ladder-author-title {
  flex: 1 1 auto;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--text-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

[data-module="product-catalog"] .pc-ladder-author-body {
  flex: 1 1 auto;
  overflow-y: auto;
  padding: 16px 18px 24px;
  background: var(--bg);
  display: flex;
  flex-direction: column;
  gap: 14px;
}

[data-module="product-catalog"] .pc-ladder-author-help {
  font-size: 12px;
  line-height: 1.4;
  padding: 8px 12px;
  border-radius: var(--button-radius);
  background: var(--panel-2);
  border: 1px solid var(--border);
}

[data-module="product-catalog"] .pc-ladder-author-comp {
  border: 1px solid var(--border);
  border-radius: var(--panel-radius);
  background: var(--panel);
  padding: 14px 14px 12px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

[data-module="product-catalog"] .pc-ladder-author-comp-head {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

[data-module="product-catalog"] .pc-ladder-author-comp-fields {
  flex: 1 1 auto;
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 0.8fr);
  gap: 8px 10px;
}

[data-module="product-catalog"] .pc-ladder-author-field-template {
  grid-column: 1 / -1;
}

[data-module="product-catalog"] .pc-ladder-author-field-row {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}

[data-module="product-catalog"] .pc-ladder-author-field-label {
  font-size: 11px;
  color: var(--text-secondary);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 600;
}

[data-module="product-catalog"] .pc-ladder-author-input {
  width: 100%;
  font-size: 13px;
  padding: 6px 8px;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: var(--input-bg);
  color: var(--text-primary);
  font-family: inherit;
}

[data-module="product-catalog"] .pc-ladder-author-input:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 0 0 2px var(--accent-soft);
}

[data-module="product-catalog"] .pc-ladder-author-comp-actions,
[data-module="product-catalog"] .pc-ladder-author-row-actions {
  display: flex;
  gap: 4px;
  flex-shrink: 0;
}

[data-module="product-catalog"] .pc-ladder-author-icon-btn {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: var(--panel);
  color: var(--text-secondary);
  font-size: 14px;
  line-height: 1;
  cursor: pointer;
}

[data-module="product-catalog"] .pc-ladder-author-icon-btn:hover:not([disabled]) {
  background: var(--row-hover);
  color: var(--text-primary);
}

[data-module="product-catalog"] .pc-ladder-author-icon-btn[disabled] {
  opacity: 0.3;
  cursor: not-allowed;
}

[data-module="product-catalog"] .pc-ladder-author-delete:hover:not([disabled]) {
  background: var(--error-soft);
  color: var(--error);
  border-color: var(--error);
}

[data-module="product-catalog"] .pc-ladder-author-segs {
  border-top: 1px dashed var(--border);
  padding-top: 10px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

[data-module="product-catalog"] .pc-ladder-author-segs-head {
  font-size: 11px;
  color: var(--text-tertiary);
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-weight: 600;
}

[data-module="product-catalog"] .pc-ladder-author-seg {
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: var(--panel-2);
  padding: 8px 10px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

[data-module="product-catalog"] .pc-ladder-author-seg-head {
  display: flex;
  align-items: center;
  gap: 8px;
}

[data-module="product-catalog"] .pc-ladder-author-seg-key {
  flex: 0 0 110px;
  font-family: var(--font-mono, monospace);
}

[data-module="product-catalog"] .pc-ladder-author-seg-label {
  flex: 1 1 auto;
}

[data-module="product-catalog"] .pc-ladder-author-seg-required {
  flex: 0 0 110px;
}

[data-module="product-catalog"] .pc-ladder-author-codes {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding-left: 12px;
  border-left: 2px solid var(--accent-line);
}

[data-module="product-catalog"] .pc-ladder-author-code {
  display: flex;
  align-items: center;
  gap: 6px;
}

[data-module="product-catalog"] .pc-ladder-author-code-code {
  flex: 0 0 130px;
  font-family: var(--font-mono, monospace);
}

[data-module="product-catalog"] .pc-ladder-author-code-label {
  flex: 1 1 auto;
}

[data-module="product-catalog"] .pc-ladder-author-add-row {
  align-self: flex-start;
  font-size: 12px;
  padding: 4px 10px;
}

[data-module="product-catalog"] .pc-ladder-author-add-comp {
  align-self: flex-start;
  font-size: 13px;
  padding: 6px 14px;
}

[data-module="product-catalog"] .pc-ladder-author-foot {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px 14px;
  border-top: 1px solid var(--border);
  background: var(--panel-2);
  flex-shrink: 0;
}

[data-module="product-catalog"] .pc-ladder-author-status {
  flex: 1 1 auto;
  font-size: 12px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

[data-module="product-catalog"] .pc-ladder-author-status-error {
  color: var(--error);
}

[data-module="product-catalog"] .pc-ladder-author-actions {
  display: flex;
  gap: 8px;
  flex-shrink: 0;
}

@media (max-width: 720px) {
  [data-module="product-catalog"] .pc-ladder-author-comp-fields {
    grid-template-columns: 1fr;
  }
  [data-module="product-catalog"] .pc-ladder-author-seg-head {
    flex-wrap: wrap;
  }
  [data-module="product-catalog"] .pc-ladder-author-seg-key,
  [data-module="product-catalog"] .pc-ladder-author-seg-required,
  [data-module="product-catalog"] .pc-ladder-author-code-code {
    flex-basis: 100px;
  }
}

/* Family Review subview (consolidation proposal review queue) ----------
   Admin ops tool for the one-time catalog re-materialization. Scoped under
   [data-module="product-catalog"]; tokens only (both themes adapt). */
[data-module="product-catalog"] .fr-root {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
}
[data-module="product-catalog"] .fr-head {
  padding: 0.875rem 1.125rem 0.625rem;
  border-bottom: 1px solid var(--border);
}
[data-module="product-catalog"] .fr-title {
  margin: 0.375rem 0 0.125rem;
  font-size: 1.0625rem;
  color: var(--text-primary);
}
[data-module="product-catalog"] .fr-sub {
  margin: 0 0 0.625rem;
  font-size: 0.78125rem;
  color: var(--text-secondary);
  max-width: 60ch;
}
[data-module="product-catalog"] .fr-summary {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4375rem;
  margin-bottom: 0.625rem;
}
[data-module="product-catalog"] .fr-chip {
  font-size: 0.6875rem;
  font-weight: 600;
  color: var(--text-secondary);
  background: var(--panel-2);
  border: 1px solid var(--border);
  padding: 0.125rem 0.5rem;
  border-radius: 12px;
}
[data-module="product-catalog"] .fr-chip-ok { color: var(--accent); background: var(--accent-soft); border-color: var(--accent-line); }
[data-module="product-catalog"] .fr-chip-no { color: var(--error); background: var(--error-soft); }
[data-module="product-catalog"] .fr-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.375rem;
}
[data-module="product-catalog"] .fr-filter {
  font: inherit;
  font-size: 0.75rem;
  font-weight: 500;
  padding: 0.25rem 0.625rem;
  border-radius: 20px;
  border: 1px solid var(--border);
  background: transparent;
  color: var(--text-secondary);
  cursor: pointer;
}
[data-module="product-catalog"] .fr-filter:hover { background: var(--row-hover); color: var(--text-primary); }
[data-module="product-catalog"] .fr-filter-on {
  background: var(--accent-soft);
  color: var(--accent);
  border-color: var(--accent);
  font-weight: 600;
}
[data-module="product-catalog"] .fr-filter-hint { color: var(--text-tertiary); font-weight: 400; }
[data-module="product-catalog"] .fr-list {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: 0.75rem 1.125rem 2rem;
}
[data-module="product-catalog"] .fr-trunc {
  font-size: 0.71875rem;
  color: var(--text-tertiary);
  margin: 0 0 0.5rem;
}
[data-module="product-catalog"] .fr-card {
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: var(--panel);
  margin-bottom: 0.5rem;
}
[data-module="product-catalog"] .fr-card-head {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.5rem 0.625rem;
  flex-wrap: wrap;
}
[data-module="product-catalog"] .fr-card-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.4375rem;
  background: transparent;
  border: none;
  color: inherit;
  font: inherit;
  cursor: pointer;
  padding: 0;
}
[data-module="product-catalog"] .fr-caret { color: var(--text-tertiary); }
[data-module="product-catalog"] .fr-mfr { font-weight: 600; color: var(--text-primary); font-size: 0.8125rem; }
[data-module="product-catalog"] .fr-stem {
  font-family: ui-monospace, SFMono-Regular, monospace;
  font-size: 0.6875rem;
  color: var(--text-tertiary);
  background: var(--panel-2);
  padding: 0.0625rem 0.375rem;
  border-radius: 3px;
  border: 1px solid var(--border);
}
[data-module="product-catalog"] .fr-headline { font-size: 0.78125rem; color: var(--text-secondary); }
[data-module="product-catalog"] .fr-cov { font-size: 0.6875rem; color: var(--text-tertiary); }
[data-module="product-catalog"] .fr-badge {
  font-size: 0.625rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--text-tertiary);
  background: var(--panel-2);
  border: 1px solid var(--border);
  padding: 0.0625rem 0.4375rem;
  border-radius: 10px;
}
[data-module="product-catalog"] .fr-badge-ok { color: var(--accent); background: var(--accent-soft); border-color: var(--accent-line); }
[data-module="product-catalog"] .fr-badge-no { color: var(--error); background: var(--error-soft); border-color: var(--error-soft); }
[data-module="product-catalog"] .fr-actions {
  margin-left: auto;
  display: flex;
  gap: 0.375rem;
}
[data-module="product-catalog"] .fr-actions button {
  font: inherit;
  font-size: 0.71875rem;
  font-weight: 500;
  padding: 0.25rem 0.625rem;
  border-radius: var(--button-radius);
  border: 1px solid var(--border);
  background: var(--panel-2);
  color: var(--text-primary);
  cursor: pointer;
}
[data-module="product-catalog"] .fr-actions button:hover { background: var(--row-hover); border-color: var(--border-strong); }
[data-module="product-catalog"] .fr-card-body { padding: 0 0.75rem 0.625rem; }
[data-module="product-catalog"] .fr-loading { color: var(--text-tertiary); font-size: 0.75rem; padding: 0.5rem 0; }
[data-module="product-catalog"] .fr-fam {
  border-top: 1px solid var(--border);
  padding: 0.5rem 0;
}
[data-module="product-catalog"] .fr-fam-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.4375rem; color: var(--text-primary); font-size: 0.8125rem; }
[data-module="product-catalog"] .fr-form { font-size: 0.6875rem; color: var(--text-secondary); background: var(--panel-2); padding: 0.0625rem 0.375rem; border-radius: 3px; }
[data-module="product-catalog"] .fr-roles { font-size: 0.6875rem; color: var(--accent); font-family: ui-monospace, SFMono-Regular, monospace; }
[data-module="product-catalog"] .fr-conf { font-size: 0.625rem; color: var(--text-tertiary); }
[data-module="product-catalog"] .fr-segs { font-size: 0.6875rem; color: var(--text-tertiary); margin: 0.1875rem 0; }
[data-module="product-catalog"] .fr-members {
  list-style: none;
  margin: 0.25rem 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.5rem;
}
[data-module="product-catalog"] .fr-members li {
  font-size: 0.71875rem;
  color: var(--text-secondary);
  background: var(--panel-2);
  border: 1px solid var(--border);
  border-radius: 3px;
  padding: 0.0625rem 0.4375rem;
}
[data-module="product-catalog"] .fr-standalone {
  margin-top: 0.5rem;
  font-size: 0.71875rem;
  color: var(--text-tertiary);
  font-style: italic;
}

[data-module="product-catalog"] .fr-actions .fr-btn-apply {
  background: var(--accent);
  color: var(--bg);
  border-color: var(--accent);
  font-weight: 600;
}
[data-module="product-catalog"] .fr-actions .fr-btn-apply:hover {
  background: var(--accent);
  border-color: var(--accent-line);
}

/* Curation Queue subview (two-tier plan Phase 3) --------------------- */
/* Tier 1: rendered inside the module container -- scoped.              */
[data-module="product-catalog"] .cq-root {
  padding: 1rem 1.25rem 2rem;
  max-width: 980px;
}
[data-module="product-catalog"] .cq-title {
  margin: 0.5rem 0 0.25rem;
  font-size: 1.25rem;
}
[data-module="product-catalog"] .cq-sub {
  margin: 0 0 0.75rem;
  color: var(--text-secondary);
  font-size: 0.8125rem;
  max-width: 64ch;
}
[data-module="product-catalog"] .cq-summary {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
  margin-bottom: 0.625rem;
}
[data-module="product-catalog"] .cq-chip {
  font-size: 0.71875rem;
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 0.125rem 0.625rem;
  color: var(--text-secondary);
}
[data-module="product-catalog"] .cq-chip-ok { color: var(--success); border-color: var(--success); }
[data-module="product-catalog"] .cq-chip-warn { color: var(--warning); border-color: var(--warning); }
[data-module="product-catalog"] .cq-filters {
  display: flex;
  gap: 0.375rem;
  flex-wrap: wrap;
  margin-bottom: 0.875rem;
}
[data-module="product-catalog"] .cq-filter {
  background: none;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  color: var(--text-secondary);
  font-size: 0.75rem;
  padding: 0.3125rem 0.75rem;
  cursor: pointer;
}
[data-module="product-catalog"] .cq-filter:hover { border-color: var(--border-strong); color: var(--text-primary); }
[data-module="product-catalog"] .cq-filter-on {
  border-color: var(--accent);
  color: var(--accent);
  background: var(--accent-soft);
}
[data-module="product-catalog"] .cq-filter-hint { color: var(--text-tertiary); }
/* Disposition chips (S4-disposition): same shape as the filter tabs, on their
   own row above them. Hidden in the Dismissed view. */
[data-module="product-catalog"] .cq-dispositions {
  display: flex;
  gap: 0.375rem;
  flex-wrap: wrap;
  margin-bottom: 0.5rem;
}
[data-module="product-catalog"] .cq-dispositions[hidden] { display: none; }
/* Summary arrow separator ("N active -> M families"): borderless, muted. */
[data-module="product-catalog"] .cq-chip-arrow {
  border: none;
  padding: 0.125rem 0.125rem;
  color: var(--text-tertiary);
}
/* Effective-disposition chip on a card (only shown for component/consumable). */
[data-module="product-catalog"] .cq-disp-chip {
  color: var(--text-tertiary);
  border-color: var(--border);
}
/* Selection bar (sticky above the list; visible only when >=1 selected) */
[data-module="product-catalog"] .cq-selbar {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
  padding: 0.5rem 0.75rem;
  margin-bottom: 0.5rem;
  border: 1px solid var(--accent);
  border-radius: var(--panel-radius);
  background: var(--accent-soft);
}
[data-module="product-catalog"] .cq-selbar[hidden] { display: none; }
[data-module="product-catalog"] .cq-selall {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.78125rem;
  color: var(--text-primary);
  cursor: pointer;
}
[data-module="product-catalog"] .cq-selbar-actions {
  display: flex;
  gap: 0.375rem;
  flex-wrap: wrap;
  margin-left: auto;
}
[data-module="product-catalog"] .cq-selbar-actions button {
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: var(--panel);
  color: var(--text-secondary);
  font-size: 0.75rem;
  padding: 0.25rem 0.625rem;
  cursor: pointer;
  min-height: 28px;
}
[data-module="product-catalog"] .cq-selbar-actions .btn-link {
  border: none;
  background: none;
  color: var(--accent);
  padding: 0.25rem 0.375rem;
}
[data-module="product-catalog"] .cq-card {
  border: 1px solid var(--border);
  border-radius: var(--panel-radius);
  background: var(--panel);
  margin-bottom: 0.5rem;
}
[data-module="product-catalog"] .cq-card-selected {
  border-color: var(--accent);
  background: var(--accent-soft);
}
/* Roving keyboard focus ring (S4-keyboard). Driven by the data attribute, not
   native :focus, so the ring is consistent whether focus arrived by key or
   click; suppress the default outline the tabindex=-1 card would otherwise show.
   var(--accent) reads in both themes. */
[data-module="product-catalog"] .cq-card:focus { outline: none; }
[data-module="product-catalog"] .cq-card[data-cq-focused] {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}
[data-module="product-catalog"] .cq-card-head {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding: 0.5rem 0.75rem;
  flex-wrap: wrap;
}
[data-module="product-catalog"] .cq-select {
  display: flex;
  align-items: center;
  cursor: pointer;
}
[data-module="product-catalog"] .cq-select input { cursor: pointer; width: 16px; height: 16px; }
[data-module="product-catalog"] .cq-card-toggle {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  background: none;
  border: none;
  color: var(--text-primary);
  cursor: pointer;
  padding: 0.25rem 0;
  text-align: left;
  min-width: 0;
  flex: 1 1 16rem;
}
[data-module="product-catalog"] .cq-caret { color: var(--text-tertiary); }
[data-module="product-catalog"] .cq-mfr {
  color: var(--text-secondary);
  font-size: 0.75rem;
  white-space: nowrap;
}
[data-module="product-catalog"] .cq-name {
  font-size: 0.84375rem;
  font-weight: 600;
  overflow-wrap: anywhere;
}
[data-module="product-catalog"] .cq-stats {
  display: flex;
  gap: 0.625rem;
  color: var(--text-tertiary);
  font-size: 0.71875rem;
  white-space: nowrap;
}
[data-module="product-catalog"] .cq-actions { display: flex; gap: 0.375rem; margin-left: auto; }
[data-module="product-catalog"] .cq-actions button {
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: none;
  color: var(--text-secondary);
  font-size: 0.75rem;
  padding: 0.25rem 0.625rem;
  cursor: pointer;
  min-height: 28px;
}
[data-module="product-catalog"] .cq-btn-promote {
  border-color: var(--accent);
  color: var(--accent);
}
[data-module="product-catalog"] .cq-btn-promote:hover { background: var(--accent-soft); }
[data-module="product-catalog"] .cq-btn-junk:hover { border-color: var(--error); color: var(--error); }
[data-module="product-catalog"] .cq-btn-sendback:hover { border-color: var(--warning); color: var(--warning); }
[data-module="product-catalog"] .cq-card-body { padding: 0 0.75rem; }
[data-module="product-catalog"] .cq-loading {
  color: var(--text-tertiary);
  font-size: 0.75rem;
  padding: 0.375rem 0 0.625rem;
}
[data-module="product-catalog"] .cq-skus {
  list-style: none;
  margin: 0 0 0.625rem;
  padding: 0.25rem 0 0;
  border-top: 1px solid var(--border);
}
[data-module="product-catalog"] .cq-skus li {
  display: flex;
  gap: 0.625rem;
  align-items: baseline;
  padding: 0.1875rem 0;
  font-size: 0.75rem;
}
[data-module="product-catalog"] .cq-pn {
  color: var(--accent);
  white-space: nowrap;
  font-size: 0.71875rem;
}
[data-module="product-catalog"] .cq-def {
  color: var(--text-secondary);
  overflow-wrap: anywhere;
}
[data-module="product-catalog"] .cq-more { padding: 0.75rem 0; }
[data-module="product-catalog"] .cq-more-btn {
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: none;
  color: var(--text-secondary);
  padding: 0.375rem 1rem;
  cursor: pointer;
}
@media (max-width: 640px) {
  [data-module="product-catalog"] .cq-stats { display: none; }
  [data-module="product-catalog"] .cq-actions { margin-left: 0; width: 100%; }
  [data-module="product-catalog"] .cq-actions button { min-height: 44px; flex: 1; }
}

/* AI-label provenance badge (rendered in-container: list rows + curation
   cards). Scoped Tier 1. */
[data-module="product-catalog"] .pc-ai-badge {
  display: inline-block;
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--warning);
  border: 1px solid var(--warning);
  border-radius: 3px;
  padding: 0 0.25rem;
  vertical-align: middle;
}
[data-module="product-catalog"] .pc-ai-badge-disputed {
  color: var(--error);
  border-color: var(--error);
}

/* Cutsheet-state badge (Gate 1 slate). One per family card; colors are theme
   tokens so both themes adapt without a separate [data-theme] block (mirrors
   pc-ai-badge). Semantics: current=success, unverified=accent (informational,
   NOT a currency claim), stale=warning, none=muted. */
[data-module="product-catalog"] .cq-cs-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.125rem 0.4375rem;
  border-radius: 10px;
  font-size: 0.65625rem;
  white-space: nowrap;
  border: 1px solid var(--border);
  background: var(--panel-2);
  color: var(--text-tertiary);
}
[data-module="product-catalog"] .cq-cs-current {
  color: var(--success);
  border-color: var(--success);
  background: var(--success-soft);
}
[data-module="product-catalog"] .cq-cs-unverified {
  color: var(--accent);
  border-color: var(--accent-line);
  background: var(--accent-soft);
}
[data-module="product-catalog"] .cq-cs-stale {
  color: var(--warning);
  border-color: var(--warning);
  background: var(--warning-soft);
}
[data-module="product-catalog"] .cq-cs-none {
  color: var(--text-tertiary);
  border-color: var(--border);
  background: var(--panel-2);
}

/* Promote dialog content (body-mounted via ctx.ui.modal, unscoped) ---- */
.pcq-promote { display: flex; flex-direction: column; gap: 0.75rem; }
.pcq-note {
  margin: 0;
  color: var(--text-secondary);
  font-size: 0.78125rem;
}
.pcq-field { display: flex; flex-direction: column; gap: 0.25rem; }
.pcq-field > span {
  font-size: 0.71875rem;
  color: var(--text-tertiary);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
.pcq-field input,
.pcq-field select,
.pcq-field textarea {
  background: var(--input-bg);
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  color: var(--text-primary);
  font-size: 16px;
  padding: 0.4375rem 0.625rem;
}
.pcq-field input:focus,
.pcq-field select:focus,
.pcq-field textarea:focus {
  outline: none;
  border-color: var(--accent);
}
.pcq-meta {
  color: var(--text-tertiary);
  font-size: 0.71875rem;
}
/* Series-sibling consolidation section in the promote modal (S4-consolidate).
   Body-mounted modal content -> unscoped Tier 2, same as .pcq-field above. */
.pcq-sibs {
  margin-top: 0.625rem;
  padding-top: 0.625rem;
  border-top: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.pcq-sib {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  font-size: 0.8125rem;
  color: var(--text-primary);
}
.pcq-sib-name { flex: 1 1 auto; }
.pcq-sib-meta {
  color: var(--text-tertiary);
  font-size: 0.71875rem;
  white-space: nowrap;
}

/* Keyboard-help modal content (body-mounted via ctx.ui.modal, unscoped Tier 2:
   a body-mounted modal does not match [data-module=...] rules). */
.cq-help-keys { display: flex; flex-direction: column; gap: 0.375rem; margin: 0; }
.cq-help-row { display: flex; align-items: baseline; gap: 0.75rem; }
.cq-help-row dt { flex: 0 0 6.5rem; display: flex; gap: 0.25rem; flex-wrap: wrap; }
.cq-help-row dd { margin: 0; color: var(--text-secondary); font-size: 0.8125rem; }
.cq-help-keys kbd {
  font-family: inherit;
  font-size: 0.6875rem;
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 0.0625rem 0.3125rem;
  background: var(--panel-2);
  color: var(--text-primary);
}

/* Post-merge curation fixes ------------------------------------------ */
/* .btn-link had no definition anywhere -- the subview back buttons
   rendered as raw user-agent buttons (curation queue + family review +
   gate2 cutsheet approvals). margin-right spaces consecutive header
   buttons (e.g. curation's Back + Cutsheet approvals) so they don't touch. */
[data-module="product-catalog"] .cq-head .btn-link,
[data-module="product-catalog"] .fr-head .btn-link,
[data-module="product-catalog"] .g2-head .btn-link {
  background: none;
  border: none;
  padding: 0;
  margin-right: 1rem;
  color: var(--accent);
  font-size: 0.78125rem;
  cursor: pointer;
}
[data-module="product-catalog"] .cq-head .btn-link:hover,
[data-module="product-catalog"] .fr-head .btn-link:hover,
[data-module="product-catalog"] .g2-head .btn-link:hover {
  text-decoration: underline;
}

/* Kick-back feedback line on a queue card. */
[data-module="product-catalog"] .cq-note {
  margin: 0 0.75rem 0.375rem 2rem;
  padding: 0.25rem 0.5rem;
  font-size: 0.71875rem;
  color: var(--warning);
  border-left: 2px solid var(--warning);
  background: var(--row-hover);
  overflow-wrap: anywhere;
}

/* ---- Gate-2 approve queue (gate2.js) -------------------------------- */
/* Wide layout (owner feedback 2026-07-14): the page hugged ~750px of a wide
   viewport. TWO causes: a 60rem cap, and -- the real trap -- margin:0 auto on
   a child of the module's column FLEX container, where auto margins override
   the default stretch and shrink the child to CONTENT width (so no max-width
   ever applied). width:100% restores stretch; the soft cap keeps ultra-wide
   monitors from stretching cards into unreadable slabs. */
[data-module="product-catalog"] .g2-root { width: 100%; max-width: 100rem; margin: 0 auto; padding: 0 1.5rem; box-sizing: border-box; }
/* In-flight approve: the whole card dims + its buttons disable while bytes
   move and the image extracts (seconds), so the confirm visibly "took". */
[data-module="product-catalog"] .g2-card-busy { opacity: 0.55; cursor: progress; }
[data-module="product-catalog"] .g2-card-busy .g2-btn-approve { font-style: italic; }
[data-module="product-catalog"] .g2-head { margin-bottom: 1rem; }
/* Admin "Run robot" acquisition trigger, next to the header back-link. Accent
   outline (mirrors .cq-btn-promote); disabled = nothing queued / in flight. */
[data-module="product-catalog"] .g2-btn-robot {
  padding: 0.25rem 0.625rem;
  font-size: 0.78125rem;
  border: 1px solid var(--accent);
  border-radius: 6px;
  background: none;
  color: var(--accent);
  cursor: pointer;
}
[data-module="product-catalog"] .g2-btn-robot:hover:not(:disabled) { background: var(--accent-soft); }
[data-module="product-catalog"] .g2-btn-robot:disabled { opacity: 0.55; cursor: default; }
[data-module="product-catalog"] .g2-title { margin: 0.5rem 0 0.25rem; font-size: 1.125rem; }
[data-module="product-catalog"] .g2-sub {
  margin: 0;
  color: var(--text-secondary);
  font-size: 0.8125rem;
  max-width: 44rem;
}
[data-module="product-catalog"] .g2-card {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  border: 1px solid var(--border);
  border-radius: var(--panel-radius);
  background: var(--panel);
  padding: 0.625rem 0.75rem;
  margin-bottom: 0.5rem;
  flex-wrap: wrap;
}
[data-module="product-catalog"] .g2-card-main { flex: 1 1 22rem; min-width: 0; }
[data-module="product-catalog"] .g2-card-title {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  flex-wrap: wrap;
}
[data-module="product-catalog"] .g2-mfr { color: var(--text-secondary); font-size: 0.75rem; white-space: nowrap; }
[data-module="product-catalog"] .g2-name { font-size: 0.84375rem; font-weight: 600; overflow-wrap: anywhere; }
[data-module="product-catalog"] .g2-method {
  font-size: 0.625rem;
  color: var(--text-tertiary);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 0 0.3125rem;
}
[data-module="product-catalog"] .g2-triage {
  display: inline-flex;
  align-items: center;
  padding: 0.125rem 0.4375rem;
  border-radius: 10px;
  font-size: 0.65625rem;
  white-space: nowrap;
  border: 1px solid var(--border);
  background: var(--panel-2);
  color: var(--text-tertiary);
}
[data-module="product-catalog"] .g2-triage-ready {
  color: var(--success);
  border-color: var(--success);
  background: var(--success-soft);
}
[data-module="product-catalog"] .g2-triage-check {
  color: var(--warning);
  border-color: var(--warning);
  background: var(--warning-soft);
}
[data-module="product-catalog"] .g2-triage-review {
  color: var(--error);
  border-color: var(--error);
  background: var(--error-soft);
}
[data-module="product-catalog"] .g2-evidence {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-top: 0.375rem;
  flex-wrap: wrap;
  font-size: 0.71875rem;
  color: var(--text-tertiary);
}
[data-module="product-catalog"] .g2-doubt { color: var(--text-secondary); overflow-wrap: anywhere; }
[data-module="product-catalog"] .g2-src { color: var(--accent); white-space: nowrap; }
[data-module="product-catalog"] .g2-actions {
  display: flex;
  gap: 0.375rem;
  margin-left: auto;
  align-items: center;
}
[data-module="product-catalog"] .g2-actions button {
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: none;
  color: var(--text-secondary);
  padding: 0.25rem 0.625rem;
  font-size: 0.75rem;
  cursor: pointer;
}
[data-module="product-catalog"] .g2-actions button:hover { border-color: var(--accent); color: var(--text-primary); }
/* Approve is the primary action: accent-tinted so it out-reads the outlined Preview/Reject.
   Specificity note: must out-rank `.g2-actions button` (which has an element selector), so
   scope through .g2-actions and keep the button type selector. Tokens only (no literal). */
[data-module="product-catalog"] .g2-actions button.g2-btn-approve {
  border-color: var(--accent);
  color: var(--accent);
  background: var(--accent-soft);
  font-weight: 600;
}
[data-module="product-catalog"] .g2-actions button.g2-btn-approve:hover {
  border-color: var(--accent);
  color: var(--accent);
  background: var(--accent-soft);
  filter: brightness(1.12);
}
[data-module="product-catalog"] .g2-btn-reject:hover { border-color: var(--error); color: var(--error); }
[data-module="product-catalog"] .g2-nopreview { font-size: 0.6875rem; color: var(--text-tertiary); }
[data-module="product-catalog"] .g2-more-btn {
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: none;
  color: var(--text-secondary);
  padding: 0.375rem 1rem;
  cursor: pointer;
  margin: 0.5rem auto;
  display: block;
}
/* Gate-2 view tabs (Ready for approval / Needs attention). */
[data-module="product-catalog"] .g2-tabs {
  display: flex;
  gap: 0.375rem;
  margin-top: 0.75rem;
  border-bottom: 1px solid var(--border);
}
[data-module="product-catalog"] .g2-tab {
  border: 1px solid transparent;
  border-bottom: none;
  border-radius: 6px 6px 0 0;
  background: none;
  color: var(--text-secondary);
  padding: 0.375rem 0.75rem;
  font-size: 0.78125rem;
  cursor: pointer;
  margin-bottom: -1px;
}
[data-module="product-catalog"] .g2-tab:hover { color: var(--text-primary); }
[data-module="product-catalog"] .g2-tab.is-active {
  color: var(--accent);
  border-color: var(--border);
  border-bottom: 1px solid var(--panel);
  background: var(--panel);
  font-weight: 600;
}

/* Batch-approve bar above the Ready grid. */
[data-module="product-catalog"] .g2-batchbar {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
}
[data-module="product-catalog"] .g2-batchbar:empty { display: none; }
[data-module="product-catalog"] .g2-selall {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.75rem;
  color: var(--text-secondary);
  cursor: pointer;
}
[data-module="product-catalog"] .g2-batch-btn {
  border: 1px solid var(--accent);
  border-radius: var(--button-radius);
  background: var(--accent-soft);
  color: var(--accent);
  font-weight: 600;
  padding: 0.3125rem 0.75rem;
  font-size: 0.78125rem;
  cursor: pointer;
}
[data-module="product-catalog"] .g2-batch-btn:hover:not(:disabled) { filter: brightness(1.12); }
[data-module="product-catalog"] .g2-batch-btn:disabled { opacity: 0.55; cursor: default; }

/* The list container is roving-focus target -- suppress the default outline in
   favor of the per-cell .g2-focused ring. */
[data-module="product-catalog"] .g2-list { outline: none; }

/* Ready grid: compact thumbnail cards. */
[data-module="product-catalog"] .g2-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr));
  gap: 0.75rem;
  margin: 0.75rem 0;
}
[data-module="product-catalog"] .g2-cell {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
  border: 1px solid var(--border);
  border-radius: var(--panel-radius);
  background: var(--panel);
  padding: 0.5rem;
  outline: none;
}
[data-module="product-catalog"] .g2-cell.g2-focused,
[data-module="product-catalog"] .g2-card.g2-focused {
  border-color: var(--accent);
  box-shadow: 0 0 0 2px var(--accent-soft);
}
[data-module="product-catalog"] .g2-cell-check {
  position: absolute;
  top: 0.5rem;
  left: 0.5rem;
  background: var(--panel-2);
  border-radius: 4px;
  padding: 0.125rem 0.25rem;
  cursor: pointer;
}
[data-module="product-catalog"] .g2-cell-thumb {
  width: 100%;
  height: auto;
  max-height: 12rem;
  object-fit: contain;
  border-radius: 4px;
  background: var(--panel-2);
}
[data-module="product-catalog"] .g2-cell-meta {
  display: flex;
  flex-direction: column;
  gap: 0.1875rem;
  min-width: 0;
}
[data-module="product-catalog"] .g2-cell-badges {
  display: flex;
  gap: 0.375rem;
  flex-wrap: wrap;
  align-items: center;
}
[data-module="product-catalog"] .g2-domain {
  font-size: 0.625rem;
  color: var(--text-tertiary);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 0 0.3125rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 8rem;
}
[data-module="product-catalog"] .g2-cell-actions {
  display: flex;
  flex-wrap: wrap; /* three actions (Preview/Reject/Approve) must never clip the cell */
  gap: 0.375rem;
  margin-top: auto;
}
[data-module="product-catalog"] .g2-cell-actions button {
  flex: 1 1 auto;
  border: 1px solid var(--border);
  border-radius: var(--button-radius);
  background: none;
  color: var(--text-secondary);
  padding: 0.25rem 0.5rem;
  font-size: 0.71875rem;
  cursor: pointer;
}
[data-module="product-catalog"] .g2-cell-actions button:hover { border-color: var(--accent); color: var(--text-primary); }
[data-module="product-catalog"] .g2-cell-actions button.g2-btn-approve {
  border-color: var(--accent);
  color: var(--accent);
  background: var(--accent-soft);
  font-weight: 600;
}

@media (max-width: 640px) {
  [data-module="product-catalog"] .g2-card { flex-direction: column; }
  [data-module="product-catalog"] .g2-actions { margin-left: 0; }
  [data-module="product-catalog"] .g2-grid { grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr)); }
}
