/* Edizione Caserta — CSS-only replacement mobile menu (no JS). * * The icon (.ec-menu-icon) is injected into Salient's mobile header row via * the nectar_hook_mobile_header_menu_items hook, while the checkbox * (#ec-menu-toggle) and panel (.ec-menu-panel) are printed in wp_footer. * They share no common DOM parent, so state is wired with :has() on . * * Salient's own hamburger toggle is hidden here; the off-canvas panel it * opened is removed at the source by the child-theme override of * includes/partials/footer/off-canvas-navigation.php. */ /* Hide Salient's native toggle (rendered inline in header-menu.php). */ .slide-out-widget-area-toggle { display: none !important; } .ec-menu-checkbox { position: absolute; opacity: 0; pointer-events: none; } /* ── Hamburger icon ─────────────────────────────────────────────────── */ .ec-menu-icon { display: none; position: relative; flex-direction: column; align-items: center; justify-content: center; gap: 5px; width: 22px; height: 22px; padding: 0 10px; box-sizing: content-box; cursor: pointer; vertical-align: middle; } .ec-menu-icon span { display: block; width: 22px; height: 2px; /* Fixed colour (not currentColor) so Salient's header accent can't tint the bars — the icon must read black. */ background: #111; } /* ── Panel: off-canvas drawer sliding in from the left ──────────────── */ .ec-menu-panel { position: fixed; inset: 0; z-index: 9990; visibility: hidden; overflow: hidden; /* keep the off-screen drawer from causing scroll */ } .ec-menu-overlay { position: absolute; inset: 0; background: rgba(0, 0, 0, 0.4); opacity: 0; transition: opacity 0.25s ease; cursor: pointer; } .ec-menu-inner { position: absolute; top: 0; left: 0; bottom: 0; width: min(320px, 85vw); background: #fff; transform: translateX(-100%); transition: transform 0.25s ease; overflow-y: auto; box-sizing: border-box; padding: 24px; } .ec-menu-close { display: block; width: 32px; height: 32px; margin: 0 0 8px auto; /* top-right of the drawer */ font-size: 30px; line-height: 32px; text-align: center; color: #111; cursor: pointer; } body:has(#ec-menu-toggle:checked) .ec-menu-panel { visibility: visible; } body:has(#ec-menu-toggle:checked) .ec-menu-overlay { opacity: 1; } body:has(#ec-menu-toggle:checked) .ec-menu-inner { transform: translateX(0); } .ec-menu-inner ul { list-style: none; margin: 0; padding: 0; } .ec-menu-inner li { /* Scoped override: the theme's list styling wins over the