/* ============================================
   CORREÇÃO DE IMAGENS DE PRODUTOS
   Garantir que imagens apareçam inteiras
   ============================================ */

/* Imagens de produtos - Aparecer inteiras sem cortar */
.featured__item__pic,
.product__item__pic,
.latest-product__item__pic,
.product-card__image,
.product__details__pic__item img {
    object-fit: contain !important;
    background: #fff;
}

/* Cards de produto na listagem */
.featured__item__pic {
    height: 280px;
    border-radius: 12px;
    background: #fff;
    padding: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.featured__item__pic img {
    width: 100%;
    height: 100%;
    object-fit: contain !important;
}

/* Produtos em grid */
.product__item__pic {
    position: relative;
    height: 300px;
    background: #fff;
    border-radius: 12px;
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.product__item__pic img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain !important;
}

/* Galeria de produto (página de detalhes) */
.product__details__pic__item {
    background: #fff;
    border-radius: 12px;
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 400px;
}

.product__details__pic__item img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain !important;
}

/* Thumbnails de produto */
.product__details__pic__slider img,
.product-card__thumbs img {
    object-fit: contain !important;
    background: #fff;
    padding: 5px;
}

/* Categorias - manter cover para banners */
.categories__item,
.hero__item {
    object-fit: cover !important;
}

.categories__item img,
.hero__item img {
    object-fit: cover !important;
}

/* Carrossel de produtos */
.latest-product__item__pic {
    height: 250px;
    background: #fff;
    border-radius: 12px;
    padding: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.latest-product__item__pic img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain !important;
}

/* Produtos relacionados */
.related-product__item__pic {
    height: 220px;
    background: #fff;
    border-radius: 12px;
    padding: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.related-product__item__pic img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain !important;
}

/* Quick view modal */
.quick-view__pic {
    background: #fff;
    border-radius: 12px;
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 350px;
}

.quick-view__pic img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain !important;
}

/* Responsivo - Mobile */
@media (max-width: 768px) {
    .featured__item__pic {
        height: 220px;
        padding: 10px;
    }
    
    .product__item__pic {
        height: 250px;
        padding: 15px;
    }
    
    .product__details__pic__item {
        min-height: 300px;
        padding: 15px;
    }
    
    .latest-product__item__pic {
        height: 200px;
        padding: 10px;
    }
}

@media (max-width: 576px) {
    .featured__item__pic {
        height: 200px;
        padding: 8px;
    }
    
    .product__item__pic {
        height: 220px;
        padding: 12px;
    }
    
    .product__details__pic__item {
        min-height: 250px;
        padding: 12px;
    }
}

/* Garantir que set-bg não sobrescreva */
.featured__item__pic.set-bg,
.product__item__pic.set-bg {
    background-size: contain !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-color: #fff !important;
}

/* Hover suave nas imagens */
.featured__item:hover .featured__item__pic img,
.product__item:hover .product__item__pic img {
    transform: scale(1.05);
    transition: transform 0.3s ease;
}

/* Loading skeleton para imagens */
.featured__item__pic[data-loading="true"],
.product__item__pic[data-loading="true"] {
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
    animation: loading 1.5s infinite;
}

@keyframes loading {
    0% {
        background-position: 200% 0;
    }
    100% {
        background-position: -200% 0;
    }
}

/* Lazy loading - fade in */
.featured__item__pic img[loading="lazy"],
.product__item__pic img[loading="lazy"] {
    opacity: 0;
    transition: opacity 0.3s ease;
}

.featured__item__pic img[loading="lazy"].loaded,
.product__item__pic img[loading="lazy"].loaded {
    opacity: 1;
}