:root { --app-nav-height:calc(62px + env(safe-area-inset-bottom, 0px)); }
#app-bottom-nav {
    display:none; position:fixed; inset:auto 0 0; z-index:39;
    box-sizing:border-box; height:var(--app-nav-height);
    padding:4px max(8px, env(safe-area-inset-right)) calc(4px + env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left));
    border-top:1px solid #e5e5e5; background:#fff; color:#737373;
}
#app-bottom-nav[hidden], #app-bottom-nav a[hidden] { display:none!important; }
.app-nav-items { display:flex; width:100%; max-width:720px; height:100%; margin:auto; }
#app-bottom-nav a {
    position:relative; flex:1 1 0; min-width:0; min-height:44px;
    display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px;
    padding:4px 2px; font:500 11px/15px Inter, Arial, sans-serif; letter-spacing:0;
    text-align:center; text-decoration:none; color:inherit; border-radius:0;
}
#app-bottom-nav a svg { display:block; flex:0 0 22px; width:22px; height:22px; stroke-width:1.7; }
#app-bottom-nav a[aria-current="page"] { color:#18181b; font-weight:700; }
#app-bottom-nav a[aria-current="page"]::before { content:''; position:absolute; top:-4px; width:30px; height:2px; background:currentColor; }
#app-bottom-nav a:focus-visible { outline:2px solid #a88700; outline-offset:-2px; }
.dark #app-bottom-nav { background:#141414; border-color:#303030; color:#aaa; }
.dark #app-bottom-nav a[aria-current="page"] { color:#fff; }
@media (min-width:768px) {
    #app-bottom-nav { display:none!important; }
    body.measurements-page.has-app-navigation { padding-bottom:16px; }
}

@media (max-width:767px) {
    body.has-app-navigation {
        padding-bottom:calc(var(--app-nav-height) + var(--app-action-height, 0px) + 56px)!important;
    }
    body.measurements-page.has-app-navigation { padding-bottom:calc(var(--app-nav-height) + 12px)!important; }
    .has-app-navigation #app-bottom-nav { display:block; }
    .has-app-navigation #main-menu .app-primary-link,
    .has-app-navigation .app-menu-empty-mobile,
    .has-app-navigation #header-calculator-link { display:none!important; }
    .has-app-navigation [data-app-actions] { bottom:var(--app-nav-height)!important; padding-bottom:8px!important; }
    .has-app-navigation #calculator-actions { padding:8px 12px!important; box-shadow:none; }
    #calculator-actions .max-w-3xl {
        display:flex!important; flex-direction:row!important; align-items:center!important;
        gap:12px!important; max-width:48rem!important;
    }
    #calculator-actions .max-w-3xl > :first-child { flex:1 1 0; min-width:0; }
    #calculator-actions .max-w-3xl > .flex { width:auto; flex:0 0 auto; }
    #calculator-actions #bottom-total { font-size:20px!important; line-height:24px; white-space:normal; overflow-wrap:anywhere; }
    #calculator-actions #retail-bottom { font-size:10px; line-height:14px; overflow-wrap:anywhere; }
    #calculator-actions button { width:auto; min-height:46px!important; padding:10px 14px!important; border-radius:8px; box-shadow:none; }
    #estimate-actions .measurement-actions { padding:8px 12px 0; gap:8px; }
    #estimate-actions .measurement-actions > button { min-width:44px; min-height:44px; border-radius:8px; }
    #credit-actions { padding:8px 12px!important; box-shadow:none; }
    #credit-actions button { min-height:46px; padding:10px; border-radius:8px; background:#facc15; color:#18181b; font-size:14px; box-shadow:none; }
    .has-app-navigation > #offline-data-status {
        bottom:calc(var(--app-nav-height) + var(--app-action-height, 0px) + 6px)!important;
        min-height:34px!important; max-width:calc(100vw - 24px)!important;
    }
    .has-app-navigation > #toast { bottom:calc(var(--app-nav-height) + var(--app-action-height, 0px) + 12px); }
}
@media print { #app-bottom-nav { display:none!important; } }
