/* Overlay container */
.wishlist-wrapper{
  position:absolute;
  top:10px;
  left:10px;
  z-index:2147483642;
  display:flex;
  align-items:center;
  gap:4px;
  pointer-events:none;          /* wrapper itself ignores clicks */
}
.wishlist-wrapper .my-remedies-heart{ pointer-events:auto; }  /* heart is clickable */

/* Heart button: no tile, no theme hover */
.my-remedies-heart{
  -webkit-appearance:none;
  appearance:none;
  background:transparent;
  border:0;
  box-shadow:none;
  outline:none;
  padding:0;
  margin:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
  line-height:1;
}
.my-remedies-heart::before,
.my-remedies-heart::after{ content:none !important; }

.my-remedies-heart:hover,
.my-remedies-heart:focus,
.my-remedies-heart:active{
  background:transparent;
  border:0;
  box-shadow:none;
}
.my-remedies-heart:focus-visible{
  outline:2px solid #0370B9;
  outline-offset:2px;
}

/* Icon colors */
.my-remedies-heart i{
  font-size:18px;
  color:#818389 !important;     /* inactive */
  line-height:1;
  pointer-events:none;
}
.my-remedies-heart.active i{ color:#DC3232 !important; } /* active */

/* Spinner */
.heart-spinner{
  display:none;
  width:16px; height:16px;
  border:2px solid #ccc;
  border-top:2px solid #000;
  border-radius:50%;
  animation:spin .6s linear infinite;
  pointer-events:none;
  margin-left: 2px !important;
}
.heart-spinner.visible{ display:inline-block; }
@keyframes spin{ to{ transform:rotate(360deg); } }

/* Toast */
.my-remedies-message{
  position:fixed;
  top:50%; left:50%;
  transform:translate(-50%,-50%);
  background:#000;
  color:#fff;
  padding:12px 40px;
  border-radius:6px;
  font-size:14px;
  z-index:2147483647;
  box-shadow:0 2px 6px rgba(0,0,0,.3);
}
.my-remedies-close{
  position:absolute; top:8px; right:12px;
  font-size:22px; color:#fff; cursor:pointer;
}
.my-remedies-content a{
  text-decoration:underline;
  font-weight:600;
}
@media (max-width:480px){
    .my-remedies-message{ 
        padding: 15px 15px !important;
        margin-right: -50px;
    }
}

/* Make the remove link lay out icon + spinner nicely */
.product-remove a,
.remove-my-remedy,
.my-remedies-remove,
a[data-action="remove-remedy"] {
  display: inline-flex;
  align-items: center;
  gap: 6px;              /* space between ✕ and spinner */
  cursor: pointer;
}

/* Spinner next to the remove icon */
.remove-spinner {
  width: 14px;
  height: 14px;
  border: 2px solid #e0e0e0;
  border-top-color: #DC3232;   /* red accent to match the ✕ */
  border-radius: 50%;
  animation: spin .6s linear infinite;
  display: none;               /* hidden until JS adds .visible */
  vertical-align: middle;
}

.remove-spinner.visible {
  display: inline-block;
}

/* already declared above, but included here if missing */
@keyframes spin { to { transform: rotate(360deg); } }

/* Center contents of Remove column */
.my-remedies-page .my-remedies-table td:nth-child(3),
.my-remedies-page .my-remedies-table td:last-child {
    text-align: center;
    vertical-align: middle;
}

/* Scope to the My Remedies endpoint output */
.my-remedies-page .my-remedies-table td.item-cell a {
    display: inline-flex;
    align-items: center;
    gap: 10px;
}

/* Force thumbnail render to 60px wide */
.my-remedies-page .my-remedies-table td.item-cell img {
    width: 60px !important;
    height: auto !important;
    max-width: 60px !important;
    display: inline-block;
}

/* Hide wishlist heart for guests */
body:not(.logged-in) .wishlist-wrapper { display: none !important; }