<?php 
$this->load->view('layouts/header');
$this->load->helper('layout');
?>

    <!-- App Header -->
    <div class="appHeader">
        <div class="left">
            <a href="<?php echo base_url('cards/view/' . $card->id); ?>" class="headerButton">
                <ion-icon name="chevron-back-outline"></ion-icon>
            </a>
        </div>
        <div class="pageTitle">Card Transactions</div>
        <div class="right"></div>
    </div>

    <!-- App Capsule -->
    <div id="appCapsule">
        
        <!-- Card Summary -->
        <div class="section mt-2">
            <div class="card">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center">
                        <div>
                            <p class="text-muted mb-1"><?php echo $card->card_number_masked; ?></p>
                            <h4 class="mb-0"><?php echo format_money($card->balance, $card->currency); ?></h4>
                        </div>
                        <span class="badge badge-<?php echo $card->status == 'active' ? 'success' : 'secondary'; ?>">
                            <?php echo ucfirst($card->status); ?>
                        </span>
                    </div>
                </div>
            </div>
        </div>

        <!-- Transactions -->
        <div class="section mt-3 mb-3">
            <div class="section-title">All Transactions (<?php echo count($transactions); ?>)</div>
            
            <?php if (empty($transactions)): ?>
            <div class="card">
                <div class="card-body text-center py-5">
                    <ion-icon name="receipt-outline" style="font-size: 64px; color: #ccc;"></ion-icon>
                    <h4 class="mt-3">No Transactions</h4>
                    <p class="text-muted">This card has no transactions yet</p>
                </div>
            </div>
            <?php else: ?>
            
            <?php 
            $grouped = [];
            foreach ($transactions as $txn) {
                $date = date('Y-m-d', strtotime($txn->created_at));
                if (!isset($grouped[$date])) {
                    $grouped[$date] = [];
                }
                $grouped[$date][] = $txn;
            }
            ?>
            
            <?php foreach ($grouped as $date => $txns): ?>
            <div class="listview-title mt-2"><?php echo date('F d, Y', strtotime($date)); ?></div>
            <div class="transactions">
                <?php foreach ($txns as $txn): ?>
                <div class="item">
                    <div class="detail">
                        <div class="icon-box bg-<?php echo $txn->type == 'credit' ? 'success' : 'danger'; ?>">
                            <ion-icon name="<?php echo $txn->type == 'credit' ? 'arrow-down' : 'arrow-up'; ?>-outline"></ion-icon>
                        </div>
                        <div>
                            <strong><?php echo htmlspecialchars($txn->merchant ?? $txn->description ?? 'Transaction'); ?></strong>
                            <p>
                                <?php if ($txn->merchant_category ?? false): ?>
                                <span class="badge badge-light me-1"><?php echo $txn->merchant_category; ?></span>
                                <?php endif; ?>
                                <?php echo date('H:i', strtotime($txn->created_at)); ?>
                            </p>
                        </div>
                    </div>
                    <div class="right">
                        <div class="price text-<?php echo $txn->type == 'credit' ? 'success' : 'danger'; ?>">
                            <?php echo $txn->type == 'credit' ? '+' : '-'; ?>
                            <?php echo format_money($txn->amount, $card->currency); ?>
                        </div>
                        <span class="badge badge-<?php 
                            echo $txn->status == 'completed' ? 'success' : 
                                ($txn->status == 'pending' ? 'warning' : 'danger'); 
                        ?>">
                            <?php echo ucfirst($txn->status ?? 'completed'); ?>
                        </span>
                    </div>
                </div>
                <?php endforeach; ?>
            </div>
            <?php endforeach; ?>
            
            <?php endif; ?>
        </div>
    </div>

    <!-- App Bottom Menu -->
    <?php echo get_bottom_menu('cards'); ?>

<?php $this->load->view('layouts/footer'); ?>
