<style>
    .navbar-toggler {
        border: 2px solid #2d6a4f;
        background-color: #fff;
        padding: 10px 12px;
        border-radius: 8px;
        transition: background-color 0.3s ease;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
    }

    .navbar-toggler:hover {
        background-color: #40916c;
    }

    .navbar-toggler-icon {
        color: #2d6a4f;
    }

    .nav-link {
        transition: color 0.3s ease;
    }

    .nav-link:hover {
        color: #48c774 !important;
    }

    .offcanvas-custom {
        background-color: #f7f7f7;
        color: #000;
    }

    .offcanvas-custom .nav-link {
        color: #000;
        font-weight: 500;
        padding: 0.75rem 1rem;
    }

    .offcanvas-custom .nav-link:hover {
        background-color: #2d6a4f;
        border-radius: 5px;
    }

    .offcanvas-custom .offcanvas-title {
        font-weight: bold;
        color: #000;
    }

    .btn-close-white {
        filter: invert(1);
    }
</style>

<header class="shadow-sm">
    <nav class="navbar navbar-expand-lg navbar-light bg-white">
        <div class="container">

            <a class="navbar-brand" href="http://parquedacidade.angra.rj.gov.br" title="Parque da Mata Atlântica">
                <img src="asset/images/logo.png">
            </a>

            <button class="navbar-toggler" type="button" data-bs-toggle="offcanvas" data-bs-target="#offcanvasNavbar"
                aria-controls="offcanvasNavbar" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>

            <div class="collapse navbar-collapse d-none d-lg-flex" id="navbarNavDropdown">
                <ul class="navbar-nav ms-auto gap-4">
                    <li class="nav-item">
                        <a class="nav-link text-dark fw-semibold" href="<?php echo e(route('parquedacidade.o-parque-da-cidade')); ?>">O Parque</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link text-dark fw-semibold" href="<?php echo e(route('parquedacidade.noticias')); ?>">Notícias</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link text-dark fw-semibold" href="<?php echo e(route('parquedacidade.projetos-e-acoes')); ?>">Projetos e Ações</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link text-dark fw-semibold" href="<?php echo e(route('parquedacidade.pesquisa-cientifica')); ?>">Pesquisa Científica</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link text-dark fw-semibold" href="<?php echo e(route('parquedacidade.conselho-gestor')); ?>">Conselho</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link text-dark fw-semibold" href="<?php echo e(route('parquedacidade.contato')); ?>">Contato</a>
                    </li>
                </ul>
            </div>

        </div>
    </nav>

    <div class="offcanvas offcanvas-end offcanvas-custom" tabindex="-1" id="offcanvasNavbar"
        aria-labelledby="offcanvasNavbarLabel">
        <div class="offcanvas-header">
            <h5 class="offcanvas-title" id="offcanvasNavbarLabel">Menu</h5>
            <button type="button" class="btn-close btn-close-dark" data-bs-dismiss="offcanvas"
                aria-label="Fechar"></button>
        </div>
        <div class="offcanvas-body">
            <ul class="navbar-nav justify-content-end flex-grow-1">
                <li class="nav-item">
                    <a class="nav-link" href="<?php echo e(route('parquedacidade.o-parque-da-cidade')); ?>">O Parque</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="<?php echo e(route('parquedacidade.noticias')); ?>">Notícias</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="<?php echo e(route('parquedacidade.projetos-e-acoes')); ?>">Projetos e Ações</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="<?php echo e(route('parquedacidade.pesquisa-cientifica')); ?>">Pesquisa Científica</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="<?php echo e(route('parquedacidade.conselho-gestor')); ?>">Conselho</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="<?php echo e(route('parquedacidade.contato')); ?>">Contato</a>
                </li>
            </ul>
        </div>
    </div>
</header><?php /**PATH /var/www/html/portal/resources/views/layouts/parquedacidade/elements/nav.blade.php ENDPATH**/ ?>