/*
 * DigiExin Mega Menu 1.3.3
 * Woodmart Categories Menu adapter
 * Target: .wd-dropdown.wd-dropdown-cats > ul.dxmm-enabled
 */

@media (min-width: 1025px) {
    /* -----------------------------------------------------------------
       Outer Woodmart categories dropdown.
       v1.3.3 uses the exact Woodmart opener as the only trigger:
       .menu-opener.color-scheme-light.has-bg

       IMPORTANT: closed means display:none. The panel is not kept alive
       by opacity/visibility tricks, so it cannot create an invisible hover
       area over the page. JS only preserves the active state while the
       pointer/focus moves from the opener into the already-open panel.
       ----------------------------------------------------------------- */
    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel {
        box-sizing: border-box !important;
        transition: none !important;
        animation: none !important;
        transform: none !important;
        width: min(1180px, calc(100vw - 32px)) !important;
        min-width: min(900px, calc(100vw - 32px)) !important;
        max-width: calc(100vw - 32px) !important;
        max-height: min(74vh, 720px) !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;

        padding: 26px 30px 24px !important;
        border-radius: 0 0 14px 14px !important;
        background: #fff !important;
        box-shadow: 0 14px 35px rgba(0, 0, 0, .10) !important;

        direction: rtl !important;
        text-align: right !important;
    }

    /* Closed by default: there is no hover target except the opener. */
    .wd-header-cats.dxmm-trigger-owner > .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel {
        display: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
        pointer-events: none !important;
    }

    /* Immediate CSS response on the exact requested opener. */
    .wd-header-cats.dxmm-trigger-owner > .menu-opener.color-scheme-light.has-bg:hover + .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel,
    .wd-header-cats.dxmm-trigger-owner > .menu-opener.color-scheme-light.has-bg:focus + .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel,
    .wd-header-cats.dxmm-trigger-owner.dxmm-active > .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }

    /* Root menu becomes a masonry-like four-column mega menu. */
    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel > ul.dxmm-enabled.dxmm-woodmart-root {
        display: block !important;
        position: static !important;
        inset: auto !important;
        float: none !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        transform: none !important;
        overflow: visible !important;
        list-style: none !important;

        columns: 4 205px !important;
        column-gap: 42px !important;
        column-fill: balance !important;
    }

    /* Every level-0 category is one block in a column. */
    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel > ul.dxmm-woodmart-root > li.dxmm-group {
        box-sizing: border-box !important;
        display: inline-block !important;
        position: static !important;
        inset: auto !important;
        float: none !important;
        vertical-align: top !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;

        margin: 0 0 18px !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        transform: none !important;

        break-inside: avoid !important;
        page-break-inside: avoid !important;
        list-style: none !important;
    }

    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel > ul.dxmm-woodmart-root > li.dxmm-group.current-menu-item,
    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel > ul.dxmm-woodmart-root > li.dxmm-group.current-menu-parent,
    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel > ul.dxmm-woodmart-root > li.dxmm-group.current-menu-ancestor {
        background: transparent !important;
    }

    /* Level-0 link = column title. */
    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel > ul.dxmm-woodmart-root > li.dxmm-group > a.dxmm-group-title {
        box-sizing: border-box !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 7px !important;
        position: relative !important;

        width: 100% !important;
        min-height: 26px !important;
        margin: 0 0 7px !important;
        padding: 0 !important;

        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        transform: none !important;

        color: #242424 !important;
        font-family: inherit !important;
        font-size: 14px !important;
        font-weight: 700 !important;
        line-height: 1.8 !important;
        text-align: right !important;
        text-decoration: none !important;
        white-space: normal !important;
    }

    /* Disable Woodmart's simple-dropdown arrow on column titles. */
    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel > ul.dxmm-woodmart-root > li.dxmm-group > a.dxmm-group-title::after {
        content: none !important;
        display: none !important;
    }

    /* Keep Woodmart category icons but resize them for mega-menu headings. */
    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel > ul.dxmm-woodmart-root > li.dxmm-group > a.dxmm-group-title > img.wd-nav-img {
        display: block !important;
        width: 22px !important;
        min-width: 22px !important;
        max-width: 22px !important;
        height: 22px !important;
        min-height: 22px !important;
        max-height: 22px !important;
        margin: 0 !important;
        object-fit: contain !important;
        flex: 0 0 22px !important;
    }
.wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel > ul.dxmm-woodmart-root > li.dxmm-group > a.dxmm-group-title > img.wd-nav-img {
    display: none  !important;
}
    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel > ul.dxmm-woodmart-root > li.dxmm-group > a.dxmm-group-title > .nav-link-text {
        display: flex !important;
        align-items: center !important;
        min-width: 0 !important;
        color: inherit !important;
        line-height: inherit !important;
    }

    /* Red accent similar to the previous plugin design. */
    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel > ul.dxmm-woodmart-root > li.dxmm-group > a.dxmm-group-title > .nav-link-text::before {
        content: '' !important;
        display: inline-block !important;
        width: 2px !important;
        height: 14px !important;
        margin: 0 0 0 8px !important;
        border-radius: 2px !important;
        background:var(--e-global-color-secondary) !important;
        flex: 0 0 2px !important;
    }

    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel > ul.dxmm-woodmart-root > li.dxmm-group > a.dxmm-group-title:focus {
        color: #111 !important;
        background: transparent !important;
    }

    /* -----------------------------------------------------------------
       Woodmart renders every level-0 submenu as a separate popup:
       .wd-dropdown-menu.wd-dropdown > .container > .wd-sub-menu
       Here it is flattened and kept visible inside its category group.
       ----------------------------------------------------------------- */
    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel > ul.dxmm-woodmart-root > li.dxmm-group > .dxmm-group-dropdown {
        box-sizing: border-box !important;
        display: block !important;
        position: static !important;
        inset: auto !important;
        float: none !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        transform: none !important;

        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        overflow: visible !important;
    }

    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel .dxmm-group-dropdown > .container,
    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel .dxmm-group-dropdown > .wd-entry-content,
    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel .dxmm-group-container {
        display: block !important;
        position: static !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        transform: none !important;
    }

    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel ul.dxmm-group-links,
    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel .dxmm-group-dropdown ul.wd-sub-menu {
        display: block !important;
        position: static !important;
        inset: auto !important;
        float: none !important;

        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;

        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        transform: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
        list-style: none !important;
    }

    /* Level-1 items. */
    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel .dxmm-group-dropdown ul.wd-sub-menu > li {
        display: block !important;
        position: static !important;
        width: 100% !important;
        min-width: 0 !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        transform: none !important;
        list-style: none !important;
    }

    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel .dxmm-group-dropdown ul.wd-sub-menu > li > a.woodmart-nav-link {
        display: block !important;
        position: static !important;
        width: 100% !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 3px 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        transform: none !important;

        color: #8b8b8b !important;
        font-family: inherit !important;
        font-size: 13px !important;
        font-weight: 400 !important;
        line-height: 1.9 !important;
        text-align: right !important;
        text-decoration: none !important;
        white-space: normal !important;
    }

    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel .dxmm-group-dropdown ul.wd-sub-menu > li > a.woodmart-nav-link::before,
    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel .dxmm-group-dropdown ul.wd-sub-menu > li > a.woodmart-nav-link::after {
        content: none !important;
        display: none !important;
    }

    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel .dxmm-group-dropdown ul.wd-sub-menu > li > a.woodmart-nav-link:focus {
        color: #222 !important;
        background: transparent !important;
    }

    /* Deeper Woodmart submenus are also flattened instead of opening popups. */
    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel .dxmm-group-dropdown .dxmm-nested-dropdown > .container,
    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel .dxmm-group-dropdown .dxmm-nested-dropdown > .wd-entry-content {
        display: block !important;
        position: static !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel .dxmm-group-dropdown .dxmm-nested-dropdown,
    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel .dxmm-group-dropdown ul.wd-sub-menu ul.wd-sub-menu {
        display: block !important;
        position: static !important;
        inset: auto !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 10px 0 0 !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        transform: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        pointer-events: auto !important;
    }
}

/* Tablet/mobile: do not force desktop mega-menu layout; Woodmart keeps control. */
@media (max-width: 1024px) {
    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel,
    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel > .dxmm-woodmart-root,
    .wd-dropdown.wd-dropdown-cats.dxmm-woodmart-panel .dxmm-group-dropdown {
        max-width: 100% !important;
    }
}