<?php include 'header.php'; ?>

<div class="bg-gray-100 py-10 px-4">

<!-- Compact Page Heading -->
<div class="max-w-7xl mx-auto mb-5">
        <div class="flex items-center justify-between">
            <div>
                <h1 class="text-2xl font-bold text-black">
                    SMO & SEO Managment
                </h1>
            </div>
        </div>
</div>

    <!-- Responsive Grid -->
    <div class="max-w-7xl mx-auto grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-5 gap-8">

        <!-- Card 1 -->
        <div
            class="bg-white/80 backdrop-blur-lg rounded-3xl shadow-2xl overflow-hidden border border-white hover:scale-105 transition duration-300">

            <!-- Header -->
            <div class="bg-gradient-to-r from-purple-500 to-indigo-500 px-5 py-4">
                <h2 class="text-white text-2xl font-bold">Dashboard</h2>
            </div>

            <!-- Links -->
            <div class="p-5 space-y-3">
                <a href="smo_seo_dashboard.php"
                    class="block bg-purple-100 hover:bg-purple-200 text-purple-800 px-4 py-2 rounded-xl transition">Dashboard</a>
            </div>

        </div>

        <!-- Card 2 -->
        <div
            class="bg-white/80 backdrop-blur-lg rounded-3xl shadow-2xl overflow-hidden border border-white hover:scale-105 transition duration-300">

            <div class="bg-gradient-to-r from-pink-500 to-rose-500 px-5 py-4">
                <h2 class="text-white text-2xl font-bold">SMM REPORT</h2>
            </div>

            <div class="p-5 space-y-3">

                <a href="smm_report.php" class="block bg-pink-100 hover:bg-pink-200 text-pink-800 px-4 py-2 rounded-xl transition">
                   SMM REPORT
                </a>

            </div>

        </div>

        <!-- Card 3-->
        <div
            class="bg-white/80 backdrop-blur-lg rounded-3xl shadow-2xl overflow-hidden border border-white hover:scale-105 transition duration-300">

            <!-- Header -->
            <div class="bg-gradient-to-r from-blue-500 to-sky-500 px-5 py-4">
                <h2 class="text-white text-lg font-bold leading-tight break-words">ADS Management </h2>
            </div>

            <!-- Account Links -->
            <div class="p-5 space-y-3">

                <a href="ads_management.php" class="block bg-blue-100 hover:bg-blue-200 text-blue-800 px-4 py-2 rounded-xl transition">
                    ADS management
                </a>

            </div>
        </div>

        <!-- Card 4 -->
        <div
            class="bg-white/80 backdrop-blur-lg rounded-3xl shadow-2xl overflow-hidden border border-white hover:scale-105 transition duration-300">

            <!-- Header -->
            <div class="bg-gradient-to-r from-green-500 to-emerald-500 px-5 py-4">
                <h2 class="text-white text-2xl font-bold">Upload Graphics</h2>
            </div>

            <!-- Links -->
            <div class="p-5 space-y-3">

                <a href="upload_graphics.php"
                    class="block bg-green-100 hover:bg-green-200 text-green-800 px-4 py-2 rounded-xl transition">
                    Upload Graphics
                </a>

            </div>

        </div>
        
        <!-- Card 5 -->
        <div
            class="bg-white/80 backdrop-blur-lg rounded-3xl shadow-2xl overflow-hidden border border-white hover:scale-105 transition duration-300">

            <div class="bg-gradient-to-r from-emerald-500 to-teal-500 px-5 py-4">
                <h2 class="text-white text-2xl font-bold">Post & Reels</h2>
            </div>

            <div class="p-5 space-y-3">

                <a href="post_and_reels.php"
                    class="block bg-emerald-100 hover:bg-emerald-200 text-emerald-800 px-4 py-2 rounded-xl transition">
                  Post & Reels
                </a>
            </div>

        </div>
        
        <!-- Card 6 -->
        <div
            class="bg-white/80 backdrop-blur-lg rounded-3xl shadow-2xl overflow-hidden border border-white hover:scale-105 transition duration-300">
        
            <div class="bg-gradient-to-r from-orange-500 to-amber-500 px-5 py-4">
                <h2 class="text-white text-2xl font-bold">
                    SEO Client List
                </h2>
            </div>
        
            <div class="p-5 space-y-3">
        
                <a href="seo_client_list.php"
                    class="block bg-orange-100 hover:bg-orange-200 text-orange-800 px-4 py-2 rounded-xl transition">
        
                   SEO Client List
        
                </a>
        
            </div>
        
        </div>
        
        <!-- Card 7 -->
        <div
            class="bg-white/80 backdrop-blur-lg rounded-3xl shadow-2xl overflow-hidden border border-white hover:scale-105 transition duration-300">
        
            <div class="bg-gradient-to-r from-cyan-500 to-sky-500 px-5 py-4">
                <h2 class="text-white text-2xl font-bold">
                   SMM Client List
                </h2>
            </div>
        
            <div class="p-5 space-y-3">
        
                <a href="smm_client_list.php"
                    class="block bg-cyan-100 hover:bg-cyan-200 text-cyan-800 px-4 py-2 rounded-xl transition">
        
                   SMM Client List
        
                </a>
        
            </div>
        
        </div>


    </div>

</div>

<?php include 'footer.php'; ?>