/* Configurable shared colors for the customer and staff top navigation. */
.topbar{background:var(--topbar-background-color,#29314e)!important}
.topbar .brand{color:var(--topbar-brand-color,#fff)!important}
.topbar .brand-mark{border-color:var(--topbar-brand-color,#fff)!important}
.topbar .brand small{background:var(--topbar-tag-background-color,#edb55a)!important;color:var(--topbar-tag-text-color,#fff)!important}
.topbar nav button,.topbar .logout{color:var(--topbar-text-color,#e9ecf4)!important}
.topbar nav button:hover,.topbar nav button:focus-visible{background:var(--topbar-active-background,#ffffff1f)!important}
.topbar nav .cart-button:not(.active){background:transparent!important}
.topbar nav button.active{color:var(--topbar-active-text-color,#fff)!important;background:var(--topbar-active-background,#ffffff1f)!important;border-bottom-color:var(--topbar-active-underline-color,#ff5966)!important}
.topbar nav button.active:hover,.topbar nav button.active:focus-visible{background:var(--topbar-active-background,#ffffff1f)!important}
.topbar nav .menu-count{background:var(--topbar-badge-background-color,#ff5966)!important;color:var(--topbar-badge-text-color,#fff)!important}

/* iPhone 添加到主屏幕后会以独立网页模式占用状态栏区域。顶栏自身承担这段
   安全区的底色，菜单仍保持原来的 48px 可视高度。普通浏览器的 inset 为 0。 */
@media (max-width:720px){
  .topbar{
    height:calc(48px + env(safe-area-inset-top));
    padding-top:env(safe-area-inset-top);
  }
}