/**
 * 移动端导航用户体验增强
 * 提供更直观的视觉反馈，帮助用户理解导航菜单的状态
 */

/* 导航按钮基础样式 */
.menu-toggle {
    position: relative;
    z-index: 100003 !important;
}

/* 菜单关闭状态下的导航按钮 */
.menu-toggle:not(.menu-open) {
    /* 可以添加一些视觉效果来表明菜单是关闭的 */
    opacity: 1;
}

/* 菜单打开状态下的导航按钮 */
.wmmb-main-header-nav-open .menu-toggle {
    /* 移除动画效果，保持按钮原始状态 */
    opacity: 1;
}

/* 移除导航按钮活动状态指示器 */
.menu-toggle::after {
    display: none !important;
}

/* 菜单打开时显示活动指示器 */
.wmmb-main-header-nav-open .menu-toggle::after {
    opacity: 1;
}

/* 菜单遮罩层的视觉增强 */
.wmmb-mobile-popup-overlay {
    background-color: rgba(0, 0, 0, 0.4) !important;
}

/* 菜单内部容器的动画效果 */
.wmmb-mobile-popup-drawer .wmmb-mobile-popup-inner {
    /* 移除动画效果 */
}

/* 菜单打开时的视觉反馈 */
.wmmb-mobile-popup-drawer.active .wmmb-mobile-popup-inner {
    /* 移除阴影效果 */
}

/* 确保导航按钮始终可见且可点击 */
[data-section="section-header-mobile-trigger"] .wmmb-button-wrap {
    position: relative !important;
    z-index: 100002 !important;
    display: block !important;
}

/* 移除按钮点击反馈 */
.menu-toggle:active {
    /* 移除点击动画效果 */
}

/* 菜单关闭按钮的视觉增强 */
#menu-toggle-close {
    position: relative;
    z-index: 100004 !important;
}

/* 移除菜单关闭按钮的悬停效果 */
#menu-toggle-close:hover {
    /* 移除悬停动画效果 */
}

/* 确保在任何状态下按钮都不会被隐藏 */
.menu-toggle,
.wmmb-button-wrap,
[data-section="section-header-mobile-trigger"] .wmmb-button-wrap {
    display: block !important;
    visibility: visible !important;
}

/* 特殊处理：确保按钮不会被其他元素覆盖 */
.wmmb-main-header-nav-open .menu-toggle,
.wmmb-main-header-nav-open .wmmb-button-wrap {
    display: block !important;
    visibility: visible !important;
}