/* ------------------------------------------------------------------
   FAVOURITES / OMILJENO  —  customer wishlist

   Kept in its own external file on purpose: the shop is served with
   Content-Security-Policy "style-src 'self'", so <style> blocks and
   inline style="" attributes are rejected by the browser.
   ------------------------------------------------------------------ */

/* ---- heart on a catalogue card ---- */
.thumb .hv-fav-btn{
position:absolute;top:9px;right:9px;z-index:3;
width:34px;height:34px;padding:0;
display:flex;align-items:center;justify-content:center;
border:1px solid var(--border-strong);border-radius:50%;
background:rgba(20,14,10,.62);backdrop-filter:blur(6px);
color:var(--text-secondary);font:400 16px/1 var(--ui);cursor:pointer;
transition:transform .15s ease,background .15s,color .15s,border-color .15s}
.thumb .hv-fav-btn:hover{background:var(--accent);color:#231703;border-color:var(--accent);transform:scale(1.08)}
.thumb .hv-fav-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.thumb .hv-fav-btn.on{color:#ff6b81;border-color:rgba(255,107,129,.55);background:rgba(20,14,10,.80)}
.thumb .hv-fav-btn.on:hover{background:rgba(255,107,129,.92);color:#2a0a10;border-color:rgba(255,107,129,.92)}
.thumb .hv-fav-btn.pop{transform:scale(1.30)}
.card.sold .thumb .hv-fav-btn{opacity:1}

/* ---- the Favourites tab in the status row ---- */
#tally button.b-fav{background:rgba(255,107,129,.90);color:#2a0a10}

/* ---- heart inside the product lightbox ---- */
.lb-info .hv-lb-fav{
align-self:flex-start;display:inline-flex;align-items:center;gap:8px;
border:1px solid var(--border-strong);border-radius:100px;
background:var(--surface-2);color:var(--text-primary);
padding:10px 16px;font:800 13px var(--ui);cursor:pointer;transition:.15s}
.lb-info .hv-lb-fav:hover{border-color:var(--accent)}
.lb-info .hv-lb-fav:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.lb-info .hv-lb-fav.on{background:rgba(255,107,129,.14);border-color:rgba(255,107,129,.50);color:#ffd9df}
.lb-info .hv-lb-fav .hv-lb-heart{font:400 15px/1 var(--ui)}

/* ---- empty favourites shelf ---- */
.empty .hv-fav-empty-h{display:block;font:800 16px var(--ui);color:var(--text-secondary);margin-bottom:6px}

/* ---- phones ----
   On a narrow grid the cards are ~150px wide, and the longest stock
   badge ("Na stanju · još malo") is wider than that, so a heart in the
   top-right corner would sit on top of it. Drop the heart to the
   bottom-right instead, where the thumbnail is always empty. */
@media(max-width:760px){
.thumb .hv-fav-btn{top:auto;bottom:8px;right:8px}
}

/* ------------------------------------------------------------------
   product detail pages  (/p/*.html)
   ------------------------------------------------------------------ */

.hv-pfav-row{
  display:flex;
  align-items:center;
  gap:16px;
  flex-wrap:wrap;
  margin:16px 0 20px;
}

.hv-pfav{
  display:inline-flex;
  align-items:center;
  gap:9px;
  font:inherit;
  font-weight:700;
  font-size:.95rem;
  line-height:1;
  padding:12px 18px;
  cursor:pointer;
  border-radius:999px;
  color:var(--text,#f2e9df);
  background:var(--surface-2,#241a15);
  border:1px solid var(--line,rgba(255,255,255,.14));
  transition:background .18s ease, border-color .18s ease, transform .18s ease;
}
.hv-pfav:hover{ transform:translateY(-1px); border-color:var(--accent,#e0b060); }
.hv-pfav:active{ transform:translateY(0); }
.hv-pfav:focus-visible{ outline:2px solid var(--accent,#e0b060); outline-offset:3px; }

.hv-pfav .hv-pfav-i{ font-size:1.15rem; line-height:1; color:var(--accent,#e0b060); }
.hv-pfav.on{ border-color:var(--accent,#e0b060); }
.hv-pfav.on .hv-pfav-i{ color:#e2564d; }

.hv-pfav-all{
  font-size:.9rem;
  color:var(--accent,#e0b060);
  text-decoration:none;
  border-bottom:1px solid transparent;
}
.hv-pfav-all:hover{ border-bottom-color:currentColor; }

@media (prefers-reduced-motion: reduce){
  .hv-pfav{ transition:none; }
  .hv-pfav:hover{ transform:none; }
}