<?php
session_start();
require_once 'config/database.php';
require_once 'includes/sidebar_layout.php';

// Ensure previous_balances has column for mobile card reference
try {
    $colCheck = $pdo->query("SHOW COLUMNS FROM previous_balances LIKE 'mobile_card_ref'");
    if ($colCheck->rowCount() === 0) {
        $pdo->exec("ALTER TABLE previous_balances ADD COLUMN mobile_card_ref VARCHAR(100) NULL AFTER account_type, ADD INDEX idx_mobile_card_ref (mobile_card_ref)");
    }
} catch (Exception $e) {
    // ignore
}

// Check if user is logged in
if (!isset($_SESSION['user_id'])) {
    header('Location: /login.php');
    exit;
}

$message = '';
$error = '';

// Get user information for sidebar
$user_role = $_SESSION['user_role'] ?? 'admin';
$user_name = $_SESSION['user_name'] ?? $_SESSION['username'] ?? 'User';

if ($_SERVER['REQUEST_METHOD'] == 'POST') {
    if (isset($_POST['add_balance'])) {
        $account_name = trim($_POST['account_name']);
        $account_type = $_POST['account_type'];
        $balance_date = $_POST['balance_date'];
        $opening_balance = $_POST['opening_balance'];
        $description = trim($_POST['description']);
        $mobile_card_ref = isset($_POST['mobile_card_ref']) ? trim($_POST['mobile_card_ref']) : null;
        
        if (empty($account_name) || empty($balance_date) || empty($opening_balance)) {
            $error = 'সমস্ত প্রয়োজনীয় তথ্য পূরণ করুন';
        } else {
            $stmt = $pdo->prepare("INSERT INTO previous_balances (account_name, account_type, mobile_card_ref, balance_date, opening_balance, description, created_by) VALUES (?, ?, ?, ?, ?, ?, ?)");
            if ($stmt->execute([$account_name, $account_type, $mobile_card_ref, $balance_date, $opening_balance, $description, $_SESSION['user_id']])) {
                $message = 'পূর্ববর্তী ব্যালেন্স সফলভাবে যোগ করা হয়েছে';
            } else {
                $error = 'পূর্ববর্তী ব্যালেন্স যোগ করতে ত্রুটি হয়েছে';
            }
        }
    }
    
    if (isset($_POST['edit_balance'])) {
        $id = $_POST['id'];
        $account_name = trim($_POST['account_name']);
        $account_type = $_POST['account_type'];
        $balance_date = $_POST['balance_date'];
        $opening_balance = $_POST['opening_balance'];
        $description = trim($_POST['description']);
        $mobile_card_ref = isset($_POST['mobile_card_ref']) ? trim($_POST['mobile_card_ref']) : null;
        
        if (empty($account_name) || empty($balance_date) || empty($opening_balance)) {
            $error = 'সমস্ত প্রয়োজনীয় তথ্য পূরণ করুন';
        } else {
            $stmt = $pdo->prepare("UPDATE previous_balances SET account_name=?, account_type=?, mobile_card_ref=?, balance_date=?, opening_balance=?, description=?, created_by=? WHERE id=?");
            if ($stmt->execute([$account_name, $account_type, $mobile_card_ref, $balance_date, $opening_balance, $description, $_SESSION['user_id'], $id])) {
                $message = 'পূর্ববর্তী ব্যালেন্স সফলভাবে আপডেট করা হয়েছে';
            } else {
                $error = 'পূর্ববর্তী ব্যালেন্স আপডেট করতে ত্রুটি হয়েছে';
            }
        }
    }
    
    if (isset($_POST['delete_balance'])) {
        $id = $_POST['id'];
        $stmt = $pdo->prepare("DELETE FROM previous_balances WHERE id=?");
        if ($stmt->execute([$id])) {
            $message = 'পূর্ববর্তী ব্যালেন্স সফলভাবে মুছে ফেলা হয়েছে';
        } else {
            $error = 'পূর্ববর্তী ব্যালেন্স মুছতে ত্রুটি হয়েছে';
        }
    }
}

