/**
 * La Finca Product Cards - Compatibilidad específica con Divi
 * 
 * Este archivo contiene estilos específicos para asegurar
 * que las tarjetas de producto funcionen perfectamente con el tema Divi
 * 
 * @package La_Finca_Product_Cards
 */

/* =========================================
   Reset de estilos Divi para productos
   ========================================= */

/* Grid de productos en módulos Divi */
.et_pb_shop ul.products.lfc-products-grid,
.et_pb_wc_related_products ul.products.lfc-products-grid,
.et_pb_wc_upsells ul.products.lfc-products-grid,
.et_pb_wc_cross_sells ul.products.lfc-products-grid {
    display: grid !important;
    grid-template-columns: repeat(var(--lfc-columns, 4), 1fr) !important;
    gap: var(--lfc-gap, 1.5rem) !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

/* Fix para pseudo-elementos que crean espacios vacíos */
.et_pb_shop ul.products.lfc-products-grid::before,
.et_pb_shop ul.products.lfc-products-grid::after,
.et_pb_wc_related_products ul.products.lfc-products-grid::before,
.et_pb_wc_related_products ul.products.lfc-products-grid::after,
.woocommerce ul.products.lfc-products-grid::before,
.woocommerce ul.products.lfc-products-grid::after {
    content: none !important;
    display: none !important;
}

/* Items de producto */
.et_pb_shop ul.products.lfc-products-grid li.product,
.et_pb_wc_related_products ul.products.lfc-products-grid li.product,
.et_pb_wc_upsells ul.products.lfc-products-grid li.product,
.et_pb_wc_cross_sells ul.products.lfc-products-grid li.product {
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    clear: none !important;
}

/* Ocultar elementos por defecto de WooCommerce/Divi */
.et_pb_shop .lfc-products-grid .woocommerce-loop-product__link,
.et_pb_shop .lfc-products-grid .woocommerce-LoopProduct-link,
.et_pb_shop .lfc-products-grid .product .star-rating,
.et_pb_shop .lfc-products-grid .product .price:not(.lfc-card-price *),
.et_pb_shop .lfc-products-grid .product .button:not(.lfc-add-to-cart-btn) {
    display: none !important;
}

/* =========================================
   Tarjeta de producto en Divi
   ========================================= */
.et_pb_module .lfc-product-card,
.et_pb_shop .lfc-product-card {
    text-align: left !important;
    margin: 0 !important;
    border: none;
}

/* Asegurar box-sizing correcto */
.et_pb_module .lfc-product-card *,
.et_pb_shop .lfc-product-card * {
    box-sizing: border-box !important;
}

/* Tipografía - Override de Divi */
.et_pb_module .lfc-card-title,
.et_pb_shop .lfc-card-title {
    font-family: var(--lfc-font-display) !important;
    font-size: 1.15rem !important;
    line-height: 1.3 !important;
    margin: 0 !important;
    padding: 0 !important;
}

.et_pb_module .lfc-card-title a,
.et_pb_shop .lfc-card-title a {
    color: var(--lfc-gray-800) !important;
}

.et_pb_module .lfc-card-title a:hover,
.et_pb_shop .lfc-card-title a:hover {
    color: var(--lfc-primary) !important;
}

/* Precio */
.et_pb_module .lfc-card-price,
.et_pb_shop .lfc-card-price {
    font-family: var(--lfc-font-body) !important;
}

.et_pb_module .lfc-card-price .woocommerce-Price-amount,
.et_pb_shop .lfc-card-price .woocommerce-Price-amount {
    font-size: 1.1rem !important;
    color: var(--lfc-gray-800) !important;
}

/* Botones */
.et_pb_module .lfc-add-to-cart-btn,
.et_pb_shop .lfc-add-to-cart-btn {
    font-family: var(--lfc-font-body) !important;
    background: var(--lfc-primary) !important;
    border: none !important;
    border-radius: var(--lfc-radius-md) !important;
}

.et_pb_module .lfc-add-to-cart-btn:hover,
.et_pb_shop .lfc-add-to-cart-btn:hover {
    background: var(--lfc-primary-light) !important;
}

.et_pb_module .lfc-add-to-cart-btn.lfc-variable-product,
.et_pb_shop .lfc-add-to-cart-btn.lfc-variable-product {
    background: var(--lfc-gray-200) !important;
}

.et_pb_module .lfc-add-to-cart-btn.lfc-variable-product.ready,
.et_pb_shop .lfc-add-to-cart-btn.lfc-variable-product.ready {
    background: var(--lfc-primary) !important;
}

/* =========================================
   Columnas Divi
   ========================================= */
/* Ajustar columnas según el ancho del módulo */
.et_pb_column_1_2 .lfc-products-grid {
    --lfc-columns: 2 !important;
}

.et_pb_column_1_3 .lfc-products-grid {
    --lfc-columns: 2 !important;
}

.et_pb_column_1_4 .lfc-products-grid {
    --lfc-columns: 1 !important;
}

.et_pb_column_2_3 .lfc-products-grid {
    --lfc-columns: 3 !important;
}

.et_pb_column_3_4 .lfc-products-grid {
    --lfc-columns: 3 !important;
}

/* Full width */
.et_pb_column_4_4 .lfc-products-grid {
    --lfc-columns: 4 !important;
}

/* =========================================
   Divi Builder Visual Mode
   ========================================= */
.et-fb-post-content .lfc-products-grid,
.et-fb-root-ancestor .lfc-products-grid {
    display: grid !important;
}

.et-fb-post-content .lfc-product-card,
.et-fb-root-ancestor .lfc-product-card {
    pointer-events: none;
}

.et-fb-post-content .lfc-add-to-cart-btn,
.et-fb-post-content .lfc-variation-option,
.et-fb-post-content .lfc-qty-btn,
.et-fb-root-ancestor .lfc-add-to-cart-btn,
.et-fb-root-ancestor .lfc-variation-option,
.et-fb-root-ancestor .lfc-qty-btn {
    pointer-events: none !important;
    cursor: default !important;
}

/* =========================================
   Imágenes en Divi
   ========================================= */
.et_pb_module .lfc-card-image-wrapper img,
.et_pb_shop .lfc-card-image-wrapper img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    max-width: none !important;
}

