/* ==========================================================
   OFFICE MAD — CART + CHECKOUT MASCOT PEEK V1.2

   CART:
   mascot peeks from LEFT edge.

   CHECKOUT:
   mascot peeks from RIGHT edge.

   Existing approved mascot image only.
   ========================================================== */

.om-mascot-peek {
    position: fixed;
    top: 48%;
    width: 118px;
    height: 128px;
    overflow: hidden;
    z-index: 35;
    pointer-events: none;
    transform: translateY(-50%);
}

.om-mascot-peek__image {
    position: absolute;
    width: 190px;
    max-width: none !important;
    height: auto !important;
    top: -2px;
    display: block;
    filter: drop-shadow(0 8px 12px rgba(0, 0, 0, .30));
}


/* CART — LEFT SIDE */

.om-mascot-peek--cart {
    left: 0;
    right: auto;
}

.om-mascot-peek--cart .om-mascot-peek__image {
    left: -48px;
    right: auto;
}


/* CHECKOUT — RIGHT SIDE */

.om-mascot-peek--checkout {
    right: 0;
    left: auto;
}

.om-mascot-peek--checkout .om-mascot-peek__image {
    right: -48px;
    left: auto;
}


/* TABLET */

@media (max-width: 1000px) {

    .om-mascot-peek {
        width: 96px;
        height: 108px;
        top: 46%;
    }

    .om-mascot-peek__image {
        width: 158px;
    }

    .om-mascot-peek--cart .om-mascot-peek__image {
        left: -42px;
    }

    .om-mascot-peek--checkout .om-mascot-peek__image {
        right: -42px;
    }
}


/* PHONE */

@media (max-width: 700px) {

    .om-mascot-peek {
        width: 72px;
        height: 82px;
        top: auto;
        bottom: 84px;
        transform: none;
    }

    .om-mascot-peek__image {
        width: 122px;
        top: 0;
    }

    .om-mascot-peek--cart .om-mascot-peek__image {
        left: -34px;
    }

    .om-mascot-peek--checkout .om-mascot-peek__image {
        right: -34px;
    }
}


/* ==========================================================
   OFFICE MAD — CART BUTTON MASCOT V1.3

   On Cart only, JavaScript anchors the existing mascot to the
   Proceed to Checkout button.

   The mascot sits BEHIND the right side of the green button.
   Checkout positioning remains the existing right-edge peek.
   ========================================================== */

body.woocommerce-cart .om-mascot-peek--cart.om-cart-button-peek {
    position: absolute;
    left: auto;
    right: auto;
    top: auto;
    bottom: auto;
    width: 118px;
    height: 138px;
    overflow: visible;
    transform: none;
    z-index: 1;
}

body.woocommerce-cart
.om-mascot-peek--cart.om-cart-button-peek
.om-mascot-peek__image {
    position: absolute;
    width: 170px;
    max-width: none !important;
    height: auto !important;
    left: 0;
    right: auto;
    top: 0;
    display: block;
    filter: drop-shadow(0 8px 12px rgba(0, 0, 0, .30));
}

body.woocommerce-cart
.wp-block-woocommerce-proceed-to-checkout-block {
    position: relative;
    z-index: 3;
}

body.woocommerce-cart
.wp-block-woocommerce-proceed-to-checkout-block
.wc-block-cart__submit {
    position: relative;
    z-index: 3;
}

body.woocommerce-cart
.wp-block-woocommerce-proceed-to-checkout-block
.wc-block-cart__submit-button {
    position: relative;
    z-index: 3;
}

@media (max-width: 700px) {

    body.woocommerce-cart .om-mascot-peek--cart.om-cart-button-peek {
        width: 82px;
        height: 100px;
    }

    body.woocommerce-cart
    .om-mascot-peek--cart.om-cart-button-peek
    .om-mascot-peek__image {
        width: 128px;
    }
}


/* ==========================================================
   OFFICE MAD — CART MASCOT INWARD FIX V1.4

   Keep the complete mascot positioning area inside the cart
   panel and let the green button visually cover his lower body.
   ========================================================== */

body.woocommerce-cart
.om-mascot-peek--cart.om-cart-button-peek {
    width: 126px;
    height: 142px;
    overflow: visible;
}

body.woocommerce-cart
.om-mascot-peek--cart.om-cart-button-peek
.om-mascot-peek__image {
    width: 158px;
    left: -8px;
    top: 0;
}

body.woocommerce-cart
.wp-block-woocommerce-proceed-to-checkout-block,
body.woocommerce-cart
.wp-block-woocommerce-proceed-to-checkout-block
.wc-block-cart__submit,
body.woocommerce-cart
.wp-block-woocommerce-proceed-to-checkout-block
.wc-block-cart__submit-button {
    position: relative;
    z-index: 3;
}

@media (max-width: 700px) {

    body.woocommerce-cart
    .om-mascot-peek--cart.om-cart-button-peek {
        width: 92px;
        height: 106px;
    }

    body.woocommerce-cart
    .om-mascot-peek--cart.om-cart-button-peek
    .om-mascot-peek__image {
        width: 118px;
        left: -5px;
    }
}


/* ==========================================================
   OFFICE MAD — CART MASCOT BUTTON CORNER V1.5

   Screenshot correction:
   - do NOT cover Estimated total
   - do NOT cover R total
   - sit at RIGHT END of green button
   - lower body hidden BEHIND button
   - head/hands visible above button
   ========================================================== */

body.woocommerce-cart
.om-mascot-peek--cart.om-cart-button-peek {
    width: 108px;
    height: 122px;
    overflow: visible;
    z-index: 1;
}

body.woocommerce-cart
.om-mascot-peek--cart.om-cart-button-peek
.om-mascot-peek__image {
    width: 136px;
    max-width: none !important;
    height: auto !important;
    left: -4px;
    right: auto;
    top: 0;
}

body.woocommerce-cart
.wp-block-woocommerce-proceed-to-checkout-block {
    position: relative !important;
    z-index: 10 !important;
}

body.woocommerce-cart
.wp-block-woocommerce-proceed-to-checkout-block
.wc-block-cart__submit {
    position: relative !important;
    z-index: 10 !important;
}

body.woocommerce-cart
.wp-block-woocommerce-proceed-to-checkout-block
.wc-block-cart__submit-button {
    position: relative !important;
    z-index: 10 !important;
}

@media (max-width: 700px) {

    body.woocommerce-cart
    .om-mascot-peek--cart.om-cart-button-peek {
        width: 78px;
        height: 90px;
    }

    body.woocommerce-cart
    .om-mascot-peek--cart.om-cart-button-peek
    .om-mascot-peek__image {
        width: 100px;
        left: -3px;
    }
}

/* OFFICE MAD — checkout mascot behind Place Order card/right edge 2026-10-03 */
body.woocommerce-checkout .om-mascot-peek--checkout {
    position: absolute !important;
    position: fixed !important;
    top: auto !important;
    bottom: 28px !important;
    right: 0 !important;
    left: auto !important;
    transform: none !important;
    z-index: 0 !important;
}
body.woocommerce-checkout .wc-block-checkout__actions,
body.woocommerce-checkout .wc-block-components-checkout-place-order-button { position:relative !important; z-index:2 !important; }
