@foreach (getSideMenuGestor() as $key => $item)
    @php
        $fullUrl = url($item['link']); // monta a URL corretamente com protocolo e host
        $isActive = request()->is(ltrim($item['link'], '/')); // compara sem barra inicial

        $itemId = $item['id'];
        $parentId = $item['parent_id'];
        $link = $item['link'];

        $title = $item['title'];
        $icon = $item['icon'];
    @endphp

    @if ($parentId === null && $link !== '')
        <li class="menu-item container-menu-sidebar-gestor" aria-haspopup="true">


            <a href="{{ $fullUrl }}" class="py-5 menu-link menu-custom ripple {{ $isActive ? 'active' : '' }}">
                <i class="fa fa-sm {{ $icon }} text-white d-flex flex-center"></i>
                <span class="menu-text text-white pl-3">{{ $title }}</span>
            </a>
        </li>
    @elseif($parentId === null && $link === '')
        <li class="menu-item container-menu-sidebar-gestor" aria-haspopup="true">
            <ul class="menu-ul-parent m-0 p-0">
                <span
                    class="py-5 menu-link menu-parent d-flex align-items-center justify-content-between w-100 {{ $isActive ? 'active' : '' }}">
                    <div class="d-flex align-items-center">
                        <i class="fa fa-sm {{ $icon }} text-white d-flex flex-center"></i>
                        <span class="menu-text text-white pl-3">{{ $title }}</span>
                    </div>
                    <span class="svg-icon svg-icon-light svg-icon-sm aside-full">
                        <i class="fas fa-chevron-right arrow-info arrow-content"></i>
                    </span>
                </span>

                @foreach (getSideMenuGestor() as $key => $subItem)
                    @php
                        $subFullUrl = url($subItem['link']);
                        $isSubActive = request()->is(ltrim($subItem['link'], '/'));

                        $subTitle = $subItem['title'];
                        $subParentId = $subItem['parent_id'];
                    @endphp
                    @if ($subParentId === $itemId)
                        <li class="menu-item menu-subitem container-menu-sidebar-gestor" aria-haspopup="true">
                            <a href="{{ $subFullUrl }}"
                                class="py-2 menu-link menu-custom ripple d-flex align-items-center {{ $isSubActive ? 'active' : '' }}">
                                <span class="svg-icon svg-icon-light svg-icon-sm aside-full">
                                    <i class="fas fa-chevron-right arrow-content"></i>
                                </span>
                                <span class="menu-text text-white pl-3">
                                    {{ $subTitle }}
                                </span>
                            </a>
                        </li>
                    @endif
                @endforeach

            </ul>
        </li>
    @else
    @endif
@endforeach

<style>
    /* Quando Minimizado */
    #kt_body.aside-minimize {
        .menu-parent .menu-text {
            display: none !important;
        }

        #aside-menu-items .menu-item .fa-sm {
            font-size: 1rem !important;
        }

        .menu-ul-parent.active {
            background: unset !important;
        }

        .menu-subitem {
            display: none;
        }
    }

    .custom-aside-icon {
        width: 15px;
        height: 15px;
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center center;
        margin-top: 2px;
    }

    .container-menu-sidebar-gestor .menu-text {
        font-size: 1rem !important;
        letter-spacing: 0.2px;
    }

    .container-menu-sidebar-gestor .menu-link {
        padding: 20px 27px !important;
    }

    .menu-item .fa-sm {
        font-size: 0.95rem !important;
    }

    .menu-ul-parent {
        .menu-subitem {
            max-height: 0;
            opacity: 0;
            overflow: hidden;
            visibility: hidden;
            transform: translateY(-10px);
            transition: all 0.4s ease;
            font-size: 0.92rem !important;

            a {
                padding: 1rem 27px !important;
                font-size: 0.92rem !important;
            }

            a .menu-text {
                font-size: 0.92rem !important;
            }

            li {
                opacity: 0;
                transform: translateY(-10px);
                transition: opacity 0.3s ease, transform 0.3s ease;
            }

            li:nth-child(1) {
                transition-delay: 0.05s;
            }

            li:nth-child(2) {
                transition-delay: 0.1s;
            }

            li:nth-child(3) {
                transition-delay: 0.15s;
            }

            li:nth-child(4) {
                transition-delay: 0.2s;
            }

            li:nth-child(5) {
                transition-delay: 0.25s;
            }

            li:nth-child(6) {
                transition-delay: 0.3s;
            }

            li:nth-child(7) {
                transition-delay: 0.35s;
            }

            li:nth-child(8) {
                transition-delay: 0.4s;
            }

            li:nth-child(9) {
                transition-delay: 0.45s;
            }

            li:nth-child(10) {
                transition-delay: 0.5s;
            }
        }

        .arrow-content {
            font-size: 0.75rem;
            color: #fff;
        }

        .arrow-info {
            transition: transform 0.3s ease;
        }

        .menu-parent {
            cursor: pointer;
            transition: background 0.3s ease;

            &:hover {
                background: #29292b !important;
            }
        }

        &.active {
            background: #29292b !important;

            .menu-subitem {
                max-height: 500px;
                opacity: 1;
                transform: translateY(0);
                visibility: visible;

                li {
                    opacity: 1;
                    transform: translateY(0);
                }
            }

            .menu-subitem,
            .menu-subitem a {
                background: #29292b !important;
            }

            .arrow-info {
                transform: rotate(90deg);
            }
        }
    }
</style>

<script>
    document.querySelectorAll(".menu-ul-parent").forEach(function(element) {
        element.addEventListener("click", function() {
            const body = document.querySelector("#kt_body");

            // Fecha todos os outros
            document.querySelectorAll(".menu-ul-parent.active").forEach(function(other) {

                // Caso esteja minimizado, remove a classe de ativo
                if (body.classList.contains("aside-minimize")) {
                    other.classList.remove("active");
                }

                if (other !== element) {
                    other.classList.remove("active");
                }
            });

            // Verifica se o elemento já está ativo
            const isAlreadyActive = element.classList.contains("active");

            if (!isAlreadyActive) {
                element.classList.add("active");

                if (body.classList.contains("aside-minimize")) {
                    body.classList.remove("aside-minimize");
                }
            } else {
                element.classList.remove("active");

                const scrollElement = document.querySelector("#aside-menu-items");

                if (scrollElement && typeof KTUtil !== "undefined") {
                    document.getElementById("aside-menu-items").scrollTop = 0;
                }
            }
        });
    });
</script>