<!DOCTYPE html>
<html lang="pt-br">

<head>
    <meta charset="UTF-8">
    <title>SOV - Sistema de Ordem de Viagens</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.css" rel="stylesheet">
    <style>
        body { overflow-x: hidden; }
        #sidebar { min-height: 100vh; background-color: #1c2e4a; color: #fff; }
        #sidebar a { color: #fff; text-decoration: none; display: block; padding: 8px 20px; }
        #sidebar a:hover { background-color: #254163; }
        .navbar-brand { font-weight: bold; font-size: 1.4rem; }
        .content { padding: 20px; }
        .form-control-sm { background: #495057; color: #fff; border: none; }
        .form-control-sm::placeholder { color: #ccc; }
        .accordion-item,
.accordion-button.collapsed {
    background-color: #1c2e4a !important;
    color: #fff !important;
    border: none;
}

.accordion-button:not(.collapsed) {
    background-color: #254163 !important;
    color: #fff !important;
}

    </style>
</head>

<body>
    <nav class="navbar navbar-dark px-3" style="background-color: #1c2e4a;">
    <a class="navbar-brand d-flex align-items-center" href="#">
        <img src="<?= URL ?>/img/logomala.png" alt="Logo SOV" style="height: 36px; margin-right: 10px;">
        <span>SOV - Sistema de Ordem de Viagens</span>
    </a>
    
    <span class="text-white">
        <?= isset($_SESSION['usuario_nome']) ? $_SESSION['usuario_nome'] : '' ?>
    </span>
     </nav>
     


    <div class="container-fluid">
        <div class="row">
           <nav id="sidebar" class="col-md-3 col-lg-2 d-md-block sidebar collapse" style="background-color: #1c2e4a;">

                <div class="p-3">

                    <!-- Barra de pesquisa -->
                    <input type="text" id="menuSearch" class="form-control form-control-sm mb-3" placeholder="Pesquisar...">
                    <a href="<?= URL ?>/paginas/index" class="d-block px-3 py-2 text-white" style="background-color: #1c2e4a;">
    <i class="bi bi-speedometer2 me-2"></i> Dashboard
</a>

                    <div class="accordion" id="menuAccordion">

                        <!-- Principal -->
                        <div class="accordion-item bg-dark border-0">
                            <h2 class="accordion-header">
                                <button class="accordion-button collapsed bg-dark text-white" type="button" data-bs-toggle="collapse" data-bs-target="#collapsePrincipal">
                                    <i class="bi bi-house-door me-2"></i> Principal
                                </button>
                            </h2>
                            <div id="collapsePrincipal" class="accordion-collapse collapse" data-bs-parent="#menuAccordion">
                                <div class="accordion-body p-0">
                                    
                                    <a href="<?= URL ?>/ordens/cadastrar">Ordens de Viagem</a>
                                    <div class="accordion-body p-0">
                                    
                                    <a href="<?= URL ?>/ordens/index">Listar Ordens de Viagem</a>
                                </div>
                                </div>
                            </div>
                        </div>

                        <!-- Cadastros Gerais -->
                        <div class="accordion-item bg-dark border-0">
                            <h2 class="accordion-header">
                                <button class="accordion-button collapsed bg-dark text-white" type="button" data-bs-toggle="collapse" data-bs-target="#collapseCadastros">
                                    <i class="bi bi-folder-plus me-2"></i> Cadastros Gerais
                                </button>
                            </h2>
                            <div id="collapseCadastros" class="accordion-collapse collapse" data-bs-parent="#menuAccordion">
                                <div class="accordion-body p-0">
                                    <a href="<?= URL ?>/pessoas/index">Pessoa</a>
                                    <a href="<?= URL ?>/funcionarios/index">Funcionários</a>
                                    <a href="<?= URL ?>/departamentos/index">Departamentos</a>
                                    <a href="<?= URL ?>/funcoes/index">Cargos / Funções</a>
                                     <a href="<?= URL ?>/veiculos/index">Veículos</a>
                                    
                                </div>
                            </div>
                        </div>

                        <!-- Financeiro -->
                        <div class="accordion-item bg-dark border-0">
                            <h2 class="accordion-header">
                                <button class="accordion-button collapsed bg-dark text-white" type="button" data-bs-toggle="collapse" data-bs-target="#collapseFinanceiro">
                                    <i class="bi bi-cash-stack me-2"></i> Financeiro
                                </button>
                            </h2>
                            <div id="collapseFinanceiro" class="accordion-collapse collapse" data-bs-parent="#menuAccordion">
                                <div class="accordion-body p-0">
                                    
                                    <a href="<?= URL ?>/diariasvalores">Diárias Valores</a>

                                </div>
                            </div>
                        </div>

                        <!-- Diárias & Decretos -->
                        <div class="accordion-item bg-dark border-0">
                            <h2 class="accordion-header">
                                <button class="accordion-button collapsed bg-dark text-white" type="button" data-bs-toggle="collapse" data-bs-target="#collapseDiarias">
                                    <i class="bi bi-calendar2-week me-2"></i> Diárias & Decretos
                                </button>
                            </h2>
                            <div id="collapseDiarias" class="accordion-collapse collapse" data-bs-parent="#menuAccordion">
                                <div class="accordion-body p-0">
                                   <a href="<?= URL ?>/decretos/index">Decretos</a>

                               
                                    
                                </div>
                            </div>
                        </div>
<!-- Gestão Avançada -->
<div class="accordion-item bg-dark border-0">
    <h2 class="accordion-header">
        <button class="accordion-button collapsed bg-dark text-white" type="button" data-bs-toggle="collapse" data-bs-target="#collapseGestao">
            <i class="bi bi-gear-wide-connected me-2"></i> Gestão Avançada
        </button>
    </h2>
    <div id="collapseGestao" class="accordion-collapse collapse" data-bs-parent="#menuAccordion">
        <div class="accordion-body p-0">
           
           
                

            <a href="<?= URL ?>/prestacao_contas">
                <i class="bi bi-receipt-cutoff me-2"></i> Prestação de Contas
            </a>
        </div>
    </div>
</div>

                        <!-- Relatórios -->
<div class="accordion-item bg-dark border-0">
    <h2 class="accordion-header">
        <button class="accordion-button collapsed bg-dark text-white" type="button" data-bs-toggle="collapse" data-bs-target="#collapseRelatorios">
            <i class="bi bi-bar-chart-line me-2"></i> Relatórios
        </button>
    </h2>
    <div id="collapseRelatorios" class="accordion-collapse collapse" data-bs-parent="#menuAccordion">
        <div class="accordion-body p-0">
            <a href="<?= URL ?>/relatorios">Ordens por Período</a>
            <a href="<?= URL ?>/relatorios/ordens_aprovadas">Ordens Aprovadas</a>
            <a href="<?= URL ?>/relatorios/relatorioFinanceiro">Relatório Financeiro</a>
            <a href="<?= URL ?>/relatorios/funcionarios_viagem">Funcionários em Viagem</a>
            <a href="<?= URL ?>/relatorios/veiculos_uso">Veículos em Uso</a>
            <a href="<?= URL ?>/relatorios/diarias_funcionarios">Diárias por Funcionário</a>
            <a href="<?= URL ?>/relatorios/despesas_gerais">Despesas Gerais</a>
            <a href="<?= URL ?>/relatorios/pdf_completo">PDF - Ordem Completa</a>
            <a href="<?= URL ?>/relatorios/pdf_financeiro">PDF - Relatório Financeiro</a>
        </div>
    </div>
</div>


                        <!-- Administração -->
                        <div class="accordion-item bg-dark border-0">
                            <h2 class="accordion-header">
                                <button class="accordion-button collapsed bg-dark text-white" type="button" data-bs-toggle="collapse" data-bs-target="#collapseAdmin">
                                    <i class="bi bi-person-gear me-2"></i> Administração
                                </button>
                            </h2>
                            <div id="collapseAdmin" class="accordion-collapse collapse" data-bs-parent="#menuAccordion">
                                <div class="accordion-body p-0">
                                    <a href="<?= URL ?>/usuarios/index">Usuários</a>
                                  
                                </div>
                            </div>
                        </div>
                        <a href="<?= URL ?>/usuarios/logout">Sair</a>

                    </div>
                </div>
                <div class="text-center mt-4 mb-3 pt-3 border-top">
    <img src="<?= URL ?>/img/sinnc.png" alt="Logo SINNC" style="max-width: 80%; height: auto;">
</div>


            </nav>
            

            <main class="col-md-9 ms-sm-auto col-lg-10 px-md-4 content">
            <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
<script>
document.addEventListener('DOMContentLoaded', () => {
    const searchInput = document.getElementById('menuSearch');
    const accordionItems = document.querySelectorAll('#menuAccordion .accordion-item');

    searchInput.addEventListener('input', function () {
        const query = this.value.toLowerCase();
        accordionItems.forEach(item => {
            const body = item.querySelector('.accordion-body');
            const links = body.querySelectorAll('a');
            let hasVisibleLinks = false;

            links.forEach(link => {
                if (link.textContent.toLowerCase().includes(query)) {
                    link.style.display = 'block';
                    hasVisibleLinks = true;
                } else {
                    link.style.display = 'none';
                }
            });

            const collapseElement = item.querySelector('.accordion-collapse');
            const bsCollapse = new bootstrap.Collapse(collapseElement, { toggle: false });

            if (query) {
                if (hasVisibleLinks) {
                    bsCollapse.show();
                } else {
                    bsCollapse.hide();
                }
            } else {
                bsCollapse.hide();
                links.forEach(link => link.style.display = 'block');
            }
        });
    });

    // Toggle no duplo clique do cabeçalho
    document.querySelectorAll('#menuAccordion .accordion-button').forEach(btn => {
        btn.addEventListener('dblclick', function () {
            const collapseElement = this.closest('.accordion-item').querySelector('.accordion-collapse');
            const bsCollapse = new bootstrap.Collapse(collapseElement, { toggle: false });
            if (collapseElement.classList.contains('show')) {
                bsCollapse.hide();
            } else {
                bsCollapse.show();
            }
        });
    });
});
</script>
