/* Unified INGCO product markers for desktop and mobile cards. */
.product .marker {
    display: flex;
    box-sizing: border-box;
    width: max-content;
    max-width: 100%;
    margin: 0 0 4px;
    padding: 1px 5px;
    border-radius: 8px;
    color: #fff;
    font-size: 10px;
    line-height: 14px;
    white-space: normal;
}

.product .marker .markerText {
    display: block;
    padding: 0;
}

.product .marker--featured {
    background: #252525 !important;
}

.product .marker--sale {
    background: #ff9601 !important;
}

/* Reset the legacy global `svg` loader rule for product action icons. */
.product .actionIcon {
    position: static;
    top: auto;
    left: auto;
    display: inline-block;
    width: 18px;
    height: 18px;
    margin: 0;
    overflow: visible;
    transform: none;
}

/* Compact INGCO product cards for category listings on phones. */
@media all and (max-width: 767px) {
    #catalog .items.productList,
    #wishlist .items.productList {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 9px;
        box-sizing: border-box;
        width: 100%;
        margin: 0 0 22px;
        overflow: visible;
    }

    #catalog .items.productList > .clear,
    #wishlist .items.productList > .clear {
        display: none;
    }

    #catalog .items.productList > .product,
    #catalog .items.productList > .product:nth-child(n),
    #wishlist .items.productList > .product,
    #wishlist .items.productList > .product:nth-child(n) {
        float: none;
        box-sizing: border-box;
        width: auto !important;
        min-width: 0;
        height: auto !important;
        min-height: 366px;
        border: 1px solid #e5e5e5 !important;
        border-radius: 9px;
        background: #fff;
        overflow: hidden;
        box-shadow: 0 2px 9px rgba(24, 24, 24, 0.055);
    }

    #catalog .product .tabloid,
    #wishlist .product .tabloid {
        display: flex;
        flex-direction: column;
        box-sizing: border-box;
        width: 100%;
        height: 100%;
        min-height: 364px;
        padding: 10px;
        border: 0;
        background: #fff;
        overflow: visible;
    }

    #catalog .product:hover .tabloid,
    #wishlist .product:hover .tabloid {
        border: 0;
        background: #fff;
        box-shadow: none;
    }

    #catalog .product .markerContainer,
    #wishlist .product .markerContainer {
        top: 8px;
        right: 50px;
        left: 8px;
        z-index: 5;
    }

    #catalog .product .marker,
    #wishlist .product .marker {
        display: flex;
        box-sizing: border-box;
        width: max-content;
        max-width: 100%;
        margin: 0 0 4px;
        padding: 1px 5px;
        border-radius: 8px;
        color: #fff;
        font-size: 10px;
        line-height: 14px;
        white-space: normal;
    }

    #catalog .product .marker .markerText,
    #wishlist .product .marker .markerText {
        display: block;
        padding: 0;
    }

    #catalog .product .marker--featured,
    #wishlist .product .marker--featured {
        background: #252525 !important;
    }

    #catalog .product .marker--sale,
    #wishlist .product .marker--sale {
        background: #ff9601 !important;
    }

    #catalog .product .image,
    #wishlist .product .image {
        order: 1;
        margin: 18px 0 4px;
    }

    #catalog .product .picture,
    #wishlist .product .picture {
        display: flex;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;
        width: 100%;
        height: 144px;
        line-height: normal;
    }

    #catalog .product .picture img,
    #wishlist .product .picture img {
        width: auto;
        max-width: 100%;
        height: auto;
        max-height: 136px;
        object-fit: contain;
    }

    #catalog .product .name,
    #wishlist .product .name {
        order: 2;
        display: -webkit-box;
        height: 51px;
        min-height: 51px;
        margin: 3px 0 5px;
        color: #202020;
        font-size: 13px;
        font-weight: 400;
        line-height: 17px;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 3;
        overflow: hidden;
    }

    #catalog .product .middle,
    #wishlist .product .middle {
        display: inline;
        line-height: inherit;
        vertical-align: baseline;
    }

    #catalog .product .rating,
    #wishlist .product .rating {
        position: relative;
        order: 3;
        top: auto;
        right: auto;
        width: 79px;
        height: 15px;
        margin: 0 0 6px;
        transform: scale(0.82);
        transform-origin: left center;
    }

    #catalog .product .price,
    #wishlist .product .price {
        order: 4;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        min-height: 43px;
        margin: auto 0 8px;
        color: #151515;
        font-size: 18px;
        line-height: 22px;
    }

    #catalog .product .price .currentPrice,
    #wishlist .product .price .currentPrice {
        display: block;
        color: #151515;
        white-space: nowrap;
    }

    #catalog .product .price .discount,
    #wishlist .product .price .discount {
        order: -1;
        display: block;
        margin: 0 0 1px;
        padding: 0;
        color: #929292;
        font-size: 12px;
        font-weight: 400;
        line-height: 16px;
    }

    #catalog .product .price.outOfStock,
    #wishlist .product .price.outOfStock {
        justify-content: flex-end;
        font-size: 14px;
        line-height: 18px;
    }

    #catalog .product .addCart,
    #wishlist .product .addCart {
        order: 5;
        box-sizing: border-box;
        width: 100%;
        height: 42px;
        margin: 0;
        border-radius: 7px;
        background: #ff9601;
        color: #fff;
        font-size: 13px;
        font-weight: 500;
        line-height: 42px;
        white-space: nowrap;
    }

    #catalog .product .addCart:hover,
    #wishlist .product .addCart:hover {
        background: #ffa800;
    }

    #catalog .product .addCart .icon,
    #wishlist .product .addCart .icon {
        width: 19px;
        max-height: 19px;
        margin: -3px 5px 0 0;
        padding: 0;
    }

    #catalog .product .addCart.disabled,
    #wishlist .product .addCart.disabled {
        background: #c9c9c9;
        pointer-events: none;
    }

    #catalog .product .optional,
    #wishlist .product .optional {
        position: absolute;
        top: 8px;
        right: 8px;
        z-index: 7;
        display: flex;
        flex-direction: column;
        gap: 5px;
    }

    #catalog .product .optional .row,
    #wishlist .product .optional .row {
        display: contents;
        margin: 0;
        overflow: visible;
    }

    #catalog .product .optional .quickOrder,
    #catalog .product .optional .changeAvailable,
    #wishlist .product .optional .quickOrder,
    #wishlist .product .optional .changeAvailable {
        display: none !important;
    }

    #catalog .product .optional .addWishlist,
    #catalog .product .optional .addCompare,
    #wishlist .product .optional .addWishlist,
    #wishlist .product .optional .addCompare {
        position: relative;
        float: none;
        display: block;
        box-sizing: border-box;
        width: 32px !important;
        height: 32px;
        padding: 0;
        border: 1px solid #e2e2e2;
        border-radius: 50%;
        background: rgba(255, 255, 255, 0.96);
        color: #777;
        box-shadow: 0 1px 5px rgba(0, 0, 0, 0.09);
        line-height: 0;
        cursor: pointer;
    }

    #catalog .product .optional .addWishlist,
    #wishlist .product .optional .addWishlist {
        order: 1;
    }

    #catalog .product .optional .addCompare,
    #wishlist .product .optional .addCompare {
        order: 2;
    }

    #catalog .product .optional .addWishlist:hover,
    #catalog .product .optional .addCompare:hover,
    #wishlist .product .optional .addWishlist:hover,
    #wishlist .product .optional .addCompare:hover,
    #catalog .product .optional .addWishlist.added,
    #catalog .product .optional .addCompare.added,
    #wishlist .product .optional .addWishlist.added,
    #wishlist .product .optional .addCompare.added {
        border-color: #e2e2e2 !important;
        background: rgba(255, 255, 255, 0.96) !important;
        box-shadow: 0 1px 5px rgba(0, 0, 0, 0.09) !important;
    }

    #catalog .product .optional .addWishlist .icon,
    #catalog .product .optional .addCompare .icon,
    #wishlist .product .optional .addWishlist .icon,
    #wishlist .product .optional .addCompare .icon {
        position: absolute;
        top: 50%;
        left: 50%;
        display: block;
        box-sizing: border-box;
        width: 20px;
        height: 20px;
        margin: 0 !important;
        padding: 0 !important;
        transform: translate(-50%, -50%);
        object-fit: contain;
        pointer-events: none;
    }

    #catalog .product .optional .addCompare.added .icon,
    #wishlist .product .optional .addCompare.added .icon {
        color: #ff9601;
    }

    #catalog .product .optional [data-list-label],
    #wishlist .product .optional [data-list-label] {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }
}

@media all and (max-width: 359px) {
    #catalog .items.productList,
    #wishlist .items.productList {
        gap: 6px;
    }

    #catalog .product .tabloid,
    #wishlist .product .tabloid {
        padding: 8px;
    }

    #catalog .product .picture,
    #wishlist .product .picture {
        height: 132px;
    }

    #catalog .product .picture img,
    #wishlist .product .picture img {
        max-height: 126px;
    }

    #catalog .product .name,
    #wishlist .product .name {
        font-size: 12px;
        line-height: 16px;
    }

    #catalog .product .price,
    #wishlist .product .price {
        font-size: 16px;
    }
}