/* Evaly Theme Hover Effects and Animations */

/* Smooth transitions for all elements */
* {
    transition: all 0.3s ease;
}

/* Button hover effect */
.btn-primary:hover,
.theme-btn:hover,
.checkout-btn:hover,
.btn-checkout:hover,
.product-buy-button:hover,
.add-to-cart:hover,
.add-to-cart-btn:hover,
button[type="submit"]:hover,
input[type="submit"]:hover {
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(34, 40, 54, 0.2);
}

/* Product card hover effect */
.product_item:hover,
.product_item_inner:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(47, 84, 235, 0.1);
}

/* Card link hover */
.product_item_inner:hover .product-name a,
.product_item:hover .product-name a {
    color: var(--evaly-blue) !important;
}

/* Badge hover animation */
.badge:hover,
.discount-badge:hover,
.sale-badge-inner:hover {
    transform: scale(1.05);
}

/* Input field focus animation */
input:focus,
select:focus,
textarea:focus,
.form-control:focus {
    transform: translateY(-1px);
}

/* Navigation links hover */
.nav-link:hover,
.navbar-nav .nav-item:hover .nav-link {
    color: var(--evaly-blue) !important;
}

/* Category links hover */
.category-item:hover,
.subcategory-item:hover {
    background-color: var(--evaly-light) !important;
}

/* Footer links hover */
.footer a:hover {
    transform: translateX(3px);
}

/* Add to cart button pulsing animation on product pages */
@keyframes pulse {
    0% {
        box-shadow: 0 0 0 0 rgba(47, 84, 235, 0.7);
    }
    70% {
        box-shadow: 0 0 0 10px rgba(47, 84, 235, 0);
    }
    100% {
        box-shadow: 0 0 0 0 rgba(47, 84, 235, 0);
    }
}

.details-page .add-to-cart,
.product-detail-section .add-to-cart {
    animation: pulse 2s infinite;
}

/* Navbar active links */
.nav-item.active .nav-link,
.nav-link.active {
    color: var(--evaly-blue) !important;
    font-weight: 600;
}

/* Price text hover on product details */
.product-details-price:hover .current-price {
    color: var(--evaly-blue) !important;
}

/* Cart icon hover */
.cart-icon:hover,
.wish-icon:hover {
    transform: scale(1.1);
    color: var(--evaly-blue) !important;
}

/* Search button hover */
.main-search form button:hover {
    background-color: var(--evaly-blue) !important;
}

/* Card image hover effect */
.product-img-wrapper:hover img {
    transform: scale(1.05);
}