/*
 * منوی چندسطحی آذین‌فایل - تنظیم ظاهری نسخه ۱۸
 * عرض پنل‌ها کنترل‌شده است؛ عنوان، شمارنده و نشانگر زیرمنو در یک ردیف می‌مانند.
 */

@media (min-width: 768px) {
    /* پنل اصلی: عرض با محتوای واقعی هماهنگ می‌شود، اما از اندازه امن بیشتر نمی‌شود. */
    .yamm-s .mega-menu.dropdown > .dropdown-menu {
        width: max-content !important;
        min-width: 250px !important;
        max-width: min(360px, calc(100vw - 24px)) !important;
        box-sizing: border-box !important;
        overflow: visible !important;
    }

    /* هر ردیف از راست به چپ و در یک خط: عنوان، شمارنده، فلش. */
    .yamm-s .mega-menu.dropdown > .dropdown-menu li.dropdown > a.menu-link,
    .yamm .mega-menu.dropdown > .dropdown-menu li.dropdown > a.menu-link,
    .yamm-s .no-mega .dropdown-menu li.dropdown > a.menu-link,
    .yamm .no-mega .dropdown-menu li.dropdown > a.menu-link,
    .yamm-s .mega-menu ul.yamm-fw > li > a.menu-link,
    .yamm .mega-menu ul.yamm-fw > li > a.menu-link,
    .yamm-s .mega-menu ul.afz-yamm-nested-menu > li > a.menu-link,
    .yamm .mega-menu ul.afz-yamm-nested-menu > li > a.menu-link,
    .yamm-s .no-mega ul.afz-yamm-nested-menu > li > a.menu-link,
    .yamm .no-mega ul.afz-yamm-nested-menu > li > a.menu-link {
        display: flex !important;
        flex-flow: row nowrap !important;
        align-items: center !important;
        justify-content: flex-start !important;
        gap: 6px !important;
        direction: rtl !important;
        text-align: right !important;
        width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        line-height: 1.65 !important;
    }

    /* عنوان متنی اجازه دارد در فضای باقی‌مانده کوچک شود، اما هیچ‌وقت به سطر دوم نمی‌رود. */
    .azin-navbar .afz-menu-item-title {
        display: block !important;
        flex: 0 1 auto !important;
        min-width: 0 !important;
        max-width: 100% !important;
        overflow: hidden !important;
        white-space: nowrap !important;
        text-overflow: ellipsis !important;
        direction: rtl !important;
    }

    /* شمارنده کنار عنوان می‌ماند و کوچک یا شکسته نمی‌شود. */
    .azin-navbar .afz-menu-product-count {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex: 0 0 auto !important;
        margin: 0 !important;
        white-space: nowrap !important;
        vertical-align: middle !important;
    }

    /* نشانگر برداری: فلش پیش‌فرض به سمت چپ است چون پنل فرزند در RTL به چپ باز می‌شود. */
    .azin-navbar .afz-menu-submenu-arrow {
        display: inline-flex !important;
        flex: 0 0 14px !important;
        align-items: center !important;
        justify-content: center !important;
        width: 14px !important;
        min-width: 14px !important;
        height: 18px !important;
        margin: 0 !important;
        padding: 0 !important;
        color: #9aa7a3 !important;
        float: none !important;
        line-height: 1 !important;
        pointer-events: none !important;
        transform: none !important;
    }

    .azin-navbar .afz-menu-submenu-arrow svg {
        display: block !important;
        width: 9px !important;
        height: 13px !important;
        overflow: visible !important;
    }

    .azin-navbar .afz-menu-submenu-arrow svg path {
        fill: none !important;
        stroke: currentColor !important;
        stroke-width: 2.2 !important;
        stroke-linecap: round !important;
        stroke-linejoin: round !important;
    }

    /* فلش جهت اصلی پنل را نشان می‌دهد: در حالت معمول چپ، هنگام بازشدن به راست برعکس. */
    .azin-navbar .afz-menu-submenu-arrow svg {
        transform: none !important;
        transform-origin: 50% 50% !important;
    }

    /* پنل دوم (yamm-fw): یک ستون منظم، با اسکرول داخلی در فهرست‌های بلند. */
    .yamm-s .mega-menu.dropdown > .dropdown-menu > li.menu-col {
        position: relative !important;
        display: block !important;
        width: max-content !important;
        min-width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        overflow: visible !important;
        flex: 0 0 auto !important;
        z-index: 1 !important;
    }

    .yamm-s .mega-menu.dropdown > .dropdown-menu > li.menu-col > ul.yamm-fw {
        position: absolute !important;
        top: 0 !important;
        right: calc(100% - 1px) !important;
        left: auto !important;
        display: none !important;
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        align-content: stretch !important;
        align-items: stretch !important;
        min-width: 250px !important;
        max-width: min(460px, calc(100vw - 24px)) !important;
        min-height: 0 !important;
        max-height: none !important;
        height: auto !important;
        margin: 0 !important;
        padding: 8px 0 !important;
        /* هرگز روی والد overflow:auto نگذار؛ پنل‌های سطح سوم باید از مرز آن خارج شوند. */
        overflow: visible !important;
        box-sizing: border-box !important;
        background: #fff !important;
        border: 1px solid rgba(0, 0, 0, .06) !important;
        border-radius: 5px !important;
        box-shadow: 0 7px 22px rgba(0, 0, 0, .12) !important;
        z-index: 10060 !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
        transition: none !important;
    }

    .yamm-s .mega-menu.dropdown > .dropdown-menu > li.menu-col:hover > ul.yamm-fw,
    .yamm-s .mega-menu.dropdown > .dropdown-menu > li.menu-col:focus-within > ul.yamm-fw,
    .yamm-s .mega-menu.dropdown > .dropdown-menu > li.menu-col.m-active > ul.yamm-fw {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }

    /* ردیف‌های پنل دوم به‌جای ستون‌های Bootstrap، عرض کامل و منظم دارند. */
    .yamm-s .mega-menu ul.yamm-fw > li {
        position: relative !important;
        display: block !important;
        float: none !important;
        flex: 0 0 auto !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
        overflow: visible !important;
    }

    .yamm-s .mega-menu ul.yamm-fw > li > a.menu-link {
        padding: 7px 12px !important;
        color: #505763 !important;
        text-decoration: none !important;
    }

    .yamm-s .mega-menu ul.yamm-fw > li > a.menu-link:hover,
    .yamm-s .mega-menu ul.yamm-fw > li > a.menu-link:focus {
        color: var(--azin-custom-color, #17b99a) !important;
        background: #f7faf9 !important;
    }

    /* پنل سوم و همه سطح‌های بعدی، مستقل و هم‌تراز با ردیف والد باز می‌شوند. */
    .yamm-s .mega-menu ul.yamm-fw li.dropdown,
    .yamm-s .mega-menu ul.afz-yamm-nested-menu li.dropdown,
    .yamm .mega-menu ul.yamm-fw li.dropdown,
    .yamm .mega-menu ul.afz-yamm-nested-menu li.dropdown,
    .yamm-s .no-mega .dropdown-menu li.dropdown,
    .yamm .no-mega .dropdown-menu li.dropdown {
        position: relative !important;
        overflow: visible !important;
        z-index: 2 !important;
    }

    .yamm-s .mega-menu ul.yamm-fw li.dropdown > ul.afz-yamm-nested-menu,
    .yamm-s .mega-menu ul.afz-yamm-nested-menu li.dropdown > ul.afz-yamm-nested-menu,
    .yamm .mega-menu ul.yamm-fw li.dropdown > ul.afz-yamm-nested-menu,
    .yamm .mega-menu ul.afz-yamm-nested-menu li.dropdown > ul.afz-yamm-nested-menu,
    .yamm-s .no-mega .dropdown-menu li.dropdown > ul.afz-yamm-nested-menu,
    .yamm .no-mega .dropdown-menu li.dropdown > ul.afz-yamm-nested-menu {
        position: absolute !important;
        top: 0 !important;
        right: calc(100% - 1px) !important;
        left: auto !important;
        display: none !important;
        width: max-content !important;
        min-width: 245px !important;
        max-width: min(340px, calc(100vw - 24px)) !important;
        max-height: none !important;
        height: auto !important;
        margin: 0 !important;
        padding: 7px 0 !important;
        /* پنل‌های عمیق نیز ظرف برش‌دهنده نمی‌سازند تا سطح بعدی دیده شود. */
        overflow: visible !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
        z-index: 10070 !important;
        transition: none !important;
        list-style: none !important;
        background: #fff !important;
        border: 1px solid rgba(0, 0, 0, .07) !important;
        border-radius: 5px !important;
        box-shadow: 0 7px 22px rgba(0, 0, 0, .14) !important;
        box-sizing: border-box !important;
    }

    .yamm-s .mega-menu ul.afz-yamm-nested-menu > li,
    .yamm .mega-menu ul.afz-yamm-nested-menu > li,
    .yamm-s .no-mega ul.afz-yamm-nested-menu > li,
    .yamm .no-mega ul.afz-yamm-nested-menu > li {
        position: relative !important;
        display: block !important;
        float: none !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
        flex: 0 0 auto !important;
        box-sizing: border-box !important;
    }

    .yamm-s .mega-menu ul.afz-yamm-nested-menu > li > a.menu-link,
    .yamm .mega-menu ul.afz-yamm-nested-menu > li > a.menu-link,
    .yamm-s .no-mega ul.afz-yamm-nested-menu > li > a.menu-link,
    .yamm .no-mega ul.afz-yamm-nested-menu > li > a.menu-link {
        display: flex !important;
        padding: 6px 12px !important;
        color: #505763 !important;
        text-decoration: none !important;
    }

    .yamm-s .mega-menu ul.afz-yamm-nested-menu > li > a.menu-link:hover,
    .yamm .mega-menu ul.afz-yamm-nested-menu > li > a.menu-link:hover,
    .yamm-s .no-mega ul.afz-yamm-nested-menu > li > a.menu-link:hover,
    .yamm .no-mega ul.afz-yamm-nested-menu > li > a.menu-link:hover,
    .yamm-s .mega-menu ul.afz-yamm-nested-menu > li > a.menu-link:focus,
    .yamm .mega-menu ul.afz-yamm-nested-menu > li > a.menu-link:focus,
    .yamm-s .no-mega ul.afz-yamm-nested-menu > li > a.menu-link:focus,
    .yamm .no-mega ul.afz-yamm-nested-menu > li > a.menu-link:focus {
        color: var(--azin-custom-color, #17b99a) !important;
        background: #f7faf9 !important;
    }

    /* فلش فقط با جهت واقعی پنل می‌چرخد؛ حالت عادی چپ، حالت بازشدن به راست: راست. */
    .yamm-s .mega-menu li.dropdown.afz-flyout-open-right > a > .afz-menu-submenu-arrow,
    .yamm .mega-menu li.dropdown.afz-flyout-open-right > a > .afz-menu-submenu-arrow,
    .yamm-s .no-mega li.dropdown.afz-flyout-open-right > a > .afz-menu-submenu-arrow,
    .yamm .no-mega li.dropdown.afz-flyout-open-right > a > .afz-menu-submenu-arrow,
    .yamm-s .mega-menu li.menu-col.afz-root-flyout-open-right > a > .afz-menu-submenu-arrow,
    .yamm .mega-menu li.menu-col.afz-root-flyout-open-right > a > .afz-menu-submenu-arrow {
        transform: rotate(180deg) !important;
    }

    /* منوی سطح دوم اگر به راست باز شود، موقعیت فلکس آن نیز با JS عوض می‌شود. */
    .yamm-s .mega-menu.dropdown > .dropdown-menu > li.menu-col.afz-root-flyout-open-right > ul.yamm-fw {
        right: auto !important;
        left: calc(100% - 1px) !important;
    }

    /* سطوح عمیق در جهت انتخاب‌شده توسط محاسبه فضای قابل‌استفاده باز می‌شوند. */
    .yamm-s .mega-menu li.dropdown.afz-flyout-open-right > ul.afz-yamm-nested-menu,
    .yamm .mega-menu li.dropdown.afz-flyout-open-right > ul.afz-yamm-nested-menu,
    .yamm-s .no-mega li.dropdown.afz-flyout-open-right > ul.afz-yamm-nested-menu,
    .yamm .no-mega li.dropdown.afz-flyout-open-right > ul.afz-yamm-nested-menu {
        right: auto !important;
        left: calc(100% - 1px) !important;
    }

    .yamm-s .mega-menu ul.yamm-fw li.dropdown:hover > ul.afz-yamm-nested-menu,
    .yamm-s .mega-menu ul.yamm-fw li.dropdown:focus-within > ul.afz-yamm-nested-menu,
    .yamm-s .mega-menu ul.afz-yamm-nested-menu li.dropdown:hover > ul.afz-yamm-nested-menu,
    .yamm-s .mega-menu ul.afz-yamm-nested-menu li.dropdown:focus-within > ul.afz-yamm-nested-menu,
    .yamm .mega-menu ul.yamm-fw li.dropdown:hover > ul.afz-yamm-nested-menu,
    .yamm .mega-menu ul.yamm-fw li.dropdown:focus-within > ul.afz-yamm-nested-menu,
    .yamm .mega-menu ul.afz-yamm-nested-menu li.dropdown:hover > ul.afz-yamm-nested-menu,
    .yamm .mega-menu ul.afz-yamm-nested-menu li.dropdown:focus-within > ul.afz-yamm-nested-menu,
    .yamm-s .no-mega .dropdown-menu li.dropdown:hover > ul.afz-yamm-nested-menu,
    .yamm-s .no-mega .dropdown-menu li.dropdown:focus-within > ul.afz-yamm-nested-menu,
    .yamm .no-mega .dropdown-menu li.dropdown:hover > ul.afz-yamm-nested-menu,
    .yamm .no-mega .dropdown-menu li.dropdown:focus-within > ul.afz-yamm-nested-menu {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
    }

    /* حذف فلش‌های pseudo قدیمی فقط برای لینک‌هایی که فلش SVG دارند. */
    .yamm-s .mega-menu.dropdown > .dropdown-menu li.dropdown > a.menu-link::after,
    .yamm .mega-menu.dropdown > .dropdown-menu li.dropdown > a.menu-link::after,
    .yamm-s .mega-menu ul.yamm-fw li.dropdown > a.menu-link::after,
    .yamm .mega-menu ul.yamm-fw li.dropdown > a.menu-link::after,
    .yamm-s .mega-menu ul.afz-yamm-nested-menu li.dropdown > a.menu-link::after,
    .yamm .mega-menu ul.afz-yamm-nested-menu li.dropdown > a.menu-link::after {
        content: none !important;
        display: none !important;
    }
}

@media (max-width: 767px) {
    /* منوی موبایل واکر جداگانه دارد؛ این اصلاح فقط از overflow افقی جلوگیری می‌کند. */
    .yamm-s .mega-menu.dropdown > .dropdown-menu,
    .yamm .mega-menu.dropdown > .dropdown-menu {
        max-width: calc(100vw - 24px) !important;
    }
}


/* کنترل نهایی فلش‌ها: فلش pseudo قدیمی قالب در منوی دسکتاپ خاموش است.
   فلش تکی فقط توسط Walker و صرفاً برای آیتم دارای فرزند واقعی ساخته می‌شود. */
@media (min-width: 768px) {
    #nav-row .yamm-s a.menu-link::after,
    #nav-row .yamm a.menu-link::after,
    #nav-row .yamm-s a.menu-link:after,
    #nav-row .yamm a.menu-link:after {
        content: none !important;
        display: none !important;
        width: 0 !important;
        height: 0 !important;
        border: 0 !important;
        background: none !important;
    }

    /* فلش اصلی در نوار منو همان نشانگر رو به پایین قالب می‌ماند؛ مثلث Bootstrap حذف می‌شود. */
    #nav-row .yamm-s > li > a.dropdown-toggle.menu-link::after,
    #nav-row .yamm > li > a.dropdown-toggle.menu-link::after {
        content: none !important;
        display: none !important;
        border: 0 !important;
    }

    /* جهت SVG با جهت واقعی پنل هماهنگ می‌شود، نه با transform روی wrapper. */
    #nav-row .yamm-s li.afz-flyout-open-right > a > .afz-menu-submenu-arrow > svg,
    #nav-row .yamm li.afz-flyout-open-right > a > .afz-menu-submenu-arrow > svg,
    #nav-row .yamm-s li.afz-root-flyout-open-right > a > .afz-menu-submenu-arrow > svg,
    #nav-row .yamm li.afz-root-flyout-open-right > a > .afz-menu-submenu-arrow > svg {
        transform: rotate(180deg) !important;
    }

    #nav-row .yamm-s li:not(.afz-flyout-open-right):not(.afz-root-flyout-open-right) > a > .afz-menu-submenu-arrow > svg,
    #nav-row .yamm li:not(.afz-flyout-open-right):not(.afz-root-flyout-open-right) > a > .afz-menu-submenu-arrow > svg {
        transform: none !important;
    }
}
