{{-- mobile menu content section --}}
<section
    class="menu__body w-full md:w-96 md:ml-[40%] opacity-0 transition-opacity ease-in delay-0 sm:hover:scale-75 hover:bg-gray-50 duration-100"
    hidden>
    <div class="menu__header">
        {{-- <label>
            <div></div>
        </label> --}}
        {{-- <p>Quick Navigation</p> --}}
        <p></p>
        <button title="Close">
            <div></div>
        </button>
    </div>
    {{-- <div class="menu__links">
        <a href="/">
            <span class="text-red-500">Home</span>
        </a>
        <a href="{{ route('church-services-records.index', ['time' => 'today']) }}">
            <span class="text-red-500">Today's Counting</span>
        </a>
        <a href="{{ route('profile.edit') }}">
            <span class="text-red-500">Update Profile</span>
        </a>
    </div> --}}
    <div class="menu__contact">
        <a href="{{ route('church-services-records.index') }}" class=" py-3 hover:bg-red-300">
            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
                stroke="currentColor" class="w-6 h-6">
                <path stroke-linecap="round" stroke-linejoin="round"
                    d="M12 6v6h4.5m4.5 0a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z" />
            </svg>
            <span>History</span>
        </a>

        <a href="{{ route('profile.edit') }}" class="py-3 hover:bg-red-300">
            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
                stroke="currentColor" class="w-6 h-6">
                <path stroke-linecap="round" stroke-linejoin="round"
                    d="M15.75 6a3.75 3.75 0 1 1-7.5 0 3.75 3.75 0 0 1 7.5 0ZM4.501 20.118a7.5 7.5 0 0 1 14.998 0A17.933 17.933 0 0 1 12 21.75c-2.676 0-5.216-.584-7.499-1.632Z" />
            </svg>

            <span>Profile</span>
        </a>

        <a href="/admin" class="py-3 hover:bg-gray-900">
            <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5"
                stroke="currentColor" class="w-6 h-6">
                <path stroke-linecap="round" stroke-linejoin="round"
                    d="M15.75 6a3.75 3.75 0 1 1-7.5 0 3.75 3.75 0 0 1 7.5 0ZM4.501 20.118a7.5 7.5 0 0 1 14.998 0A17.933 17.933 0 0 1 12 21.75c-2.676 0-5.216-.584-7.499-1.632Z" />
            </svg>

            <span>Admin</span>
        </a>

        <a data-modal-target="logout-popup-modal" data-modal-toggle="logout-popup-modal"
            class="cursor-pointer py-3 hover:bg-red-300">
            <svg xmlns="http://www.w3.org/2000/svg" fill="#000000" height="24" viewbox="0 0 24 24" width="24">
                <path
                    d="M21.71 11.29l-9-9c-.39-.39-1.02-.39-1.41 0l-9 9c-.39.39-.39 1.02 0 1.41l9 9c.39.39 1.02.39 1.41 0l9-9c.39-.38.39-1.01 0-1.41zM14 14.5V12h-4v3H8v-4c0-.55.45-1 1-1h5V7.5l3.5 3.5-3.5 3.5z">
                </path>
                <path d="M0 0h24v24H0z" fill="none"></path>
            </svg>
            <span>Logout</span>
        </a>
    </div>
</section>
<div class="menu__overlay" hidden></div>