/* Mobile bottom bar only — never show on desktop (xl / 1200px+) */

@media (min-width: 1200px) {
    .footer-device-mobile,
    .footer-device-mobile.besa-footer-customized {
        display: none !important;
        visibility: hidden !important;
    }
}

@media (max-width: 1199.98px) {
    .footer-device-mobile {
        display: flex !important;
        align-items: stretch;
        justify-content: space-around;
        gap: 0;
        background: #fff;
        border-top: 1px solid #e8e8e4;
        box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.06);
        padding: 6px 0 calc(6px + env(safe-area-inset-bottom, 0px));
        z-index: 999;
        position: fixed !important;
        bottom: 0 !important;
        left: 0 !important;
        right: 0 !important;
        top: auto !important;
        width: 100% !important;
    }

    .footer-device-mobile > div {
        flex: 1 1 0;
        min-width: 0;
        text-align: center;
    }

    .footer-device-mobile a {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 2px;
        padding: 6px 2px;
        text-decoration: none;
        color: #6b6b66;
        font-size: 10px;
        line-height: 1.2;
    }

    .footer-device-mobile a i,
    .footer-device-mobile a svg {
        font-size: 20px;
        width: 22px;
        height: 22px;
        line-height: 22px;
        margin: 0;
        color: inherit;
    }

    .footer-device-mobile a span:not(.mini-cart-items) {
        display: block;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .footer-device-mobile .device-home.active a,
    .footer-device-mobile .device-account.active a,
    .footer-device-mobile .device-categories.active a,
    .footer-device-mobile .device-brands.active a,
    .footer-device-mobile a:hover,
    .footer-device-mobile a:focus {
        color: #1D9E75;
    }

    .footer-device-mobile .tbay-element-mini-cart,
    .footer-device-mobile .cart-dropdown {
        position: relative;
    }

    .footer-device-mobile .mini-cart-items {
        position: absolute;
        top: 0;
        inset-inline-end: calc(50% - 18px);
        min-width: 16px;
        height: 16px;
        padding: 0 4px;
        border-radius: 999px;
        background: #1D9E75;
        color: #fff;
        font-size: 10px;
        font-weight: 700;
        line-height: 16px;
        text-align: center;
    }

    .footer-device-mobile.besa-footer-customized .device-checkout {
        display: none !important;
    }

    /*
     * LTR bar on RTL site: left → right = Account, Brands, Categories, Cart, Home.
     * Home must sit on the right; page dir=rtl would flip DOM order without this.
     */
    .footer-device-mobile.besa-footer-customized {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        direction: ltr !important;
        justify-content: space-around !important;
    }
}