/*
 * AUTOMART V42.23
 * FINAL MOBILE VEHICLE DETAIL STICKY NAV AUTHORITY
 *
 * Existing global nav:
 *   .mobile-bottom
 *
 * Existing contact dock:
 *   .am-v438-floating-contact
 *
 * Order:
 *   1. Contact dock
 *   2. Global bottom navigation
 */

:root{
    --am-v423-nav-height: 68px;
    --am-v423-contact-height: 64px;
    --am-v423-contact-gap: 8px;
}

/* ============================================================
   MOBILE ONLY
   ============================================================ */

@media (max-width: 767.98px){

    /* --------------------------------------------------------
       GLOBAL BOTTOM NAV
       Existing .mobile-bottom only.
       -------------------------------------------------------- */

    html body:not(.admin-page) nav.mobile-bottom,
    html body:not(.admin-page) .mobile-bottom{
        display:grid !important;
        grid-template-columns:repeat(5,minmax(0,1fr)) !important;

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

        width:100% !important;
        min-width:100% !important;
        min-height:var(--am-v423-nav-height) !important;
        height:auto !important;

        margin:0 !important;

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

        box-sizing:border-box !important;

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

        transform:none !important;

        z-index:999980 !important;

        overflow:visible !important;

        background:#ffffff !important;
    }

    html body:not(.admin-page) nav.mobile-bottom > a,
    html body:not(.admin-page) .mobile-bottom > a{
        display:flex !important;

        position:relative !important;

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

        min-width:0 !important;
        min-height:48px !important;

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

        pointer-events:auto !important;
    }

    html body:not(.admin-page) nav.mobile-bottom svg,
    html body:not(.admin-page) .mobile-bottom svg{
        display:block !important;

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

    html body:not(.admin-page) nav.mobile-bottom small,
    html body:not(.admin-page) .mobile-bottom small,
    html body:not(.admin-page) nav.mobile-bottom span,
    html body:not(.admin-page) .mobile-bottom span{
        visibility:visible !important;
        opacity:1 !important;
    }

    html body:not(.admin-page) nav.mobile-bottom .active,
    html body:not(.admin-page) .mobile-bottom .active{
        visibility:visible !important;
        opacity:1 !important;
    }

    /* --------------------------------------------------------
       STICKY CONTACT DOCK
       Existing Call / WhatsApp / Chat dock.
       -------------------------------------------------------- */

    html body:not(.admin-page) .am-v438-floating-contact{
        display:block !important;

        position:fixed !important;

        left:10px !important;
        right:10px !important;

        bottom:
            calc(
                var(--am-v423-nav-height)
                + env(safe-area-inset-bottom,0px)
                + var(--am-v423-contact-gap)
            ) !important;

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

        margin:0 !important;

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

        transform:none !important;

        pointer-events:auto !important;

        z-index:999990 !important;
    }

    html body:not(.admin-page) .am-v438-floating-contact__inner{
        display:grid !important;

        min-height:56px !important;

        box-sizing:border-box !important;

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

    /* Keep the three real contact actions visible. */

    html body:not(.admin-page)
    .am-v438-floating-contact
    .am-v461-action--call,

    html body:not(.admin-page)
    .am-v438-floating-contact
    .am-v461-action--whatsapp,

    html body:not(.admin-page)
    .am-v438-floating-contact
    .am-v461-action--chat{
        visibility:visible !important;
        opacity:1 !important;
        pointer-events:auto !important;
    }

    /* --------------------------------------------------------
       PAGE CLEARANCE
       Prevent content from being hidden underneath the two
       fixed navigation layers.
       -------------------------------------------------------- */

    html body:not(.admin-page){
        padding-bottom:
            calc(
                var(--am-v423-nav-height)
                + var(--am-v423-contact-height)
                + 32px
                + env(safe-area-inset-bottom,0px)
            ) !important;
    }

    html body:not(.admin-page) main{
        padding-bottom:
            calc(
                var(--am-v423-nav-height)
                + var(--am-v423-contact-height)
                + 32px
                + env(safe-area-inset-bottom,0px)
            ) !important;
    }

    /* Never allow an old vehicle-detail rule to hide the
       canonical global navigation on this mobile page. */

    html body:not(.admin-page) nav.mobile-bottom[hidden],
    html body:not(.admin-page) .mobile-bottom[hidden]{
        display:grid !important;
    }
}


/* ============================================================
   DESKTOP / TABLET
   Absolutely no changes.
   ============================================================ */

@media (min-width:768px){
    nav.mobile-bottom,
    .mobile-bottom,
    .am-v438-floating-contact{
        /* Existing desktop/tablet rules remain authoritative. */
    }
}

/* ============================================================
   AUTOMART V42.23 FINAL MOBILE BOTTOM NAV AUTHORITY
   Purpose:
   - defeat legacy V40 hiding state
   - restore native global mobile navigation
   - keep navigation above page content
   - keep contact dock above navigation
   ============================================================ */

html body:not(.admin-page) nav.mobile-bottom,
html body:not(.admin-page) nav.mobile-bottom[hidden],
html body:not(.admin-page) nav.mobile-bottom[data-am-v40-legacy-hidden],
html body:not(.admin-page) .mobile-bottom,
html body:not(.admin-page) .mobile-bottom[hidden],
html body:not(.admin-page) .mobile-bottom[data-am-v40-legacy-hidden] {
    display: grid !important;
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    min-height: 76px !important;
    visibility: visible !important;
    opacity: 1 !important;
    transform: none !important;
    pointer-events: auto !important;
    overflow: visible !important;
    z-index: 999980 !important;
}

html body:not(.admin-page) nav.mobile-bottom > a,
html body:not(.admin-page) .mobile-bottom > a {
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
    display: flex !important;
}

html body:not(.admin-page) nav.mobile-bottom svg,
html body:not(.admin-page) .mobile-bottom svg {
    display: block !important;
    width: 22px !important;
    height: 22px !important;
    visibility: visible !important;
    opacity: 1 !important;
}

html body:not(.admin-page) nav.mobile-bottom small,
html body:not(.admin-page) .mobile-bottom small {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* Make room for BOTH fixed layers. */
@media (max-width: 767.98px) {
    html body:not(.admin-page) {
        padding-bottom:
            calc(156px + env(safe-area-inset-bottom, 0px)) !important;
    }
}