/* Readable role navigation and native modal menu across all portal screens. */
html body #mainNav.nav :is(#navCustomer,#navEstimator,#navAdmin).nav-right .nav-btn.outline{background:#fff!important;color:#18243b!important;border:1px solid #a8b4c7!important;min-height:44px}
html body #mainNav.nav :is(#navCustomer,#navEstimator,#navAdmin).nav-right .nav-btn.outline:hover{background:#eaf0fa!important;color:#18243b!important}
html body #hamburgerBtn{width:44px;min-width:44px;height:44px;min-height:44px;align-items:center;justify-content:center;border:1px solid #a8b4c7;background:#fff;border-radius:8px}
html body #hamburgerBtn span{background:#18243b!important}
.portal-mobile-menu{position:fixed;inset:0 auto 0 0;margin:0;width:min(320px,calc(100vw - 28px));max-width:none;height:100dvh;max-height:none;border:0;padding:24px 18px;background:#f7f9fc;color:#18243b;box-shadow:16px 0 60px #10182840}
.portal-mobile-menu::backdrop{background:#10182880}
.portal-menu-heading{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-bottom:24px}
.portal-menu-heading h2{font-size:20px;margin:0}
.portal-mobile-menu nav{display:grid;gap:10px}
.portal-mobile-menu button{min-height:44px;padding:10px 14px;border-radius:8px;border:1px solid #b5c1d2;color:#18243b;background:#fff;font:inherit;font-size:16px;text-align:left}
.portal-mobile-menu [hidden],#registerForm[hidden],#signupConfirmation[hidden]{display:none!important}
.portal-mobile-menu button:focus-visible{outline:3px solid #2448e6;outline-offset:3px}
.auth-confirmation-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px}
.auth-confirmation-actions button{min-height:44px;font:inherit;padding:10px 14px;border:1px solid #9dadc2;border-radius:8px;color:#18243b;background:#fff;cursor:pointer}
.auth-confirmation-actions button:disabled{color:#46556b;background:#e9eef6;cursor:wait}
#signupConfirmation h2{font-size:21px;margin:0 0 12px}#signupConfirmation p{margin:0 0 12px}
@media(max-width:768px){
  html body #mobileBottomNav .mbn-item{font-size:12px;min-height:52px;line-height:1.3;color:#d7e3f8;padding:8px 4px}
  html body #mobileBottomNav .mbn-item.active{color:#fff;background:#2448a8;border-radius:8px}
  html body #mobileBottomNav{gap:4px;padding:6px 8px calc(6px + env(safe-area-inset-bottom,0px));background:#15223a}
  html body .auth-card input{font-size:16px;min-height:48px}
  html body .auth-card .pass-eye{min-height:44px}
  html body #mainNav{gap:8px;padding-left:12px;padding-right:12px}
  html body #mainNav .nav-right{gap:8px}
  html body #mainNav :is(#navCustomer,#navEstimator,#navAdmin) .tag{display:none}
  html body #mainNav #navCustomer .nav-link,html body #mainNav #navCustomer .nav-btn:not(.outline){display:none}
}

@media(max-width:768px){html body #mobileBottomNav .mbn-item.active,html body #mobileBottomNav .mbn-item.active span{color:#fff!important}}