<?php include "header.php"; ?>
<!-- START PAGE CONTENT-->
<div class="page-heading">
    <h1 class="page-title"><i class="fas fa-code-branch"></i> SDK Downloads</h1>
    <ol class="breadcrumb">
        <li class="breadcrumb-item">
            <a href="index.html"><i class="la la-home font-20"></i></a>
        </li>
    </ol>
</div>
<div class="page-content fade-in-up">
    <div class="ibox">
        <div class="ibox-body">
            <div class="card m-t-20 m-b-20 border-0 shadow-sm">
                <div class="card-body p-0">
                    <div class="main-panel">
                        <div class="content">
                            <div class="container-fluid">
                                <!-- Hero Section -->
                                <div class="row mb-4">
                                    <div class="col-md-12">
                                        <div class="jumbotron bg-gradient-primary text-white rounded-0 mb-0" style="border: 2px solid rgba(255,255,255,0.2);">
                                            <div class="container">
                                                <h2 class="display-4 animate__animated animate__fadeInDown"><i class="fas fa-download"></i> Developer Resources</h2>
                                                <p class="lead animate__animated animate__fadeIn animate__delay-1s">Powerful SDKs to integrate our services seamlessly into your applications</p>
                                            </div>
                                        </div>
                                    </div>
                                </div>

                                <!-- SDK Cards Section -->
                                <div class="row">
                                    <div class="col-md-12 mb-4 text-center">
                                        <h3 class="animate__animated animate__fadeIn"><i class="fas fa-cubes"></i> Available SDKs</h3>
                                    </div>
                                    
                                    <!-- Android SDK -->
                                    <div class="col-lg-4 col-md-6 mb-4 animate__animated animate__fadeInUp">
                                        <div class="card h-100 border-2 border-success shadow hover-top" style="border-top: 5px solid #3ddc84;">
                                            <div class="card-header bg-gradient-android text-white" style="border-bottom: 2px solid rgba(255,255,255,0.2);">
                                                <div class="d-flex align-items-center">
                                                    <i class="fab fa-android fa-3x mr-3"></i>
                                                    <h4 class="mb-0">Android SDK</h4>
                                                </div>
                                            </div>
                                            <div class="card-body">
                                                <p class="card-text">Seamlessly integrate our services into your Android applications with full native support.</p>
                                                <ul class="list-group list-group-flush mb-3">
                                                    <li class="list-group-item border-0 px-0"><i class="fas fa-check-circle text-success mr-2"></i> Kotlin/Java support</li>
                                                    <li class="list-group-item border-0 px-0"><i class="fas fa-check-circle text-success mr-2"></i> Jetpack Compose ready</li>
                                                    <li class="list-group-item border-0 px-0"><i class="fas fa-check-circle text-success mr-2"></i> Sample projects included</li>
                                                </ul>
                                            </div>
                                            <div class="card-footer bg-white border-0">
                                                <a href="sdk/android.zip" class="btn btn-android btn-block pulse">
                                                    <i class="fas fa-download mr-2"></i> Download
                                                </a>
                                            </div>
                                        </div>
                                    </div>

                                    <!-- PHP SDK -->
                                    <div class="col-lg-4 col-md-6 mb-4 animate__animated animate__fadeInUp animate__delay-1s">
                                        <div class="card h-100 border-2 border-primary shadow hover-top" style="border-top: 5px solid #777bb3;">
                                            <div class="card-header bg-gradient-php text-white" style="border-bottom: 2px solid rgba(255,255,255,0.2);">
                                                <div class="d-flex align-items-center">
                                                    <i class="fab fa-php fa-3x mr-3"></i>
                                                    <h4 class="mb-0">PHP SDK</h4>
                                                </div>
                                            </div>
                                            <div class="card-body">
                                                <p class="card-text">Power your PHP web applications with our easy-to-use SDK package.</p>
                                                <ul class="list-group list-group-flush mb-3">
                                                    <li class="list-group-item border-0 px-0"><i class="fas fa-check-circle text-success mr-2"></i> Composer support</li>
                                                    <li class="list-group-item border-0 px-0"><i class="fas fa-check-circle text-success mr-2"></i> Laravel integration</li>
                                                    <li class="list-group-item border-0 px-0"><i class="fas fa-check-circle text-success mr-2"></i> RESTful wrapper</li>
                                                </ul>
                                            </div>
                                            <div class="card-footer bg-white border-0">
                                                <a href="sdk/php.zip" class="btn btn-php btn-block pulse">
                                                    <i class="fas fa-download mr-2"></i> Download
                                                </a>
                                            </div>
                                        </div>
                                    </div>

                                    <!-- JavaScript SDK -->
                                    <div class="col-lg-4 col-md-6 mb-4 animate__animated animate__fadeInUp animate__delay-2s">
                                        <div class="card h-100 border-2 border-warning shadow hover-top" style="border-top: 5px solid #f7df1e;">
                                            <div class="card-header bg-gradient-js text-white" style="border-bottom: 2px solid rgba(255,255,255,0.2);">
                                                <div class="d-flex align-items-center">
                                                    <i class="fab fa-js-square fa-3x mr-3"></i>
                                                    <h4 class="mb-0">JavaScript SDK</h4>
                                                </div>
                                            </div>
                                            <div class="card-body">
                                                <p class="card-text">Modern JavaScript SDK for browser and Node.js applications.</p>
                                                <ul class="list-group list-group-flush mb-3">
                                                    <li class="list-group-item border-0 px-0"><i class="fas fa-check-circle text-success mr-2"></i> NPM package</li>
                                                    <li class="list-group-item border-0 px-0"><i class="fas fa-check-circle text-success mr-2"></i> TypeScript support</li>
                                                    <li class="list-group-item border-0 px-0"><i class="fas fa-check-circle text-success mr-2"></i> React/Vue/Angular</li>
                                                </ul>
                                            </div>
                                            <div class="card-footer bg-white border-0">
                                                <a href="sdk/javascript.zip" class="btn btn-js btn-block pulse">
                                                    <i class="fas fa-download mr-2"></i> Download
                                                </a>
                                            </div>
                                        </div>
                                    </div>

                                    <!-- Python SDK -->
                                    <div class="col-lg-4 col-md-6 mb-4 animate__animated animate__fadeInUp">
                                        <div class="card h-100 border-2 border-info shadow hover-top" style="border-top: 5px solid #3776ab;">
                                            <div class="card-header bg-gradient-python text-white" style="border-bottom: 2px solid rgba(255,255,255,0.2);">
                                                <div class="d-flex align-items-center">
                                                    <i class="fab fa-python fa-3x mr-3"></i>
                                                    <h4 class="mb-0">Python SDK</h4>
                                                </div>
                                            </div>
                                            <div class="card-body">
                                                <p class="card-text">Lightweight Python SDK for data science and web applications.</p>
                                                <ul class="list-group list-group-flush mb-3">
                                                    <li class="list-group-item border-0 px-0"><i class="fas fa-check-circle text-success mr-2"></i> PIP package</li>
                                                    <li class="list-group-item border-0 px-0"><i class="fas fa-check-circle text-success mr-2"></i> Django/Flask support</li>
                                                    <li class="list-group-item border-0 px-0"><i class="fas fa-check-circle text-success mr-2"></i> Async/Await</li>
                                                </ul>
                                            </div>
                                            <div class="card-footer bg-white border-0">
                                                <a href="sdk/python.zip" class="btn btn-python btn-block pulse">
                                                    <i class="fas fa-download mr-2"></i> Download
                                                </a>
                                            </div>
                                        </div>
                                    </div>

                                    <!-- Java SDK -->
                                    <div class="col-lg-4 col-md-6 mb-4 animate__animated animate__fadeInUp animate__delay-1s">
                                        <div class="card h-100 border-2 border-danger shadow hover-top" style="border-top: 5px solid #007396;">
                                            <div class="card-header bg-gradient-java text-white" style="border-bottom: 2px solid rgba(255,255,255,0.2);">
                                                <div class="d-flex align-items-center">
                                                    <i class="fab fa-java fa-3x mr-3"></i>
                                                    <h4 class="mb-0">Java SDK</h4>
                                                </div>
                                            </div>
                                            <div class="card-body">
                                                <p class="card-text">Robust Java SDK for enterprise applications and backend services.</p>
                                                <ul class="list-group list-group-flush mb-3">
                                                    <li class="list-group-item border-0 px-0"><i class="fas fa-check-circle text-success mr-2"></i> Maven package</li>
                                                    <li class="list-group-item border-0 px-0"><i class="fas fa-check-circle text-success mr-2"></i> Spring Boot support</li>
                                                    <li class="list-group-item border-0 px-0"><i class="fas fa-check-circle text-success mr-2"></i> Async operations</li>
                                                </ul>
                                            </div>
                                            <div class="card-footer bg-white border-0">
                                                <a href="sdk/java.zip" class="btn btn-java btn-block pulse">
                                                    <i class="fas fa-download mr-2"></i> Download
                                                </a>
                                            </div>
                                        </div>
                                    </div>

                                    <!-- C# SDK -->
                                    <div class="col-lg-4 col-md-6 mb-4 animate__animated animate__fadeInUp animate__delay-2s">
                                        <div class="card h-100 border-2 border-purple shadow hover-top" style="border-top: 5px solid #68217a;">
                                            <div class="card-header bg-gradient-csharp text-white" style="border-bottom: 2px solid rgba(255,255,255,0.2);">
                                                <div class="d-flex align-items-center">
                                                    <i class="fas fa-code fa-3x mr-3"></i>
                                                    <h4 class="mb-0">C# SDK</h4>
                                                </div>
                                            </div>
                                            <div class="card-body">
                                                <p class="card-text">Full-featured C# SDK for .NET applications and services.</p>
                                                <ul class="list-group list-group-flush mb-3">
                                                    <li class="list-group-item border-0 px-0"><i class="fas fa-check-circle text-success mr-2"></i> NuGet package</li>
                                                    <li class="list-group-item border-0 px-0"><i class="fas fa-check-circle text-success mr-2"></i> .NET Core support</li>
                                                    <li class="list-group-item border-0 px-0"><i class="fas fa-check-circle text-success mr-2"></i> Entity Framework</li>
                                                </ul>
                                            </div>
                                            <div class="card-footer bg-white border-0">
                                                <a href="sdk/csharp.zip" class="btn btn-csharp btn-block pulse">
                                                    <i class="fas fa-download mr-2"></i> Download
                                                </a>
                                            </div>
                                        </div>
                                    </div>
                                    
                                    <!-- Kotlin SDK -->
                                    <div class="col-lg-4 col-md-6 mb-4 animate__animated animate__fadeInUp">
                                        <div class="card h-100 border-2 border-indigo shadow hover-top" style="border-top: 5px solid #7f52ff;">
                                            <div class="card-header bg-gradient-kotlin text-white" style="border-bottom: 2px solid rgba(255,255,255,0.2);">
                                                <div class="d-flex align-items-center">
                                                    <i class="fas fa-mobile-alt fa-3x mr-3"></i>
                                                    <h4 class="mb-0">Kotlin SDK</h4>
                                                </div>
                                            </div>
                                            <div class="card-body">
                                                <p class="card-text">Modern Kotlin SDK for Android and server-side applications.</p>
                                                <ul class="list-group list-group-flush mb-3">
                                                    <li class="list-group-item border-0 px-0"><i class="fas fa-check-circle text-success mr-2"></i> Coroutines support</li>
                                                    <li class="list-group-item border-0 px-0"><i class="fas fa-check-circle text-success mr-2"></i> Ktor integration</li>
                                                    <li class="list-group-item border-0 px-0"><i class="fas fa-check-circle text-success mr-2"></i> Multiplatform</li>
                                                </ul>
                                            </div>
                                            <div class="card-footer bg-white border-0">
                                                <a href="sdk/kotlin.zip" class="btn btn-kotlin btn-block pulse">
                                                    <i class="fas fa-download mr-2"></i> Download
                                                </a>
                                            </div>
                                        </div>
                                    </div>
                                    
                                    <!-- WordPress SDK -->
                                    <div class="col-lg-4 col-md-6 mb-4 animate__animated animate__fadeInUp animate__delay-1s">
                                        <div class="card h-100 border-2 border-blue shadow hover-top" style="border-top: 5px solid #21759b;">
                                            <div class="card-header bg-gradient-wordpress text-white" style="border-bottom: 2px solid rgba(255,255,255,0.2);">
                                                <div class="d-flex align-items-center">
                                                    <i class="fab fa-wordpress fa-3x mr-3"></i>
                                                    <h4 class="mb-0">WordPress Plugin</h4>
                                                </div>
                                            </div>
                                            <div class="card-body">
                                                <p class="card-text">Easy WordPress integration with our dedicated WooCommerce plugin.</p>
                                                <ul class="list-group list-group-flush mb-3">
                                                    <li class="list-group-item border-0 px-0"><i class="fas fa-check-circle text-success mr-2"></i> WooCommerce support</li>
                                                    <li class="list-group-item border-0 px-0"><i class="fas fa-check-circle text-success mr-2"></i> Shortcode generator</li>
                                                    <li class="list-group-item border-0 px-0"><i class="fas fa-check-circle text-success mr-2"></i> One-click install</li>
                                                </ul>
                                            </div>
                                            <div class="card-footer bg-white border-0">
                                                <a href="sdk/upi-gateway-woocommerce.zip" class="btn btn-wordpress btn-block pulse">
                                                    <i class="fas fa-download mr-2"></i> Download
                                                </a>
                                            </div>
                                        </div>
                                    </div>
                                    
                                    <!-- Swift SDK -->
                                    <div class="col-lg-4 col-md-6 mb-4 animate__animated animate__fadeInUp animate__delay-2s">
                                        <div class="card h-100 border-2 border-orange shadow hover-top" style="border-top: 5px solid #fa7343;">
                                            <div class="card-header bg-gradient-swift text-white" style="border-bottom: 2px solid rgba(255,255,255,0.2);">
                                                <div class="d-flex align-items-center">
                                                    <i class="fab fa-apple fa-3x mr-3"></i>
                                                    <h4 class="mb-0">Swift SDK</h4>
                                                </div>
                                            </div>
                                            <div class="card-body">
                                                <p class="card-text">Native iOS SDK for building powerful mobile applications.</p>
                                                <ul class="list-group list-group-flush mb-3">
                                                    <li class="list-group-item border-0 px-0"><i class="fas fa-check-circle text-success mr-2"></i> SwiftUI support</li>
                                                    <li class="list-group-item border-0 px-0"><i class="fas fa-check-circle text-success mr-2"></i> CocoaPods</li>
                                                    <li class="list-group-item border-0 px-0"><i class="fas fa-check-circle text-success mr-2"></i> Combine framework</li>
                                                </ul>
                                            </div>
                                            <div class="card-footer bg-white border-0">
                                                <a href="sdk/swift.zip" class="btn btn-swift btn-block pulse">
                                                    <i class="fas fa-download mr-2"></i> Download
                                                </a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- Custom CSS -->
