/*!
 * CSPLUS v2.10.94 — Compact Bottom Dock Correction
 * Source ownership: customer mobile/PWA bottom navigation only.
 * Approved white glass + navy active design preserved.
 * Full-height native dock from v2.10.93 removed; compact pill sits low above iPhone safe area.
 */

:root{
    --csplus-nav-pill-height: 72px;
    --csplus-nav-side-gap: 12px;
    --csplus-nav-bottom-gap: max(8px, calc(env(safe-area-inset-bottom, 0px) + 6px));
    --csplus-nav-page-clearance: calc(var(--csplus-nav-pill-height) + var(--csplus-nav-bottom-gap) + 18px);
}

@media (max-width:768px){
    body{
        padding-bottom: var(--csplus-nav-page-clearance) !important;
    }

    .bottom-nav,
    .mobile-bottom-nav,
    .csplus-bottom-nav,
    .site-bottom-nav,
    .bottom-navigation,
    nav.bottom,
    nav[aria-label="Bottom Navigation"]{
        position: fixed !important;
        left: var(--csplus-nav-side-gap) !important;
        right: var(--csplus-nav-side-gap) !important;
        bottom: var(--csplus-nav-bottom-gap) !important;
        width: auto !important;
        max-width: none !important;
        height: var(--csplus-nav-pill-height) !important;
        min-height: var(--csplus-nav-pill-height) !important;
        margin: 0 !important;
        padding: 7px !important;
        display: grid !important;
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
        gap: 4px !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 28px !important;
        background: rgba(255,255,255,.95) !important;
        -webkit-backdrop-filter: blur(22px) saturate(155%) !important;
        backdrop-filter: blur(22px) saturate(155%) !important;
        border: 1px solid rgba(203,213,225,.9) !important;
        box-shadow: 0 16px 42px rgba(15,23,42,.13), inset 0 1px 0 rgba(255,255,255,.9) !important;
        overflow: hidden !important;
        z-index: 2147483000 !important;
    }

    .bottom-nav a,
    .bottom-nav button,
    .mobile-bottom-nav a,
    .mobile-bottom-nav button,
    .csplus-bottom-nav a,
    .csplus-bottom-nav button,
    .site-bottom-nav a,
    .site-bottom-nav button,
    .bottom-navigation a,
    .bottom-navigation button,
    nav.bottom a,
    nav.bottom button,
    nav[aria-label="Bottom Navigation"] a,
    nav[aria-label="Bottom Navigation"] button{
        width: 100% !important;
        height: 58px !important;
        min-height: 58px !important;
        padding: 0 3px !important;
        border-radius: 21px !important;
        display: inline-flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 0 !important;
        border: 0 !important;
        box-shadow: none !important;
        background: transparent !important;
        color: #52637b !important;
        text-decoration: none !important;
        font-weight: 950 !important;
        font-size: clamp(12px, 3.35vw, 14px) !important;
        letter-spacing: -.02em !important;
        line-height: 1 !important;
        white-space: nowrap !important;
    }

    .bottom-nav a svg,
    .bottom-nav button svg,
    .bottom-nav a img,
    .bottom-nav button img,
    .mobile-bottom-nav a svg,
    .mobile-bottom-nav button svg,
    .mobile-bottom-nav a img,
    .mobile-bottom-nav button img,
    .csplus-bottom-nav a svg,
    .csplus-bottom-nav button svg,
    .csplus-bottom-nav a img,
    .csplus-bottom-nav button img,
    .site-bottom-nav a svg,
    .site-bottom-nav button svg,
    .site-bottom-nav a img,
    .site-bottom-nav button img,
    .bottom-navigation a svg,
    .bottom-navigation button svg,
    .bottom-navigation a img,
    .bottom-navigation button img{
        display: none !important;
    }

    .bottom-nav a.active,
    .bottom-nav a[aria-current="page"],
    .bottom-nav .active,
    .mobile-bottom-nav a.active,
    .mobile-bottom-nav a[aria-current="page"],
    .mobile-bottom-nav .active,
    .csplus-bottom-nav a.active,
    .csplus-bottom-nav a[aria-current="page"],
    .csplus-bottom-nav .active,
    .site-bottom-nav a.active,
    .site-bottom-nav a[aria-current="page"],
    .site-bottom-nav .active,
    .bottom-navigation a.active,
    .bottom-navigation a[aria-current="page"],
    .bottom-navigation .active{
        color: #ffffff !important;
        background: #07111f !important;
        box-shadow: 0 11px 25px rgba(15,23,42,.18) !important;
    }

    .bottom-nav span,
    .mobile-bottom-nav span,
    .csplus-bottom-nav span,
    .site-bottom-nav span,
    .bottom-navigation span{
        color: inherit !important;
        font-size: inherit !important;
        font-weight: inherit !important;
        line-height: inherit !important;
    }
}

@media (max-width:370px){
    :root{
        --csplus-nav-side-gap: 8px;
        --csplus-nav-pill-height: 68px;
    }
    .bottom-nav a,
    .mobile-bottom-nav a,
    .csplus-bottom-nav a,
    .site-bottom-nav a,
    .bottom-navigation a{
        height: 54px !important;
        min-height: 54px !important;
        font-size: 12px !important;
    }
}

@media (min-width:769px){
    body{padding-bottom:0}
}