// Fetch all previous balances
$stmt = $pdo->query("
    SELECT pb.*, u.username as created_by_name 
    FROM previous_balances pb 
    LEFT JOIN users u ON pb.created_by = u.id 
    ORDER BY pb.balance_date DESC, pb.account_name ASC
");
$balances = $stmt->fetchAll();

// Determine latest mobile bank account card reference
$latest_mobile_card_ref = '';
foreach ($balances as $b) {
    if (($b['account_type'] ?? '') === 'mobile' && !empty($b['mobile_card_ref'])) {
        $latest_mobile_card_ref = $b['mobile_card_ref'];
        break;
    }
}

// Calculate total balance
$total_balance = 0;
foreach ($balances as $balance) {
    $total_balance += $balance['opening_balance'];
}
?>
<!DOCTYPE html>
<html lang="bn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>পূর্ববর্তী ব্যালেন্স - বিদ্যা সংগঠন</title>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
    <link href="https://fonts.googleapis.com/css2?family=Hind+Siliguri:wght@300;400;500;600;700&display=swap" rel="stylesheet">
    <link href="assets/css/jessoreboard-theme.css" rel="stylesheet">
    <link href="assets/css/sidebar.css" rel="stylesheet">
    <link href="assets/css/custom-sidebar.css" rel="stylesheet">
    <style>
        body {
            font-family: 'Hind Siliguri', sans-serif;
            background-color: #f4f7f6;
            direction: ltr;
            text-align: left;
            margin: 0;
            padding: 0;
        }
        
        /* Override RTL for specific elements */
        .card-header, .card-body, .table, .form-label, .form-control, .form-select, .btn {
            direction: ltr;
            text-align: left;
        }
        
        /* Ensure table headers and cells are left-aligned */
        .table th, .table td {
            text-align: left;
        }
        
        /* Fix form elements */
        .form-control, .form-select {
            text-align: left;
        }
        
        .navbar {
            background: linear-gradient(135deg, #d32f2f 0%, #c62828 100%);
        }
        
        .card {
            border: none;
            border-radius: 15px;
            box-shadow: 0 5px 15px rgba(0,0,0,0.08);
            margin-bottom: 1.5rem;
        }
        
        .table th {
            background-color: #d32f2f;
            color: white;
        }
        
        .btn-primary {
            background-color: #d32f2f;
            border-color: #d32f2f;
        }
        
        .btn-primary:hover {
            background-color: #c62828;
            border-color: #c62828;
        }
        
        .summary-card {
            text-align: center;
            padding: 1.5rem;
            border-radius: 10px;
            color: white;
            margin-bottom: 1rem;
        }
        
        .summary-card-income {
            background: linear-gradient(135deg, #28a745 0%, #20c997 100%);
        }
        
        .summary-card-expense {
            background: linear-gradient(135deg,rgb(70, 2, 126) 0%,rgb(36, 2, 49) 100%);
        }
        
        .summary-card-balance {
            background: linear-gradient(135deg, #007bff 0%, #6f42c1 100%);
        }
        
        .amount-text {
            font-weight: bold;
            color: #28a745;
        }
        
        .balance-positive {
            color: #28a745;
            font-weight: bold;
        }
        
        .balance-negative {
            color: #dc3545;
            font-weight: bold;
        }
        
        .print-btn {
            position: fixed;
            top: 20px;
            left: 20px;
            z-index: 1000;
        }
        
        /* Pagination styles */
        .pagination {
            margin-bottom: 0;
        }
        
        .pagination .page-link {
            color: #d32f2f;
        }
        
        .pagination .page-item.active .page-link {
            background-color: #d32f2f;
            border-color: #d32f2f;
        }
        
        .dashboard-card {
            background: linear-gradient(135deg, #006747 0%, #004d35 100%);
            color: white;
            border-radius: 10px;
            padding: 15px;
            margin-bottom: 10px;
            box-shadow: 0 4px 15px rgba(0,103,71,0.2);
            transition: transform 0.3s ease, box-shadow 0.3s ease;
            position: relative;
            overflow: hidden;
            border-top: 2px solid #F42A41;
        }
        
        .dashboard-card::before {
            content: '';
            position: absolute;
            top: -50%;
            right: -50%;
            width: 100%;
            height: 100%;
            background: rgba(255,255,255,0.1);
            border-radius: 50%;
            transition: all 0.3s ease;
        }
        
        .dashboard-card:hover {
            transform: translateY(-2px);
            box-shadow: 0 6px 18px rgba(0,103,71,0.3);
        }
        
        .dashboard-card:hover::before {
            top: -30%;
            right: -30%;
        }
        
        .dashboard-card.card-students {
            background: linear-gradient(135deg,rgb(13, 1, 66) 0%, #00a86b 100%);
        }
        
        .dashboard-card.card-teachers {
            background: linear-gradient(135deg, #d32f2f 0%, #F42A41 100%);
        }
        
        .dashboard-card.card-classes {
            background: linear-gradient(135deg, #1976d2 0%, #2196f3 100%);
        }
        
        .dashboard-card.card-attendance {
            background: linear-gradient(135deg, #388e3c 0%, #4caf50 100%);
        }
        
        .dashboard-card.card-fees {
            background: linear-gradient(135deg, #f57c00 0%, #ff9800 100%);
        }
        
        .dashboard-card.card-exams {
            background: linear-gradient(135deg, #7b1fa2 0%, #9c27b0 100%);
        }
        
        .dashboard-card.card-visitors {
            background: linear-gradient(135deg, #0097a7 0%, #00bcd4 100%);
        }
        
        .card-icon {
            font-size: 2rem;
            opacity: 0.9;
            margin-bottom: 8px;
            position: relative;
            z-index: 2;
        }
        
        .card-number {
            font-size: 1.6rem;
            font-weight: bold;
            margin-bottom: 6px;
            position: relative;
            z-index: 2;
        }
        
        .card-title {
            font-size: 0.9rem;
            opacity: 0.95;
            position: relative;
            z-index: 2;
        }
        
        .card-subtitle {
            font-size: 0.7rem;
            opacity: 0.8;
            margin-top: 2px;
            position: relative;
            z-index: 2;
        }
        
        .slide-in {
            animation: slideIn 0.6s ease forwards;
        }
        
        @keyframes slideIn {
            from {
                opacity: 0;
                transform: translateY(20px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }
    </style>
</head>
<body>
    <div class="sidebar-container">
        <?php echo renderSidebar(basename($_SERVER['PHP_SELF']), $user_role, $user_name); ?>
        
        <div class="main-content">
            <!-- Content Header -->
            <div class="content-header">
                <h1 class="content-title">
                    <i class="fas fa-balance-scale me-2"></i>
                    পূর্ববর্তী ব্যালেন্স
                </h1>
                <p class="content-breadcrumb">
                    <i class="fas fa-home me-1"></i>
                    হোম / পূর্ববর্তী ব্যালেন্স
                    <span class="ms-3 text-muted">
                        <i class="fas fa-clock me-1"></i>
                        <?php echo date('d F Y, l'); ?>
                    </span>
                </p>
            </div>
            
            <!-- Floating Sidebar Toggle Button -->
            <button class="sidebar-toggle-float" onclick="toggleSidebar()" title="সাইডবার টগল করুন">
                <i class="fas fa-bars"></i>
            </button>
            
            <!-- Content Body -->
            <div class="content-body">
                <?php if ($message): ?>
                    <div class="alert alert-success alert-dismissible fade show" role="alert">
                        <?php echo htmlspecialchars($message); ?>
                        <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
                    </div>
                <?php endif; ?>

                <?php if ($error): ?>
                    <div class="alert alert-danger alert-dismissible fade show" role="alert">
                        <?php echo htmlspecialchars($error); ?>
                        <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
                    </div>
                <?php endif; ?>

                <!-- Summary Cards -->
                <div class="row mb-4 row-cols-1 row-cols-sm-2 row-cols-md-3 row-cols-lg-5 g-3">
                    <div class="col">
                        <div class="dashboard-card card-fees slide-in">
                            <div class="card-icon">
                                <i class="fas fa-balance-scale"></i>
                            </div>
                            <div class="card-number">৳<?php echo number_format($total_balance, 2); ?></div>
                            <div class="card-title">মোট পূর্ববর্তী ব্যালেন্স</div>
                            <div class="card-subtitle">
                                বর্তমান তারিখ: <?php echo date('d/m/Y'); ?>
                            </div>
                        </div>
                    </div>
                    
                    <div class="col">
                        <div class="dashboard-card card-students slide-in">
                            <div class="card-icon">
                                <i class="fas fa-wallet"></i>
                            </div>
                            <div class="card-number"><?php echo count($balances); ?></div>
                            <div class="card-title">মোট একাউন্ট</div>
                            <div class="card-subtitle">
                                সক্রিয় পূর্ববর্তী ব্যালেন্স
                            </div>
                        </div>
                    </div>
                    
                    <div class="col">
                        <div class="dashboard-card card-attendance slide-in">
                            <div class="card-icon">
                                <i class="fas fa-calendar"></i>
                            </div>
                            <div class="card-number"><?php echo count(array_filter($balances, function($b) { return $b['account_type'] === 'cash'; })); ?></div>
                            <div class="card-title">নগদ একাউন্ট</div>
                            <div class="card-subtitle">
                                মোট নগদ ব্যালেন্স
                            </div>
                        </div>
                    </div>
                    
                    <div class="col">
                        <div class="dashboard-card card-teachers slide-in">
                            <div class="card-icon">
                                <i class="fas fa-university"></i>
                            </div>
                            <div class="card-number"><?php echo count(array_filter($balances, function($b) { return $b['account_type'] === 'bank'; })); ?></div>
                            <div class="card-title">ব্যাংক একাউন্ট</div>
                            <div class="card-subtitle">
                                মোট ব্যাংক ব্যালেন্স
                            </div>
                        </div>
                    </div>

                    <div class="col">
                        <div class="dashboard-card card-exams slide-in">
                            <div class="card-icon">
                                <i class="fas fa-mobile-alt"></i>
                            </div>
                            <div class="card-number"><?php echo count(array_filter($balances, function($b) { return $b['account_type'] === 'mobile'; })); ?></div>
                            <div class="card-title">মোবাইল একাউন্ট</div>
                            <div class="card-subtitle">
                                মোট মোবাইল ব্যালেন্স
                            </div>
                        </div>
                    </div>
                </div>

                <div class="row mb-4">
                    <div class="col-12">
                        <div class="card">
                            <div class="card-header d-flex justify-content-between align-items-center">
                                <h5 class="mb-0"><i class="fas fa-credit-card"></i> মোবাইল ব্যাংক একাউন্ট কার্ড</h5>
                                <button type="button" class="btn btn-sm btn-primary" onclick="goToCreateMobileCard()">
                                    <i class="fas fa-pen"></i> কার্ড পরিবর্তন করুন
                                </button>
                            </div>
                            <div class="card-body">
                                <?php if (!empty($latest_mobile_card_ref)): ?>
                                    <div class="fs-5">বর্তমান: <?php echo htmlspecialchars($latest_mobile_card_ref); ?></div>
                                <?php else: ?>
                                    <div class="text-muted">কোনো মোবাইল ব্যাংক একাউন্ট কার্ড সেট হয়নি</div>
                                <?php endif; ?>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="row">
                    <div class="col-md-4">
                        <div class="card">
                            <div class="card-header">
                                <h5><i class="fas fa-plus-circle"></i> নতুন পূর্ববর্তী ব্যালেন্স</h5>
                            </div>
                            <div class="card-body">
                                <form method="POST">
                                    <div class="mb-3">
                                        <label class="form-label">একাউন্টের নাম *</label>
                                        <input type="text" class="form-control" name="account_name" required>
                                    </div>
                                    <div class="mb-3">
                                        <label class="form-label">একাউন্টের ধরন</label>
                                        <select class="form-select" name="account_type" id="create_account_type">
                                            <option value="cash">নগদ</option>
                                            <option value="bank">ব্যাংক</option>
                                            <option value="mobile">মোবাইল ব্যাংকিং</option>
                                            <option value="other">অন্যান্য</option>
                                        </select>
                                    </div>
                                    <div class="mb-3" id="create_mobile_card_ref_group" style="display:none;">
                                        <label class="form-label">মোবাইল ব্যাংক একাউন্ট কার্ড</label>
                                        <input type="text" class="form-control" name="mobile_card_ref" id="create_mobile_card_ref" placeholder="যেমন: bKash 017XXXXXXXX / Nagad 018XXXXXXX / Card Alias">
                                        <div class="form-text">মোবাইল ব্যাংক একাউন্ট বা কার্ডের রেফারেন্স লিখুন</div>
                                    </div>
                                    <div class="mb-3">
                                        <label class="form-label">ব্যালেন্স তারিখ *</label>
                                        <input type="date" class="form-control" name="balance_date" value="<?php echo date('Y-m-d'); ?>" required>
                                    </div>
                                    <div class="mb-3">
                                        <label class="form-label">প্রারম্ভিক ব্যালেন্স (৳) *</label>
                                        <input type="number" class="form-control" name="opening_balance" step="0.01" min="0" required>
                                    </div>
                                    <div class="mb-3">
                                        <label class="form-label">বিবরণ</label>
                                        <textarea class="form-control" name="description" rows="2"></textarea>
                                    </div>
                                    <button type="submit" name="add_balance" class="btn btn-primary w-100">
                                        <i class="fas fa-save"></i> পূর্ববর্তী ব্যালেন্স যোগ করুন
                                    </button>
                                </form>
                            </div>
                        </div>
                    </div>

                    <div class="col-md-8">
                        <div class="card">
                            <div class="card-header d-flex justify-content-between align-items-center">
                                <h5><i class="fas fa-receipt"></i> পূর্ববর্তী ব্যালেন্স তালিকা</h5>
                                <span class="badge bg-primary"><?php echo count($balances); ?> টি একাউন্ট</span>
                            </div>
                            <div class="card-body">
                                <div class="table-responsive">
                                    <table class="table table-striped table-hover">
                                        <thead>
                                            <tr>
                                                <th>একাউন্টের নাম</th>
                                                <th>ধরন</th>
                                                <th>তারিখ</th>
                                                <th>ব্যালেন্স (৳)</th>
                                                <th>বিবরণ</th>
                                                <th>কার্যক্রম</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <?php foreach ($balances as $balance): ?>
                                            <tr>
                                                <td><?php echo htmlspecialchars($balance['account_name']); ?></td>
                                                <td>
                                                    <?php 
                                                    $types = [
                                                        'cash' => 'নগদ',
                                                        'bank' => 'ব্যাংক',
                                                        'mobile' => 'মোবাইল',
                                                        'other' => 'অন্যান্য'
                                                    ];
                                                    echo $types[$balance['account_type']] ?? $balance['account_type']; 
                                                    ?>
                                                </td>
                                                <td><?php echo date('d/m/Y', strtotime($balance['balance_date'])); ?></td>
                                                <td class="balance-positive">৳<?php echo number_format($balance['opening_balance'], 2); ?></td>
                                                <td><?php echo htmlspecialchars($balance['description'] ?? ''); ?></td>
                                                <td>
                                                    <button class="btn btn-sm btn-outline-primary" onclick="editBalance(<?php echo $balance['id']; ?>, '<?php echo addslashes($balance['account_name']); ?>', '<?php echo $balance['account_type']; ?>', '<?php echo $balance['mobile_card_ref'] ?? ''; ?>', '<?php echo $balance['balance_date']; ?>', <?php echo $balance['opening_balance']; ?>, '<?php echo addslashes($balance['description'] ?? ''); ?>')" title="সম্পাদনা">
                                                        <i class="fas fa-edit"></i>
                                                    </button>
                                                    <form method="POST" class="d-inline" onsubmit="return confirm('আপনি কি নিশ্চিত?')">
                                                        <input type="hidden" name="id" value="<?php echo $balance['id']; ?>">
                                                        <button type="submit" name="delete_balance" class="btn btn-sm btn-outline-danger" title="মুছুন">
                                                            <i class="fas fa-trash"></i>
                                                        </button>
                                                    </form>
                                                </td>
                                            </tr>
                                            <?php endforeach; ?>
                                            
                                            <?php if (empty($balances)): ?>
                                            <tr>
                                                <td colspan="6" class="text-center">কোন পূর্ববর্তী ব্যালেন্স পাওয়া যায়নি</td>
                                            </tr>
                                            <?php endif; ?>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Edit Modal -->
    <div class="modal fade" id="editModal" tabindex="-1">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <form method="POST">
                    <div class="modal-header">
                        <h5 class="modal-title">পূর্ববর্তী ব্যালেন্স সম্পাদনা</h5>
                        <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                    </div>
                    <div class="modal-body">
                        <input type="hidden" name="id" id="edit_id">
                        <div class="row">
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label class="form-label">একাউন্টের নাম *</label>
                                    <input type="text" class="form-control" name="account_name" id="edit_account_name" required>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label class="form-label">একাউন্টের ধরন</label>
                                    <select class="form-select" name="account_type" id="edit_account_type">
                                        <option value="cash">নগদ</option>
                                        <option value="bank">ব্যাংক</option>
                                        <option value="mobile">মোবাইল ব্যাংকিং</option>
                                        <option value="other">অন্যান্য</option>
                                    </select>
                                    <div class="mt-3" id="edit_mobile_card_ref_group" style="display:none;">
                                        <label class="form-label">মোবাইল ব্যাংক একাউন্ট কার্ড</label>
                                        <input type="text" class="form-control" name="mobile_card_ref" id="edit_mobile_card_ref" placeholder="যেমন: bKash 017XXXXXXXX / Card Alias">
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label class="form-label">ব্যালেন্স তারিখ *</label>
                                    <input type="date" class="form-control" name="balance_date" id="edit_balance_date" required>
                                </div>
                            </div>
                            <div class="col-md-6">
                                <div class="mb-3">
                                    <label class="form-label">প্রারম্ভিক ব্যালেন্স (৳) *</label>
                                    <input type="number" class="form-control" name="opening_balance" id="edit_opening_balance" step="0.01" min="0" required>
                                </div>
                            </div>
                        </div>
                        <div class="mb-3">
                            <label class="form-label">বিবরণ</label>
                            <textarea class="form-control" name="description" id="edit_description" rows="2"></textarea>
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">বাতিল</button>
                        <button type="submit" name="edit_balance" class="btn btn-primary">হালনাগাদ</button>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js"></script>
    <script>
        function editBalance(id, accountName, accountType, mobileCardRef, balanceDate, openingBalance, description) {
            document.getElementById('edit_id').value = id;
            document.getElementById('edit_account_name').value = accountName;
            document.getElementById('edit_account_type').value = accountType;
            document.getElementById('edit_mobile_card_ref').value = mobileCardRef || '';
            document.getElementById('edit_balance_date').value = balanceDate;
            document.getElementById('edit_opening_balance').value = openingBalance;
            document.getElementById('edit_description').value = description;
            document.getElementById('edit_mobile_card_ref_group').style.display = (accountType === 'mobile') ? 'block' : 'none';
            new bootstrap.Modal(document.getElementById('editModal')).show();
        }

        (function(){
            const typeEl = document.getElementById('create_account_type');
            const grp = document.getElementById('create_mobile_card_ref_group');
            if (typeEl && grp) {
                const toggle = ()=>{ grp.style.display = (typeEl.value === 'mobile') ? 'block' : 'none'; };
                typeEl.addEventListener('change', toggle);
                toggle();
            }
            const editTypeEl = document.getElementById('edit_account_type');
            const editGrp = document.getElementById('edit_mobile_card_ref_group');
            if (editTypeEl && editGrp) {
                editTypeEl.addEventListener('change', ()=>{
                    editGrp.style.display = (editTypeEl.value === 'mobile') ? 'block' : 'none';
                });
            }
        })();
    </script>
    <script>
        function goToCreateMobileCard() {
            const typeEl = document.getElementById('create_account_type');
            const inputEl = document.getElementById('create_mobile_card_ref');
            const grp = document.getElementById('create_mobile_card_ref_group');
            if (typeEl) {
                typeEl.value = 'mobile';
                typeEl.dispatchEvent(new Event('change'));
            }
            if (grp) grp.style.display = 'block';
            if (inputEl) {
                inputEl.scrollIntoView({behavior: 'smooth', block: 'center'});
                inputEl.focus();
            }
        }
    </script>
</body>
</html>