<style>
    /* Gradient backgrounds */
    .bg-gradient-primary {
        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    }
    .bg-gradient-android {
        background: linear-gradient(135deg, #3ddc84 0%, #2bb673 100%);
    }
    .bg-gradient-php {
        background: linear-gradient(135deg, #777bb3 0%, #4b568c 100%);
    }
    .bg-gradient-js {
        background: linear-gradient(135deg, #f7df1e 0%, #d6ba32 100%);
    }
    .bg-gradient-python {
        background: linear-gradient(135deg, #3776ab 0%, #2a5f8a 100%);
    }
    .bg-gradient-java {
        background: linear-gradient(135deg, #007396 0%, #00557f 100%);
    }
    .bg-gradient-csharp {
        background: linear-gradient(135deg, #68217a 0%, #4c1264 100%);
    }
    .bg-gradient-kotlin {
        background: linear-gradient(135deg, #7f52ff 0%, #5e35b1 100%);
    }
    .bg-gradient-wordpress {
        background: linear-gradient(135deg, #21759b 0%, #195875 100%);
    }
    .bg-gradient-swift {
        background: linear-gradient(135deg, #fa7343 0%, #f35724 100%);
    }
    
    /* Button colors */
    .btn-android {
        background-color: #3ddc84;
        border-color: #3ddc84;
        color: white;
    }
    .btn-php {
        background-color: #777bb3;
        border-color: #777bb3;
        color: white;
    }
    .btn-js {
        background-color: #f7df1e;
        border-color: #f7df1e;
        color: #333;
    }
    .btn-python {
        background-color: #3776ab;
        border-color: #3776ab;
        color: white;
    }
    .btn-java {
        background-color: #007396;
        border-color: #007396;
        color: white;
    }
    .btn-csharp {
        background-color: #68217a;
        border-color: #68217a;
        color: white;
    }
    .btn-kotlin {
        background-color: #7f52ff;
        border-color: #7f52ff;
        color: white;
    }
    .btn-wordpress {
        background-color: #21759b;
        border-color: #21759b;
        color: white;
    }
    .btn-swift {
        background-color: #fa7343;
        border-color: #fa7343;
        color: white;
    }
    
    /* Card hover effect */
    .hover-top {
        transition: all 0.3s ease;
    }
    .hover-top:hover {
        transform: translateY(-5px);
        box-shadow: 0 10px 20px rgba(0,0,0,0.1);
    }
    
    /* Jumbotron styling */
    .jumbotron {
        border-radius: 0;
        padding: 4rem 2rem;
        margin-bottom: 0;
    }
    
    /* Pulse animation for download buttons */
    .pulse {
        animation: pulse 2s infinite;
    }
    @keyframes pulse {
        0% {
            transform: scale(1);
        }
        50% {
            transform: scale(1.05);
        }
        100% {
            transform: scale(1);
        }
    }
    
    /* Border colors */
    .border-success {
        border-color: #28a745 !important;
    }
    .border-primary {
        border-color: #007bff !important;
    }
    .border-warning {
        border-color: #ffc107 !important;
    }
    .border-info {
        border-color: #17a2b8 !important;
    }
    .border-danger {
        border-color: #dc3545 !important;
    }
    .border-purple {
        border-color: #6f42c1 !important;
    }
    .border-indigo {
        border-color: #6610f2 !important;
    }
    .border-blue {
        border-color: #007bff !important;
    }
    .border-orange {
        border-color: #fd7e14 !important;
    }
    
    /* Card styling */
    .card {
        border-radius: 10px !important;
        overflow: hidden;
    }
    
    .card-header {
        border-bottom: none;
    }
    
    /* Responsive adjustments */
    @media (max-width: 768px) {
        .jumbotron {
            padding: 2rem 1rem;
        }
        .jumbotron h2 {
            font-size: 2rem;
        }
        .card-header i.fa-3x {
            font-size: 2em;
        }
    }
</style>

<!-- Animate.css -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"/>

<script src="./assets/vendors/jquery/dist/jquery.min.js" type="text/javascript"></script>
<script src="assets/js/app.min.js" type="text/javascript"></script>
<script src="./assets/js/scripts/dashboard_1_demo.js" type="text/javascript"></script>
<script>
    // Initialize animations on scroll
    $(document).ready(function() {
        // Add scroll animation
        $(window).scroll(function() {
            $('.animate__animated').each(function() {
                var position = $(this).offset().top;
                var scroll = $(window).scrollTop();
                var windowHeight = $(window).height();
                
                if (scroll + windowHeight > position) {
                    $(this).addClass('animate__fadeInUp');
                }
            });
        });
        
        // Trigger scroll event on page load
        $(window).trigger('scroll');
    });
</script>