/**
 * RTL Menu Fixes for Hebrew and other RTL languages
 * Fixes mobile alignment, header layout, and submenu dropdown background issues
 * Updated: 2025-12-28 - Cleaned and consolidated
 */

/* ==========================================================================
   RTL GENERAL FIXES
   ========================================================================== */

html[lang="he"],
html[dir="rtl"],
body.rtl {
    direction: rtl;
}

/* ==========================================================================
   DESKTOP MENU RTL FIXES
   ========================================================================== */

/* RTL dropdown positioning */
html[lang="he"] .elementor-nav-menu--dropdown,
html[dir="rtl"] .elementor-nav-menu--dropdown,
.rtl .elementor-nav-menu--dropdown {
    text-align: right;
    left: auto !important;
    right: 0 !important;
}

/* Submenu dropdown background fix - ensure it covers full text */
html[lang="he"] .elementor-nav-menu--dropdown .menu-item,
html[dir="rtl"] .elementor-nav-menu--dropdown .menu-item,
.rtl .elementor-nav-menu--dropdown .menu-item {
    width: 100%;
    min-width: 200px;
    white-space: nowrap;
}

html[lang="he"] .elementor-nav-menu--dropdown a,
html[dir="rtl"] .elementor-nav-menu--dropdown a,
.rtl .elementor-nav-menu--dropdown a {
    display: block;
    width: 100%;
    text-align: right;
    padding-right: 20px !important;
    padding-left: 20px !important;
    box-sizing: border-box;
}

/* Fix submenu background clipping */
html[lang="he"] .elementor-nav-menu--main .elementor-nav-menu--dropdown,
html[dir="rtl"] .elementor-nav-menu--main .elementor-nav-menu--dropdown {
    min-width: max-content;
    width: auto;
    overflow: visible;
    padding: 0;
}

html[lang="he"] .elementor-nav-menu--dropdown .elementor-item,
html[dir="rtl"] .elementor-nav-menu--dropdown .elementor-item {
    background-clip: padding-box;
    box-sizing: border-box;
}

/* Submenu hover background full width */
html[lang="he"] .elementor-nav-menu--dropdown a:hover,
html[lang="he"] .elementor-nav-menu--dropdown a:focus,
html[lang="he"] .elementor-nav-menu--dropdown a.highlighted,
html[lang="he"] .elementor-nav-menu--dropdown a.elementor-item-active,
html[dir="rtl"] .elementor-nav-menu--dropdown a:hover,
html[dir="rtl"] .elementor-nav-menu--dropdown a:focus,
html[dir="rtl"] .elementor-nav-menu--dropdown a.highlighted,
html[dir="rtl"] .elementor-nav-menu--dropdown a.elementor-item-active {
    width: 100%;
    display: block;
    background-size: 100% 100%;
}

/* ==========================================================================
   SUBMENU DROPDOWN BACKGROUND FIX
   ========================================================================== */

/* Fix background not fitting text - ensure proper box model */
.elementor-nav-menu--dropdown .menu-item,
.elementor-nav-menu--dropdown .elementor-item {
    box-sizing: border-box;
}

html[lang="he"] .elementor-nav-menu--dropdown ul,
html[dir="rtl"] .elementor-nav-menu--dropdown ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

html[lang="he"] .elementor-nav-menu--dropdown li,
html[dir="rtl"] .elementor-nav-menu--dropdown li {
    width: 100%;
    padding: 0;
    margin: 0;
}

/* ==========================================================================
   HEADER CONTAINER RTL FIXES
   ========================================================================== */

/* Ensure nav widget aligns properly */
html[lang="he"] .elementor-widget-nav-menu,
html[dir="rtl"] .elementor-widget-nav-menu {
    direction: rtl;
    text-align: right;
}

/* ==========================================================================
   LANGUAGE SWITCHER ALIGNMENT
   ========================================================================== */

html[lang="he"] .lang-switch-wrap,
html[dir="rtl"] .lang-switch-wrap {
    margin-right: 0;
    margin-left: 0;
}

