/* Shared Tunwalai 3.0 content-menu primitive. Navbar stays outside #main-body. */
#main-body .dropdown-menu {
  background-color: var(--Base-bg-raised);
  border: 1px solid var(--twl-sem-border-neutral-subtle);
  border-radius: var(--Radius-md);
  box-shadow: 0 4px 12px var(--Static-Opacity-Black-16);
  color: var(--Text-Neutral-primary);
  max-width: calc(100vw - 32px) !important;
  min-width: 159px;
  padding: 8px 0 !important;
}

/* Every li owns one full-width state surface; legacy spacing utilities must not indent rows. */
#main-body .dropdown-menu > li {
  background-color: transparent;
  border-radius: 0;
  color: var(--Text-Neutral-primary);
  margin: 0 !important;
  overflow: hidden;
  padding: 0 !important;
}

#main-body .dropdown-menu > li > :is(a, button),
#main-body .dropdown-menu > :is(a, button, .dropdown-item, [role="menuitem"]),
#main-body .dropdown-menu > li:not(:has(a, button, .dropdown-item, [role="menuitem"])) {
  align-items: center;
  background-color: transparent;
  border: 0;
  border-radius: 0;
  color: inherit;
  cursor: pointer;
  display: flex;
  font-family: var(--Body-font-family);
  font-size: 14px;
  font-weight: 500;
  gap: 12px;
  justify-content: flex-start !important;
  line-height: 21px;
  min-height: 37px;
  padding: 8px 16px !important;
  text-align: left !important;
  text-decoration: none;
  white-space: nowrap;
  width: 100%;
}

#main-body .dropdown-menu > li:is(:hover, :focus-within, :has(> .active)),
#main-body .dropdown-menu > :is(a, button, .dropdown-item, [role="menuitem"]):is(:hover, :focus-visible, .active) {
  background-color: var(--Background-Brand-subtle) !important;
  color: var(--Text-Brand-default) !important;
}

#main-body .dropdown-menu :is(a, button, .dropdown-item, [role="menuitem"]):focus-visible {
  box-shadow: none;
  outline: none;
}

#main-body .dropdown-menu :is(a, button, .dropdown-item, [role="menuitem"]) > :is(i, svg),
#main-body .dropdown-menu > li > :is(i, svg) {
  color: currentColor;
  flex: 0 0 16px;
  font-size: 16px;
  margin: 0 !important;
  text-align: center;
  width: 16px;
}

#main-body .dropdown-menu .dropdown-divider {
  border-color: var(--twl-sem-border-neutral-subtle);
  margin: 8px 0 !important;
}

#main-body .dropdown-menu :is(.disabled, :disabled, [aria-disabled="true"]) {
  background-color: transparent !important;
  color: var(--Text-Brand-disabled) !important;
  cursor: not-allowed;
}