<?php
require_once __DIR__ . '/includes/lang.php';
require_once __DIR__ . '/includes/header.php';
?>
<main class="container py-5">
    <h1 class="mb-4 fw-bold"><?php echo __('api_doc'); ?></h1>
    <div class="card bg-surface border-secondary p-4 shadow-sm">
        <div class="row">
            <div class="col-md-3 border-end border-secondary">
                <nav class="nav flex-column sticky-top" style="top: 100px;">
                    <a class="nav-link text-white fw-bold mb-2" href="#intro"><?= __('api_intro') ?></a>
                    <a class="nav-link text-white-50 mb-2" href="#auth"><?= __('api_auth') ?></a>
                    <a class="nav-link text-white-50 mb-2" href="#market"><?= __('api_market_data') ?></a>
                    <a class="nav-link text-white-50 mb-2" href="#trade"><?= __('api_trade_endpoints') ?></a>
                    <a class="nav-link text-white-50 mb-2" href="#errors"><?= __('api_errors') ?></a>
                </nav>
            </div>
            <div class="col-md-9 ps-md-4">
                <section id="intro" class="mb-5">
                    <h2 class="fw-bold text-white"><?= __('api_intro') ?></h2>
                    <p class="text-white-50"><?= __('api_intro_desc') ?></p>
                </section>

                <section id="auth" class="mb-5">
                    <h2 class="fw-bold text-white"><?= __('api_auth') ?></h2>
                    <p class="text-white-50"><?= __('api_auth_desc') ?></p>
                    <div class="bg-black p-3 rounded mb-3 border border-secondary">
                        <code class="text-success">Authorization: Bearer YOUR_API_KEY</code>
                    </div>
                </section>

                <section id="market" class="mb-5">
                    <h2 class="fw-bold text-white"><?= __('api_market_data') ?></h2>
                    <h5 class="mt-4 text-white"><?= __('api_get_ticker') ?></h5>
                    <div class="bg-black p-3 rounded mb-2 border border-secondary">
                        <code class="text-info">GET /api/v1/market/ticker?symbol=BTCUSDT</code>
                    </div>
                    <p class="small text-white-50"><?= __('api_get_ticker_desc') ?></p>
                </section>

                <section id="trade" class="mb-5">
                    <h2 class="fw-bold text-white"><?= __('trade') ?></h2>
                    <h5 class="mt-4 text-white"><?= __('api_place_order') ?></h5>
                    <div class="bg-black p-3 rounded mb-2 border border-secondary">
                        <code class="text-info">POST /api/v1/trade/order</code>
                    </div>
                    <p class="small text-white-50"><?= __('api_payload_example') ?></p>
                    <pre class="bg-black p-3 rounded text-warning border border-secondary"><code>{
  "symbol": "BTCUSDT",
  "side": "buy",
  "type": "limit",
  "price": "65000",
  "amount": "0.1"
}</code></pre>
                </section>
            </div>
        </div>
    </div>
</main>
<?php require_once __DIR__ . '/includes/footer.php'; ?>
