<?php include __DIR__ . '/../layout/header.php'; ?>

<style>
/* Same layout CSS as profile.php */
.account-wrapper {
    max-width: var(--max-w);
    margin: 40px auto;
    padding: 0 20px;
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 30px;
    align-items: start;
}

@media (max-width: 900px) {
    .account-wrapper {
        grid-template-columns: 1fr;
    }
}

.account-sidebar {
    background: var(--surface-card);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-card);
    border: 1px solid var(--border);
    overflow: hidden;
}
.sidebar-user {
    padding: 30px 20px;
    text-align: center;
    border-bottom: 1px solid var(--border);
    background: var(--surface-2);
}
.sidebar-avatar {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    object-fit: cover;
    margin: 0 auto 15px auto;
    border: 2px solid var(--orange);
    box-shadow: var(--shadow-glow);
}
.sidebar-avatar-placeholder {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: var(--orange);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 32px;
    font-weight: 700;
    margin: 0 auto 15px auto;
    box-shadow: var(--shadow-glow);
}
.sidebar-user h3 {
    font-size: 18px;
    color: var(--text-1);
    margin: 0 0 5px 0;
}
.sidebar-user p {
    font-size: 13px;
    color: var(--text-3);
    margin: 0;
}

.sidebar-menu {
    list-style: none;
    padding: 10px 0;
    margin: 0;
}
.sidebar-menu li {
    margin: 0;
}
.sidebar-menu a {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 15px 25px;
    color: var(--text-2);
    font-size: 15px;
    font-weight: 500;
    transition: all 0.3s ease;
    border-left: 3px solid transparent;
}
.sidebar-menu a:hover {
    background: var(--surface-2);
    color: var(--text-1);
}
.sidebar-menu a.active {
    background: var(--surface-2);
    color: var(--orange);
    border-left-color: var(--orange);
}
.sidebar-menu a i {
    width: 20px;
    text-align: center;
    font-size: 18px;
}

.account-content {
    background: var(--surface-card);
    border-radius: var(--r-lg);
    box-shadow: var(--shadow-card);
    border: 1px solid var(--border);
    padding: 40px;
}
.account-content-header {
    margin-bottom: 30px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--border);
}
.account-content-header h1 {
    font-size: 24px;
    color: var(--text-1);
    margin: 0;
}
.account-content-header p {
    color: var(--text-3);
    margin: 5px 0 0 0;
    font-size: 14px;
}

