<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Manage Subscription Limits - SuperAdmin</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.css" rel="stylesheet">
    <style>
        body { background-color: #f4f6f9; }
        .sidebar { min-height: 100vh; background: linear-gradient(180deg, #1e3c72 0%, #2a5298 100%); color: white; }
        .sidebar .nav-link { color: rgba(255,255,255,0.8); }
        .sidebar .nav-link:hover { background: rgba(255,255,255,0.1); color: white; }
        .card { border: none; border-radius: 10px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); }
    </style>
</head>
<body>
    <div class="container-fluid">
        <div class="row">
            <!-- Sidebar -->
            <div class="col-md-3 col-lg-2 px-0 sidebar">
                <div class="p-3">
                    <h4 class="text-white mb-4"><i class="bi bi-shield-check"></i> Super Admin</h4>
                    <nav class="nav flex-column">
                        <a href="<?= base_url('superadmin/dashboard') ?>" class="nav-link">
                            <i class="bi bi-speedometer2"></i> Dashboard
                        </a>
                        <a href="<?= base_url('superadmin/users') ?>" class="nav-link">
                            <i class="bi bi-people"></i> Users
                        </a>
                        <a href="<?= base_url('superadmin/admins') ?>" class="nav-link">
                            <i class="bi bi-person-badge"></i> Admins
                        </a>
                        <a href="<?= base_url('superadmin/settings') ?>" class="nav-link">
                            <i class="bi bi-gear"></i> Settings
                        </a>
                        <a href="<?= base_url('superadmin/reports') ?>" class="nav-link">
                            <i class="bi bi-file-earmark-text"></i> Reports
                        </a>
                        <a href="<?= base_url('superadmin/manageTaxonomy') ?>" class="nav-link">
                            <i class="bi bi-tags"></i> Catalogue
                        </a>
                        <a href="<?= base_url('superadmin/manageSubscriptionLimits') ?>" class="nav-link active">
                            <i class="bi bi-card-list"></i> Subscription Limits
                        </a>
                        <a href="<?= base_url('superadmin/managePostingLimits') ?>" class="nav-link">
                            <i class="bi bi-clock-history"></i> Posting Limits
                        </a>
                        <a href="<?= base_url('auth/logout') ?>" class="nav-link mt-4">
                            <i class="bi bi-box-arrow-right"></i> Logout
                        </a>
                    </nav>
                </div>
            </div>

            <!-- Main Content -->
            <div class="col-md-9 col-lg-10 p-4">
                <h2 class="mb-4"><i class="bi bi-card-list"></i> Manage Subscription Limits</h2>

                <div class="row">
                    <?php foreach ($tiers as $tier): ?>
                        <div class="col-md-6 mb-4">
                            <div class="card">
                                <div class="card-header bg-primary text-white">
                                    <h5 class="mb-0"><?= ucfirst($tier) ?> Plan</h5>
                                </div>
                                <div class="card-body">
                                    <form class="subscription-form" data-tier="<?= $tier ?>">
                                        <input type="hidden" name="tier" value="<?= $tier ?>">
                                        
                                        <div class="mb-3">
                                            <label class="form-label">Max Products Allowed</label>
                                            <input type="number" class="form-control" name="max_products" 
                                                   value="<?= $current_limits[$tier]['max_products'] ?>" required>
                                        </div>
                                        
                                        <div class="mb-3">
                                            <label class="form-label">Monthly Price (₹)</label>
                                            <input type="number" step="0.01" class="form-control" name="monthly_price" 
                                                   value="<?= $current_limits[$tier]['monthly_price'] ?>" required>
                                        </div>
                                        
                                        <div class="mb-3">
                                            <label class="form-label">Yearly Price (₹)</label>
                                            <input type="number" step="0.01" class="form-control" name="yearly_price" 
                                                   value="<?= $current_limits[$tier]['yearly_price'] ?>" required>
                                        </div>
                                        
                                        <button type="submit" class="btn btn-success w-100">
                                            <i class="bi bi-save"></i> Update Limits
                                        </button>
                                    </form>
                                </div>
                            </div>
                        </div>
                    <?php endforeach; ?>
                </div>

                <div class="alert alert-info mt-4">
                    <i class="bi bi-info-circle"></i> <strong>Note:</strong> Changes will affect new subscriptions immediately. 
                    Existing subscriptions will continue with their current limits until renewal.
                </div>
            </div>
        </div>
    </div>

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
    <script>
        document.querySelectorAll('.subscription-form').forEach(form => {
            form.addEventListener('submit', function(e) {
                e.preventDefault();
                const formData = new FormData(this);
                const tier = this.dataset.tier;

                fetch('/superadmin/updateSubscriptionLimit', {
                    method: 'POST',
                    body: formData
                })
                .then(res => res.json())
                .then(data => {
                    if (data.success) {
                        alert('✅ ' + tier.toUpperCase() + ' tier limits updated successfully!');
                    } else {
                        alert('❌ Failed to update limits');
                    }
                })
                .catch(err => alert('Error updating limits'));
            });
        });
    </script>
</body>
</html>
