.product-cart-thumbnail { position: fixed; z-index: 10001; display: grid; place-items: center; width: 60px; height: 60px; padding: 6px; border: 1px solid #d4e2f2; border-radius: 12px; background: white; color: #0066cc; box-shadow: 0 5px 18px #19314e38; pointer-events: none; }
.product-cart-thumbnail img { display: block; width: 100%; height: 100%; object-fit: contain; }
.product-cart-feedback { margin-top: .65rem; color: #23653d; font: 600 .85rem/1.5 Raleway, sans-serif; }

.product-cart-arrival-pulse { position: fixed; display: block; width: 48px; height: 48px; border-radius: 50%; background: #0066cc; pointer-events: none; z-index: -1; }

.product-detail-actions button { border: 0; }
.product-detail-actions button:focus:not(:focus-visible) { outline: none; box-shadow: none; }
.product-detail-actions button:focus-visible { outline: 2px solid #667085; outline-offset: 3px; }
.product-detail-actions #addToCartButton { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-width: 150px; }
.product-detail-actions #addToCartButton.is-adding { opacity: 1; cursor: wait; }
.product-detail-actions #addToCartButton.is-added { background: #23653d; color: white; opacity: 1; }
.product-detail-actions #addToCartButton.is-adding::before { content: ""; width: 15px; height: 15px; border: 2px solid #ffffff66; border-top-color: white; border-radius: 50%; animation: cartButtonSpin .8s linear infinite; }
.product-cart-feedback:not(.is-error) { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.product-cart-feedback.is-error { color: #a72d3a; }
@keyframes cartButtonSpin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .product-detail-actions #addToCartButton.is-adding::before { animation: none; } }

.product-detail-container .product-detail-image { padding: 3px; box-sizing: border-box; background: linear-gradient(135deg, #0066cc, #4da6ff, #0066cc, #4da6ff); background-size: 400% 400%; animation: gradientRotate 10s linear infinite; }
.product-detail-container .product-detail-image::before, .product-detail-container .product-detail-image > .rotating-gradient { display: none; }
.product-detail-container .product-detail-image > img { display: block; width: 100%; border-radius: 7px; background: white; }
@media (prefers-reduced-motion: reduce) { .product-detail-container .product-detail-image { animation: none; } }
