/* Quick fix for missing images - add to inline styles or external CSS */

/* Handle missing product images gracefully */
.product-card img[src=""],
.product-card img[src="/"],
.product-card--featured img[src=""],
.product-card--featured img[src="/"] {
    display: none !important;
}

/* Fallback placeholder styling */
.product-card .no-image,
.product-card--featured .no-image,
.product-card .img-placeholder,
.product-card--featured .img-placeholder {
    width: 100%;
    aspect-ratio: 4/3;
    display: flex !important;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #eef2f6 0%, #e3e9ef 100%);
    color: #9aa7b5;
    border-radius: 12px;
    font-size: 48px;
    transition: all 0.3s ease;
}

.product-card:hover .img-placeholder,
.product-card--featured:hover .img-placeholder {
    background: linear-gradient(135deg, #e3e9ef 0%, #d8dfe6 100%);
    color: #7a8794;
}

/* Hide broken images and show placeholder */
.product-card img,
.product-card--featured img {
    display: block;
}

.product-card img.img-error,
.product-card--featured img.img-error {
    display: none !important;
}

/* Ensure images load with proper error handling */
img {
    image-rendering: auto;
    image-rendering: crisp-edges;
    image-rendering: -webkit-optimize-contrast;
}