/* NOTE: Top-level menu — inline-flex + relative, same as .mud-menu */
.mw-menu {
    display: inline-flex;
    position: relative;
}

/* NOTE: Nested submenu — full width inside parent mud-menu-list, relative for flyout anchor */
.mw-menu-submenu {
    position: relative;
    width: 100%;
}

/* NOTE: Flyout opens to the right by default, above parent popover content.
   white-space:nowrap prevents menu item text from wrapping to multiple lines.
   visibility:hidden prevents MudPopover's FlipAlways from reacting to the flyout overflow
   before JS has a chance to reposition it. positionFlyout sets visibility:visible after
   adjusting for viewport bounds. The animation is a fallback if JS hasn't loaded yet. */
.mw-menu-flyout {
    position: absolute;
    left: 100%;
    top: 0;
    z-index: 1;
    white-space: nowrap;
    visibility: hidden;
    animation: mw-flyout-show 0s 250ms forwards;
}

@keyframes mw-flyout-show {
    to { visibility: visible; }
}

/* NOTE: Override for left-opening flyouts (FlyoutRight=false) */
.mw-menu-flyout.mw-menu-flyout--left {
    left: auto;
    right: 100%;
}

/* NOTE: Submenu activator — copied from MudBlazor v9 .mud-menu-item */
.mw-menu-submenu-activator {
    width: 100%;
    display: flex;
    position: relative;
    box-sizing: border-box;
    text-align: start;
    align-items: center;
    justify-content: flex-start;
    text-decoration: none;
    padding: 8px 12px;
    cursor: pointer;
    color: var(--mud-palette-text-primary);
    user-select: none;
}

.mw-menu-submenu-activator:hover {
    background-color: var(--mud-palette-action-default-hover);
}

/* NOTE: Disabled state — copied from .mud-menu-item.mud-disabled */
.mw-menu-submenu-activator.mud-disabled {
    color: var(--mud-palette-action-disabled) !important;
    cursor: default !important;
    pointer-events: none !important;
}

.mw-menu-submenu-activator.mud-disabled .mw-menu-submenu-icon-start {
    color: var(--mud-palette-action-disabled) !important;
}

/* NOTE: Copied from .mud-menu-item .mud-menu-item-icon */
.mw-menu-submenu-icon-start {
    display: inline-flex;
    flex-shrink: 0;
    margin-inline-end: 12px;
}

/* NOTE: Copied from .mud-menu-item .mud-menu-item-text */
.mw-menu-submenu-label {
    flex: 1 1 auto;
    margin: 4px 0;
}

.mw-menu-submenu-arrow {
    display: inline-flex;
    flex-shrink: 0;
    margin-inline-start: 12px;
    opacity: 0.5;
}

/* NOTE: Dense mode — copied from .mud-menu-item.mud-menu-item-dense */
.mw-menu-dense .mw-menu-submenu-activator {
    padding: 2px 12px;
}

/* NOTE: Override MudBlazor's .mud-popover:has(> .mud-menu-list) { overflow: hidden }
   which clips submenu flyouts that extend beyond the popover bounds.
   white-space:nowrap prevents menu item text from wrapping when the popover
   is near a viewport edge. */
.mw-menu-popover {
    overflow: visible !important;
    white-space: nowrap;
}