/* Product card redesign - homepage + category pages, mobile and desktop */
/* Safe to remove: delete this file and the <link> line added in header.tpl */

/* 1. Compare link removed - unused by customers */
.product-container .compare {
    display: none !important;
}

/* 2. Add to cart: one solid orange button, no cart icon.
      Selectors mirror the theme's own (product_list.css) plus one extra class, so they win. */
ul.product_list li .product-container .my_product_cart a.ajax_add_to_cart_button,
ul.product_list_featured li .product-container .my_product_cart a.ajax_add_to_cart_button {
    width: 100%;
    left: 0;
    right: auto;
    margin: 0;
    background: #fe8c29;
    border: none;
    border-radius: 5px;
    color: #fff;
    text-align: center;
}

ul.product_list li .product-container .my_product_cart a.ajax_add_to_cart_button:hover,
ul.product_list_featured li .product-container .my_product_cart a.ajax_add_to_cart_button:hover {
    background: #e87c1c;
    color: #fff;
}

.product-container .my_product_cart a.ajax_add_to_cart_button i.fa-shopping-cart {
    display: none;
}

/* 3. "Super pret" flag removed - the percentage badge already says it, and this one
      covered a large part of the product photo */
.product-container .reduction-flag {
    display: none !important;
}

/* 5. On phones the grid reserved 15px of padding on each side of every cell, leaving the
      visible card at 154px out of 184px. Tighten it so the card (and product photo) get
      that space back. */
@media (max-width: 767px) {
    ul.product_list li.ajax_block_product,
    ul.product_list_featured li.ajax_block_product {
        padding-left: 4px !important;
        padding-right: 4px !important;
    }
}

/* 4. Discount badge: small pill in the top right corner instead of a large block */
.product-container .reduction_percent_circle {
    top: 10px;
    right: 10px;
    left: auto;
    width: auto;
    height: auto;
    padding: 4px 9px;
    font-size: 12px;
    line-height: 1.3;
    border-radius: 999px;
}