/* Wishlist Button Styles - Global - Keeping Original Red Design */
.wishlist-btn {
    cursor: pointer;
    transition: all 0.3s ease;
}

/* Product Cards - Keep original FontAwesome design */
.love-icon.wishlist-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 35px;
    height: 35px;
}

.love-icon.wishlist-btn i {
    font-size: 16px;
    color: #ccc;
    transition: color 0.3s ease;
}

.love-icon.wishlist-btn:hover i {
    color: #ff6b6b;
}

.love-icon.wishlist-btn[data-in-wishlist="true"] i {
    color: #ff6b6b !important;
    font-weight: 900;
}

/* Product Detail Page - Keep original SVG design */
.heart-icon.wishlist-btn {
    cursor: pointer;
}

.heart-icon.wishlist-btn .img-heart-icon {
    content: url("/assets/images-ownskin/icons/love-none.svg");
    width: 47px;
    height: 47px;
    cursor: pointer;
    transition: all 0.3s ease;
}

.heart-icon.wishlist-btn:hover .img-heart-icon {
    content: url("/assets/images-ownskin/icons/love-red.svg");
}

.heart-icon.wishlist-btn[data-in-wishlist="true"] .img-heart-icon {
    content: url("/assets/images-ownskin/icons/love-red.svg") !important;
}

/* Loading states */
.wishlist-btn.loading {
    opacity: 0.6;
    pointer-events: none;
}

.wishlist-btn.loading i::before {
    content: "\f110"; /* spinner icon */
    animation: fa-spin 1s infinite linear;
}

/* Error state */
.wishlist-btn.error {
    animation: shake 0.5s ease-in-out;
}

@keyframes shake {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-5px); }
    75% { transform: translateX(5px); }
}

/* Mobile responsive */
@media (max-width: 768px) {
    .love-icon.wishlist-btn {
        width: 32px;
        height: 32px;
    }
    
    .love-icon.wishlist-btn i {
        font-size: 14px;
    }
    
    .heart-icon.wishlist-btn .img-heart-icon {
        width: 40px;
        height: 40px;
    }
}
