<?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); display: flex; justify-content: space-between; align-items: center;}
.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; }

.status-badge { display: inline-block; padding: 6px 12px; border-radius: 20px; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.5px; }
.status-pending { background: rgba(245, 158, 11, 0.1); color: #f59e0b; }
.status-completed { background: rgba(16, 185, 129, 0.1); color: #10b981; }
.status-cancelled { background: rgba(239, 68, 68, 0.1); color: #ef4444; }

.order-items-table { width: 100%; border-collapse: collapse; margin-top: 20px; }
.order-items-table th, .order-items-table td { padding: 16px; text-align: left; border-bottom: 1px solid var(--border); }
.order-items-table th { color: var(--text-2); font-size: 14px; font-weight: 500; background: var(--surface-2); }
.order-items-table td { color: var(--text-1); font-size: 15px; }
.order-items-table tr:last-child td { border-bottom: none; }

.order-summary-box { background: var(--surface-2); border-radius: var(--r-md); padding: 20px; margin-top: 20px; }
.summary-row { display: flex; justify-content: space-between; margin-bottom: 10px; color: var(--text-2); font-size: 15px; }
.summary-row.total { font-size: 18px; font-weight: 700; color: var(--orange); margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--border); margin-bottom: 0; }

.customer-info-box { border: 1px solid var(--border); border-radius: var(--r-md); padding: 20px; margin-top: 30px; }
.customer-info-box h3 { font-size: 16px; margin: 0 0 15px 0; border-bottom: 1px solid var(--border); padding-bottom: 10px;}
.info-row { display: flex; margin-bottom: 8px; font-size: 14px; }
.info-row span { width: 120px; color: var(--text-2); font-weight: 500; }
.info-row div { color: var(--text-1); flex: 1; }

@media (max-width: 768px) {
    .account-content { padding: 24px; }
    .account-content-header { flex-direction: column; align-items: flex-start; gap: 10px; }
    .order-items-table th, .order-items-table td { padding: 12px 8px; }
}
</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>

    <!-- Content -->
    <main class="account-content">
        <?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';
            } elseif ($order->status == 'pending_payment') {
                $statusClass = 'status-pending'; // yellow
                $statusText = 'Ödeme Dekontu Bekliyor';
            } elseif ($order->status == 'payment_uploaded') {
                $statusClass = 'status-processing'; // blue
                $statusText = 'Dekont İnceleniyor';
            }
        ?>
        <div class="account-content-header">
            <div>
                <h1>Sipariş Detayı #<?php echo str_pad($order->id, 5, '0', STR_PAD_LEFT); ?></h1>
                <p><?php echo date('d.m.Y H:i', strtotime($order->created_at)); ?> tarihinde verildi.</p>
            </div>
            <div>
                <a href="<?php echo $baseUrl; ?>/profile/orders" class="btn-primary" style="padding: 8px 16px; font-size: 14px; text-decoration: none; border-radius: var(--radius-sm); margin-right: 15px; background: transparent; border: 1px solid var(--orange); color: var(--orange);">
                    <i class="fa fa-arrow-left"></i> Geri Dön
                </a>
                <span class="status-badge <?php echo $statusClass; ?>"><?php echo $statusText; ?></span>
            </div>
        </div>

        <?php if ($order->status === 'pending_payment'): ?>
        <div style="background:var(--surface-2); padding:15px 20px; border-radius:var(--radius-sm); border:1px solid var(--border); margin-bottom:20px; display:flex; flex-direction:column; gap:10px;">
            <h3 style="font-size:15px; margin:0; color:var(--text-1);"><i class="fa fa-upload" style="color:var(--orange);"></i> Ödeme Dekontu Yükle</h3>
            <p style="font-size:13px; color:var(--text-3); margin:0;">Havale/EFT işleminizi tamamladıktan sonra dekontunuzu yükleyiniz. İşleminiz kontrol edildikten sonra siparişiniz onaylanacaktır.</p>
            <form action="<?php echo $baseUrl; ?>/profile/orders/<?php echo $order->id; ?>/receipt" method="POST" enctype="multipart/form-data" style="display: flex; gap: 10px; align-items: center; margin-top: 10px;">
                <input type="file" name="receipt" accept="image/*,.pdf" required style="font-size: 13px; padding: 5px; color: var(--text-1);">
                <button type="submit" class="btn-primary" style="padding: 8px 16px; font-size: 13px; border-radius: var(--radius-sm);">Yükle</button>
            </form>
        </div>
        <?php elseif ($order->status === 'payment_uploaded'): ?>
        <div style="background:rgba(16, 185, 129, 0.1); padding:15px 20px; border-radius:var(--radius-sm); border:1px solid rgba(16, 185, 129, 0.3); margin-bottom:20px; display:flex; flex-direction:column; gap:10px;">
            <h3 style="font-size:15px; margin:0; color:#10b981;"><i class="fa fa-info-circle"></i> Dekont Yüklendi</h3>
            <p style="font-size:13px; color:var(--text-1); margin:0;">Dekontunuz başarıyla yüklenmiştir. Yönetici onayının ardından siparişiniz işleme alınacaktır.</p>
        </div>
        <?php endif; ?>

        <?php if (!empty($order->shipping_company) || !empty($order->tracking_number)): ?>
        <div style="background:var(--surface-2); padding:15px 20px; border-radius:var(--radius-sm); border:1px solid var(--border); margin-bottom:20px; display:flex; flex-direction:column; gap:10px;">
            <h3 style="font-size:15px; margin:0; color:var(--text-1);"><i class="fa fa-truck" style="color:var(--orange);"></i> Kargo Bilgileri</h3>
            <div style="display:flex; gap:30px;">
                <?php if (!empty($order->shipping_company)): ?>
                <div>
                    <span style="font-size:12px; color:var(--text-3); display:block;">Kargo Firması</span>
                    <span style="font-weight:600; color:var(--text-1);"><?php echo htmlspecialchars($order->shipping_company); ?></span>
                </div>
                <?php endif; ?>
                
                <?php if (!empty($order->tracking_number)): ?>
                <div>
                    <span style="font-size:12px; color:var(--text-3); display:block;">Takip Numarası</span>
                    <span style="font-weight:600; color:var(--text-1);"><?php echo htmlspecialchars($order->tracking_number); ?></span>
                </div>
                <?php endif; ?>
            </div>
        </div>
        <?php endif; ?>

        <div style="overflow-x: auto;">
            <table class="order-items-table">
                <thead>
                    <tr>
                        <th>Ürün</th>
                        <th style="text-align: center;">Adet</th>
                        <th style="text-align: right;">Birim Fiyat</th>
                        <th style="text-align: right;">Toplam</th>
                    </tr>
                </thead>
                <tbody>
                    <?php if (!empty($order->items) && is_array($order->items)): ?>
                        <?php foreach ($order->items as $item): ?>
                            <tr>
                                <td>
                                    <?php 
                                        $product = null;
                                        if (isset($item['product_id'])) {
                                            $product = \App\Models\Product::find($item['product_id']);
                                        }
                                    ?>
                                    <?php if ($product): ?>
                                        <div style="display: flex; align-items: center; gap: 15px;">
                                            <div style="width: 50px; height: 50px; background-color: white; border: 1px solid var(--border); border-radius: var(--r-sm); display: flex; align-items: center; justify-content: center; overflow: hidden; padding: 4px; flex-shrink: 0;">
                                                <img src="<?php echo $product->getMainImage($baseUrl); ?>" alt="<?php echo htmlspecialchars($product->name); ?>" style="max-width: 100%; max-height: 100%; object-fit: contain;">
                                            </div>
                                            <div>
                                                <a href="<?php echo $baseUrl; ?>/<?php echo $product->slug; ?>" style="color: var(--text-1); font-weight: 500; text-decoration: none;">
                                                    <?php echo htmlspecialchars($item['name'] ?? 'Bilinmeyen Ürün'); ?>
                                                </a>
                                            </div>
                                        </div>
                                    <?php else: ?>
                                        <?php echo htmlspecialchars($item['name'] ?? 'Bilinmeyen Ürün'); ?>
                                    <?php endif; ?>
                                </td>
                                <td style="text-align: center; font-weight: 600;"><?php echo $item['quantity'] ?? 1; ?></td>
                                <td style="text-align: right;"><?php echo \App\Services\CurrencyService::format($item['price'] ?? 0, $item['currency'] ?? $order->currency); ?></td>
                                <td style="text-align: right; font-weight: 600;"><?php echo \App\Services\CurrencyService::format($item['subtotal'] ?? 0, $order->currency); ?></td>
                            </tr>
                        <?php endforeach; ?>
                    <?php else: ?>
                        <tr>
                            <td colspan="4" style="text-align: center; padding: 30px;">Bu siparişte ürün bulunamadı.</td>
                        </tr>
                    <?php endif; ?>
                </tbody>
            </table>
        </div>

        <div class="order-summary-box">
            <div class="summary-row">
                <span>Ara Toplam</span>
                <span><?php echo \App\Services\CurrencyService::format((float)($order->subtotal ?? $order->total), $order->currency); ?></span>
            </div>
            <div class="summary-row">
                <span>Kargo Ücreti (<?php echo htmlspecialchars($order->shipping_method ?? 'Standart Kargo'); ?>)</span>
                <span><?php echo \App\Services\CurrencyService::format((float)($order->shipping_cost ?? 0), $order->currency); ?></span>
            </div>
            <div class="summary-row total">
                <span>Genel Toplam</span>
                <span><?php echo \App\Services\CurrencyService::format($order->total, $order->currency); ?></span>
            </div>
        </div>

        <div class="customer-info-box">
            <h3>Teslimat ve İletişim Bilgileri</h3>
            <div class="info-row">
                <span>Ödeme Yöntemi:</span>
                <div style="font-weight:600; color:var(--text-1);">
                    <?php 
                    if (isset($order->payment_method) && $order->payment_method === 'bank_transfer') {
                        echo '<i class="fa fa-university" style="color:var(--text-3);"></i> Havale / EFT';
                    } else {
                        echo '<i class="fa fa-credit-card" style="color:var(--text-3);"></i> Kredi Kartı';
                    }
                    ?>
                </div>
            </div>
            <div class="info-row">
                <span>Ad Soyad:</span>
                <div><?php echo htmlspecialchars($order->customer_name ?? '-'); ?></div>
            </div>
            <div class="info-row">
                <span>E-posta:</span>
                <div><?php echo htmlspecialchars($order->customer_email ?? '-'); ?></div>
            </div>
            <div class="info-row">
                <span>Telefon:</span>
                <div><?php echo htmlspecialchars($order->customer_phone ?? '-'); ?></div>
            </div>
            <div class="info-row" style="margin-top: 10px;">
                <span>Adres:</span>
                <div style="line-height: 1.5;"><?php echo nl2br(htmlspecialchars($order->customer_address ?? '-')); ?></div>
            </div>
        </div>

    </main>
</div>

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