/* Wishlist Page Specific Styles */

.wishlist-page .page-main-title {
    color: var(--dark-text);
    font-family: var(--font-display);
}

.wishlist-item.card {
    border: 1px solid var(--border-color);
    transition: box-shadow 0.2s ease-in-out;
}
.wishlist-item.card:hover {
    box-shadow: var(--box-shadow-sm) !important;
}

.wishlist-item-image {
    max-width: 100px; /* Adjust as needed */
    height: auto;
    object-fit: contain; /* Use contain to show full image */
}

.wishlist-item-title a {
    font-weight: 500;
    font-size: 1.05rem;
    color: var(--dark-text);
}
.wishlist-item-title a:hover {
    color: var(--primary-color);
}

.wishlist-item-category {
    font-size: 0.85rem;
}

.wishlist-item-price {
    color: var(--primary-color); /* Or use text-danger for price */
}

.wishlist-item .badge {
    font-size: 0.75rem;
    font-weight: 500;
}

.add-to-cart-wishlist-btn,
.remove-from-wishlist-btn {
    font-size: 0.85rem;
    padding: 0.4rem 0.8rem;
}
.remove-from-wishlist-btn i {
    font-size: 0.9em; /* Make trash icon slightly smaller than text */
}

.wishlist-empty-message i.fa-heart {
    font-size: 5rem; /* Larger icon */
    opacity: 0.5;
}
.wishlist-empty-message h3 {
    font-family: var(--font-display);
}

.wishlist-actions .btn {
    font-weight: 500;
}

/* Responsive adjustments for wishlist items */
@media (max-width: 767.98px) {
    .wishlist-item .card-body .row > div {
        text-align: center; /* Center content on small screens */
        margin-bottom: 0.75rem;
    }
    .wishlist-item .col-md-2.col-3.text-center, /* Image column */
    .wishlist-item .col-md-4.col-9, /* Title/meta column */
    .wishlist-item .col-md-2.col-6.text-md-center { /* Price column */
        text-align: left !important; /* Align left for better readability */
    }
     .wishlist-item .col-md-4.col-6.text-md-end { /* Buttons column */
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
     }
    .wishlist-item .add-to-cart-wishlist-btn,
    .wishlist-item .remove-from-wishlist-btn {
        width: 100% !important;
        margin-right: 0 !important;
    }
    .wishlist-item-image {
        max-width: 80px;
        margin-bottom: 0.5rem;
    }
    .wishlist-item-title {
        font-size: 1rem;
    }
}