html[lang="he"] .lmsp-switcher,
html[dir="rtl"] .lmsp-switcher {
    direction: rtl;
    text-align: right;
}

/* ==========================================================================
   TABLET/MOBILE HEADER LAYOUT (max-width: 1024px) - CONSOLIDATED
   Layout: [LOGO] ... [LANG SWITCHER + HAMBURGER]
   ========================================================================== */

@media (max-width: 1024px) {
    /* ============================================
       HEBREW/RTL MOBILE HEADER LAYOUT
       ============================================ */

    /* Main header container - OVERRIDE Elementor's row-reverse */
    html[lang="he"] .elementor-element-ced89f5,
    html[dir="rtl"] .elementor-element-ced89f5,
    html[lang="he-IL"] .elementor-element-ced89f5,
    .elementor-2879 .elementor-element.elementor-element-ced89f5 {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        justify-content: space-between !important;
        align-items: center !important;
    }

    /* Logo container (3a901461) - FORCE to LEFT with order -1 */
    html[lang="he"] .elementor-element-3a901461,
    html[dir="rtl"] .elementor-element-3a901461,
    html[lang="he-IL"] .elementor-element-3a901461,
    .elementor-2879 .elementor-element.elementor-element-3a901461 {
        display: flex !important;
        justify-content: flex-start !important;
        align-items: center !important;
        order: -1 !important;
        flex-shrink: 0 !important;
        flex-grow: 0 !important;
    }

    /* Mobile menu container RTL */
    html[lang="he"] .elementor-nav-menu__container,
    html[dir="rtl"] .elementor-nav-menu__container,
    .rtl .elementor-nav-menu__container {
        text-align: right;
        direction: rtl;
    }

    /* Mobile dropdown alignment */
    html[lang="he"] .elementor-nav-menu--dropdown,
    html[dir="rtl"] .elementor-nav-menu--dropdown {
        right: 0 !important;
        left: auto !important;
        text-align: right;
    }

    /* Mobile menu items alignment */
    html[lang="he"] .elementor-nav-menu--dropdown a,
    html[dir="rtl"] .elementor-nav-menu--dropdown a {
        text-align: right !important;
        justify-content: flex-end;
        padding-right: 20px !important;
    }

    /* Mobile submenu indicator (chevron) position */
    html[lang="he"] .elementor-nav-menu--dropdown .sub-arrow,
    html[dir="rtl"] .elementor-nav-menu--dropdown .sub-arrow,
    html[lang="he"] .elementor-nav-menu--dropdown .elementor-sub-item > .sub-arrow,
    html[dir="rtl"] .elementor-nav-menu--dropdown .elementor-sub-item > .sub-arrow {
        right: auto !important;
        left: 10px !important;
        transform: rotate(180deg);
    }

    /* Fix mobile menu height alignment */
    html[lang="he"] .elementor-nav-menu--dropdown li,
    html[dir="rtl"] .elementor-nav-menu--dropdown li {
        display: flex;
        align-items: center;
        min-height: 48px;
    }

    /* Mobile menu full width background */
    html[lang="he"] .elementor-nav-menu--dropdown .menu-item a,
    html[dir="rtl"] .elementor-nav-menu--dropdown .menu-item a {
        width: 100%;
        display: block;
    }

    /* ============================================
       ENGLISH (LTR) HEADER LAYOUT
       ============================================ */

    html:not([lang="he"]):not([dir="rtl"]) .elementor-element-20925dae {
        flex-direction: row !important;
    }

    html:not([lang="he"]):not([dir="rtl"]) .elementor-element-48690604 {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: flex-end !important;
    }

    html:not([lang="he"]):not([dir="rtl"]) .elementor-element-fbdad0c .elementor-menu-toggle {
        margin-left: auto !important;
        margin-right: 0 !important;
    }

    html:not([lang="he"]):not([dir="rtl"]) .elementor-element-ddkv7mk {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        margin-left: 10px !important;
    }

    /* ============================================
       LMSP LANGUAGE SWITCHER WIDGET
       ============================================ */

    html[lang="he"] .lmsp-widget-wrapper,
    html[dir="rtl"] .lmsp-widget-wrapper {
        direction: rtl;
    }

    html[lang="he"] .lmsp-widget-toggle,
    html[dir="rtl"] .lmsp-widget-toggle {
        justify-content: flex-start;
    }

    html[lang="he"] .lmsp-widget-dropdown,
    html[dir="rtl"] .lmsp-widget-dropdown {
        right: 0;
        left: auto;
        text-align: right;
    }
}

