/* Centers the mobile and desktop app navigation labels inside their active pill states. */
.app-shell .top-nav-links a,
.app-shell .top-nav-links a.active,
.app-shell .top-nav-links a:hover,
.app-shell .top-nav nav a,
.app-shell .top-nav nav a.active,
.app-shell .top-nav nav a:hover,
.app-shell .top-nav-links .notification-nav-link,
.app-shell .top-nav-links .notification-nav-link.active,
.app-shell .top-nav-links .notification-nav-link:hover,
.app-shell .top-nav nav .notification-nav-link,
.app-shell .top-nav nav .notification-nav-link.active,
.app-shell .top-nav nav .notification-nav-link:hover {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  min-height: 48px !important;
  line-height: 1 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

.app-shell .top-nav > button.logout-button,
.app-shell .top-nav > button:not(.mobile-menu-close),
.app-shell .membership-chip,
.app-shell .filter-row button,
.app-shell .filters button,
.app-shell .role-badge,
.app-shell .verification-badge {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
}

@media (max-width: 900px) {
  .app-shell .top-nav-links,
  .app-shell .top-nav nav {
    display: grid !important;
    gap: 8px !important;
  }

  .app-shell .top-nav-links a,
  .app-shell .top-nav nav a,
  .app-shell .top-nav-links .notification-nav-link,
  .app-shell .top-nav nav .notification-nav-link {
    width: 100% !important;
  }
}