.mx-menu {
    position: relative;
    width: 100%;
    color: var(--mx-menu-color);
    background: var(--mx-menu-background);
    font-family: var(--mx-menu-font);
    font-size: var(--mx-menu-font-size);
    font-weight: var(--mx-menu-weight);
    line-height: 1.5;
    text-align: left;
}
.mx-menu, .mx-menu * { box-sizing: border-box; }
.mx-menu ul { list-style: none; margin: 0; padding: 0; }
.mx-menu .mx-menu__list { display: flex; flex-wrap: wrap; gap: var(--mx-menu-gap); justify-content: var(--mx-menu-align); }
.mx-menu li { position: relative; display: flex; flex-wrap: wrap; align-items: stretch; margin: 0; padding: 0; }
.mx-menu a, .mx-menu button {
    display: block;
    color: var(--mx-menu-color);
    background: var(--mx-menu-background);
    border: var(--mx-menu-border-width) solid var(--mx-menu-border-color);
    border-radius: var(--mx-menu-radius);
    padding: var(--mx-menu-padding);
    font: inherit;
    line-height: inherit;
    text-decoration: none;
    text-transform: none;
    box-shadow: none;
    cursor: pointer;
    min-height: 0;
}
.mx-menu a { flex: 1; overflow-wrap: anywhere; }
.mx-menu .mx-menu__expand { flex: 0 0 0; padding-inline: 8px; }
.mx-menu a:hover, .mx-menu button:hover, .mx-menu .current-menu-item > a, .mx-menu .current-menu-ancestor > a, .mx-menu button[aria-expanded="true"] {
    color: var(--mx-menu-hover-color);
    background: var(--mx-menu-hover-background);
}
.mx-menu a:focus-visible, .mx-menu button:focus-visible { outline: 2px solid currentColor; outline-offset: -3px; }
.mx-menu .mx-menu__sub {
    flex-basis: 100%;
    padding: 4px;
    background: var(--mx-menu-background);
    border: 1px solid var(--mx-menu-border-color);
    border-radius: var(--mx-menu-radius);
}
.mx-menu.is-ready .mx-menu__sub {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    width: var(--mx-menu-submenu-width);
    max-width: calc(100vw - 32px);
    z-index: 1000;
    box-shadow: 0 8px 24px #0000001a;
}
.mx-menu.is-ready .mx-menu__sub .mx-menu__sub { top: 0; left: 100%; }
.mx-menu.is-ready .mx-menu__sub.opens-left { left: auto; right: 0; }
.mx-menu.is-ready .mx-menu__sub .mx-menu__sub.opens-left { left: auto; right: 100%; }
.mx-menu.is-ready li.is-open > .mx-menu__sub { display: block; }
.mx-menu .mx-menu__expand[hidden],
.mx-menu .mx-menu__sub[hidden] { display: none !important; }
.mx-menu .mx-menu__toggle { display: none; }
.mx-menu .mx-menu__entry { flex: 1; padding: var(--mx-menu-padding); }
.mx-menu .mx-menu__parent { flex: 1; text-align: left; display: flex; justify-content: space-between;}
.mx-menu .mx-menu__entry--button,
.mx-menu a[data-mx-appearance="button"] { background: var(--mx-menu-hover-background); color: var(--mx-menu-hover-color); }
.mx-menu .mx-menu__separator { display: block; width: 100%; border-top: 1px solid var(--mx-menu-border-color); margin: 8px 0; }
.mx-menu button:disabled, .mx-menu [aria-disabled="true"] { opacity: .55; cursor: default; }

/* JS applies is-mobile using the single breakpoint saved in WordPress. */
.mx-menu.is-mobile.is-ready .mx-menu__toggle { display: flex; align-items: center; gap: 10px; }
.mx-menu.is-mobile .mx-menu__list { flex-direction: column; }
.mx-menu .mx-menu__drawer {
    position: fixed;
    inset: 0 auto 0 0;
    margin: 0;
    padding: 20px;
    width: min(var(--mx-menu-drawer-width), 92vw);
    max-width: 92vw;
    height: 100dvh;
    max-height: 100dvh;
    border: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    color: var(--mx-menu-color);
    background: var(--mx-menu-background);
    font: inherit;
    text-align: left;
    transform: translateX(-100%);
    transition: transform .25s ease;
}
.mx-menu[data-drawer-side="right"] .mx-menu__drawer { inset: 0 0 0 auto; transform: translateX(100%); }
.mx-menu .mx-menu__drawer.is-visible { transform: translateX(0); }
.mx-menu .mx-menu__drawer::backdrop { background: rgb(0 0 0 / .45); }
.mx-menu .mx-menu__drawer-header { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.mx-menu .mx-menu__drawer-header .mx-menu__close { flex: 0 0 auto; margin: 0; }
.mx-menu .mx-menu__actions--drawer-left { flex: 1 1 auto; }
.mx-menu .mx-menu__drawer-header > .mx-menu__close:first-child,
.mx-menu .mx-menu__actions--drawer-left:empty + .mx-menu__close { margin-left: auto; }
.mx-menu.is-mobile.is-ready .mx-menu__sub,
.mx-menu.is-mobile.is-ready .mx-menu__sub .mx-menu__sub {
    position: static;
    width: 100%;
    max-width: 100%;
    margin: 0;
    padding-inline-start: 16px;
    box-shadow: none;
}
html.mx-menu-scroll-locked { overflow: hidden; }
@media (prefers-reduced-motion: reduce) {
    .mx-menu .mx-menu__drawer { transition: none; }
}

.mx-menu .mx-menu__caption { display: inline-flex; align-items: center; gap: .5em; max-width: 100%; vertical-align: middle; }
.mx-menu .mx-menu__label { min-width: 0; overflow-wrap: anywhere; }
.mx-menu .mx-menu__icon { display: inline-block; flex-shrink: 0; vertical-align: middle; }
.mx-menu .mx-menu__icon.dashicons { font-size: 1.15em; width: 1.15em; height: 1.15em; }
.mx-menu .mx-menu__expand > .mx-menu__indicator { transform: none; }
.mx-menu .mx-menu__expand > .mx-menu__indicator--close { display: none; }
.mx-menu .mx-menu__expand[aria-expanded="true"] > .mx-menu__indicator--open { display: none; }
.mx-menu .mx-menu__expand[aria-expanded="true"] > .mx-menu__indicator--close { display: inline-block; }

/* Shortcuts share the existing icon, link and action rendering. */
.mx-menu .mx-menu__toolbar { display: none; }
.mx-menu.is-mobile.is-ready .mx-menu__toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.mx-menu .mx-menu__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; min-width: 0; }
.mx-menu .mx-menu__actions:empty { display: none; }
.mx-menu.is-mobile.is-ready .mx-menu__list .mx-menu__panel-hidden { display: none; }
.mx-menu .mx-menu__shortcut > a, .mx-menu .mx-menu__shortcut > button { min-width: 44px; min-height: 44px; }
.mx-menu .mx-menu__shortcut--icon .mx-menu__label {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0;
}
.mx-menu .mx-menu__shortcut--icon .mx-menu__caption { justify-content: center; gap: 0; }
.mx-menu .mx-menu__actions .menu-cta { margin-top: 0; }

.mx-menu .mx-menu__icon.mx-menu__svg, .mx-menu .mx-menu__svg-mask { width: 1.25em; height: 1.25em; object-fit: contain; }
.mx-menu .mx-menu__svg-mask { background-color: currentColor; -webkit-mask: var(--mx-icon-image) center / contain no-repeat; mask: var(--mx-icon-image) center / contain no-repeat; }