/* TM Flyout Menu v1.2 — שרשור פאנלים ישירות מפריטי התפריט העליון (בהשראת מור לוי) */

/* העץ המקורי המוסתר (ה-JS משכפל ממנו ומוחק אותו) */
#tmfm-root[hidden] {
    display: none !important;
}

/* ---- משתני עיצוב: מוגדרים על פריט מארח ועל הפאנלים ---- */
.tmfm-host,
.tmfm-dropdown {
    --tmfm-brand: #183950;
    --tmfm-accent: #8D3F11;
    --tmfm-text: #404040;
    --tmfm-bg: #ffffff;
    --tmfm-border: rgba(24, 57, 80, .14);
    --tmfm-font: 'Assistant', Arial, sans-serif;
}

/* פריט תפריט עליון שמארח פאנל */
li.menu-item.tmfm-host {
    position: relative;
}

/* מסתירים את תת-התפריט הישן של וורדפרס/Oxygen בפריטים שאנחנו מארחים —
   הפאנלים החיים שלנו מחליפים אותו (גם בדסקטופ וגם בהמבורגר של מובייל) */
li.menu-item.tmfm-host > ul.sub-menu {
    display: none !important;
}

/* חץ ∨ קטן ליד שם הפריט בשורה */
.tmfm-row-toggle {
    background: transparent;
    border: 0;
    padding: 2px 4px;
    margin-inline-start: 2px;
    cursor: pointer;
    font-size: 12px;
    line-height: 1;
    color: inherit;
    vertical-align: middle;
}

.tmfm-row-toggle span {
    display: inline-block;
    transition: transform .15s ease;
}

li.tmfm-row-open > .tmfm-row-toggle span {
    transform: rotate(180deg);
}

/* ---- העטיפה שנפתחת מתחת לפריט השורה ---- */
.tmfm-dropdown {
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    z-index: 99999;
    direction: rtl;
    font-family: var(--tmfm-font);
}

li.tmfm-row-open > .tmfm-dropdown {
    display: block;
}

/* ---- פאנלים ---- */
.tmfm-panel {
    list-style: none;
    margin: 0;
    padding: 6px 0;
    background: var(--tmfm-bg);
    border: 1px solid var(--tmfm-border);
    box-shadow: 0 8px 24px rgba(0, 0, 0, .16);
    border-radius: 6px;
    min-width: 240px;
    /* בלי overflow על פאנל עם ילדים — אחרת הפאנלים המקוננים נחתכים */
}

/* פאנל שכל פריטיו חסרי-ילדים — אין מה לחתוך, מותר לגלול */
.tmfm-panel.tmfm-leaf-panel {
    max-height: calc(100vh - 180px);
    overflow-y: auto;
    overflow-x: hidden;
}

/* הפאנל הראשון בתוך העטיפה: יושב סטטית מתחת לפריט (לא בצד) */
.tmfm-dropdown > .tmfm-panel {
    position: static !important;
    display: block !important;
    margin: 4px 0 0 0 !important;
}

/* ---- פריטי פאנל ----
   הפאנלים יושבים בתוך ה-nav של Oxygen, וכללי ה-CSS הגנריים שלו לדרופדאונים
   (למשל .oxy-nav-menu .menu-item ul / li / a) תופסים גם אותם ומשבשים מיקום
   וגבהים. לכן כל כללי הפריסה כאן מוקשחים ב-!important. */
.tmfm-item {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    display: block !important;
    float: none !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.4 !important;
}

.tmfm-link {
    display: block !important;
    position: static !important;
    padding: 9px 18px !important;
    margin: 0 !important;
    height: auto !important;
    line-height: 1.4 !important;
    color: var(--tmfm-text);
    text-decoration: none;
    font-size: 15px;
    font-weight: 400;
    white-space: nowrap;
}

.tmfm-has-children > .tmfm-link {
    padding-inline-end: 38px; /* מקום לחץ */
}

.tmfm-item:hover > .tmfm-link {
    background: var(--tmfm-accent);
    color: #fff;
}

.tmfm-toggle {
    position: absolute;
    inset-inline-end: 4px;
    top: 5px;
    background: transparent;
    border: 0;
    cursor: pointer;
    padding: 6px 10px;
    font-size: 15px;
    line-height: 1;
    color: inherit;
}

.tmfm-item:hover > .tmfm-toggle {
    color: #fff;
}

/* פריט שהשרשור פעיל עליו חייב לעלות מעל אחיו המאוחרים ברשימה — אחרת
   הפאנל שנפתח ממנו מצויר מתחת לשורות שאחריו (חפיפת טקסטים) */
.tmfm-item:hover,
.tmfm-item.tmfm-force-open {
    z-index: 20 !important;
}

/* ---- רמות עמוקות: פאנל צמוד/חופף לצד (השרשור) ---- */
.tmfm-panel .tmfm-panel {
    display: none;
    position: absolute !important;
    top: -7px !important;
    right: 100% !important;
    left: auto !important;
    bottom: auto !important;
    margin: 0 !important;
    margin-inline-end: 2px !important;
}

/* עכבר אמיתי: hover טהור פותח את הרמה הבאה */
@media (hover: hover) and (pointer: fine) {
    .tmfm-has-children:hover > .tmfm-panel {
        display: block;
    }
}

/* מקלדת / טאץ': נשלט ע"י JS */
.tmfm-has-children.tmfm-force-open > .tmfm-panel {
    display: block;
}

/* הגנת-קצה: נחתך משמאל — נפתח ימינה */
.tmfm-item.tmfm-flip > .tmfm-panel {
    right: auto !important;
    left: 100% !important;
    margin-inline-end: 0 !important;
    margin-inline-start: 2px !important;
}

/* ===================== מובייל: אקורדיון בתוך ההמבורגר של Oxygen ===================== */
@media (max-width: 900px) {
    .tmfm-dropdown {
        position: static;
        box-shadow: none;
    }

    .tmfm-dropdown > .tmfm-panel,
    .tmfm-panel .tmfm-panel {
        position: static !important;
        display: none !important;
        box-shadow: none;
        border: 0;
        border-radius: 0;
        min-width: 0;
        max-height: none;
        margin: 0 !important;
        padding-inline-start: 14px;
        background: rgba(24, 57, 80, .04);
    }

    li.tmfm-row-open > .tmfm-dropdown > .tmfm-panel {
        display: block !important;
    }

    .tmfm-has-children.tmfm-force-open > .tmfm-panel {
        display: block !important;
    }

    /* במובייל אין hover — ביטול פתיחת ה-hover של הדסקטופ ליתר ביטחון */
    .tmfm-item:hover > .tmfm-link {
        background: transparent;
        color: var(--tmfm-text);
    }

    .tmfm-link,
    .tmfm-toggle {
        white-space: normal;
    }

    .tmfm-toggle {
        position: absolute;
        inset-inline-end: 0;
        top: 0;
        padding: 10px 14px;
    }

    .tmfm-toggle span {
        display: inline-block;
        transition: transform .2s ease;
    }

    .tmfm-has-children.tmfm-force-open > .tmfm-toggle span {
        transform: rotate(-90deg);
    }
}