/*
 * AutoMart Mobile Vehicle Detail V42.17
 *
 * GLOBAL MOBILE BOTTOM NAV AUTHORITY
 *
 * This patch restores the existing AutoMart global mobile
 * navigation. It does NOT create a second navigation system.
 *
 * V42.16 contact dock remains above this navigation.
 */

@media (max-width: 767.98px) {

    /* =========================================================
       GLOBAL MOBILE BOTTOM NAV
       ========================================================= */

    html body .mobile-bottom,
    html body .mobile-bottom-nav,
    html body .mobile-bottom-menu,
    html body .am-mobile-bottom-nav,
    html body .am-mobile-bottom-menu,
    html body [data-mobile-bottom-nav] {

        display: flex !important;

        position: fixed !important;

        right: 0 !important;
        bottom: 0 !important;
        left: 0 !important;

        width: 100% !important;

        min-height: 64px !important;

        margin: 0 !important;

        padding:
            7px
            10px
            calc(7px + env(safe-area-inset-bottom, 0px))
            10px !important;

        box-sizing: border-box !important;

        align-items: center !important;
        justify-content: space-around !important;

        background:
            rgba(255, 255, 255, .98) !important;

        border-top:
            1px solid #e3ebe7 !important;

        box-shadow:
            0 -8px 25px rgba(20, 38, 31, .10) !important;

        backdrop-filter: blur(16px) !important;
        -webkit-backdrop-filter: blur(16px) !important;

        z-index: 999999 !important;

        visibility: visible !important;
        opacity: 1 !important;

        transform: translateZ(0) !important;
        -webkit-transform: translateZ(0) !important;
    }


    /* =========================================================
       NAV LINKS
       ========================================================= */

    html body .mobile-bottom a,
    html body .mobile-bottom-nav a,
    html body .mobile-bottom-menu a,
    html body .am-mobile-bottom-nav a,
    html body .am-mobile-bottom-menu a,
    html body [data-mobile-bottom-nav] a {

        display: flex !important;

        min-width: 52px !important;
        min-height: 50px !important;

        flex: 1 1 0 !important;

        align-items: center !important;
        justify-content: center !important;

        flex-direction: column !important;

        gap: 3px !important;

        padding: 4px 5px !important;

        border-radius: 12px !important;

        text-decoration: none !important;

        font-size: 11px !important;
        line-height: 1.1 !important;

        box-sizing: border-box !important;
    }


    /* =========================================================
       NAV ICONS
       ========================================================= */

    html body .mobile-bottom svg,
    html body .mobile-bottom-nav svg,
    html body .mobile-bottom-menu svg,
    html body .am-mobile-bottom-nav svg,
    html body .am-mobile-bottom-menu svg,
    html body [data-mobile-bottom-nav] svg {

        width: 21px !important;
        height: 21px !important;

        flex: 0 0 auto !important;
    }


    /* =========================================================
       ACTIVE ITEM
       ========================================================= */

    html body .mobile-bottom .active,
    html body .mobile-bottom-nav .active,
    html body .mobile-bottom-menu .active,
    html body .am-mobile-bottom-nav .active,
    html body .am-mobile-bottom-menu .active,
    html body [data-mobile-bottom-nav] .active {

        color: #07985e !important;

        background: #eefaf5 !important;

        font-weight: 800 !important;
    }


    /* =========================================================
       PAGE CLEARANCE
       ========================================================= */

    html body {
        padding-bottom:
            calc(72px + env(safe-area-inset-bottom, 0px)) !important;
    }


    /*
     * V42.16 contact dock:
     * keep it ABOVE the global navigation.
     */

    html body .am-v438-floating-contact {
        bottom:
            calc(
                74px +
                env(safe-area-inset-bottom, 0px)
            ) !important;

        z-index: 999990 !important;
    }


    /*
     * V42.16 contact inner layer must stay above
     * the page but below the global nav.
     */

    html body .am-v438-floating-contact__inner {
        z-index: 999991 !important;
    }
}


/* =============================================================
   EXTRA SMALL PHONES
   ============================================================= */

@media (max-width: 360px) {

    html body .mobile-bottom,
    html body .mobile-bottom-nav,
    html body .mobile-bottom-menu,
    html body .am-mobile-bottom-nav,
    html body .am-mobile-bottom-menu,
    html body [data-mobile-bottom-nav] {

        min-height: 61px !important;

        padding-left: 6px !important;
        padding-right: 6px !important;
    }

    html body .mobile-bottom a,
    html body .mobile-bottom-nav a,
    html body .mobile-bottom-menu a,
    html body .am-mobile-bottom-nav a,
    html body .am-mobile-bottom-menu a,
    html body [data-mobile-bottom-nav] a {

        min-width: 45px !important;

        font-size: 10px !important;
    }
}
