/**
 * Subliminal Mart — Logo Badge
 * File: shop/mobile/mobile-style/components/badge.css
 */


/* ---------------------------------------------------------
   IMAGE / GALLERY ANCHOR
   --------------------------------------------------------- */
.product,
.product-card,
.product-thumb,
ul.products li.product,
.woocommerce div.product .woocommerce-product-gallery {
    position: relative !important;
}

.woocommerce div.product .woocommerce-product-gallery {
    overflow: visible !important;
}


/* ---------------------------------------------------------
   LOGO BADGE
   --------------------------------------------------------- */
.sm-badge-wrap {
    position: absolute !important;
    top: 2px !important;
    left: 2px !important;
    z-index: 50 !important;

    width: 30px !important;
    height: 30px !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;

    overflow: visible !important;
    pointer-events: none !important;

    transform: none !important;
}


/* Badge canvas */
.sm-badge {
    display: block !important;

    width: 30px !important;
    height: 30px !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;

    transform: none !important;
}


/* ---------------------------------------------------------
   LOGO IMAGE
   --------------------------------------------------------- */
.sm-badge-logo img {
    display: block !important;

    width: 30px !important;
    height: 30px !important;

    max-width: none !important;
    max-height: none !important;

    margin: 0 !important;
    padding: 0 !important;

    object-fit: contain !important;
    object-position: center !important;

    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;

    transform: none !important;

    /* Clean white separation from artwork */
    filter:
        drop-shadow(1px 0 0 #fff)
        drop-shadow(-1px 0 0 #fff)
        drop-shadow(0 1px 0 #fff)
        drop-shadow(0 -1px 0 #fff)
        drop-shadow(0 0 1px #fff)
        drop-shadow(0 1px 2px rgba(0,0,0,.18)) !important;
}


/* ---------------------------------------------------------
   MOBILE
   --------------------------------------------------------- */
@media (max-width: 768px) {

    .sm-badge-wrap {
        top: 2px !important;
        left: 2px !important;

        width: 30px !important;
        height: 30px !important;
    }

    .sm-badge,
    .sm-badge-logo img {
        width: 30px !important;
        height: 30px !important;
    }
}