/* =========================================================
   Single Product Page — DC Supplies Theme (ULTRA-CLEAN)
   ========================================================= */

/* ---------- RESPONSIVE SAFETY NET ----------
   Defensive rules that don't depend on the theme's global
   stylesheet. box-sizing keeps padding/border from adding to
   declared widths inside this section's grids, and the img
   rule stops arbitrary content (short-description bullets,
   promo banners pasted into the WYSIWYG editor, spec-table
   images, etc.) from forcing horizontal overflow on tablet
   and phone, which is the single biggest cause of a "broken"
   mobile layout on WooCommerce product pages. */
   .single-product-wrapper,
   .single-product-wrapper *,
   .single-product-wrapper *::before,
   .single-product-wrapper *::after {
       box-sizing: border-box;
   }
   
   .single-product-wrapper img,
   .single-product-wrapper svg,
   .single-product-wrapper iframe,
   .single-product-wrapper video,
   .single-product-wrapper table {
       max-width: 100%;
   }
   
   .single-product-wrapper img {
       height: auto;
   }
   
   /* Grid/flex children default to min-width: auto, which means their
      min-content size (an unbroken string, a slider track with an
      inline JS-computed width, a fixed-width embed) can silently force
      the whole track wider than its minmax() cap — the browser just
      grows the column and clips whatever doesn't fit, which is exactly
      what a sliced-off search icon or share icon looks like. Force
      every direct grid/flex item in this section back down to the
      available space. */
   .single-product-wrapper,
   .single-product-left,
   .single-product-left > *,
   .single-product-sidebar > *,
   .product-buybox,
   .product-bestsellers,
   .product-enterprise-support {
       min-width: 0;
   }
   
   .single-product-wrapper {
       overflow-x: hidden;
   }
   
      .single-product-wrapper{
   
       /* This is now the outer page grid for the whole product overview:
          column 1 holds the main product box AND (below it) Related
          Products; column 2 is the sidebar, which spans both of those
          rows so it can run alongside Related Products too when it's
          tall (e.g. buy box + best sellers). */
       max-width: 1400px;
       margin: 40px auto;
       padding: 0 20px;
   
       display: grid;
       grid-template-columns: minmax(0, 1fr) 340px;
       grid-template-rows: auto auto;
       gap: 32px;
       align-items: start;
   
   }
   
   .single-product-layout{
   
       /* Just the main product box now — no longer a grid of its own. */
       grid-column: 1;
       grid-row: 1;
       min-width: 0;
   
   }
   
   /* ========== MAIN PRODUCT BOX (breadcrumb + image + summary, single card) ==========
      This is the actual visible "card" for the product overview. The
      breadcrumb is its first grid item, pinned to grid-row 1 and spanning
      both columns so it sits above the title but still inside the card;
      the gallery and summary auto-flow into row 2, side by side. Applies
      to every product automatically since this is the shared WooCommerce
      single-product template — no per-product changes needed. */
   .single-product-left{
       display: grid;
       grid-template-columns: minmax(240px, 400px) minmax(220px, 400px);
       grid-template-rows: auto auto;
       column-gap: 32px;
       row-gap: 18px;
       align-items: start;
       width: 100%;
       max-width: 100%;
   
       background: #FFFFFF;
       border: 1px solid #ECECEC;
       border-radius: 12px;
       box-shadow: 0 2px 10px rgba(15, 23, 42, 0.05);
       padding: 28px;
   }
   
   /* ========== BREADCRUMB (inside the card, above the title) ========== */
   
   .single-product__breadcrumb {
       grid-column: 1 / -1;
       grid-row: 1;
       margin: 0 0 4px;
       padding: 0;
   }
   
   .single-product__breadcrumb-trail,
   .single-product__breadcrumb-trail a {
       font-size: 13px;
       color: #6B6B6B;
       text-decoration: none;
       overflow-wrap: break-word;
   }
   
   .single-product__breadcrumb-trail a:hover {
       color: #9B1E22;
       text-decoration: underline;
   }
   
   .single-product__breadcrumb-sep {
       margin: 0 6px;
       color: #B5B5B5;
   }
   
   /* ========== GALLERY ========== */
   
   .single-product__gallery-card {
       grid-column: 1;
       grid-row: 2;
       min-width: 0;
   }
   
   .single-product__summary-card {
       grid-column: 2;
       grid-row: 2;
       min-width: 0;
       display: flex;
       flex-direction: column;
   }
   
   /* ========== SIDEBAR (completely separate box, runs alongside
      both the product box row AND the Related Products row) ========== */
   .single-product-sidebar {
       grid-column: 2;
       grid-row: 1 / span 2;
   
       width: 340px;
       min-width: 0;
       align-self: start;
       position: sticky;
       top: 24px;
       display: flex;
       flex-direction: column;
       gap: 16px;
   }
   
   /* The gallery and summary no longer have their own borders — they now
      live inside the single .single-product-left card above. */
   .single-product__gallery-card,
   .single-product__summary-card {
       background: transparent;
       border: none;
       border-radius: 0;
       padding: 0;
   }
   
   .single-product__gallery-card img {
       width: 100%;
       max-width: 100%;
       max-height: 520px;
       object-fit: contain;
       display: block;
       margin: 0 auto;
   }
   .woocommerce-product-gallery {
       width: 100%;
       overflow: hidden;
   }
   
   .woocommerce-product-gallery__wrapper {
       overflow: hidden;
   }
   
   .woocommerce-product-gallery__image {
       display: flex;
       justify-content: center;
       align-items: center;
   }
   
   .woocommerce-product-gallery__image img {
       width: 100%;
       max-width: 100%;
       height: auto;
       object-fit: contain;
       display: block;
   }
   
   .single-product__gallery .flex-control-thumbs {
       display: flex;
       flex-wrap: wrap;
       gap: 8px;
       list-style: none;
       margin-top: 22px;
       padding: 0;
       justify-content: center;
   }
   
   .single-product__gallery .flex-control-thumbs li {
       width: 64px;
       height: 64px;
       list-style: none;
   }
   
   .single-product__gallery .flex-control-thumbs img {
       width: 100%;
       height: 100%;
       object-fit: contain;
       border: 1px solid #E2E2E2;
       border-radius: 3px;
       cursor: pointer;
       transition: border-color 0.15s ease;
   }
   
   .single-product__gallery .flex-control-thumbs img.flex-active,
   .single-product__gallery .flex-control-thumbs img:hover {
       border-color: #9B1E22;
   }
   
   /* main page css */
   .single-product__gallery .woocommerce-product-gallery__trigger {
       display: none;
       }
   
   
   /* ========== SUMMARY ========== */
   .single-product__summary {
       display: flex;
       flex-direction: column;
       min-width: 0;
   }
   
   .single-product__summary > * {
       min-width: 0;
   }
   
   .single-product__summary .woocommerce-breadcrumb {
       font-size: 13px;
       color: #6E6E6E;
       margin-bottom: 12px;
   }
   
   .single-product__summary .woocommerce-breadcrumb a {
       color: #9B1E22;
       text-decoration: none;
   }
   
   .product-title {
       font-size: 22px;
       line-height: 1.35;
       font-weight: 700;
       margin: 0 0 8px;
       color: #101C28;
       overflow-wrap: break-word;
       word-break: break-word;
   }
   
   .product-sku {
       font-size: 13px;
       color: #6E6E6E;
       margin: 0 0 4px;
      
   }
   p.product-info-list__line {
       margin-top: 9px;
   }
   
   p.product-info-list__line > span:first-child {
       margin-right: 4px;
   }
   
   .product-info-list__line--sku {
       display: flex;
       align-items: center;
       justify-content: space-between;
       gap: 12px;
       flex-wrap: wrap;
   }
   
   .product-info-list__sku-text {
       color: inherit;
   }
   
   .product-info-list__write-review {
       display: inline-flex;
       align-items: center;
       gap: 6px;
       padding: 7px 14px;
       border: 1px solid #9B1E22;
       border-radius: 20px;
       background: #FFFFFF;
       color: #9B1E22;
       font-size: 12px;
       font-weight: 700;
       text-decoration: none;
       white-space: nowrap;
       transition: background 0.15s ease, color 0.15s ease;
   }
   
   .product-info-list__write-review svg {
       flex: 0 0 auto;
   }
   
   .product-info-list__write-review:hover {
       background: #9B1E22;
       color: #FFFFFF;
       text-decoration: none;
   }
   
   .product-review-summary {
       display: flex;
       align-items: center;
       flex-wrap: wrap;
       gap: 8px;
   }
   
   .product-info-list {
       margin-top: 12px;
   }
   
   .product-sku span {
       font-weight: 600;
       color: #12181E;
   }
   
   /* ========== PRICE & STOCK ========== */
   .product-price {
       background: #FFFFFF;
       border: 1px solid #E2E2E2;
       border-radius: 6px;
       padding: 16px;
       margin: 16px 0 0;
       font-size: 28px;
       font-weight: 700;
       color: #9B1E22;
   }
   
   .product-price del {
       font-size: 16px;
       color: #6E6E6E;
       font-weight: 400;
       margin-right: 8px;
   }
   
   .product-price ins {
       text-decoration: none;
   }
   
   .product-stock {
       padding: 0 16px;
       margin-top: -4px;
   }
   
   .product-stock .in-stock {
       color: #1a7d3a;
       font-weight: 600;
       font-size: 14px;
       margin: 8px 0;
   }
   
   .product-stock .out-of-stock {
       color: #9B1E22;
       font-weight: 600;
       font-size: 14px;
       margin: 8px 0;
   }
   
   /* ========== ADD TO CART ========== */
   .product-add-to-cart {
       border: 1px solid #E2E2E2;
       border-top: none;
       border-radius: 0 0 6px 6px;
       padding: 16px;
       margin-bottom: 16px;
   }
   
   .product-add-to-cart .quantity {
       margin-right: 12px;
   }
   
   .product-add-to-cart .quantity input {
       width: 60px;
       padding: 10px 8px;
       border: 1px solid #E2E2E2;
       border-radius: 4px;
   }
   
   .product-add-to-cart .button,
   .product-add-to-cart button[type="submit"] {
       background: #9B1E22;
       color: #FFFFFF;
       border: none;
       padding: 12px 28px;
       font-weight: 700;
       font-size: 15px;
       border-radius: 4px;
       cursor: pointer;
       transition: background 0.15s ease;
   }
   
   .product-add-to-cart .button:hover,
   .product-add-to-cart button[type="submit"]:hover {
       background: #7A171B;
   }
   
   .product-short-description {
       font-size: 14px;
       line-height: 1.6;
       color: #12181E;
       margin-bottom: 16px;
   }
   
   .product-short-description ul {
       padding-left: 18px;
   }
   
   /* ========== SHARE ========== */
   .product-share {
       display: flex;
       align-items: center;
       flex-wrap: wrap;
       gap: 10px;
       margin: 20px 0 16px;
       max-width: 100%;
       justify-content: center;
   }
   
   .product-share__label {
       font-size: 13px;
       font-weight: 600;
       color: #6E6E6E;
   }
   
   .product-share__icon {
       display: inline-flex;
       align-items: center;
       justify-content: center;
       width: 28px;
       height: 28px;
       border-radius: 50%;
       border: 1px solid #E2E2E2;
       color: #6E6E6E;
       background: #FFFFFF;
       transition: background 0.15s, color 0.15s, border-color 0.15s;
   }
   
   .product-share__icon:hover {
       border-color: #9B1E22;
       color: #FFFFFF;
       background: #9B1E22;
   }
   
   .single-product__summary .product_meta {
       font-size: 13px;
       color: #6E6E6E;
       border-top: 1px solid #E2E2E2;
       padding-top: 12px;
   }
   
   .single-product__summary .product_meta a {
       color: #9B1E22;
   }
   
   /* ========== BUY BOX (Right Sidebar) ========== */
   .product-buybox {
       /* No sticky/top/z-index here — .single-product-sidebar (the parent)
          already owns sticky positioning. A second sticky context on the
          child was redundant and fought with the parent's offset. */
       display: flex;
       flex-direction: column;
       gap: 14px;
       padding: 20px;
       border: 1px solid #E2E2E2;
       border-radius: 8px;
       background: #FFFFFF;
       box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
   }
   
   .product-buybox__badges {
       display: flex;
       flex-wrap: wrap;
       gap: 8px;
   }
   
   .product-buybox__badge {
       display: inline-flex;
       align-items: center;
       gap: 8px;
       padding: 6px 12px;
       border-radius: 20px;
       font-size: 13px;
       font-weight: 700;
       text-decoration: none;
       cursor: pointer;
       transition: background 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
   }
   
   .product-buybox__badge svg {
       flex: 0 0 auto;
   }
   
   .product-buybox__badge--payment {
       background: #eaf1fb;
       color: #1d5fad;
   }
   
   .product-buybox__badge--payment:hover {
       background: #1d5fad;
       color: #FFFFFF;
       text-decoration: none;
   }
   
   .product-buybox__badge--shipping {
       background: #e8f5e9;
       color: #1a7d3a;
   }
   
   .product-buybox__badge--shipping:hover {
       background: #1a7d3a;
       color: #FFFFFF;
       text-decoration: none;
   }
   
   .product-buybox__stock {
       display: flex;
       align-items: center;
       flex-wrap: wrap;
       gap: 8px;
   }
   
   .product-buybox__stock-badge {
       font-size: 13px;
       font-weight: 700;
   }
   
   .product-buybox__stock-badge--in {
       color: #1a7d3a;
   }
   
   .product-buybox__stock-badge--out {
       color: #9B1E22;
   }
   
   .product-buybox__stock-note {
       font-size: 12px;
       color: var(--text-secondary, #6E6E6E);
   }
   
   .product-buybox__price {
       padding-top: 10px;
       border-top: 1px solid var(--border, #E2E2E2);
       font-size: 30px;
       font-weight: 700;
       line-height: 1.2;
       color: #9B1E22;
   }
   
   .product-buybox__price del {
       margin-right: 8px;
       font-size: 16px;
       font-weight: 400;
       color: #6E6E6E;
   }
   
   .product-buybox__price ins {
       text-decoration: none;
   }
   
   .product-buybox__form .cart {
       display: flex;
       flex-wrap: wrap;
       align-items: center;
       gap: 12px;
   }
   
   .product-buybox__form .quantity {
       margin: 0;
       display: inline-flex;
       align-items: stretch;
       height: 44px;
       border: 1px solid #E2E2E2;
       border-radius: 6px;
       background: #FCFAF8;
       overflow: hidden;
       transition: border-color 0.15s ease, box-shadow 0.15s ease;
   }
   
   .product-buybox__form .quantity:focus-within {
       border-color: #9B1E22;
       box-shadow: 0 0 0 3px rgba(206,0,0,0.15);
   }
   
   /* Custom step buttons, injected by JS next to the native <input class="qty">.
      Kept as siblings (not wrapping the input) so the markup WooCommerce/plugins
      expect for the quantity field is left completely intact. */
   .dc-qty-btn {
       flex: 0 0 34px;
       width: 34px;
       border: 0;
       background: transparent;
       color: #6E6E6E;
       font-size: 17px;
       line-height: 1;
       cursor: pointer;
       display: flex;
       align-items: center;
       justify-content: center;
       -webkit-user-select: none;
       user-select: none;
       transition: background 0.15s ease, color 0.15s ease;
   }
   
   .dc-qty-btn:hover {
       background: #FCFAF8;
       color: #9B1E22;
   }
   
   .dc-qty-btn:active {
       background: #E2E2E2;
   }
   
   .dc-qty-btn--minus {
       border-right: 1px solid #E2E2E2;
   }
   
   .dc-qty-btn--plus {
       border-left: 1px solid #E2E2E2;
   }
   
   .product-buybox__form .qty {
       flex: 1 1 auto;
       width: 46px;
       min-width: 0;
       height: 100%;
       padding: 0 4px;
       border: 0;
       background: transparent;
       color: #101C28;
       font-size: 15px;
       font-weight: 600;
       text-align: center;
       -moz-appearance: textfield;
       appearance: textfield;
   }
   
   .product-buybox__form .qty:focus {
       outline: none;
   }
   
   /* Hide the native spinner arrows — replaced by .dc-qty-btn above */
   .product-buybox__form .qty::-webkit-outer-spin-button,
   .product-buybox__form .qty::-webkit-inner-spin-button {
       -webkit-appearance: none;
       margin: 0;
   }
   
   .product-buybox__form .single_add_to_cart_button,
   .product-buybox__form button[type="submit"] {
       flex: 1 1 160px;
       min-height: 44px;
       padding: 12px 20px;
       border: 0;
       border-radius: 6px;
       background: var(--fill-accent, #9B1E22);
       color: #FFFFFF;
       font-size: 14px;
       font-weight: 700;
       cursor: pointer;
       transition: background 0.15s ease;
   }
   
   .product-buybox__form .single_add_to_cart_button:hover,
   .product-buybox__form button[type="submit"]:hover {
       background: var(--accent-dark, #7A171B);
   }
   
   .product-buybox__form .single_add_to_cart_button:disabled {
       cursor: default;
       opacity: 0.7;
   }
   
   /* ========== REQUEST QUOTE (no-price products) ========== */
   .product-buybox__quote {
       padding-top: 10px;
       border-top: 1px solid var(--border, #E2E2E2);
   }
   
   .product-buybox__quote-text {
       margin: 0 0 10px;
       font-size: 13px;
       color: var(--text-secondary, #6E6E6E);
   }
   
   .single-product-sidebar .product-buybox__get-quote {
       display: inline-flex !important;
       width: 100% !important;
       box-sizing: border-box;
       min-height: 44px;
       align-items: center;
       justify-content: center;
       gap: 8px;
       border: 0;
       border-radius: 6px;
       background: var(--fill-primary, #9B1E22);
       color: #FFFFFF;
       font-size: 14px;
       font-weight: 700;
       white-space: normal;
       overflow: visible;
       text-overflow: clip;
       text-decoration: none;
       cursor: pointer;
       transition: background 0.15s ease;
   }
   
   .single-product-sidebar .product-buybox__get-quote:hover {
       background: var(--primary, #7A171B);
       color: #FFFFFF;
       text-decoration: none;
   }
   
   
   /* ========== PRICE ALERT LINK ========== */
   .product-buybox__links {
       display: flex;
       flex-direction: column;
       gap: 10px;
       padding-top: 8px;
       border-top: 1px solid var(--border, #E2E2E2);
   }
   
   .product-buybox__link {
       display: inline-flex;
       align-items: center;
       gap: 7px;
       padding: 0;
       border: 0;
       background: none;
       font: inherit;
       font-size: 13px;
       font-weight: 600;
       color: #9B1E22;
       text-decoration: none;
       cursor: pointer;
       transition: color 0.15s ease;
   }
   
   .product-buybox__link-icon {
       flex: 0 0 auto;
   }
   
   .product-buybox__link:hover {
       color: #9B1E22;
       text-decoration: underline;
   }
   
   .product-buybox__link[aria-expanded="true"] {
       color: #9B1E22;
   }
   
   .product-buybox__alert-error {
       flex-basis: 100%;
       margin: 4px 0 0;
       color: #9B1E22;
       font-size: 12px;
       font-weight: 600;
   }
   
   .product-buybox__alert-wrap {
       position: relative;
   }
   
   .product-buybox__alert-form {
       display: flex;
       flex-wrap: wrap;
       gap: 8px;
       margin-top: 10px;
       padding: 12px;
       border: 1px solid var(--border, #E2E2E2);
       border-radius: 6px;
       background: #FCFAF8;
   }
   
   .product-buybox__alert-input {
       flex: 1 1 160px;
       min-width: 0;
       height: 38px;
       padding: 0 10px;
       border: 1px solid #E2E2E2;
       border-radius: 4px;
       background: #FFFFFF;
       font-size: 13px;
   }
   
   .product-buybox__alert-input:focus {
       outline: none;
       border-color: #9B1E22;
       box-shadow: 0 0 0 3px rgba(206,0,0,0.15);
   }
   
   .product-buybox__alert-submit {
       flex: 0 0 auto;
       box-sizing: border-box;
       height: 38px;
       padding: 0 16px;
       border: 0;
       border-radius: 4px;
       background: #9B1E22;
       color: #FFFFFF;
       font-size: 13px;
       font-weight: 700;
       white-space: normal;
       overflow: visible;
       text-overflow: clip;
       cursor: pointer;
       transition: background 0.15s ease;
   }
   
   .product-buybox__alert-submit:hover {
       background: #7A171B;
   }
   
   .product-buybox__alert-note {
       flex: 1 1 100%;
       margin: 0;
       font-size: 11px;
       font-weight: 400;
       color: var(--text-secondary, #6E6E6E);
   }
   
   .product-buybox__alert-form.is-confirmed {
       align-items: center;
       background: #eaf6ed;
       border-color: #b7e0c0;
   }
   
   .product-buybox__alert-confirm {
       margin: 0;
       font-size: 13px;
       font-weight: 600;
       color: #1a7d3a;
   }
   
   /* ========== ENTERPRISE SUPPORT (Right Sidebar) — styled like the Business Accounts promo card ========== */
   .product-enterprise-support {
       margin-top: 16px;
       padding: 24px;
       border-radius: 10px;
       background: #101C28;
       color: #FFFFFF;
   }
   
   .product-enterprise-support__label {
       display: block;
       margin-bottom: 10px;
       color: var(--fill-accent, #9B1E22);
       font-size: 11px;
       font-weight: 700;
       letter-spacing: 0.06em;
       line-height: 1;
       text-transform: uppercase;
   }
   
   .product-enterprise-support__heading {
       margin: 0 0 10px;
       color: #FFFFFF;
       font-size: 18px;
       font-weight: 700;
       line-height: 1.3;
   }
   
   .product-enterprise-support__text {
       margin: 0 0 18px;
       color: rgba(255, 255, 255, 0.72);
       font-size: 13px;
       line-height: 1.5;
   }
   
   .product-enterprise-support__contact {
       display: flex;
       flex-direction: column;
       gap: 8px;
       margin: 0 0 18px;
   }
   
   .product-enterprise-support__contact a {
       display: inline-flex;
       align-items: center;
       gap: 8px;
       color: rgba(255, 255, 255, 0.85);
       font-size: 13px;
       font-weight: 500;
       line-height: 1;
       text-decoration: none;
   }
   
   .product-enterprise-support__contact a:hover {
       color: #FFFFFF;
   }
   
   .product-enterprise-support__contact svg {
       flex: 0 0 auto;
       opacity: 0.8;
   }
   
   .product-enterprise-support__cta {
       display: flex;
       width: 100%;
       min-height: 48px;
       align-items: center;
       justify-content: center;
       gap: 10px;
       padding: 10px 16px;
       border: 0;
       border-radius: 6px;
       background: var(--fill-accent, #9B1E22);
       color: #FFFFFF;
       font-size: 13px;
       font-weight: 600;
       text-decoration: none;
       cursor: pointer;
       transition: background 0.2s ease;
   }
   
   .product-enterprise-support__cta svg {
       flex: 0 0 auto;
   }
   
   .product-enterprise-support__cta-text {
       display: inline-block;
       line-height: 1.3;
   }
   
   .product-enterprise-support__cta:hover {
       background: var(--accent-dark, #7A171B);
       color: #FFFFFF;
       text-decoration: none;
   }
   
   /* ========== BEST SELLERS (Right Sidebar — conditional) ========== */
   .product-bestsellers {
       padding: 20px;
       border: 1px solid #E2E2E2;
       border-radius: 8px;
       background: #FFFFFF;
       box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
   }
   
   .product-bestsellers__header {
       display: flex;
       align-items: center;
       justify-content: space-between;
       margin-bottom: 14px;
       padding-bottom: 10px;
       border-bottom: 1px solid var(--border, #E2E2E2);
   }
   
   .product-bestsellers__title {
       font-size: 15px;
       font-weight: 700;
       color: var(--text-primary, #101C28);
   }
   
   .product-bestsellers__see-more {
       font-size: 12px;
       font-weight: 600;
       color: #9B1E22;
       text-decoration: none;
   }
   
   .product-bestsellers__see-more:hover {
       text-decoration: underline;
   }
   
   .product-bestsellers__list {
       display: flex;
       flex-direction: column;
       gap: 12px;
       margin: 0;
       padding: 0;
       list-style: none;
   }
   
   .product-bestsellers__item {
       display: grid;
       grid-template-columns: 48px minmax(0, 1fr) minmax(0, auto);
       align-items: center;
       gap: 10px;
       padding-bottom: 12px;
       border-bottom: 1px solid var(--border, #FCFAF8);
   }
   
   .product-bestsellers__item:last-child {
       padding-bottom: 0;
       border-bottom: 0;
   }
   
   .product-bestsellers__image-link {
       display: block;
   }
   
   .product-bestsellers__image {
       width: 48px;
       height: 48px;
       border: 0.5px solid var(--border, #E2E2E2);
       border-radius: 6px;
       object-fit: contain;
       background: #FCFAF8;
   }
   
   .product-bestsellers__info {
       display: flex;
       min-width: 0;
       flex-direction: column;
       gap: 4px;
   }
   
   .product-bestsellers__name {
       overflow: hidden;
       color: var(--text-primary, #101C28);
       font-size: 13px;
       font-weight: 600;
       line-height: 1.3;
       text-decoration: none;
       text-overflow: ellipsis;
       white-space: nowrap;
   }
   
   .product-bestsellers__name:hover {
       color: var(--fill-accent, #9B1E22);
   }
   
   .product-bestsellers__price {
       font-size: 13px;
       font-weight: 700;
       color: #9B1E22;
   }
   
   .product-bestsellers__view {
       justify-self: end;
       font-size: 12px;
       font-weight: 600;
       color: #9B1E22;
       text-decoration: none;
       white-space: nowrap;
   }
   
   .product-bestsellers__view:hover {
       text-decoration: underline;
   }
   
   /* ========== RESPONSIVE: BUY BOX + BEST SELLERS ========== */
   @media (max-width: 480px) {
       .product-buybox {
           padding: 16px;
       }
   
       .product-buybox__price {
           font-size: 24px;
       }
   
       .product-buybox__form .cart {
           flex-direction: row;
           flex-wrap: nowrap;
           align-items: stretch;
           gap: 10px;
       }
   
       .product-buybox__form .single_add_to_cart_button,
       .product-buybox__form button[type="submit"] {
           width: auto;
           flex: 1 1 auto;
           min-width: 0;
       }
   
       .product-buybox__form .quantity {
           width: auto;
           flex: 0 0 auto;
       }
   
       .product-buybox__alert-input,
       .product-buybox__alert-submit {
           flex: 1 1 100%;
           width: 100%;
       }
   
       .product-bestsellers {
           padding: 16px;
       }
   
       .product-bestsellers__item {
           grid-template-columns: 40px minmax(0, 1fr);
           row-gap: 4px;
       }
   
       .product-bestsellers__view {
           grid-column: 2;
           justify-self: start;
       }
   }
   /* ========== RESPONSIVE: PRODUCT OVERVIEW (MAIN BOX / SIDEBAR) ========== */
   
   /* Laptops: still two columns (main box + sidebar), just a little
      tighter than full desktop so the sidebar doesn't crowd the gallery. */
   @media (max-width: 1200px) {
       .single-product-wrapper {
           grid-template-columns: minmax(0, 1fr) 300px;
           gap: 24px;
       }
   
       .single-product-sidebar {
           width: 300px;
           max-width: 300px;
       }
   
       .single-product-left {
           grid-template-columns: minmax(220px, 360px) minmax(200px, 1fr);
           padding: 22px;
           width: 100%;
           max-width: 100%;
       }
   
       .single-product__gallery-card img {
           max-height: 440px;
       }
   }
   
   /* Tablets: everything drops into a single column — main box, then buy
      box, then Related Products, in natural DOM order. */
   @media(max-width:991px){
   
       .single-product-wrapper{
           grid-template-columns: minmax(0, 1fr);
           grid-template-rows: auto;
           gap: 24px;
           width: 100%;
           max-width: 100%;
       }
   
       /* Explicit stacking order (independent of DOM order): main box,
          then the buy box sidebar, then Related Products, then the
          tabs/reviews section. .single-product__tabs is included here
          too since it now lives inside the wrapper grid. */
       .single-product-layout,
       .single-product-sidebar,
       .single-product__related,
       .single-product__tabs{
           grid-column: 1;
           grid-row: auto;
           width: 100%;
           max-width: 100%;
       }
   
       .single-product-layout  { order: 1; }
       .single-product__related{ order: 3; }
       .single-product__tabs   { order: 4; }
   
       .single-product-sidebar{
           order: 2;
           position: static;
           width: 100%;
           max-width: 100%;
       }
   
       .single-product-left {
           width: 100%;
           max-width: 100%;
       }
   
       .product-buybox,
       .product-bestsellers,
       .product-enterprise-support {
           width: 100%;
           max-width: 100%;
       }
   
   }
   
   /* Small tablets/large phones: inside the main product box, picture and
      summary stack instead of sitting side-by-side. */
   @media (max-width: 700px) {
       .single-product-left {
           display: grid;
           width: 100%;
           max-width: 100%;
           grid-template-columns: minmax(0, 1fr);
           gap: 20px;
           padding: 16px;
       }
   
       .single-product__breadcrumb {
           grid-column: 1;
           grid-row: 1;
           width: 100%;
           max-width: 100%;
       }
   
       .single-product__gallery-card {
           grid-column: 1;
           grid-row: 2;
           width: 100%;
           max-width: 100%;
       }
   
       .single-product__summary-card {
           grid-column: 1;
           grid-row: 3;
           width: 100%;
           max-width: 100%;
       }
   
       .single-product__summary {
           width: 100%;
           max-width: 100%;
       }
   
       .single-product__gallery-card img {
           max-height: 320px;
       }
   }
   
   /* Phones: tighten up spacing further so nothing crowds the edges. */
   @media (max-width: 480px) {
       .single-product-wrapper {
           margin: 20px auto;
           padding: 0 12px;
           gap: 16px;
           width: 100%;
           max-width: 100%;
       }
   
       .single-product-left {
           padding: 12px;
           gap: 16px;
           width: 100%;
           max-width: 100%;
       }
   
       .product-title {
           font-size: 19px;
           margin-top: 12px;
       }
   }
   
   /* ========== TABS ========== */
   .single-product__tabs {
       /* Explicit placement instead of grid auto-placement. Previously
          this box had no grid-column/grid-row of its own, so the grid
          auto-placed it into whichever single 1fr track happened to be
          free — at the mercy of whether Related Products rendered above
          it. Spanning both tracks here guarantees it always sits full
          width beneath everything else, at 1400px max like the rest of
          the page. */
       grid-column: 1 / -1;
       grid-row: 3;
   
       width: 100%;
       max-width: 1400px;
       margin-top: 8px;
   }
   
   .single-product__tabs .woocommerce-tabs {
       border: 1px solid #E2E2E2;
       background: #FFFFFF;
       overflow: hidden;
       border-radius: 10px;
       box-shadow: 0 2px 8px rgba(15, 23, 42, 0.05);
   }
   
   .single-product__tabs .woocommerce-tabs ul.tabs,
   .single-product__tabs ul.tabs.wc-tabs {
       display: flex !important;
       flex-wrap: nowrap;
       gap: 0;
       list-style: none !important;
       margin: 0 !important;
       padding: 0 !important;
       border-bottom: 1px solid #E2E2E2;
       background: #FCFAF8;
       overflow-x: auto;
       -webkit-overflow-scrolling: touch;
       scrollbar-width: thin;
   }
   
   .single-product__tabs .woocommerce-tabs ul.tabs li,
   .single-product__tabs ul.tabs.wc-tabs li {
       flex: 0 0 auto;
       list-style: none !important;
       margin: 0 !important;
       padding: 0 !important;
       border-right: 1px solid #E2E2E2;
   }
   
   .single-product__tabs .woocommerce-tabs ul.tabs li a,
   .single-product__tabs ul.tabs.wc-tabs li a {
       display: flex !important;
       align-items: center;
       justify-content: center;
       min-height: 48px;
       padding: 12px 22px !important;
       font-size: 14px;
       font-weight: 700;
       white-space: nowrap;
       color: #12181E !important;
       text-decoration: none !important;
       border-top: 3px solid transparent;
       background: #FCFAF8 !important;
       transition: background 0.18s ease, color 0.18s ease, border-color 0.18s ease;
   }
   
   .single-product__tabs .woocommerce-tabs ul.tabs li a:hover,
   .single-product__tabs ul.tabs.wc-tabs li a:hover {
       color: #101C28 !important;
       background: #FFFFFF !important;
   }
   
   .single-product__tabs .woocommerce-tabs ul.tabs li.active a,
   .single-product__tabs ul.tabs.wc-tabs li.active a {
       color: #101C28 !important;
       border-top-color: #9B1E22;
       background: #FFFFFF !important;
       box-shadow: inset 0 -1px 0 #FFFFFF;
   }
   
   .single-product__tabs .woocommerce-tabs .woocommerce-Tabs-panel,
   .single-product__tabs .woocommerce-tabs .panel {
       display: none !important;
       padding: 28px 30px;
       font-size: 14px;
       line-height: 1.7;
       color: #12181E;
   }
   
   .single-product__tabs .woocommerce-tabs .woocommerce-Tabs-panel.panel-active,
   .single-product__tabs .woocommerce-tabs .panel.panel-active,
   .single-product__tabs .woocommerce-tabs .woocommerce-Tabs-panel:target {
       display: block !important;
   }
   
   .single-product__tabs #reviews,
   .single-product__tabs #tab-reviews {
       padding: 24px;
   }
   
   .single-product__tabs #reviews .woocommerce-Reviews-title,
   .single-product__tabs #reviews h2 {
       font-size: 16px;
       font-weight: 700;
       margin-bottom: 16px;
   }
   
   .single-product__tabs #reviews .comment-form-rating label,
   .single-product__tabs #reviews label {
       font-size: 13px;
       font-weight: 600;
       display: block;
       margin-bottom: 6px;
   }
   
   .single-product__tabs #reviews textarea {
       width: 100%;
       border: 1px solid #E2E2E2;
       border-radius: 4px;
       padding: 10px;
       font-family: inherit;
       font-size: 13px;
   }
   
   .single-product__tabs #reviews #submit,
   .single-product__tabs #reviews input[type="submit"] {
       margin-top: 10px;
   }
   
   .dc-product-tab {
       max-width: 100%;
   }
   
   .dc-product-tab--overview > *:first-child,
   .dc-policy-block > *:first-child {
       margin-top: 0;
   }
   
   .dc-product-tab--overview > *:last-child,
   .dc-policy-block > *:last-child {
       margin-bottom: 0;
   }
   
   .dc-product-tab--overview img,
   .dc-product-tab--overview iframe,
   .dc-product-tab--overview video {
       max-width: 100%;
   }
   
   .dc-spec-table {
       width: 100%;
       border-collapse: collapse;
       border: 1px solid #E2E2E2;
       background: #FFFFFF;
   }
   
   .dc-spec-table th,
   .dc-spec-table td {
       padding: 12px 16px;
       border-bottom: 1px solid #E2E2E2;
       text-align: left;
       vertical-align: top;
   }
   
   .dc-spec-table tr:last-child th,
   .dc-spec-table tr:last-child td {
       border-bottom: 0;
   }
   
   .dc-spec-table th {
       width: 30%;
       min-width: 180px;
       background: #FCFAF8;
       color: #12181E;
       font-weight: 700;
   }
   
   .dc-spec-table td {
       color: #12181E;
   }
   
   /* Tablet: the 180px label column plus real spec values (long model
      numbers, part numbers, etc.) can be wider than the panel. Let it
      scroll horizontally instead of squeezing text or blowing out the
      page width. */
   @media (max-width: 768px) {
       .dc-spec-table {
           display: block;
           overflow-x: auto;
           -webkit-overflow-scrolling: touch;
       }
   
       .dc-spec-table th,
       .dc-spec-table td {
           padding: 10px 14px;
       }
   }
   
   /* Phones: keep the familiar 2-column key/value layout instead of
      stacking or scrolling sideways — just tighten it to fit. Fixed
      table-layout + explicit widths keep both columns on one row;
      word-break lets long spec values wrap instead of overflowing. */
   @media (max-width: 560px) {
       .dc-spec-table {
           table-layout: fixed;
           width: 100%;
       }
   
       .dc-spec-table th,
       .dc-spec-table td {
           display: table-cell;
           padding: 8px 10px;
           font-size: 12.5px;
           word-break: break-word;
       }
   
       .dc-spec-table th {
           width: 42%;
           min-width: 0;
           font-size: 12px;
       }
   
       .dc-spec-table td {
           width: 58%;
       }
   }
   
   .dc-policy-block {
       padding: 0 0 22px;
       margin: 0 0 22px;
       border-bottom: 1px solid #E2E2E2;
   }
   
   .dc-policy-block:last-child {
       padding-bottom: 0;
       margin-bottom: 0;
       border-bottom: 0;
   }
   
   .dc-policy-block h3 {
       margin: 0 0 10px;
       color: #12181E;
       font-size: 17px;
       font-weight: 700;
   }
   
   /* ---- Payment, Shipping & Returns tabs ---- */
   .dc-product-tab--payment,
   .dc-product-tab--shipping,
   .dc-product-tab--returns {
       color: #12181E;
   }
   
   .dc-product-tab--payment > *:first-child,
   .dc-product-tab--shipping > *:first-child,
   .dc-product-tab--returns > *:first-child {
       margin-top: 0;
   }
   
   .dc-product-tab--payment > *:last-child,
   .dc-product-tab--shipping > *:last-child,
   .dc-product-tab--returns > *:last-child {
       margin-bottom: 0;
   }
   
   .dc-product-tab--payment p,
   .dc-product-tab--shipping p,
   .dc-product-tab--returns p {
       margin: 0 0 14px;
       line-height: 1.7;
       /* Guards against unbreakable runs in the actual tab copy (most
          commonly literal &nbsp; characters left over from pasting text
          in from Word/Google Docs) which would otherwise refuse to wrap
          at all and get silently cut off by the page's overflow-x:hidden
          instead of showing a scrollbar. overflow-wrap: anywhere forces a
          break even mid-word if nothing better is available. */
       overflow-wrap: anywhere;
       word-break: break-word;
   }
   
   .dc-product-tab--payment h3,
   .dc-product-tab--returns h3 {
       margin: 0 0 12px;
       color: #12181E;
       font-size: 16px;
       font-weight: 700;
   }
   
   .dc-product-tab--returns h3 {
       margin-top: 22px;
   }
   
   .dc-product-tab--returns h3:first-child {
       margin-top: 0;
   }
   
   .dc-product-tab--payment ul,
   .dc-product-tab--shipping ul,
   .dc-product-tab--returns ul {
       list-style: none;
       margin: 0 0 16px;
       padding: 0;
       display: grid;
       gap: 8px;
   }
   
   .dc-product-tab--payment ul li,
   .dc-product-tab--shipping ul li,
   .dc-product-tab--returns ul li {
       position: relative;
       padding-left: 24px;
       line-height: 1.5;
       overflow-wrap: anywhere;
       word-break: break-word;
   }
   
   .dc-product-tab--payment ul li::before,
   .dc-product-tab--shipping ul li::before,
   .dc-product-tab--returns ul li::before {
       content: "";
       position: absolute;
       left: 0;
       top: 8px;
       width: 8px;
       height: 8px;
       border-radius: 50%;
       background: #9B1E22;
   }
   
   .dc-product-tab--payment a,
   .dc-product-tab--shipping a,
   .dc-product-tab--returns a {
       color: #9B1E22;
       font-weight: 600;
       text-decoration: none;
   }
   
   .dc-product-tab--payment a:hover,
   .dc-product-tab--shipping a:hover,
   .dc-product-tab--returns a:hover {
       text-decoration: underline;
   }
   
   /* Returns tab CTA — styled as a button (matches Request Quote / Add to
      Cart maroon buttons) instead of inheriting the plain-link style above,
      since "view full policy" is an action, not inline body copy. */
   .dc-product-tab__cta {
       display: inline-flex !important;
       align-items: center;
       gap: 8px;
       margin-top: 4px;
       padding: 10px 20px;
       border-radius: 4px;
       background: #9B1E22;
       color: #FFFFFF !important;
       font-size: 13px;
       font-weight: 700;
       text-decoration: none !important;
       transition: background 0.15s ease;
   }
   
   .dc-product-tab__cta:hover {
       background: #7A171B;
       text-decoration: none !important;
   }
   
   /* ========== REVIEWS SECTION ========== */
   .dc-reviews {
       padding: 24px;
   }
   
   .dc-reviews__title {
       font-size: 18px;
       font-weight: 700;
       color: #101C28;
       margin-bottom: 16px;
   }
   
   .dc-static-stars {
       display: inline-flex;
       gap: 1px;
       font-size: 16px;
       line-height: 1;
   }
   
   .dc-static-stars__star {
       color: #E2E2E2;
   }
   
   .dc-static-stars__star.is-filled {
       color: #9B1E22;
   }
   
   .dc-reviews__compare {
       display: grid;
       grid-template-columns: 1fr 50px 1fr;
       align-items: center;
       gap: 0;
       background: #FFFFFF;
       padding: 24px;
       margin-bottom: 24px;
       position: relative;
   }
   
   .dc-reviews__compare-heading {
       font-size: 16px;
       font-weight: 700;
       text-align: center;
       margin: 0 0 8px;
       color: #101C28;
   }
   
   .dc-reviews__compare-card {
       padding: 16px;
       border-radius: 6px;
   }
   
   
   
   .dc-reviews__compare-stars {
       font-size: 16px;
       margin-bottom: 8px;
   }
   
   .dc-reviews__compare-body {
       font-size: 14px;
       line-height: 1.5;
       color: #6E6E6E;
       margin: 0 0 8px;
   }
   
   .dc-reviews__compare-meta {
       font-size: 14px;
       color: #6E6E6E;
       margin: 0;
       
   }
   
   .dc-reviews__compare-vs {
       width: 40px;
       height: 40px;
       display: flex;
       align-items: center;
       justify-content: center;
       position: relative;
       z-index: 2;
       margin: 0 auto;
       border-radius: 50%;
       background: #9B1E22;
       box-shadow: 0 2px 8px rgba(206,0,0,0.3);
       color: white;
       font-size: 14px;
       font-weight: 700;
       text-align: center;
   }
   
   /* VERTICAL ORANGE LINE */
   .dc-reviews__compare::before {
       content: '';
       position: absolute;
       left: 50%;
       top: 25px;
       bottom: 25px;
       width: 2px;
        background: #E2E2E2; 
       transform: translateX(-50%);
   }
   
   .dc-reviews__summary-row {
       display: grid;
       grid-template-columns: 2fr 1fr 1fr;
       gap: 24px;
       border-bottom: 1px solid #E2E2E2;
       padding-bottom: 24px;
       margin-bottom: 24px;
   }
   
   .dc-reviews__summary-left {
       border-right: 1px solid #E2E2E2;
       padding-right: 24px;
   }
   
   .dc-reviews__summary-mid {
       border-right: 1px solid #E2E2E2;
       padding-right: 24px;
       margin-bottom: 40px;
   }
   
   .dc-reviews__avg-line {
       display: flex;
       align-items: center;
       gap: 12px;
       margin-bottom: 16px;
   }
   
   .dc-reviews__avg-stars {
       font-size: 18px;
   }
   
   .dc-reviews__avg-text {
       font-size: 13px;
       color: #6E6E6E;
   }
   
   .dc-reviews__bars {
       display: flex;
       flex-direction: column;
       gap: 8px;
   }
   
   .dc-reviews__bar-row {
       display: grid;
       grid-template-columns: 70px 1fr 50px 50px;
       align-items: center;
       gap: 8px;
       font-size: 12px;
   }
   
   .dc-reviews__bar-label {
       color: #9B1E22;
       text-decoration: none;
       cursor: pointer;
       transition: font-weight 0.15s;
   }
   
   .dc-reviews__bar-label:hover {
       font-weight: 700;
   }
   
   .dc-reviews__bar-track {
       height: 6px;
       background: #E2E2E2;
       border-radius: 3px;
       overflow: hidden;
   }
   
   .dc-reviews__bar-fill {
       height: 100%;
       background: #9B1E22;
   }
   
   .dc-reviews__bar-percent {
       text-align: right;
       color: #6E6E6E;
   }
   
   .dc-reviews__bar-count {
       text-align: right;
       color: #6E6E6E;
   }
   
   .dc-reviews__filter-title {
       font-size: 13px;
       font-weight: 700;
       margin: 0 0 12px;
       color: #12181E;
   }
   
   .dc-reviews__filter-option {
       display: flex;
       align-items: center;
       gap: 6px;
       font-size: 13px;
       margin-bottom: 8px;
       cursor: pointer;
       color: #6E6E6E;
   }
   
   .dc-reviews__filter-checkbox {
       cursor: pointer;
   }
   
   .dc-reviews__own-title {
       font-size: 13px;
       font-weight: 700;
       margin: 0 0 12px;
       color: #12181E;
   }
   
   .dc-reviews__write-btn {
       display: inline-block;
       background: #101C28;
       color: #FFFFFF;
       padding: 10px 20px;
       font-weight: 700;
       border-radius: 4px;
       text-decoration: none !important;
       font-size: 13px;
       cursor: pointer;
       border: none;
       font-family: inherit;
       transition: background 0.15s;
   }
   
   .dc-reviews__write-btn:hover {
       background: #12181E;
       color: white;
   }
   
   .dc-reviews__toolbar {
       display: flex;
       justify-content: space-between;
       align-items: center;
       gap: 20px;
       margin-bottom: 20px;
       padding: 12px;
       background: #FCFAF8;
       border-radius: 4px;
   }
   
   .dc-reviews__search-wrap {
       display: flex;
       gap: 6px;
       flex: 1;
   }
   
   .dc-reviews__search-input {
       border: 1px solid #E2E2E2;
       border-radius: 4px;
       padding: 8px 12px;
       font-size: 13px;
       font-family: inherit;
   }
   
   .dc-reviews__search-btn,
   .dc-reviews__reset-btn {
       background: #101C28;
       color: #FFFFFF;
       border: none;
       padding: 8px 16px;
       font-weight: 700;
       font-size: 13px;
       border-radius: 4px;
       cursor: pointer;
       font-family: inherit;
       transition: background 0.15s;
   }
   .dc-reviews__search-btn:hover{
   color: white;
   text-decoration: none;
   background-color: #12181E;
   
   }
   .dc-reviews__reset-btn:hover{
   background-color: #9B1E22;
   color: white;
   
   }
   
   .dc-reviews__sort-wrap {
       display: flex;
       align-items: center;
       gap: 8px;
       font-size: 13px;
   }
   
   .dc-reviews__sort-select {
       border: 1px solid #E2E2E2;
       border-radius: 4px;
       padding: 6px 10px;
       font-size: 13px;
       font-family: inherit;
       background: #FFFFFF;
   }
   
   .dc-reviews__list {
       display: flex;
       flex-direction: column;
       gap: 20px;
   }
   
   .dc-reviews__empty {
       font-size: 14px;
       color: #6E6E6E;
       text-align: center;
       padding: 24px;
   }
   
   .dc-review-item {
       display: grid;
       grid-template-columns: 66px 1fr;
       gap: 16px;
       padding: 16px;
     
   }
   
   .dc-review-item__left {
       display: flex;
       flex-direction: column;
       gap: 6px;
   }
   
   .dc-review-item__author {
       font-weight: 800;
       color: #101C28;
       font-size: 14px;
   }
   
   .dc-review-item__badge {
       font-size: 12px;
       color: #1a7d3a;
       font-weight: 600;
   }
   
   .dc-review-item__right {
       display: flex;
       flex-direction: column;
       gap: 8px;
   }
   
   .dc-review-item__header {
       display: flex;
       align-items: center;
       gap: 12px;
       justify-content: space-between;
   }
   
   .dc-review-item__stars {
       font-size: 14px;
   }
   
   .dc-review-item__date {
       font-size: 12px;
       color: #6E6E6E;
       margin-left: 12px;
   }
   
   .dc-review-item__body {
       font-size: 13px;
       color: #6E6E6E;
       line-height: 1.6;
       margin: 0;
   }
   
   .dc-review-item__helpful {
       display: flex;
       align-items: center;
       gap: 8px;
       margin-top: 10px;
       font-size: 12px;
       color: #6E6E6E;
       justify-content: flex-end;
   }
   
   .dc-review-item__helpful-btn {
       border: 1px solid #E2E2E2;
       background: #FFFFFF;
       padding: 3px 12px;
       font-size: 12px;
       cursor: pointer;
       border-radius: 2px;
       font-family: inherit;
       color: #12181E;
       display: inline-flex;
       align-items: center;
       gap: 4px;
       transition: border-color 0.15s, color 0.15s, background 0.15s;
   }
   
   .dc-review-item__helpful-btn:hover {
       border-color: #101C28;
       color: #101C28;
   }
   
   .dc-review-item__helpful-btn.active {
       border-color: #101C28;
       color: #FFFFFF;
       background: #101C28;
   }
   
   .dc-reviews__form-wrap {
       margin-top: 24px;
       padding-top: 24px;
       border-top: 1px solid #E2E2E2;
   }
   
   .dc-reviews__form-wrap h3,
   .dc-reviews__form-wrap .comment-reply-title {
       margin-bottom: 24px;
   }
   
   .dc-reviews__form-wrap .comment-form-rating {
       margin-bottom: 20px;
   }
   
   .dc-reviews__form-wrap .comment-form-rating label {
       display: block;
       margin-bottom: 8px;
       font-size: 13px;
       font-weight: 600;
       color: #12181E;
   }
   
   /* ========== CUSTOM FORM STAR RATING SYSTEM ========== */
   .comment-form-rating {
       margin-bottom: 20px;
   }
   
   .dc-form-stars {
       display: inline-flex;
    
   }
   
   .dc-form-star {
       display: inline-flex;
       align-items: center;
       justify-content: center;
       width: 36px;
       height: 36px;
       font-size: 23px;
       color: #E2E2E2;
       text-decoration: none;
       cursor: pointer;
       transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
       border: none;
       background: transparent;
       padding: 0;
       position: relative;
       line-height: 1;
   }
   
   .dc-form-star:hover,
   .dc-form-star.hover-preview {
       color: #9B1E22;
       transform: scale(1.15);
   }
   
   .dc-form-star.active {
       color: #9B1E22;
   }
   
   .dc-form-star .screen-reader-text {
       position: absolute;
       width: 1px;
       height: 1px;
       padding: 0;
       margin: -1px;
       overflow: hidden;
       clip: rect(0, 0, 0, 0);
       white-space: nowrap;
       border-width: 0;
       clip-path: inset(50%);
   }
   
   .dc-reviews__form-wrap textarea {
       width: 100%;
       border: 1px solid #E2E2E2;
       border-radius: 4px;
       padding: 10px;
       font-family: inherit;
       font-size: 13px;
   }
   
   .dc-reviews__form-wrap input[type="submit"] {
       margin-top: 10px;
       background: #9B1E22;
       color: #FFFFFF;
       border: none;
       padding: 10px 22px;
       font-weight: 700;
       border-radius: 4px;
       cursor: pointer;
       font-family: inherit;
   }
   
   .dc-reviews__form-wrap input[type="submit"]:hover {
       background:#9B1E22;
   }
   
   .dc-reviews__reset-btn {
       background: #9B1E22;
       color: #FFFFFF;
       border: none;
       padding: 6px 14px;
       font-size: 13px;
       font-weight: 700;
       cursor: pointer;
       border-radius: 2px;
       font-family: inherit;
   }
   
   .required-field-message {
       display: block !important;
       width: 100%;
       margin-top: 13px;
   }
   
   .dc-user-status {
       margin-right: 16px;
   }
   
   
   /* ========== MANUFACTURER RESPONSE ========== */
   .dc-review-item__mfr-response {
       margin-top: 18px;
       padding: 18px;
       background: #FCFAF8;
       border: 1px solid #E2E2E2;
   }
   
   .dc-review-item__mfr-title {
       font-weight: 700;
       margin-bottom: 10px;
       color: #12181E;
   }
   
   .dc-review-item__mfr-body {
       color: #6E6E6E;
       line-height: 1.7;
   }
   
   
   
   
   
   p.stars {
       display: none;
   }
   
   
   
   
   /* ==========================================================
      RESPONSIVE
   ========================================================== */
   
   
   /* ==========================================================
      <= 1200px (Large Laptop)
   ========================================================== */
   
   @media (max-width:1200px){
   
       .dc-reviews{
           font-size:14px;
       }
       
       .dc-reviews__summary-row{
           grid-template-columns:2fr 1fr 1fr;
           gap:20px;
       }
       
       .dc-reviews__compare{
           gap:30px;
       }
       
       }
       
       
       /* ==========================================================
          <= 992px (Tablet Landscape)
       ========================================================== */
       
       @media (max-width:992px){
       
       /* NOTE: this used to also set grid-template-columns:1fr auto 1fr
          here, but a second (duplicate) 992px block further down
          immediately overrode it with display:flex — making the grid
          rule dead code. Merged the two into the one block below. */
       .dc-reviews__compare{
           position: relative;
           display: flex;
           flex-direction: column;
           gap: 35px;
       }
   
       .dc-reviews__compare::before{
           content: "";
           position: absolute;
           top: 50%;
           left: 20%;
           right: 20%;
           width: auto;
           height: 1px;
           background: #E2E2E2;
           transform: translateY(-50%);
       }
   
       .dc-reviews__compare-vs{
           position: relative;
           z-index: 2;
           margin: 0 auto;
           padding: 0 12px;
       }
   
       .dc-reviews__summary-row{
       
           grid-template-columns:minmax(0, 1fr);
           gap:25px;
       
       }
      
           .dc-reviews__summary-mid {
               margin-bottom: 12px;
               padding-bottom: 12px;
           }
       
           .dc-reviews__summary-right {
               margin-top: 0;
               padding-top: 0;
           }
       
           .dc-reviews__summary-right h4,
           .dc-reviews__summary-right p {
               margin-top: 0;
           }
       
       
       
       .dc-reviews__toolbar{
       
           display:flex;
           flex-direction:column;
           gap:18px;
       
       }
       
       .dc-reviews__sort-wrap{
           display:flex;
           align-items:center;
           justify-content:flex-start;
           gap:10px;
           margin-top:12px;
       
       }
       .dc-reviews__sort-wrap label,
   .dc-reviews__sort-wrap span{
       white-space:nowrap;
   }
   
   .dc-reviews__sort-select{
       flex:1;
       width:auto;
       margin:0;
   }
       
       .dc-review-item{
       
           grid-template-columns:minmax(0, 1fr);
           gap:20px;
       
       }
       
       .dc-review-item__left{
       
           display:flex;
           align-items:center;
           gap:10px;
       
       }
       
       }
       
       
       /* ==========================================================
          <= 768px (Tablet Portrait)
       ========================================================== */
       
       @media (max-width:768px){
       
       
       
       .single-product__tabs ul.tabs{
   
           display:flex;
           flex-wrap:nowrap;
           overflow-x:auto;
   
       }
   
       .single-product__tabs ul.tabs li{
   
           flex:0 0 auto;
   
       }
   
       .single-product__tabs ul.tabs li a{
   
           padding:12px 16px !important;
           font-size:13px;
   
       }
   
       .single-product__tabs .panel{
       
           padding:20px 16px;
       
       }
       
       /* Compare */
       
       .dc-reviews__compare{
       
           display:flex;
           flex-direction:column;
           gap:30px;
       
       }
       
       .dc-reviews__compare-card{
       
           width:100%;
           text-align:center;
       
       }
       
       .dc-reviews__compare-vs{
       
           margin:auto;
       
       }
       
       /* Rating */
       
       .dc-reviews__bar-row{
       
           grid-template-columns:55px 1fr 45px 35px;
           gap:8px;
       
       }
       
       /* Toolbar */
       
       .dc-reviews__search-wrap{
       
           display:grid;
           grid-template-columns:1fr auto auto;
           gap:8px;
       
       }
       
       .dc-reviews__search-input{
       
           min-width:0;
           width:100%;
       
       }
       
       .dc-reviews__sort-wrap{
       
           display:flex;
           justify-content:space-between;
           align-items:center;
       
       }
       
       .dc-reviews__sort-select{
       
           flex:1;
           margin-left:10px;
       
       }
       
       /* Review */
       
       .dc-review-item__header{
       
           display:flex;
           flex-direction:column;
           align-items:flex-start;
           gap:5px;
       
       }
       
       .dc-review-item__date{
       
           margin-left:0;
       
       }
       
       .dc-review-item__helpful{
       
           display:flex;
           flex-wrap:wrap;
           gap:10px;
       
       }
       
       .dc-review-item__helpful-summary,
       .dc-review-item__helpful-prompt{
       
           width:100%;
       
       }
       .dc-reviews__summary-left{
           border-right:none
       }
       .dc-reviews__summary-mid{
           border-right :none
       }
       /* Form */
       
       .logged-in-as{
       
           display:flex;
           flex-wrap:wrap;
           gap:10px;
       
       }
       
       .logged-in-as .dc-reviews__search-btn{
       
           margin:0;
       
       }
       
       textarea{
       
           width:100%;
           max-width:100%;
           box-sizing:border-box;
       
       }
       
       }
       
       /* ==========================================================
          <= 576px (Phones)
       ========================================================== */
       
       @media (max-width:576px){
       
       
       
      
       .single-product__tabs ul.tabs{
   
           flex-direction:row;
   
       }
   
       .single-product__tabs ul.tabs li a{
   
           padding:10px 14px !important;
           font-size:12.5px;
           min-height:44px;
   
       }
       
       .dc-reviews__title{
       
           font-size:24px;
           line-height:1.4;
           text-align:center;
       
       }
       
       .dc-reviews__compare-heading{
       
           font-size:18px;
       
       }
       
       .dc-reviews__search-wrap{
       
           display:flex;
           flex-direction:column;
       
       }
       
       .dc-reviews__search-btn,
       .dc-reviews__reset-btn{
       
           width:100%;
       
       }
       
      
       
       .dc-reviews__sort-select{
       
           width:100%;
          
       
       }
       
       .logged-in-as{
       
           flex-direction:column;
           align-items:flex-start;
       
       }
       
       .logged-in-as .dc-reviews__search-btn{
       
           width:100%;
           text-align:center;
       
       }
       
       .comment-form-rating{
       
           width:100%;
       
       }
       
       .dc-form-stars{
       
           display:flex;
           justify-content:flex-start;
           flex-wrap:wrap;
       
       }
       
       }
       
       
       /* ==========================================================
          <= 420px (Small Phones)
       ========================================================== */
       
       @media (max-width:420px){
       
       .dc-reviews{
       
           font-size:13px;
       
       }
       
       .dc-reviews__title{
       
           font-size:21px;
       
       }
       
       .dc-reviews__compare{
       
           gap:24px;
       
       }
       
       .dc-reviews__bar-row{
       
           grid-template-columns:45px 1fr 38px 28px;
           column-gap:6px;
       
       }
       
       .dc-review-item{
       
           padding:15px;
       
       }
       
       .dc-review-item__body{
       
           word-break:break-word;
       
       }
       
       .dc-review-item__helpful button{
       
           width:100%;
       
       }
       
       .dc-form-stars{
       
           font-size:22px;
       
       }
       
       }
           
           
   /* ========== RELATED PRODUCTS ========== */
   .single-product__related {
       --surface-1: #FCFAF8;
       --surface-2: var(--white, #FFFFFF);
       --text-primary: var(--text, #12181E);
       --text-secondary: var(--text-light, #6E6E6E);
       --fill-accent: var(--accent, #9B1E22);
       --fill-primary: var(--primary-dark, #7A171B);
       --fill-danger: var(--red, #9B1E22);
       --shadow-sm: 0 2px 8px rgba(15, 23, 42, 0.06);
       --shadow-lg: 0 16px 36px rgba(15, 23, 42, 0.16);
   
       grid-column: 1;
       grid-row: 2;
       min-width: 0;
   
       width: 100%;
       max-width: none;
       margin: 0;
       padding: 0;
       background: transparent;
       border: none;
   }
   
   .related-products__heading {
       position: relative;
       min-height: 0;
       margin: 0 0 20px;
       padding: 0 0 16px;
       display: flex;
       align-items: center;
       justify-content: space-between;
       background: transparent;
       border: 0;
       border-bottom: 1px solid var(--border, #E2E2E2);
       border-radius: 0;
   }
   
   .related-products__heading .section-title {
       font-size: 20px;
   }
   
   .related-products__view-all {
       padding: 8px 18px;
       border: 1px solid var(--border, #E2E2E2);
       border-radius: 20px;
       color: var(--text-primary);
       font-size: 13px;
       font-weight: 600;
       text-decoration: none;
       white-space: nowrap;
       transition: border-color 0.2s ease, color 0.2s ease;
   }
   
   .related-products__view-all:hover {
       border-color: var(--fill-accent);
       color: var(--fill-accent);
   }
   
   .related-products__heading::before {
       content: "";
       position: absolute;
       left: 0;
       bottom: -1px;
       height: 3px;
       background: var(--fill-accent);
       width: 64px;
   }
   
   
   
   
   
   .single-product__related .section-title {
       margin: 0;
       padding: 0;
       border: 0;
       color: var(--text-primary);
       font-size: 16px;
       font-weight: 700;
       line-height: 1.25;
   }
   
   .related-products {
       width: 100%;
       display: flex;
       flex-direction: column;
       gap: 24px;
       padding: 0;
       border: 0;
       border-radius: 0;
       background: transparent;
       box-shadow: none;
   }
   
   .product-carousel {
       width: 100%;
       margin: 0;
       padding: 0;
       display: flex;
       align-items: center;
       gap: 12px;
       border: 0;
       border-radius: 0;
       background: transparent;
       box-shadow: none;
   }
   
   .product-carousel__track {
       flex: 1 1 auto;
       min-width: 0;
       display: flex !important;
       flex-wrap: nowrap !important;
       align-items: stretch;
       gap: 16px;
       overflow-x: auto;
       padding: 0;
       scroll-behavior: smooth;
       scroll-snap-type: x mandatory;
       scrollbar-width: none;
   }
   
   .product-carousel__track::-webkit-scrollbar {
       display: none;
   }
   
   .product-carousel__nav {
       position: static;
       flex: 0 0 36px;
       width: 36px;
       height: 36px;
       display: inline-flex;
       align-items: center;
       justify-content: center;
       border: 1px solid var(--border, #E2E2E2);
       border-radius: 50%;
       background: #FFFFFF;
       color: var(--text-primary);
       cursor: pointer;
       font-size: 0;
       line-height: 1;
       box-shadow: none;
       transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease, opacity 0.2s ease;
   }
   
   .product-carousel__nav::before {
       display: block;
       font-size: 20px;
       font-weight: 400;
       line-height: 1;
   }
   
   .product-carousel__nav--prev::before {
       content: "\2039";
   }
   
   .product-carousel__nav--next::before {
       content: "\203a";
   }
   
   .product-carousel__nav:hover:not(:disabled),
   .product-carousel__nav:focus-visible:not(:disabled) {
       border-color: var(--fill-primary);
       background: var(--fill-primary);
       color: #FFFFFF;
   }
   
   .product-carousel__nav:disabled {
       opacity: 0.3;
       cursor: default;
   }
   
   .single-product__related .product-carousel__track .product-card {
       /*
        * Was a bare "divide by 3" with no floor (min-width: 0 combined with
        * flex-shrink: 0 via the "0 0" shorthand meant the calculated width
        * WAS the final width, however small it got). If this carousel's
        * container is ever narrower than the ~3-per-row math assumes — a
        * resized/zoomed browser, or an intermediate breakpoint — each card
        * could shrink to well under 100px, leaving no room for the product
        * name and forcing it to wrap a character or two per line.
        * max(180px, ...) puts a floor under the calc() so cards never go
        * below a readable width; the track's existing overflow-x: auto
        * lets people scroll to see cards that no longer fit in the row,
        * which is what a carousel should do anyway.
        *
        * Scoped under .single-product__related (instead of the bare
        * ".product-carousel__track .product-card" used by the category/hub
        * page's grid) so this never loses the cascade to that stylesheet —
        * same class names, different page, but a 2-class selector can be
        * overridden by load order alone. The extra ancestor class guarantees
        * this rule always wins here regardless of stylesheet order.
        *
        * flex-basis and width both subtract 32px (2 gaps × 16px gap) so the
        * two agree on the same 3-per-row math instead of drifting apart.
        */
       flex: 0 0 max(180px, calc((100% - 32px) / 3)) !important;
       width: max(180px, calc((100% - 32px) / 3)) !important;
       min-width: 180px;
       display: flex !important;
       flex-direction: column;
       gap: 0;
       padding: 16px;
       border: 0;
       border-radius: 8px;
       /* background: transparent; */
       color: var(--text-primary);
       box-shadow: none;
       scroll-snap-align: start;
       text-align: left;
       transition: box-shadow 0.2s ease, transform 0.2s ease;
   }
   
   .single-product__related .product-carousel__track .product-card:hover {
       box-shadow: var(--shadow-sm);
       transform: translateY(-1px);
   }
   
   .product-carousel__track .product-card__image-wrap {
       width: 100%;
       aspect-ratio: 1 / 1;
       height: auto;
       margin: 0 0 16px;
       display: flex;
       align-items: center;
       justify-content: center;
       border-radius: 6px;
       background: var(--surface-2);
   }
   
   .product-carousel__track .product-card__image-wrap img {
       width: 100%;
       max-width: 160px;
       height: 100%;
       max-height: 160px;
       object-fit: contain;
   }
   
   .product-carousel__track .product-card__body {
       display: flex;
       flex: 1 1 auto;
       flex-direction: column;
       gap: 0;
   }
   
   .product-card__meta-top {
       min-height: 24px;
       margin-bottom: 10px;
       display: flex;
       align-items: center;
       justify-content: space-between;
       gap: 8px;
   }
   
   .product-card__reviews {
       flex: 1 1 auto;
       min-width: 0;
       display: inline-flex;
       align-items: center;
       gap: 4px;
       color: var(--text-secondary);
       font-size: 12px;
       font-weight: 400;
       line-height: 1;
   }
   
   .product-card__review-count {
       display: none;
   }
   
   .product-card__reviews .dc-form-stars {
       display: inline-flex;
       gap: 1px;
   }
   
   .product-card__reviews .dc-form-star {
       width: 14px;
       height: 14px;
       font-size: 14px;
       cursor: default;
       pointer-events: none;
   }
   
   .product-card__reviews .dc-form-star:hover {
       color: inherit;
       transform: none;
   }
   
   .product-card__reviews .dc-form-star.active,
   .product-card__reviews .dc-form-star.active:hover {
       color: var(--fill-accent);
   }
   
   .product-card__brand-icon {
       max-width: 64px;
       min-width: 24px;
       height: 22px;
       padding: 0 8px;
       display: inline-flex;
       flex: 0 0 auto;
       align-items: center;
       justify-content: center;
       overflow: hidden;
       border: 0;
       border-radius: 4px;
       background: var(--text-primary, #101C28);
       color: #FFFFFF;
       font-size: 10px;
       font-weight: 700;
       line-height: 1;
       text-overflow: ellipsis;
       text-transform: uppercase;
       white-space: nowrap;
   }
   
   .product-carousel__track .product-card__title {
       min-height: 36px;
       margin: 0 0 8px;
       color: var(--text-primary);
       font-size: 14px;
       font-weight: 700;
       line-height: 1.4;
       display: -webkit-box;
       -webkit-box-orient: vertical;
       overflow: hidden;
   }
   
   .product-carousel__track .product-card__title a {
       color: inherit;
       text-decoration: none;
   }
   
   .product-carousel__track .product-card__title a:hover {
       color: var(--fill-accent);
   }
   
   .product-carousel__track .product-card__model,
   .product-carousel__track .product-card__condition {
       display: flex;
       align-items: center;
       gap: 4px;
       margin: 0;
       color: var(--text-secondary);
       font-size: 12px;
       font-weight: 400;
       line-height: 1.35;
   }
   
   .product-carousel__track .product-card__model {
       margin-bottom: 6px;
   }
   
   .product-carousel__track .product-card__condition {
       margin-bottom: 12px;
   }
   
   /*
    * Green checkmark next to "Model No" / "Condition" — same design as
    * the one defined in category-hub.css, duplicated here because
    * category-hub.css only loads on category hub pages with
    * subcategories, not on the single-product page. Keep both copies in
    * sync if the tick design ever changes.
    */
   .product-card__model,
   .product-card__condition,
   .product-card__mpn,
   .dcs-card__mpn {
       display: flex;
       align-items: center;
       gap: 8px;
   }

   .product-card__model::before,
   .product-card__condition::before,
   .product-card__mpn::before,
   .dcs-card__mpn::before {
       content: "\2713";
       flex: 0 0 auto;
       display: inline-flex;
       align-items: center;
       justify-content: center;
       width: 14px;
       height: 14px;
       border-radius: 50%;
       background: rgba(22, 163, 74, 0.12);
       color: #16a34a;
       font-size: 9px;
       font-weight: 800;
       line-height: 1;
   }

   .product-card__model .dashicons,
   .product-card__condition .dashicons,
   .product-card__mpn .dashicons,
   .dcs-card__mpn .dashicons {
       display: none;
   }
   
   .product-carousel__track .product-card__price {
       margin: 0 0 16px;
       padding: 0;
       border-top: 0;
       color: var(--text-primary);
       font-size: 15px;
       font-weight: 600;
       line-height: 1.2;
   }
   
   .product-card__quote-block,
   .product-carousel__track .product-card__footer {
       margin-top: auto;
       padding-top: 0;
       border-top: 0;
   }
   
   .product-card__add-to-cart,
   .product-card__get-quote {
       width: 100%;
       min-height: 36px;
       height: 36px;
       padding: 8px 12px !important;
       display: inline-flex;
       align-items: center;
       justify-content: center;
       gap: 7px;
       border: 0;
       border-radius: 6px;
       color: #FFFFFF;
       font-size: 13px;
       font-weight: 500;
       line-height: 1;
       text-decoration: none;
       cursor: pointer;
   }
   
   .product-card__add-to-cart {
       background: var(--fill-accent);
   }
   
   .product-card__add-to-cart:hover {
       background: var(--accent-dark, #7A171B);
       color: #FFFFFF;
   }
   
   .product-card__get-quote {
       background: var(--fill-primary);
   }
   
   .product-card__get-quote:hover {
       background: var(--primary, #9B1E22);
       color: #FFFFFF;
   }
   
   .product-card__get-quote svg,
   .product-card__add-to-cart svg {
       width: 16px;
       height: 16px;
       fill: none;
       stroke: currentColor;
       stroke-linecap: round;
       stroke-linejoin: round;
       stroke-width: 2;
   }
   
   .product-card .added_to_cart,
   .product-card .wc-forward,
   .product-card__view-btn {
       display: none !important;
   }
   
   .related-products-summary {
       width: 100%;
       min-height: 0;
       padding: 16px 16px 13px;
       display: flex;
       align-items: center;
       gap: 1px;
       border: 0;
       border-top: 1px solid var(--border, #E2E2E2);
       border-radius: 0;
       background: white;
       box-shadow: none;
   }
   
   .related-products-summary__main {
       min-width: 0;
       display: flex;
       flex: 1 1 auto;
       align-items: center;
       gap: 12px;
   }
   
   .related-products-summary__image {
       flex: 0 0 60px;
       width: 60px;
       height: 60px;
       border: 0.5px solid var(--border);
       border-radius: 6px;
       object-fit: contain;
       background: #FCFAF8;
   }
   
   .related-products-summary__title {
       min-width: 0;
       overflow: hidden;
       color: var(--text-primary);
       font-size: 14px;
       font-weight: 500;
       line-height: 1.3;
       text-overflow: ellipsis;
       white-space: nowrap;
   }
   
   .related-products-summary__actions {
       display: flex;
       flex: 0 0 auto;
       align-items: center;
       gap: 12px;
   }
   
   .related-products-summary__selected-wrap {
       position: relative;
       display: none;
   }
   
   .related-products-summary__selected {
       display: inline-flex;
       align-items: center;
       gap: 6px;
       min-height: 32px;
       padding: 6px 14px;
       border: 1px solid var(--border, #E2E2E2);
       border-radius: 20px;
       background: #FCFAF8;
       color: var(--text-primary, #101C28);
       font: inherit;
       font-size: 13px;
       font-weight: 600;
       cursor: pointer;
       transition: background 0.15s ease, border-color 0.15s ease;
   }
   
   .related-products-summary__selected:hover,
   .related-products-summary__selected[aria-expanded="true"] {
       border-color: var(--fill-accent, #9B1E22);
       background: #F0F0F0;
   }
   
   .related-products-summary__total {
       display: none;
       color: #9B1E22;
       font-size: 17px;
       font-weight: 700;
       white-space: nowrap;
   }
   
   .related-products.has-selection .related-products-summary__selected-wrap,
   .related-products.has-selection .related-products-summary__total {
       display: block;
   }
   
   .related-products-summary__view-cart {
       width: 140px;
       height: 36px;
       display: inline-flex;
       align-items: center;
       justify-content: center;
       gap: 7px;
       border: 0;
       border-radius: 6px;
       background: var(--fill-accent);
       color: #FFFFFF;
       font-size: 13px;
       font-weight: 500;
       cursor: pointer;
       opacity: 1;
       transition: background 0.2s ease;
   }
   
   .related-products-summary__view-cart:disabled {
       cursor: pointer;
       opacity: 1;
   }
   
   .related-products-summary__view-cart:not(:disabled):hover {
       background: var(--accent-dark, #7A171B);
   }
   
   .related-products-summary__popover {
       position: absolute;
       top: calc(100% + 8px);
       left: 0;
       z-index: 20;
       width: min(350px, 88vw);
       max-height: 400px;
       overflow: auto;
       padding: 16px;
       border: 0.5px solid var(--border);
       border-radius: 8px;
       background: var(--surface-2);
       box-shadow: var(--shadow-lg);
   }
   
   .related-products-summary__popover::before {
       content: "Selected Products";
       display: block;
       margin: 0 0 12px;
       padding: 0 0 10px;
       border-bottom: 0.5px solid var(--border);
       color: var(--text-primary);
       font-size: 14px;
       font-weight: 500;
   }
   
   .related-products-summary__empty {
       margin: 0;
       color: var(--text-secondary);
       font-size: 13px;
   }
   
   .related-products-summary__list {
       display: flex;
       flex-direction: column;
       gap: 0;
       margin: 0;
       padding: 0;
   }
   
   .related-products-summary__item {
       display: grid;
       grid-template-columns: 40px minmax(0, 1fr) auto 32px;
       align-items: center;
       gap: 10px;
       padding: 10px 6px;
       border-radius: 6px;
       border-bottom: 0.5px solid var(--border);
       transition: background 0.15s ease;
   }
   
   .related-products-summary__item:hover {
       background: #FCFAF8;
   }
   
   .related-products-summary__item:last-child {
       border-bottom: 0;
   }
   
   .related-products-summary__item img {
       width: 40px;
       height: 40px;
       border: 0.5px solid var(--border);
       border-radius: 6px;
       object-fit: contain;
       background: #FCFAF8;
   }
   
   .related-products-summary__item-title {
       overflow: hidden;
       color: var(--text-primary);
       font-size: 13px;
       line-height: 1.3;
       text-overflow: ellipsis;
       white-space: nowrap;
   }
   
   .related-products-summary__quantity {
       padding: 3px 9px;
       border-radius: 10px;
       background: #FCFAF8;
       color: var(--text-secondary, #6E6E6E);
       font-size: 12px;
       font-weight: 700;
       white-space: nowrap;
   }
   
   .related-products-summary__remove {
       width: 32px;
       height: 32px;
       border: 0;
       border-radius: 6px;
       background: transparent;
       color: var(--text-secondary);
       cursor: pointer;
   }
   
   .related-products-summary__remove:hover {
       color: var(--fill-danger);
       background: rgba(199, 0, 30, 0.08);
   }
   
   @media (max-width: 1024px) {
      
       .related-products,
       .product-carousel {
           padding: 18px;
       }
   
       .single-product__related .product-carousel__track .product-card {
           /* Same unguarded divide-by-3 bug as the base rule above — add the
              same 180px floor so cards can't collapse below a readable width
              at this breakpoint either. Scoped under .single-product__related
              for the same override-protection reason as the base rule. */
           flex-basis: max(180px, calc((100% - 32px) / 3)) !important;
           width: max(180px, calc((100% - 32px) / 3)) !important;
           min-width: 180px;
       }
   
       .related-products-summary__actions {
           gap: 10px;
       }
   }
   
   @media (max-width: 767px) {
      
   
       .related-products__heading {
           padding-right: 16px;
           padding-left: 16px;
       }
   
       .related-products {
           padding: 14px;
       }
   
       .product-carousel {
           padding: 14px 8px;
           gap: 6px;
       }
   
       .product-carousel__nav {
           flex-basis: 34px;
           width: 34px;
           height: 34px;
       }
   
       .single-product__related .product-carousel__track .product-card {
           /* flex-basis, width, and min-width used to be three different
              numbers (240 / 210 / 228) fighting each other — the browser
              picks flex-basis for layout but width/min-width still applied
              to the box's content sizing, which is what squeezed the
              image/text and made it look cut off. One consistent number
              fixes that, and scoping under .single-product__related keeps
              the category page's grid CSS from overriding it. */
           flex-basis: 220px !important;
           width: 220px !important;
           min-width: 220px;
           padding: 14px;
       }
   
       .related-products-summary {
           min-height: 0;
           padding: 16px;
           display: grid;
           grid-template-columns: minmax(0, 1fr);
       }
   
       .related-products-summary__main,
       .related-products-summary__actions {
           width: 100%;
       }
   
       .related-products-summary__actions {
           flex-wrap: wrap;
           justify-content: flex-start;
           padding-top: 12px;
       }
   
       .related-products-summary__view-cart {
           flex: 1 1 100%;
           width: 100%;
       }
   }
   
/*
 * Real brand logo images (dcsupplies_get_brand_logo_html output) were
 * rendering at full native resolution because neither the modifier
 * class (.product-card__brand-icon--logo) nor the <img> class
 * (.product-card__brand-logo) had any size constraint defined —
 * only the plain text-badge wrapper (.product-card__brand-icon) did.
 */
.product-card__brand-icon--logo,
.dcs-card__brand-icon--logo {
    background: transparent;
    padding: 0;
    max-width: 88px;
}

.product-card__brand-logo,
.dcs-card__brand-logo {
    display: block;
    width: auto;
    height: 22px;
    max-width: 100%;
    max-height: 22px;
    object-fit: contain;
}