


.header-mobile {
    
    .header-mobile-content {
    
        .header-right {
            .canvas-mobile {
                .gva-offcanvas-content {
                    .top-canvas {
                        background-color:black;
                        
                        .control-close-mm {
                            background-color: black;
                            border: 1px solid white;
                            border-radius: 50px;
                            display: flex;
                            align-items: center;
                            justify-content: center;
                            padding: 0px;
                            zoom: 0.8;
                            margin: 10px;
                            
                            .far.fa-times-circle {
                                mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 640 640'%3E%3C!--!Font Awesome Free v7.2.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2026 Fonticons, Inc.--%3E%3Cpath d='M183.1 137.4C170.6 124.9 150.3 124.9 137.8 137.4C125.3 149.9 125.3 170.2 137.8 182.7L275.2 320L137.9 457.4C125.4 469.9 125.4 490.2 137.9 502.7C150.4 515.2 170.7 515.2 183.2 502.7L320.5 365.3L457.9 502.6C470.4 515.1 490.7 515.1 503.2 502.6C515.7 490.1 515.7 469.8 503.2 457.3L365.8 320L503.1 182.6C515.6 170.1 515.6 149.8 503.1 137.3C490.6 124.8 470.3 124.8 457.8 137.3L320.5 274.7L183.1 137.4z'/%3E%3C/svg%3E");
                                
                                width: 25px;
                                height: 25px;
                                
                                content: " ";
                                display: inline-block;

                                /* Mask setup */
                                -webkit-mask-repeat: no-repeat !important;
                                mask-repeat: no-repeat !important;
                            
                                -webkit-mask-position: center !important;
                                mask-position: center !important;
                            
                                -webkit-mask-size: contain !important;
                                mask-size: contain !important;
                                
                                -webkit-mask-repeat: no-repeat !important;
                                mask-repeat: no-repeat !important;
                            
                                /* Color of the icon */
                                background-color: white;
                            }
                        }
                    }
                    
                    
                    /*ul.gva-nav-menu > li.megamenu-main .megamenu-wrap-inner ul.megamenu-sub > li > a*/


                    .wp-sidebar {
                        padding: 15px;
                        background-color: #1A1A1A;
			height: calc(100vh - 52px);
                        
                        #gva-mobile-menu {
                            ul.gva-mobile-menu { /* first Level */
                                > li {
                                    > a {
                                        color: white;
                                        
                                        > .caret {
                                            display: none;
                                        }
                                    }
                                    
                                    
                                    
                                    div.submenu-inner  {
                                        padding: 0px !important;
                                        
                                        &:after {
                                            content: unset;
                                        }
                                        
                                        ul { /* 2nd level class="menu-sub" */
                                            
                                            li {
                                                &:before {
                                                    content: unset;
                                                }
                                                
                                                
                                                
                                                > a {
                                                    display: flex;
                                                    gap: 20px;
                                                    align-items: center;
                                                    color: white !important;
                                                    border-bottom: 0px;
                                                    
                                                    .icon {
                                                        width: 25px;
                                                        height: 25px;
                                                    }
                                                    
                                                    &:before {
                                                        content: unset;
                                                    }
                                                    
                                                    .caret {
                                                        width: 20px;
                                                        display: block !important;
                                                        
                                                        background: url("/wp-content/themes/qempo/images/plus.png") no-repeat center right transparent;
                                                    }
                                                }
                                                
                                                > ul {      /* 3rd Level class="submenu-inner" */
                                                    > li {
                                                        &.open {
                                                            > .submenu-inner {
                                                                display: block !important;
                                                            }
                                                            
                                                            >a {
                                                                .caret {
                                                                    background: url("/wp-content/themes/qempo/images/minium.png") no-repeat center right transparent;
                                                                }
                                                            }
                                                        }    
                                                        
                                                        > a { 
                                                            .caret {
                                                                width: 20px;
                                                                display: block !important;
                                                                background: url("/wp-content/themes/qempo/images/plus.png") no-repeat center right transparent;
                                                            }
                                                        }
                                                        
                                                        .submenu-inner {        /* 4th level class="submenu-inner */
                                                            display: none !important;
                                                           
                                                            
                                                        }
                                                        
                                                        
                                                    }
                                                }
                                                > .submenu-inner {
                                                    display: none !important;
                                                }
                                                &.open {
                                                    > a {
                                                        .caret {
                                                            background: url("/wp-content/themes/qempo/images/minium.png") no-repeat center right transparent;
                                                            right: -20px;
                                                        }
                                                    }
                                                
                                                    > .submenu-inner {
                                                        display: block !important;
                                                    }
                                                }
                                                &:hover {
                                                    > a {
                                                        color: #F36F27 !important;    
                                                    }                                               
                                                    
                                                }
                                                
                                                &.current_page_item,  &.current-menu-ancestor {
                                                    > a {
                                                        color: #F36F27 !important ;    
                                                    }
                                                }
                                            }
                                        }
                                    }
                                    
                                    &:hover {
                                        > a {
                                            color: #F36F27 ;    
                                        }                                               
                                        
                                    }
                                    
                                    &.current-menu-parent, &.current-menu-ancestor {
                                        > a {
                                            color: #F36F27 !important ;
                                        }
                                    }
                                    
                                    &.current_page_item {
                                        > a {
                                            color: #F36F27 !important ;    
                                        }
                                    }
                                }
                            }
                            
                            .menu-description {
                                display: none;
                            }
                        }
                    }
                }
            }
        }
    }
    
    
    /*ul.gva-nav-menu > li.menu-item-3398, ul.gva-nav-menu > li.menu-item-3398:hover {*/
    /*    padding: 0px 20px;*/
    /*    background-color: #F46F25;*/
    /*    border-radius: 49px 49px 49px 49px;*/
    /*    height: 100%;*/
    /*}*/
    /*ul.gva-nav-menu > li.menu-item-3398:before {*/
    /*    display: none;*/
    /*}*/
    /*ul.gva-nav-menu > li.menu-item-3398 a, ul.gva-nav-menu > li.menu-item-3398:hover a {*/
    /*    color: #fff;*/
    /*}*/
    
    li {
        &:has(a[href*="contact-us"]) {
            &::before {
                content: unset;
            }
        }
        > a[href*="contact-us"] {
            background-color: #F46F25;
            border-radius: 50px;
            height: 100%;
            width: 100%;
            text-align: center;
            
            
            
            
        }
        &:hover {
            > a { 
                color: #fff;
            }
        }
    }
}


.gva-mobile-menu .menu-item-has-children > a > .caret {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  flex-shrink: 0;
  border: 0.5px solid var(--color-border-secondary);
  border-radius: 6px;
  cursor: pointer;
  transition: transform 0.2s;
  margin-left: auto;
}

.gva-mobile-menu .menu-item-has-children.open > a > .caret {
  transform: rotate(90deg);
}

/* Hide 3rd level by default */
.gva-mobile-menu .submenu-inner .submenu-inner {
  display: none;
}

/* Auto-show when current page */
.gva-mobile-menu .current_page_item > .submenu-inner {
  display: block;
}



