/* =========================================================
   MOBILE MENU
   ========================================================= */


/* =========================================================
   آیتم دارای زیرمنو
   ========================================================= */

   .mobile-navigation .menu-item-has-children {
    position: relative;
}


/* =========================================================
   دکمه فلش
   ========================================================= */

.mobile-navigation .mobile-submenu-toggle {
    position: absolute;

    left: 0;
    top: 0;

    width: 58px;
    height: 60px;

    padding: 0;
    margin: 0;

    border: 0;
    border-right: 1px solid #eeeeee;

    background: transparent;
    color: #111;

    cursor: pointer;

    display: flex;
    align-items: center;
    justify-content: center;

    z-index: 5;

    appearance: none;
    -webkit-appearance: none;

    font-family: 'IRANSans', sans-serif;
}


/* =========================================================
   فلش
   حالت بسته: به سمت چپ
   حالت باز: به سمت بالا
   ========================================================= */

.mobile-navigation .mobile-submenu-toggle::before {
    content: "⌃";

    display: block;

    font-family: Arial, sans-serif;

    font-size: 18px;
    font-weight: 400;

    line-height: 1;

    width: auto;
    height: auto;

    border: 0;

    transform: rotate(-90deg);

    transition: transform 0.35s ease-in-out;
}


/* =========================================================
   فلش در حالت باز
   ========================================================= */

.mobile-navigation
.menu-item-has-children.is-open
> .mobile-submenu-toggle::before {

    transform: rotate(0deg);
}


/* =========================================================
   دکمه فلش در حالت باز
   ========================================================= */

.mobile-navigation
.menu-item-has-children.is-open
> .mobile-submenu-toggle {

    background-color: rgb(91, 91, 91);
    color: #fff;
}


/* =========================================================
   ردیف دسته در حالت باز
   ========================================================= */

.mobile-navigation
.menu-item-has-children.is-open
> a {

    background-color: #f7f7f7;
}


/* =========================================================
   زیرمنو
   ========================================================= */

.mobile-navigation .sub-menu {

    display: block;

    max-height: 0;

    overflow: hidden;

    margin: 0;
    padding: 0;

    list-style: none;

    opacity: 0;

    transition:
        max-height 0.35s ease,
        opacity 0.25s ease;
}


/* =========================================================
   زیرمنوی باز
   ========================================================= */

.mobile-navigation
.menu-item-has-children.is-open
> .sub-menu {

    max-height: 500px;

    opacity: 1;
}


/* =========================================================
   آیتم‌های زیرمنو
   ========================================================= */

.mobile-navigation
.sub-menu
> li {

    position: relative;

    opacity: 1;

    transform: none;

    border-bottom: 1px solid #f3f3f3;
}


/* =========================================================
   آیتم‌های منوی اصلی
   ========================================================= */

.mobile-navigation
.mobile-menu-list
> li {

    position: relative;

    border-bottom: 1px solid #eeeeee;
}


/* =========================================================
   لینک‌های منوی اصلی
   ========================================================= */

.mobile-navigation
.mobile-menu-list
> li
> a {

    display: block;

    padding: 18px 24px 18px 70px;

    color: #111;

    text-decoration: none;

    font-family: 'IRANSans', sans-serif;
    font-weight: 500;

    line-height: 1.6;
}


/* =========================================================
   لینک‌های زیرمنو
   ========================================================= */

.mobile-navigation
.sub-menu
> li
> a {

    display: block;

    padding: 16px 42px 16px 70px;

    color: #111;

    text-decoration: none;

    font-family: 'IRANSans', sans-serif;
    font-weight: 400;

    line-height: 1.6;
}


/* =========================================================
   زیرمنوی سطح دوم
   ========================================================= */

.mobile-navigation
.sub-menu
.sub-menu
> li
> a {

    padding-right: 62px;
}


/* =========================================================
   آخرین آیتم زیرمنو
   ========================================================= */

.mobile-navigation
.sub-menu
> li:last-child {

    border-bottom: 0;
}


/* =========================================================
   Hover فلش
   ========================================================= */

@media (hover: hover) {

    .mobile-navigation
    .mobile-submenu-toggle:hover {

        background: rgba(0, 0, 0, 0.03);
    }

}


/* =========================================================
   صفحه اصلی
   ========================================================= */

.mobile-home-link {

    display: flex;

    align-items: center;

    width: 100%;

    min-height: 64px;

    padding: 0 28px;

    box-sizing: border-box;

    color: #111;
    background: #fff;

    text-decoration: none;

    font-family: 'IRANSans', sans-serif;

    font-size: 15px;

    font-weight: 500;

    line-height: 1.6;

    border-bottom: 1px solid #e5e5e5;

    box-shadow: 0 0 9px rgba(0, 0, 0, 0.17);

    transition:
        background-color 0.2s ease,
        color 0.2s ease;
}


/* =========================================================
   Hover صفحه اصلی
   ========================================================= */

.mobile-home-link:hover {

    background-color: #f7f7f7;
}
/* =========================================================
   حذف نقطه‌های لیست منوی موبایل
   ========================================================= */

   .mobile-menu-list,
   .mobile-menu-list ul,
   .mobile-menu-list ol {
       list-style: none;
       margin: 0;
       padding: 0;
   }
   
   .mobile-menu-list li {
       list-style: none;
   }
   
   .mobile-menu-list li::before,
   .mobile-menu-list li::after {
       content: none;
   }