/* ==========================================================================
   Elementor Drilldown Mobile Menu — slide between levels (opt-in)
   Author: Agencia SEO Orbitalia — orbitalia.com

   Enqueued only for widgets with Menu Style › Slide Between Levels switched
   on: a page whose menus leave it off never downloads this file.

   The incoming level slides in over the one it came from, and Back slides it
   out again to reveal it. The level underneath cannot move along: sub-levels
   are nested inside their parent's <ul>, so a transform on the parent would
   carry the incoming level with it. The JS keeps the parent on screen for the
   length of the slide instead, and collapses it once the slide is over.

   Classes, set by the JS only while the widget carries .drilldown-slide:
     .drilldown-sliding-in   incoming level, entering from the inline end
     .drilldown-sliding-out  level leaving on Back, towards the inline end
     .drilldown-slide-under  level underneath: on screen, but inert
   ========================================================================== */

@keyframes drilldown-slide-in {
    from { transform: translateX(100%); }
    to   { transform: translateX(0); }
}

@keyframes drilldown-slide-out {
    from { transform: translateX(0); }
    to   { transform: translateX(100%); }
}

/* Placed where its parent is scrolled to, so it slides in over what is on
   screen rather than over the top of a list scrolled out of view. The base
   stylesheet pins sub-menus at top:0 !important; this selector outranks it.
   The offset lives in a custom property rather than an inline `top` because
   the drill-in code clears inline `top` to undo SmartMenus. */
.drilldown-active.drilldown-slide nav.elementor-nav-menu--dropdown ul.sub-menu.drilldown-sliding-in {
    top: var(--drilldown-slide-offset, 0px) !important;
    animation: drilldown-slide-in var(--drilldown-speed, 300ms) cubic-bezier(0.2, 0.7, 0.3, 1) both;
}

.drilldown-active.drilldown-slide nav.elementor-nav-menu--dropdown ul.sub-menu.drilldown-sliding-out {
    animation: drilldown-slide-out var(--drilldown-speed, 300ms) cubic-bezier(0.4, 0, 0.6, 1) both;
}

/* A tap on the strip of the parent still showing must not drill into a
   sibling or leave the page mid-slide. The active level turns pointer events
   back on for itself (base stylesheet, !important), so it stays usable. */
.drilldown-active.drilldown-slide .drilldown-slide-under {
    pointer-events: none !important;
}

/* RTL: levels arrive from the left, the inline end in that direction. */
@keyframes drilldown-slide-in-rtl {
    from { transform: translateX(-100%); }
    to   { transform: translateX(0); }
}

@keyframes drilldown-slide-out-rtl {
    from { transform: translateX(0); }
    to   { transform: translateX(-100%); }
}

[dir="rtl"] .drilldown-active.drilldown-slide nav.elementor-nav-menu--dropdown ul.sub-menu.drilldown-sliding-in {
    animation-name: drilldown-slide-in-rtl;
}

[dir="rtl"] .drilldown-active.drilldown-slide nav.elementor-nav-menu--dropdown ul.sub-menu.drilldown-sliding-out {
    animation-name: drilldown-slide-out-rtl;
}

/* The JS already skips the slide for these visitors; this covers a
   preference changed while the page is open. */
@media (prefers-reduced-motion: reduce) {
    .drilldown-active.drilldown-slide nav.elementor-nav-menu--dropdown ul.sub-menu.drilldown-sliding-in,
    .drilldown-active.drilldown-slide nav.elementor-nav-menu--dropdown ul.sub-menu.drilldown-sliding-out {
        animation: none;
    }
}