.et_pb_module .lfc-card-image-wrapper,
.et_pb_shop .lfc-card-image-wrapper {
    overflow: hidden !important;
}

/* =========================================
   Links y overlay
   ========================================= */
.et_pb_shop .lfc-products-grid .et_overlay,
.et_pb_shop .lfc-products-grid .et_shop_image {
    display: none !important;
}

.et_pb_shop .lfc-card-image-link {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
}

/* =========================================
   Hover effects
   ========================================= */
.et_pb_shop .lfc-product-card:hover {
    transform: none !important;
    box-shadow: var(--lfc-shadow-hover) !important;
}

.et_pb_shop .lfc-product-card:hover .lfc-card-image-hover {
    opacity: 1 !important;
}

.et_pb_shop .lfc-product-card:hover .lfc-card-quick-actions {
    opacity: 1 !important;
    transform: translateX(0) !important;
}

/* =========================================
   Responsive para Divi
   ========================================= */
@media (max-width: 980px) {
    .et_pb_column_1_2 .lfc-products-grid,
    .et_pb_column_2_3 .lfc-products-grid,
    .et_pb_column_3_4 .lfc-products-grid,
    .et_pb_column_4_4 .lfc-products-grid {
        --lfc-columns: 2 !important;
    }
    
    .et_pb_column_1_3 .lfc-products-grid,
    .et_pb_column_1_4 .lfc-products-grid {
        --lfc-columns: 1 !important;
    }
}

@media (max-width: 767px) {
    .et_pb_shop ul.products.lfc-products-grid {
        --lfc-columns: 1 !important;
    }
    
    .et_pb_column .lfc-products-grid {
        --lfc-columns: 1 !important;
    }
}

/* =========================================
   Divi Theme Header Cart
   ========================================= */
.et-cart-info .et-cart-count.lfc-cart-updated {
    animation: lfc-cartBounce 0.4s ease !important;
}

/* =========================================
   Divi WooCommerce Modules
   ========================================= */

/* Product Grid Module */
.et_pb_wc_products .lfc-products-grid {
    display: grid !important;
}

/* Related Products */
.et_pb_wc_related_products .lfc-products-grid {
    margin-top: 0 !important;
}

/* Upsells */
.et_pb_wc_upsells .lfc-products-grid {
    margin-top: 0 !important;
}

/* Cart Cross-sells */
.et_pb_wc_cross_sells .lfc-products-grid {
    margin-top: 0 !important;
}

/* =========================================
   Divi Extra Theme Support
   ========================================= */
.extra .lfc-products-grid {
    display: grid !important;
}

.extra .lfc-product-card {
    text-align: left !important;
}

/* =========================================
   Divi Blog Module with Shop
   ========================================= */
.et_pb_blog_grid .lfc-products-grid {
    display: grid !important;
}

/* =========================================
   Animaciones en Divi
   ========================================= */
.et_pb_module .lfc-animate {
    animation: lfc-fadeInUp 0.6s cubic-bezier(0.4, 0, 0.2, 1) forwards !important;
    opacity: 0 !important;
}

.et_pb_module .lfc-animate.lfc-animate-in {
    opacity: 1 !important;
}

/* Divi's own animation shouldn't conflict */
.et_pb_module[class*="et_pb_animation"] .lfc-product-card {
    animation-delay: inherit;
}

/* =========================================
   Fix para z-index en Divi
   ========================================= */
.et_pb_section .lfc-toast {
    z-index: 999999 !important;
}

.et_pb_section .lfc-card-quick-actions {
    z-index: 10 !important;
}

.et_pb_section .lfc-card-badges {
    z-index: 10 !important;
}

/* =========================================
   Divi Fullwidth Section
   ========================================= */
.et_pb_fullwidth_section .lfc-products-grid {
    --lfc-columns: 4 !important;
    padding: 0 4% !important;
}

@media (max-width: 1200px) {
    .et_pb_fullwidth_section .lfc-products-grid {
        --lfc-columns: 3 !important;
    }
}

@media (max-width: 980px) {
    .et_pb_fullwidth_section .lfc-products-grid {
        --lfc-columns: 2 !important;
    }
}

@media (max-width: 767px) {
    .et_pb_fullwidth_section .lfc-products-grid {
        --lfc-columns: 1 !important;
    }
}

