/* =========================================================
   Cart / Checkout Mobile Backorder Highlight
   File: cart-mobile.css
   ========================================================= */

@media screen and (max-width: 800px) {

    /*
       Cart page backorder item.
       JS adds .jj-backorder-cart-item only to real backorder cart rows.
    */
    .wc-block-cart-items__row.jj-backorder-cart-item {
        background: #ffe5e5 !important;
        border: 1px solid #e00000 !important;
        border-radius: 6px !important;
        padding: 12px !important;
        margin-bottom: 12px !important;
    }

    .wc-block-cart-items__row.jj-backorder-cart-item,
    .wc-block-cart-items__row.jj-backorder-cart-item * {
        color: #d00000 !important;
    }

    .wc-block-cart-items__row.jj-backorder-cart-item img {
        background: #ffffff !important;
        border-radius: 4px !important;
    }

    .wc-block-cart-items__row.jj-backorder-cart-item .wc-block-components-product-badge {
        background: #ffffff !important;
        border-color: #e00000 !important;
        color: #d00000 !important;
        font-weight: 700 !important;
    }


    /*
       Checkout order summary backorder item.
       JS adds .jj-backorder-summary-item only to real backorder summary rows.
    */
    .wc-block-components-order-summary-item.jj-backorder-summary-item {
        background: #ffe5e5 !important;
        border: 1px solid #e00000 !important;
        border-radius: 6px !important;
        padding: 12px !important;
        margin-bottom: 12px !important;
    }

    .wc-block-components-order-summary-item.jj-backorder-summary-item,
    .wc-block-components-order-summary-item.jj-backorder-summary-item * {
        color: #d00000 !important;
    }

    .wc-block-components-order-summary-item.jj-backorder-summary-item img {
        background: #ffffff !important;
        border-radius: 4px !important;
    }

    .wc-block-components-order-summary-item.jj-backorder-summary-item .wc-block-components-product-badge {
        background: #ffffff !important;
        border-color: #e00000 !important;
        color: #d00000 !important;
        font-weight: 700 !important;
    }
}