/* Wishlist heart (agent E). Button markup: mu-plugin costos-wishlist.php → button.costos-wl-btn[data-costos-wl]. */
.products li.product,.nsc-card__media{position:relative}
.costos-wl-btn--card{position:absolute;top:8px;right:8px;z-index:3;width:36px;height:36px;justify-content:center;padding:0;border-radius:50%;background:rgba(255,255,255,.92);box-shadow:0 1px 4px rgba(0,0,0,.12);color:var(--ns-ink,#242424)}
.costos-wl-btn--card .costos-wl-ic{width:19px;height:19px}
.costos-wl-btn--card:hover,.costos-wl-btn--card:focus-visible{background:#fff;color:#c62828}
.costos-wl-btn--single{margin:4px 0 10px;color:var(--ns-ink,#242424)}
.costos-wl-btn--single:hover{color:var(--ns-accent,#12562D)}
.costos-wl-page .costos-wl-total{color:var(--ns-muted,#5d6560)}
@media (max-width:600px){.costos-wl-btn--card{top:6px;right:6px;width:32px;height:32px}}
/* Desktop (mouse) = live: the card heart appears on hover, sliding in from the right (Woodmart «wd-buttons», 0.3s).
   Touch screens keep it always visible, as live does on mobile. Saved items stay visible. */
@media (hover:hover) and (min-width:1025px){
 .costos-wl-btn--card{opacity:0;transform:translateX(20px);transition:opacity .3s,transform .3s,background .2s,color .2s}
 :is(li.product,.nsc-card,.product-grid-item):hover .costos-wl-btn--card,.costos-wl-btn--card:focus-visible,.costos-wl-btn--card.is-on{opacity:1;transform:none}
}