/* V5.6.3.3: restore mobile center navigation as a horizontal, scrollable tab row.
   Scoped to .center-nav so it does not alter homepage category cards or other menus. */
.content nav.center-nav,
nav.center-nav {
  display:flex !important;
  flex-flow:row nowrap !important;
  align-items:stretch !important;
  justify-content:flex-start !important;
  gap:8px !important;
  width:100% !important;
  max-width:100% !important;
  box-sizing:border-box !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  white-space:nowrap !important;
  padding:4px 2px 12px !important;
  margin:0 0 18px !important;
  scrollbar-width:thin;
  -webkit-overflow-scrolling:touch;
}
.content nav.center-nav > a,
nav.center-nav > a {
  display:inline-flex !important;
  flex:0 0 auto !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;
  width:auto !important;
  max-width:none !important;
  min-height:44px !important;
  box-sizing:border-box !important;
  padding:8px 13px !important;
  border:1px solid var(--line, #dfe8f5) !important;
  border-radius:14px !important;
  background:#fff !important;
  color:var(--ink, #183252) !important;
  font-size:13px !important;
  font-weight:700 !important;
  line-height:1.25 !important;
  text-decoration:none !important;
  white-space:nowrap !important;
  overflow:visible !important;
}
.content nav.center-nav > a > span,
nav.center-nav > a > span {
  display:inline !important;
  flex:0 0 auto !important;
  white-space:nowrap !important;
  overflow:visible !important;
  overflow-wrap:normal !important;
  word-break:keep-all !important;
}
.content nav.center-nav > a > .icon,
nav.center-nav > a > .icon {
  display:block !important;
  flex:0 0 29px !important;
  width:29px !important;
  height:29px !important;
}
.content nav.center-nav > a.active,
nav.center-nav > a.active {
  color:var(--blue, #326cda) !important;
  background:#eaf2ff !important;
  border-color:#b5cdff !important;
}
@media (max-width:600px) {
  .content nav.center-nav,
  nav.center-nav { gap:7px !important; padding-bottom:10px !important; }
  .content nav.center-nav > a,
  nav.center-nav > a { min-height:42px !important; padding:7px 11px !important; }
}
