/* ====== COEUR FAVORIS — ANIMATION ====== */

/* Cœur header */
.n8h__fav-btn { overflow:visible!important; }
.n8h__fav-heart { filter:drop-shadow(0 1px 2px rgba(0,0,0,0.1)); transition:filter 0.2s; }
.n8h__fav-liked .n8-h-shadow { fill:rgba(185,28,28,0.15); }
.n8h__fav-liked .n8-h-base { fill:#991b1b; stroke:#7f1d1d; }
.n8h__fav-liked .n8-h-main { fill:#b91c1c; stroke:#991b1b; }
.n8h__fav-liked .n8-h-shine { fill:rgba(255,255,255,0.3); }
.n8h__fav-liked .n8h__fav-heart { filter:drop-shadow(0 2px 4px rgba(185,28,28,0.3)); }

/* Bouton coeur */
.n8-heart-btn {
    background:transparent!important; border:none!important; border-radius:0!important;
    box-shadow:none!important; outline:none!important;
    -webkit-appearance:none; appearance:none;
    padding:0; cursor:pointer; position:relative;
    display:flex; align-items:center; justify-content:center;
    -webkit-tap-highlight-color:transparent;
}

/* Coeur SVG avec volume */
.n8-heart-svg {
    width:26px; height:26px;
    filter:drop-shadow(0 2px 3px rgba(0,0,0,0.12));
    transition:filter 0.2s;
}

/* Default: gris */
.n8-heart-btn .n8-h-shadow { fill:rgba(0,0,0,0.06); }
.n8-heart-btn .n8-h-base { fill:#ccc; stroke:#bbb; stroke-width:1; }
.n8-heart-btn .n8-h-main { fill:#ddd; stroke:#bbb; stroke-width:0.8; }
.n8-heart-btn .n8-h-shine { fill:rgba(255,255,255,0.6); }

/* Liké: rouge sombre */
.n8-heart-btn.liked .n8-h-shadow { fill:rgba(185,28,28,0.15); }
.n8-heart-btn.liked .n8-h-base { fill:#991b1b; stroke:#7f1d1d; }
.n8-heart-btn.liked .n8-h-main { fill:#b91c1c; stroke:#991b1b; }
.n8-heart-btn.liked .n8-h-shine { fill:rgba(255,255,255,0.3); }
.n8-heart-btn.liked .n8-heart-svg { filter:drop-shadow(0 3px 6px rgba(185,28,28,0.3)); }

/* Hover */
.n8-heart-btn:hover .n8-heart-svg { filter:drop-shadow(0 4px 6px rgba(0,0,0,0.15)); }
.n8-heart-btn.liked:hover .n8-heart-svg { filter:drop-shadow(0 4px 8px rgba(185,28,28,0.35)); }

/* ====== ANIMATIONS ====== */

@keyframes n8-heart-up-article {
    0%   { transform:translateY(0) scale(1); }
    25%  { transform:translateY(-18px) scale(1.15); }
    45%  { transform:translateY(-20px) scale(1.18); }
    60%  { transform:translateY(0px) scale(0.85); }
    72%  { transform:translateY(2px) scale(1.08); }
    84%  { transform:translateY(-2px) scale(0.97); }
    100% { transform:translateY(0) scale(1); }
}

@keyframes n8-heart-up-product {
    0%   { transform:translateY(0) scale(1) rotate(0); }
    20%  { transform:translateY(-20px) scale(1.2) rotate(-4deg); }
    40%  { transform:translateY(-22px) scale(1.22) rotate(3deg); }
    55%  { transform:translateY(0px) scale(0.8) rotate(-2deg); }
    68%  { transform:translateY(3px) scale(1.1) rotate(1deg); }
    80%  { transform:translateY(-2px) scale(0.96) rotate(0); }
    100% { transform:translateY(0) scale(1) rotate(0); }
}

@keyframes n8-heart-unlike {
    0%   { transform:translateY(0) scale(1); }
    40%  { transform:translateY(6px) scale(0.8); }
    100% { transform:translateY(0) scale(1); }
}

@keyframes n8-heart-ring {
    0%   { transform:translate(-50%,-50%) scale(0.3); opacity:0.9; border-width:3px; }
    100% { transform:translate(-50%,-50%) scale(2.8); opacity:0; border-width:0.5px; }
}

@keyframes n8-heart-particle {
    0%   { opacity:1; transform:translate(0,0) scale(1); }
    100% { opacity:0; transform:translate(var(--tx), var(--ty)) scale(0); }
}

@keyframes n8-heart-mini {
    0%   { opacity:1; transform:translate(0,0) scale(1) rotate(0); }
    100% { opacity:0; transform:translate(var(--tx), var(--ty)) scale(0.2) rotate(var(--tr)); }
}

.n8-heart-particle {
    position:absolute;
    opacity:0;
    pointer-events:none;
}

/* ====== POSITIONNEMENT CONTEXTUEL ====== */

/* Sur les articles homepage (cartes + wide) */
.n8-art-fav.n8-heart-btn { position:absolute; top:10px; right:10px; z-index:10; }
.n8-art-fav--wide.n8-heart-btn { top:14px; right:14px; }

/* Sur les produits shop */
.n8-shop-fav.n8-heart-btn { position:absolute; top:8px; right:8px; z-index:10; }

/* Sur les articles single (image featured) */
.n8-single-fav.n8-heart-btn {
    position:absolute; top:14px; right:14px; z-index:10;
    flex-direction:column; gap:3px;
}
.n8-single-fav .n8-heart-svg { width:28px; height:28px; }
.n8-single-fav__label {
    font-family:'Inter',sans-serif; font-size:10px; font-weight:700;
    letter-spacing:0.5px; text-transform:uppercase; color:#999;
    transition:color 0.25s ease;
    text-shadow:0 0 5px rgba(255,255,255,1), 0 0 12px rgba(255,255,255,0.9), 0 0 24px rgba(255,255,255,0.5);
}
.n8-single-fav.liked .n8-single-fav__label { color:#b91c1c; }
.n8-single-fav:hover { transform:scale(1.15); }
.n8-single-fav { transition:transform 0.25s ease; }
