/* Hide only the default WooCommerce add-to-cart button in the grid, but NOT custom quick actions */
.woocommerce ul.products li.product > a.button.add_to_cart_button {
    display: none !important;
}

/* Hide the screen reader text associated with the default add-to-cart button */
.woocommerce ul.products li.product > span.screen-reader-text[id*="woocommerce_loop_add_to_cart_link_describedby"] {
    display: none !important;
}

/* Make all product cards equal height regardless of content */
.woocommerce ul.products li.product {
    min-height: 420px;
}
/* SALE BADGE: Make 'sale!' tag smaller and top-right */
.woocommerce span.onsale {
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    left: auto !important;
    min-width: unset !important;
    min-height: unset !important;
    font-size: 11px !important;
    padding: 2px 8px !important;
    border-radius: 10px !important;
    background: var(--warning-color) !important;
    color: var(--white) !important;
    z-index: 2 !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    font-weight: 700 !important;
    letter-spacing: 0.5px;
    height: 20px !important;
    line-height: 16px !important;
}

/* Ensure product card is positioned for absolute badge */
.woocommerce ul.products li.product {
    position: relative;
}

/* Price block: normalize margin and display to avoid button misalignment */
.woocommerce ul.products li.product .price {
    display: block !important;
    margin-bottom: 10px !important;
    min-height: 1.5em;
}

/* Remove extra gap below add-to-cart button */
.woocommerce ul.products li.product .button {
    margin-bottom: 0 !important;
    margin-top: 10px !important;
    display: block !important;
}

/* Remove extra margin from del/ins in price to keep height consistent */
.woocommerce ul.products li.product .price del,
.woocommerce ul.products li.product .price ins {
    margin: 0 !important;
    display: inline-block !important;
    vertical-align: middle !important;
}
/**
 * WooCommerce Grid Styles - Minecraft Theme
 * Bootstrap-based responsive grid layouts
 */

/* Bootstrap-based Product Grid System */
.woocommerce ul.products,
.woocommerce.archive .products,
.woocommerce ul.products.columns-3,
.woo-shop-page .woocommerce ul.products,
.woocommerce ul.products.columns-5,
.woocommerce.tax-product_cat .products,
.woocommerce.single-product .related .products,
.woo-category-page .woocommerce ul.products {
    display: flex !important;
    flex-wrap: wrap !important;
    margin: 0 auto !important;
    padding: 1rem 0 !important;
    list-style: none !important;
    gap: 24px !important;
    justify-content: center !important;
    align-items: stretch !important;
}

/* Product Items - Bootstrap Column Behavior with proper spacing */
.woocommerce ul.products li.product {
    margin-bottom: 30px !important;
    list-style: none !important;
    float: none !important;
    width: 100%;
    max-width: 350px;
    box-sizing: border-box !important;
    flex: 1 1 300px;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    height: 100%;
}

/* Shop Page Categories - 3 columns override */
.woo-shop-page .woocommerce ul.products.columns-3 li.product,
.woocommerce.woo-shop-page ul.products li.product {
    flex: 0 0 calc(33.333% - 16px);
    max-width: calc(33.333% - 16px);
}

/* Product Category Pages - 5 columns override */
.woo-category-page .woocommerce ul.products.columns-5 li.product,
.woocommerce.woo-category-page ul.products li.product {
    flex: 0 0 calc(20% - 19.2px);
    max-width: calc(20% - 19.2px);
}

/* Wrap product content for flex grow/shrink */
.woocommerce ul.products li.product .product-inner,
.woocommerce ul.products li.product > a,
.woocommerce ul.products li.product .product-wrapper {
    flex: 1 1 auto;
    display: flex !important;
    flex-direction: column;
    justify-content: flex-start;
    min-height: 0;
}

/* Make product inner content fill height and align button to bottom */
.woocommerce ul.products li.product > a,
.woocommerce ul.products li.product .product-wrapper {
    flex: 1 1 auto;
    display: flex !important;
    flex-direction: column;
}

/* Ensure price block always same height for all cards */
.woocommerce ul.products li.product .price {
    min-height: 2.6em !important; /* enough for two lines (del+ins) */
    margin-bottom: 0 !important;
    display: block !important;
    line-height: 1.2;
    align-items: flex-start;
    justify-content: flex-start;
}

/* Force add-to-cart button to bottom, remove extra gap */
.woocommerce ul.products li.product .button {
    margin: 0 !important;
    margin-top: auto !important;
    align-self: stretch !important;
    display: block !important;
}

/* Add margin to the actual product card content */
.woocommerce ul.products li.product > a,
.woocommerce ul.products li.product .product-wrapper {
    margin: 10px !important;
}

/* Shop Page Categories - 3 columns (col-lg-4) */


/* Product Category Pages - 5 columns (custom) */


