/**
 * Product Grid Styles
 * 
 * Styles for WooCommerce product grids and lists
 * including custom product list items and default WooCommerce product displays
 */

/* ========================================
   CUSTOM PRODUCT LIST ITEMS (.r-product-list-item)
   ======================================== */

/* Removing underline from links in product list grid */
.r-product-list-item a {
    text-decoration: none;
}

/* Removing margins around price column in products list grid*/
.r-price-column-wrapper .wp-block-columns-is-layout-flex {
    margin: 0;
}

/* Making shadow effect on hover in product list grid */
.r-product-list-item:hover {
    box-shadow: 0px 0px 11px rgba(0, 0, 0, 0.85);
    transition: all 0.2s ease-in-out 0s;
}
.r-product-list-item {
    box-shadow: 0px 0px 11px rgba(0, 0, 0, 0.0);
    transition: all 0.8s ease-out 0s;
}

/* Redesigning "Add to cart" section */
.r-product-list-item .gb-container .cart {
    --margins: 18px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

/* Centering input number */
.r-product-list-item .gb-container .cart .quantity input {
    text-align: center;
    width: calc(70px + var(--margins));
}

/* Fixing space for mobile between amount, show cart */
@media (max-width: 768px) {
    .r-product-list-item .gb-container .cart button {
        margin-left: var(--margins);
        margin-right: var(--margins);
    }
}

/* moving minus and plus buttons */
.r-product-list-item .gb-container .cart .quantity.buttons-added {
    margin-left: var(--margins);
}
.r-product-list-item .gb-container .cart .minus {
    margin-right: calc(var(--margins) * -1);
    margin-top: -4px;
    z-index: 1;
}
.r-product-list-item .gb-container .cart .plus {
    margin-left: calc(var(--margins) * -1);
}
.r-product-list-item .gb-container .cart .quantity.buttons-added a {
    color: var(--eb-global-text-color);
}

/* Hide in stock amount on lists and single product */
.product .stock.in-stock {
    display: none;
}

/* Changing behaviour for 1 item available product */
.do-quantity-buttons .r-product-list-item form.cart .quantity:not(.buttons-added):not(.hidden):before {
    content: "1";
    border: none;
    min-height: unset;
}
.do-quantity-buttons .r-product-list-item form.cart .quantity:not(.buttons-added):not(.hidden):after {
    display: none;
}

/* Changing appearance of "Show cart" link */
.r-product-list-item a.added_to_cart.wc-forward {
    font-weight: normal;
    color: var(--global-red);
}

/* Showing two columns for products a little longer */
@media (max-width: 767px) {
    .r-product-list.gb-grid-wrapper > .gb-grid-column.gb-query-loop-item.product {
        width: 50%;
    }
}
@media (max-width: 500px) {
    .r-product-list.gb-grid-wrapper > .gb-grid-column.gb-query-loop-item.product {
        width: 100%;
    }
}

/* ========================================
   WOOCOMMERCE DEFAULT PRODUCT GRID
   ======================================== */

.woocommerce ul.products li.product {
    text-align: center;
    padding-bottom: 10px;
    margin-bottom: 40px;
    margin-top: 5px;
}

/* Hiding number of items and sorting */
.woocommerce-result-count, .woocommerce-ordering {
    display: none;
}

/* Fixing price size */
.woocommerce ul.products li.product .price {
    font-size: unset !important;
}

/* Adjusting Sale badge */
.woocommerce ul.products li.product .onsale {
    background-color: #cc1818;
}

/* Adjusting on sale product price color */
.price ins .woocommerce-Price-amount {
    color: #cc1818;
}

/* Products list Add to cart button */
.product .price del {
    color: #222222;
}

.woocommerce ul.products li.product .button {
    color: #ffffff;
    background-color: #55555e;
    font-weight: inherit;
    border-radius: 50px;
    margin-top: 0;
}

.wc-block-grid__product-title, .wc-block-grid__product-link {
    font-size: 1.3em;
}

/* Align Add to cart buttons in a grid */
.woocommerce ul.products li.product h2.woocommerce-loop-product__title {
    line-height: 2.4ex;
    height: 4.6ex;
    overflow: hidden;
    padding-top: 0;
    padding-bottom: 0;
    font-weight: 600;
}

/* Reducing spaces in a product grid */
.woocommerce ul.products li.product a img {
    margin: 0;
    max-width: 300px;
    margin-left: auto;
    margin-right: auto;
}

/* Making nice hover effects in product grid */
.woocommerce ul.products li.product:hover {
    box-shadow: 0px 0px 11px rgba(0, 0, 0, 0.85) !important;
    transition: all 0.2s ease-in-out 0s;
}
.woocommerce ul.products li.product {
    box-shadow: 0px 0px 11px rgba(0, 0, 0, 0.0) !important;
    transition: all 0.8s ease-out 0s;
}

/* ========================================
   MOBILE RESPONSIVE
   ======================================== */

/* Two columns for mobile - commented out for now
@media (max-width: 768px) {
    .woocommerce ul.products[class*=columns-] li.product, 
    .woocommerce-page ul.products[class*=columns-] li.product {
        width: 49%;
        float: left;
        clear: both;
        margin: 0 0 3em;
    }
    .woocommerce ul.products[class*=columns-] li.product:nth-child(2n), 
    .woocommerce-page ul.products[class*=columns-] li.product:nth-child(2n) {
        float: right;
        clear: none !important;
    }
}
*/

/* Align Add to cart buttons in a grid for narrow mobile devices - commented out for now
@media (max-width: 768px) {
    .woocommerce ul.products li.product span.price {
        line-height: 3ex;
        height: 5.5ex;
        overflow: hidden;
        padding-top: 0px;
        font-size: medium !important;
    }
}
*/

/* ========================================
   DEFAULT WOOCOMMERCE PRODUCT LOOP STYLING
   ======================================== */

/* Shop page product grid */
.woocommerce ul.products li.product {
    background-color: var(--base);
    border-radius: 10px;
    padding: 15px;
    margin-bottom: 20px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.woocommerce ul.products li.product:hover {
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

.woocommerce ul.products li.product img {
    border-radius: 8px;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
    font-size: 1.1em;
    font-weight: 600;
    color: var(--global-dark-grey);
    margin: 10px 0 5px 0;
}

.woocommerce ul.products li.product .price {
    margin-bottom: 10px;
}

/* Loop add to cart button */
.woocommerce ul.products li.product .button {
    background-color: var(--accent-1);
    color: var(--global-white);
    border-radius: 20px;
    padding: 8px 16px;
    font-size: 14px;
    border: none;
    width: 100%;
    text-align: center;
}

.woocommerce ul.products li.product .button:hover {
    background-color: var(--global-dark-grey);
}