.elementor-15606 .elementor-element.elementor-element-a7783ad{--display:flex;}.elementor-15606 .elementor-element.elementor-element-179377a .elementor-heading-title{color:var( --e-global-color-primary );}.elementor-15606 .elementor-element.elementor-element-23fd1c9.elementor-wc-products  ul.products{grid-column-gap:20px;grid-row-gap:40px;}.elementor-15606 .elementor-element.elementor-element-23fd1c9.elementor-wc-products ul.products li.product span.onsale{display:block;}@media(max-width:1024px){.elementor-15606 .elementor-element.elementor-element-23fd1c9.elementor-wc-products  ul.products{grid-column-gap:20px;grid-row-gap:40px;}}@media(max-width:768px){.elementor-15606 .elementor-element.elementor-element-23fd1c9.elementor-wc-products  ul.products{grid-column-gap:20px;grid-row-gap:40px;}}/* Start custom CSS for woocommerce-products, class: .elementor-element-23fd1c9 *//* Target the product section and make it relative for positioning */
.product-section {
    position: relative;
}

/* Add the Sale badge to all product images */
.product-section .product img,
.product-section .woocommerce-loop-product__thumbnail img,
.product-section .wp-block-woocommerce-product-image img {
    position: relative; /* Ensures badge overlays correctly */
}

/* Sale badge styling using ::before pseudo-element */
.product-section .product img::before,
.product-section .woocommerce-loop-product__thumbnail img::before,
.product-section .wp-block-woocommerce-product-image img::before {
    content: "Sale"; /* Badge text */
    position: absolute;
    top: 10px; /* Distance from top */
    right: 10px; /* Distance from right */
    background-color: #024b8f; /* Your brand blue */
    color: #fff;
    padding: 5px 10px;
    font-size: 0.875rem; /* 14px */
    font-weight: 600;
    text-transform: uppercase;
    border-radius: 4px;
    z-index: 10; /* Ensures badge is above image */
}

/* Responsive adjustments */
@media (max-width: 640px) {
    .product-section .product img::before,
    .product-section .woocommerce-loop-product__thumbnail img::before,
    .product-section .wp-block-woocommerce-product-image img::before {
        font-size: 0.75rem; /* Smaller on mobile */
        padding: 4px 8px;
        top: 5px;
        right: 5px;
    }
}/* End custom CSS */