{{--SAYFA İŞLEMLERİ--}}
<div class="w-full p-2 mx-auto sm:mx-0 lg:col-span-2 lg:row-span-2 lg:row-end-2">
    <div class="grid grid-cols-2 gap-2 p-2 mx-auto bg-white lg:grid-cols-4 max-w-7xl rounded-xl">
        {{--FIRSAT--}}
        <div
            class="overflow-hidden transition-all rounded-lg shadow pattern-charlie-brown ring-1 ring-stone-200 hover:ring-stone-400 hover:shadow-xl">
            <div class="p-2 transition-all bg-gradient-to-b from-stone-300/40 hover:bg-stone-100 hover:shadow-2xl">
                <div class="flex items-center">
                    <div class="flex-shrink-0">
                        <span class="text-3xl material-symbols-rounded text-stone-600">
                            mintmark
                        </span>
                    </div>
                    <a href="#" class="flex-1 w-0 ml-2">
                        <dl>
                            <dd>
                                <div class="text-sm font-bold text-stone-700">HARCAMALAR</div>
                            </dd>
                        </dl>
                    </a>
                </div>
            </div>
        </div>
        {{--TEKLİF--}}
        <div
            class="overflow-hidden transition-all rounded-lg shadow pattern-charlie-brown ring-1 ring-stone-200 hover:ring-stone-400 hover:shadow-xl">
            <div class="p-2 transition-all bg-gradient-to-b from-stone-300/40 hover:bg-stone-100 hover:shadow-2xl">
                <div class="flex items-center">
                    <div class="flex-shrink-0">
                        <span class="text-3xl material-symbols-rounded text-stone-600">
                            checklist
                        </span>
                    </div>
                    <a href="#" class="flex-1 w-0 ml-2">
                        <dl>
                            <dd>
                                <div class="text-sm font-bold text-stone-700">ALIŞVERİŞ LİSTESİ</div>
                            </dd>
                        </dl>
                    </a>
                </div>
            </div>
        </div>
        {{--ANLAŞMA--}}
        <div
            class="overflow-hidden transition-all rounded-lg shadow pattern-charlie-brown ring-1 ring-stone-200 hover:ring-stone-400 hover:shadow-xl">
            <div class="p-2 transition-all bg-gradient-to-b from-stone-300/40 hover:bg-stone-100 hover:shadow-2xl">
                <div class="flex items-center">
                    <div class="flex-shrink-0">
                        <span class="text-3xl material-symbols-rounded text-stone-600">
                            query_stats
                        </span>
                    </div>
                    <a href="#" class="flex-1 w-0 ml-2">
                        <dl>
                            <dd>
                                <div class="text-sm font-bold text-stone-700">İSTATİSTİKLER</div>
                            </dd>
                        </dl>
                    </a>
                </div>
            </div>
        </div>
        {{--ANLAŞMA--}}
        <div
            class="overflow-hidden transition-all rounded-lg shadow pattern-charlie-brown ring-1 ring-stone-200 hover:ring-stone-400 hover:shadow-xl">
            <div class="p-2 transition-all bg-gradient-to-b from-stone-300/40 hover:bg-stone-100 hover:shadow-2xl">
                <div class="flex items-center">
                    <div class="flex-shrink-0">
                        <span class="text-3xl material-symbols-rounded text-stone-600">
                            tune
                        </span>
                    </div>
                    <a href="#" class="flex-1 w-0 ml-2">
                        <dl>
                            <dd>
                                <div class="text-sm font-bold text-stone-700">AYARLAR</div>
                            </dd>
                        </dl>
                    </a>
                </div>
            </div>
        </div>
    </div>
</div>