<?php
require __DIR__ . '/_boot.php';
require __DIR__ . '/partials/mobile_member_shell.php';
$user = pyrk_mobile_member_guard($user);
?>
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
  <meta name="theme-color" content="#087f5b">
  <title>Pyrk App</title>
  <link rel="manifest" href="manifest.webmanifest">
  <link rel="stylesheet" href="assets/css/app.css">
  <link rel="stylesheet" href="assets/css/mobile_member_app.css?v=1">
</head>
<body class="pyrk-native-app mobile-member-app" data-mobile-page="home">
<?php pyrk_mobile_member_header('Home', 'Your Pyrk member app'); ?>
<main class="mobile-member-main">
  <section class="mobile-home-hero">
    <button class="mobile-avatar-button" id="mobileHomeAvatarButton" type="button" aria-label="Open profile"><span id="mobileHomeAvatar">P</span></button>
    <div>
      <p class="mobile-kicker">Welcome back</p>
      <h2 id="mobileHomeName">Member</h2>
      <p id="mobileHomeMeta">Loading your activity…</p>
    </div>
    <a class="mobile-qr-shortcut" href="my_qr.php?source=app">My QR</a>
  </section>

  <section class="mobile-next-walk" id="mobileNextWalk">
    <div class="mobile-loading-card">Loading your next walk…</div>
  </section>

  <section class="mobile-mini-stats" aria-label="Member summary">
    <article><span>KM</span><strong id="mobileHomeKm">0.0</strong></article>
    <article><span>Points</span><strong id="mobileHomePoints">0</strong></article>
    <article><span>Badges</span><strong id="mobileHomeBadges">0</strong></article>
  </section>

  <section class="mobile-action-grid" aria-label="Member sections">
    <a href="mobile_walks.php"><span>🥾</span><strong>Upcoming walks</strong><small>Browse and register</small></a>
    <a href="mobile_history.php"><span>📜</span><strong>History</strong><small>Finished walks</small></a>
    <a href="mobile_rewards.php"><span>🎁</span><strong>Rewards</strong><small>Badges and prizes</small></a>
    <a href="mobile_profile.php"><span>👤</span><strong>Profile</strong><small>View and edit</small></a>
    <a href="mobile_activity.php"><span>⭐</span><strong>Activity & points</strong><small>Points gained and used</small></a>
    <a href="notifications.php" class="mobile-notification-tile"><span>🔔</span><strong>Notifications</strong><small><b data-mobile-unread-text>No unread messages</b></small></a>
  </section>
</main>
<?php pyrk_mobile_member_dock('home'); ?>
<script>window.PYRK_API_BASE='../api'; window.PYRK_CSRF='<?= htmlspecialchars($csrf, ENT_QUOTES, 'UTF-8') ?>';</script>
<script src="assets/js/api.js"></script>
<script src="assets/js/mobile_member_app.js?v=1"></script>
</body>
</html>
