/*
 * SMWD Theme Controls v2.1.2
 * Custom-theme mobile navigation viewport correction.
 */

@media (max-width: 1100px) {
    html,
    body {
        max-width: 100%;
        overflow-x: clip !important;
    }

    /* JS adds this class only to the mobile menu controlled by the header
       hamburger. This avoids changing unrelated page navigation/components. */
    .mcud-viewport-mobile-menu {
        position: fixed !important;
        top: calc(var(--mcud-mobile-menu-top, 88px) + 8px) !important;
        left: 50% !important;
        right: auto !important;
        inset-inline-start: 50% !important;
        inset-inline-end: auto !important;
        width: min(360px, calc(100vw - 28px)) !important;
        max-width: calc(100vw - 28px) !important;
        min-width: 0 !important;
        margin: 0 !important;
        transform: translateX(-50%) !important;
        box-sizing: border-box !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        max-height: calc(100dvh - var(--mcud-mobile-menu-top, 88px) - 22px) !important;
        z-index: 999999 !important;
        background: #fff;
        border: 1px solid rgba(13, 60, 96, .14);
        border-radius: 14px;
        box-shadow: 0 18px 42px rgba(8, 38, 63, .20);
    }

    .mcud-viewport-mobile-menu,
    .mcud-viewport-mobile-menu *,
    .mcud-viewport-mobile-menu *::before,
    .mcud-viewport-mobile-menu *::after {
        box-sizing: border-box !important;
    }

    .mcud-viewport-mobile-menu ul,
    .mcud-viewport-mobile-menu ol,
    .mcud-viewport-mobile-menu li {
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .mcud-viewport-mobile-menu > ul,
    .mcud-viewport-mobile-menu > ol,
    .mcud-viewport-mobile-menu .menu,
    .mcud-viewport-mobile-menu .nav-menu,
    ul.mcud-viewport-mobile-menu,
    ol.mcud-viewport-mobile-menu {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    .mcud-viewport-mobile-menu li {
        width: 100% !important;
    }

    .mcud-viewport-mobile-menu a,
    .mcud-viewport-mobile-menu button:not(.menu-toggle):not(.mobile-menu-toggle):not(.nav-toggle) {
        max-width: 100% !important;
        min-width: 0 !important;
        white-space: normal !important;
        overflow-wrap: break-word !important;
        word-break: normal !important;
    }

    /* Common custom-theme submenu patterns can otherwise retain a desktop
       fixed pixel width and recreate the same off-screen problem. */
    .mcud-viewport-mobile-menu .sub-menu,
    .mcud-viewport-mobile-menu .children,
    .mcud-viewport-mobile-menu [class*="submenu"],
    .mcud-viewport-mobile-menu [class*="sub-menu"] {
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
    }

    .mcud-viewport-mobile-menu > ul > li > a,
    .mcud-viewport-mobile-menu > ol > li > a,
    ul.mcud-viewport-mobile-menu > li > a,
    ol.mcud-viewport-mobile-menu > li > a {
        padding-left: 18px !important;
        padding-right: 18px !important;
    }

    .mcud-viewport-mobile-menu > ul > li:first-child > a,
    .mcud-viewport-mobile-menu > ol > li:first-child > a,
    ul.mcud-viewport-mobile-menu > li:first-child > a,
    ol.mcud-viewport-mobile-menu > li:first-child > a {
        border-top-left-radius: 13px;
        border-top-right-radius: 13px;
    }

    .mcud-viewport-mobile-menu > ul > li:last-child > a,
    .mcud-viewport-mobile-menu > ol > li:last-child > a,
    ul.mcud-viewport-mobile-menu > li:last-child > a,
    ol.mcud-viewport-mobile-menu > li:last-child > a {
        border-bottom-left-radius: 13px;
        border-bottom-right-radius: 13px;
    }

    @media (max-width: 380px) {
        .mcud-viewport-mobile-menu {
            left: 50% !important;
            right: auto !important;
            inset-inline-start: 50% !important;
            inset-inline-end: auto !important;
            width: calc(100vw - 20px) !important;
            max-width: calc(100vw - 20px) !important;
            transform: translateX(-50%) !important;
        }
    }

    body.mcud-mobile-menu-open {
        overflow-x: hidden !important;
    }
}
\n\n/* Center the standard content wrapper that contains the public advisory card.\n   JS scopes this class to the appropriate content branch so full-width hero/header\n   components remain untouched. */\n.mcud-theme-centered-content {\n    width: min(var(--mcud-theme-content-width, 1440px), calc(100% - 36px)) !important;\n    max-width: var(--mcud-theme-content-width, 1440px) !important;\n    margin-left: auto !important;\n    margin-right: auto !important;\n    box-sizing: border-box !important;\n}\n\n@media (max-width: 767px) {\n    .mcud-theme-centered-content {\n        width: calc(100% - 24px) !important;\n    }\n}\n