/* Favoritos: corazón en tarjetas y ficha, enlace en la cabecera y página «Mis favoritos» */
.fav-btn { position: absolute; top: 10px; right: 10px; z-index: 3; display: grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 0; border-radius: 999px; background: rgba(255, 253, 249, .9); color: var(--ink); cursor: pointer; box-shadow: 0 8px 20px -14px rgba(120, 90, 40, .5); transition: background .4s, color .4s, transform .5s var(--ease-out); }
.fav-btn svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.2; transition: fill .4s, stroke .4s; }
.fav-btn:hover { color: var(--gold-deep); }
.fav-btn:focus-visible { outline: 1px solid var(--gold-deep); outline-offset: 2px; }
.fav-btn.on { color: var(--gold-deep); }
.fav-btn.on svg { fill: var(--gold-deep); stroke: var(--gold-deep); }
.fav-btn.pop svg { animation: fav-pop .6s var(--ease-out); }
@keyframes fav-pop { 0% { transform: scale(1); } 35% { transform: scale(1.28); } 100% { transform: scale(1); } }
.gallery .fav-btn { top: 16px; right: 16px; width: 46px; height: 46px; }
.gallery .fav-btn svg { width: 21px; height: 21px; }
/* «Elegir talla» es un enlace: sin esto heredaba el tamaño de la foto y salía como franja arriba, tapando el corazón */
.card-media > a.quick-add { inset: auto 12px 12px auto; display: inline-flex; }
.fav-link { display: inline-flex; align-items: center; gap: 8px; }
.fav-link .cart-count { margin-left: -2px; }
.fav-page h1 { margin: 0; font-family: var(--serif); font-size: clamp(2.2rem, 4vw, 3.2rem); font-weight: 400; line-height: 1.08; }
.fav-page .grid[aria-busy="true"] { min-height: 40vh; }
.fav-empty { max-width: 34em; margin: 10px 0 0; padding: 34px 0; border-top: 1px solid var(--line); color: var(--ink-soft); }
.fav-empty-title { margin: 0 0 10px; font-family: var(--serif); font-size: 1.5rem; color: var(--ink); }
.fav-empty .pair { margin-top: 22px; justify-content: flex-start; gap: 32px; }
@media (max-width: 900px) {
  .fav-link { position: relative; }
  .fav-link .cart-count { position: absolute; top: -2px; right: -9px; min-width: 15px; height: 15px; padding: 0 4px; font-size: .52rem; margin: 0; }
  .fav-btn { top: 6px; right: 6px; width: 36px; height: 36px; }
  .fav-btn svg { width: 17px; height: 17px; }
  .gallery .fav-btn { top: 12px; right: 12px; width: 42px; height: 42px; }
}
@media (max-width: 760px) { .card-media > a.quick-add { inset: auto 8px 8px auto; } }
@media (prefers-reduced-motion: reduce) { .fav-btn.pop svg { animation: none; } }