/*
Theme Name: Astra Child
Description: Child theme of Astra
Template: astra
Version: 1.0
*/



/* Import parent theme styles */
@import url("../astra/style.css");


/* Beautiful WooCommerce Product Cards for Astra Theme */

/* Import Google Font for better typography */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

/* Main Product Item Container */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    overflow: hidden;
    border: 1px solid rgba(229, 231, 235, 0.6);
    margin-bottom: 2rem;
    position: relative;
}

.woocommerce ul.products li.product:hover,
.woocommerce-page ul.products li.product:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15);
    border-color: rgba(59, 130, 246, 0.3);
}

/* Thumbnail Wrapper */
.astra-shop-thumbnail-wrap {
    position: relative;
    overflow: hidden;
    border-radius: 16px 16px 0 0;
    background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
}

/* Product Image */
.astra-shop-thumbnail-wrap img {
    width: 100%;
    height: 250px;
    object-fit: cover;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    border-radius: 0;
}

.woocommerce ul.products li.product:hover .astra-shop-thumbnail-wrap img {
    transform: scale(1.05);
}

/* Sale Badge */
.woocommerce span.onsale {
    position: absolute;
    top: 12px;
    left: 12px;
    background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
    
    color: white;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    font-family: 'Inter', sans-serif;
    letter-spacing: 0.5px;
    z-index: 2;
    box-shadow: 0 2px 8px rgba(239, 68, 68, 0.3);
}

/* Summary Wrapper */
.astra-shop-summary-wrap {
    padding: 20px 20px 24px;
    background: #ffffff;
}

/* Product Title */
.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2 {
    font-family: 'Inter', sans-serif !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
    color: #1f2937 !important;
    margin: 0 0 12px 0 !important;
    transition: color 0.2s ease;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.woocommerce ul.products li.product:hover .woocommerce-loop-product__title,
.woocommerce ul.products li.product:hover h2 {
    color: #115989 !important;
}

/* Star Rating */
.woocommerce .star-rating {
    margin: 0 0 12px 0;
    font-size: 14px;
}

.woocommerce .star-rating::before {
    color: #e5e7eb;
}

.woocommerce .star-rating span::before {
    color: #fbbf24;
}

/* Price */
.woocommerce ul.products li.product .price {
    font-family: 'Inter', sans-serif !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #059669 !important;
    margin: 12px 0 16px 0 !important;
    display: block;
}

.woocommerce ul.products li.product .price del {
    color: #9ca3af !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    margin-right: 8px;
}

.woocommerce ul.products li.product .price ins {
    text-decoration: none !important;
    color: #059669 !important;
}

/* Add to Cart Button */
.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product .add_to_cart_button {
    /*background: linear-gradient(135deg, #3b82f6 0%, #1d4ed8 100%) !important;*/
    color: white !important;
    border: none !important;
    padding: 12px 24px !important;
    border-radius: 10px !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: 0.3px !important;
    text-transform: none !important;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1) !important;
    width: 100% !important;
    text-align: center !important;
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3) !important;
    position: relative;
    overflow: hidden;
}

.woocommerce ul.products li.product .button:hover,
.woocommerce ul.products li.product .add_to_cart_button:hover,
.woocommerce ul.products li.product a.button:hover,
.woocommerce-page ul.products li.product .button:hover,
.woocommerce-page ul.products li.product .add_to_cart_button:hover,
.woocommerce-page ul.products li.product a.button:hover {
    /*background: linear-gradient(135deg, #1d4ed8 0%, #1e40af 100%) !important;*/
    background-color: #CF3028;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 20px rgba(59, 130, 246, 0.4) !important;
}

.woocommerce ul.products li.product .button:active,
.woocommerce ul.products li.product .add_to_cart_button:active {
    transform: translateY(0) !important;
}

/* Loading state for AJAX add to cart */
.woocommerce ul.products li.product .button.loading,
.woocommerce ul.products li.product .add_to_cart_button.loading {
    opacity: 0.7;
    pointer-events: none;
}

/* Added to cart state */
.woocommerce ul.products li.product .added_to_cart {
    background: linear-gradient(135deg, #059669 0%, #047857 100%) !important;
    color: white !important;
    border: none !important;
    padding: 8px 16px !important;
    border-radius: 6px !important;
    font-family: 'Inter', sans-serif !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    margin-top: 8px !important;
    display: inline-block !important;
    text-decoration: none !important;
}

/* Product Link Overlay */
.woocommerce ul.products li.product .woocommerce-LoopProduct-link,
.woocommerce ul.products li.product .ast-loop-product__link {
    text-decoration: none;
}

/* Responsive Design */
@media (max-width: 768px) {
    .astra-shop-thumbnail-wrap img {
        height: 200px;
    }
    
    .astra-shop-summary-wrap {
        padding: 16px;
    }
    
    .woocommerce ul.products li.product .woocommerce-loop-product__title,
    .woocommerce ul.products li.product h2 {
        font-size: 15px !important;
    }
    
    .woocommerce ul.products li.product .price {
        font-size: 16px !important;
    }
}




/* Mobile adjustments */
@media (max-width: 768px) {
    .woocommerce ul.products {
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important;
    }
    
    .woocommerce ul.products li.product {
        min-width: 300px !important;
        max-width: none !important;
    }
}

@media (max-width: 480px) {
    .woocommerce ul.products {
        grid-template-columns: 1fr !important;
        gap: 1.5rem !important;
    }
    
    .woocommerce ul.products li.product {
        min-width: 100% !important;
        max-width: 100% !important;
    }
}








/* Add this to your existing style.css - Grid Container Reset */
.woocommerce ul.products,
.woocommerce-page ul.products {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)) !important;
    gap: 2rem !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

/* Reset any potential pseudo-elements or inherited content */
.woocommerce ul.products::before,
.woocommerce ul.products::after,
.woocommerce-page ul.products::before,
.woocommerce-page ul.products::after {
    display: none !important;
    content: none !important;
}

/* Ensure first child starts properly */
.woocommerce ul.products li.product:first-child,
.woocommerce-page ul.products li.product:first-child {
    grid-column: 1;
    grid-row: 1;
}

/* Additional reset for product items */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
    width: 100% !important;
    min-width: 320px !important;
    max-width: 400px !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
    position: relative !important;
    display: block !important;
    /* Remove aspect-ratio for now to test */
    /* aspect-ratio: 3/4 !important; */
}




/* Better cart icon */
.woocommerce ul.products li.product .button::before,
.woocommerce ul.products li.product .add_to_cart_button::before {
    content: "";
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-right: 8px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 24 24'%3E%3Cpath d='M7 18c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zM1 2v2h2l3.6 7.59-1.35 2.45c-.16.28-.25.61-.25.96 0 1.1.9 2 2 2h12v-2H7.42c-.14 0-.25-.11-.25-.25l.03-.12L8.1 13h7.45c.75 0 1.41-.41 1.75-1.03L21.7 4H5.21l-.94-2H1zm16 16c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
}













/* Increase main container width */
.ast-container {
    max-width: 1400px !important; /* Adjust as needed */
}

/* For single posts specifically */
.single .ast-container {
    max-width: 1600px !important;
}

/* Elementor container width */
.elementor-section.elementor-section-boxed > .elementor-container {
    max-width: 1400px !important;
}

/* Full width for Elementor sections */
.elementor-section.elementor-section-full_width {
    width: 100% !important;
}

/* Responsive adjustments */
@media (max-width: 1200px) {
    .ast-container {
        max-width: 95% !important;
    }
}