/* Bootstrap Responsive Breakpoints */

/* Large devices (desktops, 992px and up) */
@media (max-width: 1199.98px) {
    .woocommerce ul.products li.product {
        max-width: 320px;
        flex: 1 1 280px;
    }
    
    /* Shop Page Categories - 3 columns on large screens */
    .woo-shop-page .woocommerce ul.products.columns-3 li.product,
    .woocommerce.woo-shop-page ul.products li.product {
        flex: 0 0 calc(33.333% - 16px);
        max-width: calc(33.333% - 16px);
    }
    
    /* Product Category Pages - 4 columns on large screens instead of 5 */
    .woo-category-page .woocommerce ul.products.columns-5 li.product,
    .woocommerce.woo-category-page ul.products li.product {
        flex: 0 0 calc(25% - 18px);
        max-width: calc(25% - 18px);
    }
}

/* Medium devices (tablets, 768px and up) */
@media (max-width: 991.98px) {
    .woocommerce ul.products li.product {
        max-width: 300px;
        flex: 1 1 240px;
    }
    
    /* Shop Page Categories - 2 columns on medium screens */
    .woo-shop-page .woocommerce ul.products.columns-3 li.product,
    .woocommerce.woo-shop-page ul.products li.product {
        flex: 0 0 calc(50% - 12px);
        max-width: calc(50% - 12px);
    }
    
    /* Product Category Pages - 3 columns on medium screens */
    .woo-category-page .woocommerce ul.products.columns-5 li.product,
    .woocommerce.woo-category-page ul.products li.product {
        flex: 0 0 calc(33.333% - 16px);
        max-width: calc(33.333% - 16px);
    }
}

@media (max-width: 767.98px) {
    .woocommerce ul.products li.product {
        max-width: 90vw;
        flex: 1 1 90vw;
    }
    
    /* All pages - 2 columns on tablets */
    .woo-shop-page .woocommerce ul.products.columns-3 li.product,
    .woocommerce.woo-shop-page ul.products li.product,
    .woo-category-page .woocommerce ul.products.columns-5 li.product,
    .woocommerce.woo-category-page ul.products li.product {
        flex: 0 0 calc(50% - 12px);
        max-width: calc(50% - 12px);
    }
}

/* Small devices (landscape phones, 576px and up) */
@media (max-width: 575.98px) {
    .woocommerce ul.products li.product {
        max-width: 98vw;
        flex: 1 1 98vw;
        margin: 0 auto 30px auto !important;
    }
    
    /* All pages - 1 column on mobile */
    .woo-shop-page .woocommerce ul.products.columns-3 li.product,
    .woocommerce.woo-shop-page ul.products li.product,
    .woo-category-page .woocommerce ul.products.columns-5 li.product,
    .woocommerce.woo-category-page ul.products li.product {
        flex: 0 0 98vw;
        max-width: 98vw;
    }
}

/* Additional WooCommerce fixes */
.woocommerce ul.products {
    clear: both !important;
}

/* Remove any pseudo-element content from products list that causes gaps */
.woocommerce ul.products::before,
.woocommerce ul.products::after {
    content: none !important;
    display: none !important;
}

.woocommerce ul.products li.product {
    list-style: none !important;
    float: none !important;
    clear: none !important;
}

/* Ensure container spacing */
.woocommerce-page .container,
.woocommerce .container {
    padding-left: 15px !important;
    padding-right: 15px !important;
}

/* Clearfix and layout stability */
.woocommerce:before,
.woocommerce:after {
    content: "" !important;
    display: table !important;
    clear: both !important;
}

.woocommerce {
    zoom: 1 !important;
}

/* Prevent layout shifts */
.woocommerce .products,
.woocommerce ul.products {
    min-height: 200px !important;
}

/* Fix category title centering - ensure consistent alignment */
.woocommerce .product-category .woocommerce-loop-category__title {
    position: absolute !important;
    bottom: 2rem !important;
    left: 2rem !important;
    right: 2rem !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-grow: 0 !important;
    height: auto !important;
    text-align: center !important;
    width: auto !important;
}

/* Specific selectors for both first and other category cards */
.woocommerce ul.products li.product-category a h2.woocommerce-loop-category__title,
.woocommerce ul.products li.product-category.first a h2.woocommerce-loop-category__title {
    position: absolute !important;
    bottom: 2rem !important;
    left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    width: calc(100% - 4rem) !important;
}

/* Adjust category container to accommodate absolute positioned title and image */
.woocommerce .product-category {
    position: relative !important;
    padding: 0 !important;
    padding-bottom: 4rem !important;
    padding-top: 280px !important;
}

/* Additional mobile and tablet fixes */
@media (max-width: 991px) {
    .woocommerce ul.products {
        justify-content: center !important;
    }
    .woocommerce .product {
        max-width: 100% !important;
    }
}
