.favorite-btn {
    background-color: transparent;
    border: none;
    cursor: pointer;
    position: relative;
    outline: none;
    font-size: 20px;
    padding: 5px;
    color: #ff0000; /* Red color for the heart */
    transition: transform 0.3s ease, color 0.3s ease;
}

.favorite-btn i {
    font-size: 24px; /* Adjust the size of the icon */
}

.favorite-btn:hover {
    transform: scale(1.2); /* Slightly enlarge the button on hover */
    color: #ff6666; /* Lighter red on hover */
}

.favorite-btn.active i {
    color: #ff0000; /* Filled heart color */
}

.favorite-btn.inactive i {
    color: #ccc; /* Outlined heart color */
}