/* ===========================================================
   Spacivo Similar Products — horizontally-scrolling related-product card
   carousel. Self-contained plugin CSS (no theme dependency beyond
   --color-accent).
   =========================================================== */

.spacivo-sp-carousel { position: relative; padding: 0 2.5rem; }

.spacivo-sp-track {
  display: flex; gap: 1.25rem; overflow-x: auto; scroll-behavior: smooth; scrollbar-width: none;
  padding: .25rem 0 .5rem;
}
.spacivo-sp-track::-webkit-scrollbar { display: none; }

.spacivo-sp-card { flex: 0 0 200px; text-decoration: none; color: inherit; }
.spacivo-sp-card__media { aspect-ratio: 1/1; border-radius: 6px; overflow: hidden; background: #f5f5f5; margin-bottom: .5rem; }
.spacivo-sp-card__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.spacivo-sp-card__title { margin: 0 0 .3rem; font-size: .85rem; font-weight: 500; line-height: 1.35; }
.spacivo-sp-card__price { font-size: .85rem; }
.spacivo-sp-card__price ins { text-decoration: none; font-weight: 700; }
.spacivo-sp-card__price del { color: #999; margin-right: .35rem; }

.spacivo-sp-nav {
  position: absolute; top: 40%; transform: translateY(-50%); background: #d9d9d9; border: none;
  width: 28px; height: 40px; border-radius: 4px; display: flex; align-items: center; justify-content: center;
  cursor: pointer; color: #333; z-index: 2;
}
.spacivo-sp-nav:hover { background: var(--color-accent, #8A1748); color: #fff; }
.spacivo-sp-nav--prev { left: 0; }
.spacivo-sp-nav--next { right: 0; }

@media (max-width: 600px) {
  .spacivo-sp-card { flex: 0 0 150px; }
}