.product-replacements { clear: both; display: flow-root; width: 100%; box-sizing: border-box; margin: 24px 0; padding-top: 12px; min-height: 40px; }
.product-replacements[hidden] { display: none; }
.replacement-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.product-replacements .replacement-title { margin: 0; font-size: 20px; line-height: 1.35; }
.replacement-nav { display: flex; gap: 8px; flex-shrink: 0; }
.replacement-nav[hidden] { display: none; }
.replacement-nav button { width: 34px; height: 34px; padding: 0; border: 1px solid #d8dfd4; border-radius: 5px; background: #fff; color: #3b601d; font: 26px/1 Arial, sans-serif; cursor: pointer; }
.replacement-nav button:disabled { opacity: .35; cursor: default; }
.replacement-list { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(180px, calc((100% - 48px) / 5)); gap: 12px; align-items: stretch; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x proximity; scrollbar-width: thin; padding: 2px 0 10px; }
.product-replacements form.replacement-card { display: flex; flex-direction: column; box-sizing: border-box; width: 100%; min-width: 0; height: 100%; gap: 12px; margin: 0; padding: 12px; background: #fff; border: 0; border-radius: 0; box-shadow: none; scroll-snap-align: start; }
.product-replacements .replacement-image { display: flex; flex: 0 0 120px; height: 120px; align-items: center; justify-content: center; }
.product-replacements .replacement-image img { width: 100%; max-width: 120px; height: 120px; object-fit: contain; }
.replacement-details { display: flex; flex: 1; min-width: 0; flex-direction: column; gap: 8px; }
.replacement-name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; height: 60px; font-size: 14px; line-height: 20px; overflow-wrap: anywhere; }
.product-replacements .replacement-rating { display: flex; align-items: center; gap: 5px; font-size: 12px; line-height: 20px; }
.product-replacements .replacement-stars { position: relative; display: inline-block; flex-shrink: 0; overflow: hidden; white-space: nowrap; color: #d6d6d6; font: 16px/20px Arial, sans-serif; letter-spacing: 1px; }
.product-replacements .replacement-stars > span { position: absolute; top: 0; left: 0; max-width: 100%; overflow: hidden; white-space: nowrap; color: #e9ac14; }
.product-replacements .replacement-rating-count { color: #555; }
.replacement-options label { display: block; font-size: 12px; }
.replacement-details select { width: 100%; max-width: 100%; box-sizing: border-box; padding: 4px; }
.replacement-actions { display: flex; gap: 10px; align-items: center; justify-content: space-between; margin-top: auto; }
.replacement-actions > span { white-space: nowrap; font-size: 12px; }
.product-replacements .replacement-actions .price { display: inline; font-size: 18px; font-weight: 700; line-height: 26px; height: auto; margin: 0; }
.product-replacements .replacement-actions > .button { flex-shrink: 0; box-sizing: border-box; width: auto; margin: 0; padding: 8px; text-align: center; cursor: pointer; }
.product-replacements .replacement-actions > .replacement-cart { width: 34px; height: 34px; padding: 0; border: 2px solid #f38a00; border-radius: 50%; color: #458500; font: bold 22px Arial, sans-serif; box-shadow: none; background: #fff url("cart-add.svg") center / 24px 24px no-repeat; }
.product-replacements .replacement-actions > .replacement-cart:hover { background-color: #fff5e8; }
.product-replacements .replacement-cart[value="✓"] { background-image: none; }
.product-replacements .replacement-cart:focus-visible { outline: 2px solid #458500; outline-offset: 3px; }
.product-replacements .replacement-cart:disabled { opacity: .6; cursor: wait; }
.product-replacements .replacement-actions > .replacement-external { flex-shrink: 1; font-size: 12px; }
.replacement-status { color: #687368; font-size: 14px; }
.replacement-retry { padding: 7px 12px; margin-left: 8px; cursor: pointer; }
.replacement-external { display: inline-block; text-decoration: none; }
@media (max-width: 767px) {
    .product-replacements .replacement-heading { justify-content: center; flex-wrap: wrap; gap: 12px; padding: 0 12px; }
    .product-replacements .replacement-title { flex: 0 1 auto; width: auto; max-width: 100%; font-size: 18px; text-align: center; }
    .replacement-list { grid-auto-columns: 180px; align-items: start; }
    .product-replacements form.replacement-card { height: auto; min-height: 0; padding: 8px; gap: 8px; }
    .product-replacements .replacement-details { flex: none; min-height: 0; gap: 8px; }
    .product-replacements .replacement-actions { margin-top: 0; }
    .product-replacements .replacement-image { height: 110px; flex-basis: 110px; }
    .product-replacements .replacement-image img { height: 110px; max-width: 110px; }
}
@media (prefers-reduced-motion: reduce) { .replacement-list { scroll-behavior: auto; } }