/* ==========================================================================
   SMALL MOBILE FIXES (max-width: 767px) - CONSOLIDATED
   Uses absolute positioning for reliable mobile layout
   ========================================================================== */

@media (max-width: 767px) {
    /* Controls container (798905e6) - position relative for absolute children */
    .elementor-2879 .elementor-element.elementor-element-798905e6 {
        position: relative !important;
        width: 100% !important;
        height: 50px !important;
    }

    /* Language switcher (lan0nw6) - absolute position next to hamburger */
    .elementor-2879 .elementor-element.elementor-element-lan0nw6 {
        position: absolute !important;
        right: 60px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        z-index: 9999 !important;
        margin: 0 !important;
        width: auto !important;
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    .elementor-2879 .elementor-element.elementor-element-lan0nw6 > .elementor-widget-container {
        margin: 0 !important;
        padding: 0 !important;
    }

    .elementor-2879 .elementor-element.elementor-element-lan0nw6 .elementor-shortcode,
    .elementor-2879 .elementor-element.elementor-element-lan0nw6 .lmsp-switcher {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    /* Hamburger (719527a9) - absolute position on right edge */
    .elementor-2879 .elementor-element.elementor-element-719527a9 {
        position: absolute !important;
        right: 10px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        z-index: 9998 !important;
    }

    /* Mobile dropdown full width */
    html[lang="he"] .elementor-nav-menu__container.elementor-nav-menu--dropdown,
    html[dir="rtl"] .elementor-nav-menu__container.elementor-nav-menu--dropdown {
        width: 100%;
        right: 0 !important;
        left: 0 !important;
    }
}

/* ==========================================================================
   USER-TESTED FIXES - These values work in F12 console
   ========================================================================== */

/* Logo image height on mobile */
@media (max-width: 767px) {
    .elementor-2879 .elementor-element.elementor-element-a6b308e img {
        height: 84px;
    }
}

/* Language toggle button positioning */
@media (max-width: 480px) {
    .lmsp-toggle {
        padding: 5px 8px;
        font-size: 11px;
        margin: 27px 50px 0 0 !important;
        gap: 18px;
    }
}

/* Hamburger position - user tested values */
@media (max-width: 767px) {
    .elementor-2879 .elementor-element.elementor-element-719527a9 {
        position: absolute !important;
        right: 0px !important;
        top: 100% !important;
        transform: translateY(-50%) !important;
        z-index: 9998 !important;
    }
}

/* Logo container positioning */
@media (max-width: 1024px) {
    html[lang="he"] .elementor-element-3a901461,
    html[dir="rtl"] .elementor-element-3a901461,
    html[lang="he-IL"] .elementor-element-3a901461,
    .elementor-2879 .elementor-element.elementor-element-3a901461 {
        display: flex !important;
        justify-content: flex-start !important;
        align-items: center !important;
        order: -1 !important;
        padding-top: 0px;
        margin: -27px 11px 10px 1px !important;
    }
}

/* Dropdown menu positioning */
@media (max-width: 767px) {
    .elementor-2879 .elementor-element.elementor-element-719527a9 .elementor-nav-menu--main > .elementor-nav-menu > li > .elementor-nav-menu--dropdown,
    .elementor-2879 .elementor-element.elementor-element-719527a9 .elementor-nav-menu__container.elementor-nav-menu--dropdown {
        margin: 36px 0px 0px 17px !important;
        padding: 0px 10px 2px 0px;
    }
}
