/* Admin dropdown sub-menus (issue #73).
   Bootstrap 5 has no nested-dropdown support, so this supplies the flyout.
   Plain CSS on purpose: it must not depend on the Dart Sass build step,
   which is unavailable on machines without Node. */

.cp-admin-menu .dropdown-submenu {
    position: relative;
}

.cp-admin-menu .dropdown-submenu > .dropdown-menu {
    display: none;
}

.cp-admin-menu .dropdown-submenu > .dropdown-menu.show {
    display: block;
}

/* The root menu hangs off the right edge (dropdown-menu-end), so
   sub-menus fly out to the LEFT of it. */
@media (min-width: 992px) {
    .cp-admin-menu .dropdown-submenu > .dropdown-menu {
        position: absolute;
        top: 0;
        right: 100%;
        left: auto;
        margin-top: -0.3rem;
        margin-right: 0.125rem;
    }

    /* Rotate the caret to point where the flyout opens. */
    .cp-admin-menu .dropdown-submenu > a.dropdown-toggle::after {
        transform: rotate(90deg);
        vertical-align: 0.1em;
    }
}

/* Collapsed navbar: sub-menus become indented sections instead of flyouts. */
@media (max-width: 991.98px) {
    .cp-admin-menu .dropdown-submenu > .dropdown-menu {
        position: static;
        border: 0;
        box-shadow: none;
        margin: 0;
        padding: 0 0 0.25rem 1rem;
    }
}
