/**
 * Fix CSS para Menu Mobile - ERP Analytics
 * Versão: 1.0
 * Data: 19/11/2024
 * 
 * Problema: Menu mobile abre mas fica fora da tela (deslocado para direita)
 * Solução: Forçar posicionamento correto do menu quando classe sidebar-enable é adicionada
 */

/* ===================================================================
   FIX PARA MENU MOBILE
   =================================================================== */

/* Garantir que o menu fique VISÍVEL quando aberto em mobile */
@media (max-width: 991.98px) {
    
    /* Quando o menu está aberto (classe sidebar-enable no body) */
    body.sidebar-enable .vertical-menu {
        left: 0 !important;
        transform: translateX(0) !important;
        opacity: 1 !important;
        visibility: visible !important;
        z-index: 1001 !important;
    }
    
    /* Garantir que o menu esteja posicionado corretamente */
    .vertical-menu {
        position: fixed !important;
        top: 70px !important;
        bottom: 0 !important;
        width: 250px !important;
        height: calc(100vh - 70px) !important;
        transition: all 0.3s ease !important;
        z-index: 1001 !important;
    }
    
    /* Quando o menu está fechado */
    body:not(.sidebar-enable) .vertical-menu {
        left: -250px !important;
        transform: translateX(0) !important;
    }
    
    /* Overlay (fundo escuro) quando menu está aberto */
    body.sidebar-enable::before {
        content: '' !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        background: rgba(0, 0, 0, 0.5) !important;
        z-index: 1000 !important;
        display: block !important;
    }
    
    /* Garantir que o conteúdo do menu seja visível */
    body.sidebar-enable .vertical-menu .simplebar-wrapper,
    body.sidebar-enable .vertical-menu .simplebar-mask,
    body.sidebar-enable .vertical-menu .simplebar-content-wrapper,
    body.sidebar-enable .vertical-menu .simplebar-content {
        opacity: 1 !important;
        visibility: visible !important;
    }
    
    /* Prevenir scroll do body quando menu está aberto */
    body.sidebar-enable {
        overflow: hidden !important;
    }
    
    /* Garantir que o botão do menu fique acessível */
    #vertical-menu-btn {
        z-index: 1002 !important;
        position: relative !important;
    }
}

/* ===================================================================
   FIX ADICIONAL PARA PÁGINAS ESPECÍFICAS
   =================================================================== */

/* Fix para páginas que usam canvas/charts (como dashboard) */
@media (max-width: 991.98px) {
    body.sidebar-enable .main-content {
        transform: none !important;
        margin-left: 0 !important;
    }
    
    body.sidebar-enable .page-content {
        transform: none !important;
    }
}

/* ===================================================================
   DEBUG (remover em produção se desejar)
   =================================================================== */

/* Adicionar borda vermelha no menu para debug (comentar após confirmar que funciona) */
/*
@media (max-width: 991.98px) {
    body.sidebar-enable .vertical-menu {
        border: 3px solid red !important;
    }
}
*/

