.hbt-menu { display: flex; align-items: center; font-family: var(--hbt-font); }

.hbt-menu__list {
  display: flex; align-items: center; gap: 40px;
  margin: 0; padding: 0; list-style: none;
}
.hbt-menu__item.hbt-menu__item a {
  font-size: 15px; color: var(--hbt-ink); text-decoration: none;
  border-bottom: 2px solid transparent; padding-bottom: 2px;
}
.hbt-menu__item.hbt-menu__item a:hover { color: var(--hbt-accent); }
.hbt-menu__item.is-active.is-active a { color: var(--hbt-accent); }
.hbt-menu--active-underline .hbt-menu__item.is-active a { border-bottom-color: var(--hbt-accent); }

/* Ukuran kotaknya diatur bersama di habits-core.css supaya sama persis
   dengan ikon keranjang dan akun. Di sini hanya yang khas burger.
   display:none default; media query per-instance yang menyalakannya. */
.hbt-menu__burger,
.hbt-menu__burger:hover,
.hbt-menu__burger:focus,
.hbt-menu__burger:active {
  border: 0; border-radius: 50%;
  background: transparent; cursor: pointer; color: var(--hbt-ink);
}
.hbt-menu__burger { display: none; }
.hbt-menu__burger:hover { background: var(--hbt-surface); color: var(--hbt-accent); }
.hbt-menu__burger:focus { outline: none; }
.hbt-menu__burger:focus-visible {
  outline: 2px solid var(--hbt-accent); outline-offset: 2px;
}

.hbt-menu__drawer-list {
  margin: 0; padding: 0; list-style: none;
  display: flex; flex-direction: column;
}
.hbt-menu__drawer-list.hbt-menu__drawer-list a {
  display: block; padding: 13px 0;
  font-size: 15.5px; color: var(--hbt-ink); text-decoration: none;
  border-bottom: 1px solid #F3F3F1;
}
.hbt-menu__drawer-list.hbt-menu__drawer-list a:hover { color: var(--hbt-accent); }
.hbt-menu__drawer-list li:last-child a { border-bottom: 0; }