<?php
session_start();

require_once __DIR__ . '/../includes/helpers.php';
require_once __DIR__ . '/../includes/layout.php';
require_once __DIR__ . '/../includes/expense_shell.php';

if (!isset($_SESSION['authenticated'])) {
    redirect(page_url('signin'));
}

render_expense_shell_start('Advances | Expense', 'dashboard-page advances-page', 'advances');
?>
<div class="page-surface page-surface--white advances-surface" data-advance-page>
    <header class="advances-header">
        <div class="advances-tabs-wrap">
            <nav class="expense-tabs expense-tabs--advances" aria-label="Advance tabs">
                <a class="expense-tab is-active" href="<?= e(page_url('advances')) ?>">
                    <span>Pending Advances</span>
                </a>
                <button type="button" class="expense-tab expense-tab--button">
                    <span>All Advances</span>
                    <i class="fa-solid fa-chevron-down" aria-hidden="true"></i>
                </button>
            </nav>
        </div>

        <div class="advances-actions">
            <button type="button" class="advances-show-button" data-advance-drawer-open>
                Show
            </button>
        </div>
    </header>

    <section class="advances-empty-state">
        <div class="advances-empty-art" aria-hidden="true">
            <span class="advances-empty-scene">
                <i class="fa-solid fa-handshake-angle"></i>
            </span>
        </div>
        <h1>No advances for this filter.</h1>
        <p>Choose another filter or create a new advance.</p>
        <a class="expense-primary advances-record-button" href="<?= e(route_url('advances/new/')) ?>">+ Record Advance</a>
        <a class="advances-learn-link" href="#">Learn more about Advances <i class="fa-solid fa-arrow-right" aria-hidden="true"></i></a>
    </section>

    <button type="button" class="advance-drawer-backdrop" data-advance-drawer-close aria-label="Close panel"></button>

    <aside class="advance-drawer" data-advance-drawer aria-hidden="true">
        <div class="advance-drawer-card">
            <button type="button" class="advance-drawer-close" data-advance-drawer-close aria-label="Close">
                <i class="fa-solid fa-xmark" aria-hidden="true"></i>
            </button>

            <div class="advance-drawer-art" aria-hidden="true">
                <div class="advance-drawer-circle">
                    <i class="fa-solid fa-bullhorn"></i>
                </div>
            </div>

            <h2>Invite people to use Expense</h2>
            <p class="advance-drawer-lead">
                Share Expense with your team and earn referral credits when they sign up and stay active.
            </p>

            <button type="button" class="advance-drawer-cta">Refer and Earn</button>

            <section class="advance-drawer-copy">
                <h3>How it works</h3>
                <p>Invite colleagues, friends, or partner businesses. When they sign up and continue using the app, you receive referral credits.</p>
                <p>Those credits can be applied toward future subscription payments, and the person you refer also gets a welcome bonus.</p>
                <p class="advance-drawer-note">Terms and conditions apply.</p>
            </section>
        </div>
    </aside>
</div>
<?php render_expense_shell_end(); ?>
