/*==================================================
GONBAD FIROUZE
Navigation
Version 6.0
==================================================*/


/*======================================
Main Menu
======================================*/

.menu{

    display:flex;
    justify-content:center;
    align-items:center;

    gap:0;

    margin:0;
    padding:0;

    list-style:none;

}

.menu > li{

    position:relative;

}

.menu > li > a{

    position:relative;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:12px 18px;

    font-size:15px;
    font-weight:600;

    color:var(--color-secondary);

    text-decoration:none;

    transition:.25s;

}

/*======================================
Top Border Animation
======================================*/

.menu > li > a::before{

    content:"";

    position:absolute;

    top:0;
    left:50%;

    width:70%;
    height:1px;

    background:var(--color-primary);

    transform:
        translateX(-50%)
        scaleX(0);

    transform-origin:center;

transition:.8s cubic-bezier(.22,.61,.36,1);

}

.menu > li:hover > a::before{

    transform:
        translateX(-50%)
        scaleX(1);

}

/*======================================
Dropdown Base
======================================*/

.menu .sub-menu{

    position:absolute;

    top:100%;
    right:0;

    min-width:240px;

    margin:0;
    padding:10px 0;

    list-style:none;

    background:var(--color-white);

    border-top:4px solid var(--color-primary);

    border-radius:6px;

    box-shadow:0 10px 30px rgba(0,0,0,.08);

    opacity:0;
    visibility:hidden;

    transform:translateY(10px);

    transition:.25s;

    z-index:9999;

}

.menu li:hover > .sub-menu{

    opacity:1;
    visibility:visible;

    transform:translateY(0);

}
/*====================================================
DROPDOWN
====================================================*/

.menu .sub-menu{

    position:absolute;

    top:100%;
    right:0;

    min-width:260px;

    margin:0;
    padding:10px 0;

    list-style:none;

    background:var(--color-white);

    border-radius:8px;

    box-shadow:0 10px 35px rgba(0,0,0,.08);

    opacity:0;
    visibility:hidden;

    transform:translateY(12px);

    transition:.25s ease;

    z-index:9999;

}

/* نمایش */

.menu > li:hover > .sub-menu,
.menu .sub-menu li:hover > .sub-menu{

    opacity:1;
    visibility:visible;

    transform:translateY(0);

}

/*====================================================
SUBMENU ITEMS
====================================================*/

.menu .sub-menu li{

    position:relative;

}

.menu .sub-menu a{

    display:flex;

    align-items:center;

    justify-content:space-between;

    padding:12px 18px;

    font-size:14px;

    color:var(--color-secondary);

    text-decoration:none;

    transition:.25s;

    white-space:nowrap;

}

.menu .sub-menu a:hover{

    background:var(--color-primary);

    color:var(--color-white);

}

/*====================================================
LEVEL 3
====================================================*/

.menu .sub-menu .sub-menu{

    top:0;

    right:100%;

    margin-right:0px;

}

body.english-body .menu .sub-menu{

    right:auto;
    left:0;

}

body.english-body .menu .sub-menu .sub-menu{

    left:100%;
    right:auto;

    margin-left:0px;

}
/*====================================================
ARROWS
====================================================*/

.menu > li.menu-item-has-children > a::after{

    content:"▼";

    font-size:9px;

    color:var(--color-orange);

    margin-right:8px;

    transition:.25s;

}

body.english-body .menu > li.menu-item-has-children > a::after{

    margin-right:0;
    margin-left:8px;

}

.menu .sub-menu .menu-item-has-children > a::after{

    content:"◀";

    font-size:9px;

    color:var(--color-orange);

    transition:.25s;

}

body.english-body .menu .sub-menu .menu-item-has-children > a::after{

    content:"▶";

}

.menu .sub-menu a:hover::after{

    color:var(--color-white);

}


/*====================================================
ACTIVE
====================================================*/

.menu > li.current-menu-item > a,
.menu > li.current-menu-parent > a,
.menu > li.current-menu-ancestor > a{

    color:var(--color-primary);

}


/*====================================================
COMPACT HEADER
====================================================*/

.header.is-compact .menu > li > a{

    padding:10px 16px;

    font-size:14px;

}


/*====================================================
RESPONSIVE
====================================================*/



/*====================================================
CLEANUP
====================================================*/

.menu li{

    list-style:none;

}

.menu a{

    text-decoration:none;

}

.menu ul{

    margin:0;
    padding:0;

}
.header-nav{
    display:block !important;
}