/* 
 * CORREÇÃO PARA O MENU MOBILE
 * Este arquivo contém estilos simplificados para garantir o funcionamento 
 * do menu lateral em dispositivos móveis com fundo escuro e blur
 */

/* Overlay (fundo escuro e borrado) - APENAS FORA DO MENU */
.sidebar-overlay {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background-color: rgba(0, 0, 0, 0.7) !important;
    backdrop-filter: blur(5px) !important;
    -webkit-backdrop-filter: blur(5px) !important;
    z-index: 1040 !important;
    display: none !important;
    opacity: 0 !important;
    transition: opacity 0.3s ease !important;
    pointer-events: auto !important; /* Garantir que o overlay receba eventos de clique */
}

.sidebar-overlay.show {
    display: block !important;
    opacity: 1 !important;
}

/* Menu lateral - SEM BLUR E COM Z-INDEX MAIS ALTO */
@media (max-width: 991.98px) {
    /* Impedir scroll quando menu está aberto */
    body.modal-open {
        overflow: hidden !important;
        position: fixed !important;
        width: 100% !important;
    }
    
    /* Remover todas as propriedades que possam afetar cliques */
    * {
        pointer-events: auto !important;
    }
    
    /* Menu lateral com z-index mais alto */
    .navbar-collapse {
        position: fixed !important;
        top: 0 !important;
        right: -280px !important;
        width: 280px !important;
        height: 100vh !important;
        background-color: #7a2941 !important;
        z-index: 9999 !important; /* Z-index extremamente alto */
        transition: right 0.3s ease !important;
        overflow-y: auto !important;
        padding: 20px !important;
        box-shadow: -5px 0 25px rgba(0, 0, 0, 0.3) !important;
        pointer-events: auto !important;
        -webkit-backdrop-filter: none !important;
        backdrop-filter: none !important;
    }
    
    .navbar-collapse.show {
        right: 0 !important;
    }
    
    /* Adicionar estilo importante para links clicáveis */
    .navbar-nav .nav-link {
        padding: 15px !important;
        margin: 5px 0 !important;
        border-radius: 8px !important;
        background-color: rgba(255, 255, 255, 0.1) !important;
        color: white !important;
        font-weight: 600 !important;
        position: relative !important;
        z-index: 10000 !important; /* Z-index ainda mais alto */
        cursor: pointer !important;
        pointer-events: auto !important;
    }
    
    /* Efeito de hover nos links */
    .navbar-nav .nav-link:hover {
        background-color: rgba(255, 255, 255, 0.2) !important;
    }
    
    /* Botão de fechar menu */
    .sidebar-close {
        position: absolute !important;
        top: 10px !important;
        left: 10px !important;
        background-color: rgba(255, 255, 255, 0.15) !important;
        color: white !important;
        width: 36px !important;
        height: 36px !important;
        border-radius: 50% !important;
        border: none !important;
        font-size: 24px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        cursor: pointer !important;
        z-index: 10001 !important; /* Z-index extremamente alto */
        pointer-events: auto !important;
    }
    
    /* Logo no topo do sidebar */
    .sidebar-logo {
        text-align: center !important;
        margin-bottom: 20px !important;
        padding-bottom: 15px !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important;
        z-index: 10000 !important;
        position: relative !important;
    }
    
    .sidebar-logo img {
        height: 45px !important;
    }
    
    /* Botão hamburguer */
    .navbar-toggler {
        border: none !important;
        padding: 8px !important;
        cursor: pointer !important;
        z-index: 1050 !important;
        position: relative !important;
        pointer-events: auto !important;
    }
    
    /* Logo principal */
    .navbar-brand {
        cursor: pointer !important;
        z-index: 1050 !important;
        position: relative !important;
        pointer-events: auto !important;
    }
    
    /* Botões dentro do menu */
    .navbar-nav .btn {
        margin: 8px 0 !important;
        width: 100% !important;
        cursor: pointer !important;
        pointer-events: auto !important;
        position: relative !important;
        z-index: 10000 !important;
    }
    
    /* Tornar todos os links e botões dentro do menu clicáveis com z-index alto */
    .navbar-collapse a,
    .navbar-collapse button,
    .navbar-collapse .btn {
        pointer-events: auto !important;
        cursor: pointer !important;
        position: relative !important;
        z-index: 10000 !important;
    }
    
    /* Garantir que o overlay fique apenas por fora do menu */
    .sidebar-overlay.show + header .navbar-collapse.show {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background-color: #7a2941 !important;
    }
    
    /* Adicionar propriedade para que o overlay não afete o menu */
    .sidebar-overlay.show {
        clip-path: polygon(0% 0%, calc(100% - 280px) 0%, calc(100% - 280px) 100%, 0% 100%) !important;
    }
    
    /* Garantir que todos os links no menu sejam clicáveis */
    .navbar-collapse .nav-link,
    .navbar-collapse .btn,
    .navbar-collapse a {
        user-select: auto !important;
        -webkit-user-select: auto !important;
        -moz-user-select: auto !important;
        -ms-user-select: auto !important;
        touch-action: auto !important;
        -webkit-touch-callout: default !important;
        -webkit-tap-highlight-color: rgba(255, 255, 255, 0.2) !important;
    }
    
    /* Melhorar o visual do menu */
    .navbar-collapse {
        box-shadow: -5px 0 25px rgba(0, 0, 0, 0.5) !important;
        border-left: 1px solid rgba(255, 255, 255, 0.1) !important;
    }
    
    /* Animação suave para abrir/fechar o menu */
    .navbar-collapse {
        transition: right 0.3s ease-in-out !important;
    }
    
    /* Área clicável aumentada para os links */
    .navbar-nav .nav-link {
        padding: 15px 20px !important;
        margin: 5px 0 !important;
    }
}

/* Correção para dispositivos iOS */
@media (max-width: 991.98px) {
    html.ios-device .navbar-collapse {
        position: fixed !important;
        z-index: 9999 !important;
        pointer-events: auto !important;
    }
    
    html.ios-device .sidebar-overlay {
        position: fixed !important;
        z-index: 1040 !important;
    }
    
    /* Fix específico para iOS */
    html.ios-device .navbar-collapse a,
    html.ios-device .navbar-collapse button {
        -webkit-tap-highlight-color: rgba(255, 255, 255, 0.2) !important;
    }
    
    /* Corrigir o clip-path para iOS também */
    html.ios-device .sidebar-overlay.show {
        clip-path: polygon(0% 0%, calc(100% - 280px) 0%, calc(100% - 280px) 100%, 0% 100%) !important;
    }
} 