/* ==========================================================================
# File: canvas-mobile-menu.css
# Purpose: Customizing the Astra Canvas Mobile Menu Theme Styles.
# Note: We do not rewrite Astra code, only add what is needed for visual modifications.
# Author: Tamer
# Date: 2025-12-11
========================================================================== */
@media (max-width: 921px) {
    .ast-mobile-popup-header {
        background-image: url('/wp-content/themes/hub-trend-child/logo/hub-trend-logo.svg');
        background-repeat: no-repeat;
        background-size: 150px auto;
        background-position: left center; 
        margin: 10px;
    }
    
    .rtl .ast-mobile-popup-header {
        background-position: right center;
    }
    
	.ast-builder-menu-mobile .main-navigation .menu-item.menu-item-has-children > .ast-menu-toggle {
        top: 10px !important;
    }
	
    /* زر القائمة الجوالية */
    .ast-header-break-point .ast-menu-toggle {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        padding: 6px !important;
        border: 1px solid var(--ast-global-color-6) !important;
        border-radius: 6px !important;
        cursor: pointer !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
        margin: 0 10px !important;
        transform: rotateX(0deg) !important;
        transition: transform 0.5s ease, fill 0.6s ease !important;
    }

    /* الحاوية الخاصة بالسهم */
    .ast-header-break-point .ast-icon.icon-arrow {
        display: inline-flex !important;
        margin: 0 5px !important;
    }

    /* السهم نفسه */
    .ast-header-break-point .ast-icon.icon-arrow svg {
        width: 14px !important;
        height: 14px !important;
        margin: 0 ;
    }

    .ast-mobile-popup-content .ast-submenu-expanded > .ast-menu-toggle {
    background: var(--ast-global-color-1) !important;
    color:  var(--ast-global-color-4) !important;
    transform: rotateX(180deg) !important;
    transition: transform 0.5s ease, fill 0.6s ease !important;
    }
}

/* =====================================*/
@media (max-width: 544px) {
    .ast-mobile-popup-header {
        background-image: url('/wp-content/themes/hub-trend-child/logo/hub-trend-logo.svg');
        background-repeat: no-repeat;
        background-size: 150px auto;
        background-position: left center; 
        margin: 10px;
    }
    
    .rtl .ast-mobile-popup-header {
        background-position: right center;
    }
}