/* All display rules are scoped to this product enhancement and its image dialog. */
.dg-shaft-collars .dg-sc-native-picker,
.dg-shaft-collars .dg-sc-native-gallery { display: none !important; }
.dg-shaft-collars .product-detail__main { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 40px; align-items: start; }
.dg-shaft-collars .product-detail__main > .product-detail__col { width: 100%; min-width: 0; }
.dg-shaft-collars .product-detail__media-group { position: sticky; top: 24px; }
.dg-shaft-collars .product-detail__info { min-width: 0; }
.dg-shaft-collars .dg-sc-gallery { width: 100%; }
.dg-shaft-collars .dg-sc-main-image { position: relative; display: flex; align-items: center; justify-content: center; width: 100%; padding: 8px; aspect-ratio: 1; border: 1px solid #e0e4e8; background: #fff; border-radius: 12px; cursor: zoom-in; overflow: hidden; }
.dg-shaft-collars .dg-sc-main-image img { width: 100%; height: 100%; object-fit: contain; }
.dg-shaft-collars .dg-sc-zoom-label { position: absolute; right: 12px; bottom: 12px; padding: 7px 12px; border: 1px solid #dde3e9; border-radius: 20px; background: rgba(255,255,255,.95); color: #30343b; font-size: 12px; font-weight: 600; }
.dg-shaft-collars .dg-sc-selected-thumbnail { display: block; width: 74px; height: 74px; padding: 4px; margin-top: 12px; border: 2px solid #ed650c; border-radius: 8px; background: #fff; cursor: zoom-in; }
.dg-shaft-collars .dg-sc-selected-thumbnail img { display: block; width: 100%; height: 100%; object-fit: contain; }
.dg-shaft-collars .dg-sc-caption { margin: 14px 0 5px; color: #30343b; font-size: 16px; font-weight: 650; line-height: 1.45; }
.dg-shaft-collars .dg-sc-source-note { margin: 0; color: #5c6975; font-size: 12px; line-height: 1.5; }
.dg-shaft-collars .dg-sc-selector { min-width: 0; width: 100%; }
.dg-shaft-collars .dg-sc-selector-title { margin: 0 0 6px; color: #30343b; font-size: 20px; font-weight: 700; line-height: 1.3; }
.dg-shaft-collars .dg-sc-selector-intro { margin: 0 0 12px; color: #5c6975; font-size: 13px; line-height: 1.5; }
.dg-shaft-collars .dg-sc-selection { min-height: 42px; margin: 0 0 10px; padding: 10px 12px; border-radius: 6px; background: #fff4e9; color: #a64100; font-size: 13px; line-height: 1.5; font-weight: 600; }
.dg-shaft-collars .dg-sc-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9px; max-height: 580px; overflow: auto; overscroll-behavior: contain; padding: 3px 8px 3px 3px; scrollbar-gutter: stable; }
.dg-shaft-collars .dg-sc-option { display: flex; flex-direction: column; align-items: stretch; gap: 5px; min-width: 0; padding: 8px; border: 1px solid #dce2e7; border-radius: 8px; background: #fff; color: #30343b; cursor: pointer; text-align: left; font-family: inherit; line-height: 1.4; }
.dg-shaft-collars .dg-sc-option:hover { border-color: #ed650c; background: #fff8f2; }
.dg-shaft-collars .dg-sc-option.is-selected { border: 2px solid #ed650c; padding: 7px; background: #fff4e9; box-shadow: 0 0 0 1px #ed650c; }
.dg-shaft-collars .dg-sc-option-image { display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; border-radius: 4px; background: #fff; }
.dg-shaft-collars .dg-sc-option-size { font-size: 12px; font-weight: 700; overflow-wrap: anywhere; }
.dg-shaft-collars .dg-sc-option-design { color: #5c6975; font-size: 11px; }
.dg-shaft-collars .dg-sc-schematic-label { color: #714d16; font-size: 10px; font-weight: 600; }
.dg-shaft-collars .dg-sc-availability { color: #923c35; font-size: 11px; }
.dg-shaft-collars button:focus-visible,
.dg-shaft-collars .dg-sc-detail-image:focus-visible { outline: 3px solid #ed650c; outline-offset: 3px; }
.dg-shaft-collars .dg-sc-detail-image { cursor: zoom-in; }
.dg-shaft-collars.dg-sc-zoom { position: fixed; inset: 0; width: min(1440px, calc(100vw - 32px)); height: calc(100dvh - 32px); max-width: none; max-height: none; padding: 0; margin: auto; border: 0; border-radius: 12px; background: #f4f6f8; color: #30343b; overflow: hidden; }
.dg-shaft-collars.dg-sc-zoom[open] { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; }
.dg-shaft-collars.dg-sc-zoom::backdrop { background: rgba(7,18,30,.82); }
.dg-shaft-collars .dg-sc-zoom-toolbar { display: flex; gap: 12px; align-items: center; justify-content: space-between; padding: 14px 18px; background: #fff; border-bottom: 1px solid #e0e4e8; z-index: 1; }
.dg-shaft-collars .dg-sc-zoom-title { margin: 0; font-size: 14px; font-weight: 650; line-height: 1.4; }
.dg-shaft-collars .dg-sc-zoom-controls { display: flex; flex-shrink: 0; align-items: center; gap: 7px; }
.dg-shaft-collars .dg-sc-zoom-controls button { min-width: 40px; min-height: 40px; padding: 6px 12px; border: 1px solid #cdd7e0; border-radius: 6px; background: #fff; color: #30343b; cursor: pointer; font: inherit; font-size: 14px; }
.dg-shaft-collars .dg-sc-zoom-controls button:disabled { opacity: .4; cursor: default; }
.dg-shaft-collars .dg-sc-zoom-percent { min-width: 45px; font-size: 12px; text-align: center; }
.dg-shaft-collars .dg-sc-zoom-stage { display: flex; align-items: center; justify-content: center; min-width: 0; min-height: 0; overflow: hidden; touch-action: none; user-select: none; }
.dg-shaft-collars .dg-sc-zoom-stage.is-zoomed { cursor: grab; }
.dg-shaft-collars .dg-sc-zoom-stage.is-zoomed:active { cursor: grabbing; }
.dg-shaft-collars .dg-sc-zoom-image { display: block; max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; transform-origin: center; will-change: transform; pointer-events: none; }
.dg-shaft-collars .dg-sc-zoom-hint { margin: 0; padding: 10px; background: #fff; color: #596877; font-size: 12px; text-align: center; z-index: 1; }
.dg-shaft-collars [hidden] { display: none !important; }
@media (max-width: 959px) {
  .dg-shaft-collars .product-detail__main { grid-template-columns: minmax(0, 1fr); gap: 28px; }
  .dg-shaft-collars .product-detail__media-group { position: static; }
  .dg-shaft-collars .dg-sc-main-image { max-height: 520px; }
  .dg-shaft-collars .dg-sc-grid { max-height: 520px; }
}
@media (max-width: 540px) {
  .dg-shaft-collars .dg-sc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); max-height: 460px; }
  .dg-shaft-collars.dg-sc-zoom { width: 100vw; height: 100dvh; border-radius: 0; }
  .dg-shaft-collars .dg-sc-zoom-toolbar { flex-direction: column; align-items: stretch; padding: 12px; }
  .dg-shaft-collars .dg-sc-zoom-controls { justify-content: flex-end; }
  .dg-shaft-collars .dg-sc-zoom-hint { font-size: 11px; }
}

/* Match the approved compact selector and paired native purchase buttons. */
.dg-shaft-collars .dg-sc-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-height:420px}
.dg-shaft-collars .dg-sc-option{display:grid;grid-template-columns:44px minmax(0,1fr);column-gap:8px;row-gap:3px;align-content:center;padding:8px}
.dg-shaft-collars .dg-sc-option.is-selected{padding:7px}
.dg-shaft-collars .dg-sc-option-image{width:44px;height:44px;grid-row:1 / span 4;align-self:center}
.dg-shaft-collars .dg-sc-option-size,.dg-shaft-collars .dg-sc-option-design,.dg-shaft-collars .dg-sc-option-price,.dg-shaft-collars .dg-sc-schematic-label,.dg-shaft-collars .dg-sc-availability{grid-column:2}
.dg-shaft-collars .dg-sc-option-price{font-size:12px;font-weight:600;color:#a64100}
.dg-shaft-collars .dg-sc-selector>.dg-sc-selected-thumbnail{float:left;margin:0 14px 12px 0}
.dg-shaft-collars .dg-sc-grid{clear:both}
.dg-shaft-collars .product-detail__buy-button-group{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;align-items:end}
.dg-shaft-collars .product-detail__buy-button-group>div{display:contents!important}
.dg-shaft-collars .product-detail__buy-button-group .quantity-selector__input{grid-column:1 / -1}
.dg-shaft-collars .product-detail__buy-button-group theme-product-form{min-width:0;width:100%}
.dg-shaft-collars .product-detail__buy-button-group button{width:100%;min-height:48px}
.dg-shaft-collars .product-detail__buy-button-group .payment-button-wrapper{align-self:end}
@media(max-width:540px){.dg-shaft-collars .dg-sc-option{grid-template-columns:32px minmax(0,1fr);column-gap:6px}.dg-shaft-collars .dg-sc-option-image{width:32px;height:32px}}