/* Orders Table */
.orders-table {
    width: 100%;
    border-collapse: collapse;
}
.orders-table th, .orders-table td {
    padding: 16px;
    text-align: left;
    border-bottom: 1px solid var(--border);
}
.orders-table th {
    color: var(--text-2);
    font-size: 14px;
    font-weight: 500;
    background: var(--surface-2);
}
.orders-table td {
    color: var(--text-1);
    font-size: 15px;
}
.orders-table tr:last-child td {
    border-bottom: none;
}
.order-id {
    font-weight: 600;
    color: var(--orange);
}
.status-badge {
    display: inline-block;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
}
.status-pending { background: rgba(234, 179, 8, 0.1); color: #eab308; }
.status-completed { background: rgba(34, 197, 94, 0.1); color: #4ade80; }
.status-cancelled { background: rgba(239, 68, 68, 0.1); color: #ef4444; }
.status-shipped { background: rgba(59, 130, 246, 0.1); color: #3b82f6; }

.empty-orders {
    text-align: center;
    padding: 40px 20px;
    color: var(--text-3);
}
.empty-orders i {
    font-size: 48px;
    margin-bottom: 15px;
    color: var(--border);
}

@media (max-width: 768px) {
    .account-content {
        padding: 24px;
    }
    .orders-table {
        display: block;
        overflow-x: auto;
    }
}
</style>

<div class="account-wrapper">
    <!-- Sidebar -->
    <aside class="account-sidebar">
        <div class="sidebar-user">
            <?php if (!empty($user->avatar)): ?>
                <img src="<?php echo htmlspecialchars($user->avatar); ?>" alt="Profil Resmi" referrerpolicy="no-referrer" class="sidebar-avatar">
            <?php else: ?>
                <div class="sidebar-avatar-placeholder">
                    <?php echo mb_substr(mb_strtoupper(htmlspecialchars($user->name), 'UTF-8'), 0, 1, 'UTF-8'); ?>
                </div>
            <?php endif; ?>
            <h3><?php echo htmlspecialchars($user->name); ?></h3>
            <p>Müşteri Hesabı</p>
        </div>
        <ul class="sidebar-menu">
            <li>
                <a href="<?php echo $baseUrl; ?>/profile">
                    <i class="fa fa-user"></i> Hesap Bilgilerim
                </a>
            </li>
            <li>
                <a href="<?php echo $baseUrl; ?>/profile/orders" class="active">
                    <i class="fa fa-shopping-bag"></i> Siparişlerim
                </a>
            </li>
            <li>
                <a href="<?php echo $baseUrl; ?>/cart">
                    <i class="fa fa-shopping-cart"></i> Sepetim
                </a>
            </li>
            <li>
                <a href="<?php echo $baseUrl; ?>/logout" style="color: #ef4444; margin-top: 10px; border-top: 1px solid var(--border);">
                    <i class="fa fa-sign-out"></i> Çıkış Yap
                </a>
            </li>
        </ul>
    </aside>

    <!-- Main Content -->
    <main class="account-content">
        <div class="account-content-header">
            <h1>Siparişlerim</h1>
            <p>Geçmiş siparişlerinizi ve durumlarını buradan takip edebilirsiniz.</p>
        </div>

        <?php if (empty($orders)): ?>
            <div class="empty-orders">
                <i class="fa fa-box-open"></i>
                <p>Henüz hiç sipariş vermemişsiniz.</p>
                <a href="<?php echo $baseUrl; ?>/" class="btn-save" style="display:inline-block; width:auto; margin-top:15px; text-decoration:none;"><i class="fa fa-shopping-cart"></i> Alışverişe Başla</a>
            </div>
        <?php else: ?>
            <table class="orders-table">
                <thead>
                    <tr>
                        <th>Sipariş No</th>
                        <th>Tarih</th>
                        <th>Tutar</th>
                        <th>Durum</th>
                        <th>İşlemler</th>
                    </tr>
                </thead>
                <tbody>
                    <?php foreach ($orders as $order): ?>
                        <tr>
                            <td class="order-id">#<?php echo str_pad($order->id, 5, '0', STR_PAD_LEFT); ?></td>
                            <td><?php echo date('d.m.Y H:i', strtotime($order->created_at)); ?></td>
                            <td style="font-weight:600;"><?php echo \App\Services\CurrencyService::format($order->total, $order->currency); ?></td>
                            <td>
                                <?php 
                                    $statusClass = 'status-pending';
                                    $statusText = 'Bekliyor';
                                    
                                    if ($order->status == 'processing') {
                                        $statusClass = 'status-processing';
                                        $statusText = 'Hazırlanıyor';
                                    } elseif ($order->status == 'shipped') {
                                        $statusClass = 'status-completed'; // green
                                        $statusText = 'Kargoya Verildi';
                                    } elseif ($order->status == 'delivered') {
                                        $statusClass = 'status-completed'; // green
                                        $statusText = 'Teslim Edildi';
                                    } elseif ($order->status == 'cancelled') {
                                        $statusClass = 'status-cancelled';
                                        $statusText = 'İptal / Red';
                                    } elseif ($order->status == 'returned') {
                                        $statusClass = 'status-cancelled'; // red
                                        $statusText = 'İade Edildi';
                                    }
                                ?>
                                <span class="status-badge <?php echo $statusClass; ?>">
                                    <?php echo $statusText; ?>
                                </span>
                            </td>
                            <td>
                                <a href="<?php echo $baseUrl; ?>/profile/orders/<?php echo $order->id; ?>" class="btn-primary" style="padding: 6px 12px; font-size: 13px; text-decoration: none; border-radius: var(--radius-sm); display: inline-block;">
                                    Detaylar
                                </a>
                            </td>
                        </tr>
                    <?php endforeach; ?>
                </tbody>
            </table>
        <?php endif; ?>
    </main>
</div>

<?php include __DIR__ . '/../layout/footer.php'; ?>
