<?php
session_start();
$role = 'captain';
$page = 'customers';
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Add Customer – Captain</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="/pwa/assets/pwa_core.css">
    <link rel="stylesheet" href="/pwa/assets/pwa_header.css">
    <link rel="stylesheet" href="/pwa/assets/pwa_nav.css">

    <link rel="stylesheet" href="/pwa/assets/pwa_fab.css">
    <link rel="stylesheet" href="/pwa/assets/pwa_filters.css">
    <link rel="stylesheet" href="/pwa/assets/pwa_customer_view.css">

</head>
<body data-role="<?php echo $role; ?>" data-page="<?php echo $page; ?>">
<div class="pwa-app">
    <?php include __DIR__ . '/../components/pwa_header.php'; ?>
    <main class="pwa-content">

        <div class="pwa-card">
            <div class="pwa-card-header">
                <span>Add Customer (Dummy)</span>
                <span class="pwa-card-meta">Form UI only</span>
            </div>
            <form>
                <div style="margin-bottom:10px;">
                    <label class="pwa-card-meta">Customer Name</label><br>
                    <input type="text" style="width:100%;padding:8px;border-radius:10px;border:1px solid #d0d7de;">
                </div>
                <div style="margin-bottom:10px;">
                    <label class="pwa-card-meta">Mobile</label><br>
                    <input type="tel" style="width:100%;padding:8px;border-radius:10px;border:1px solid #d0d7de;">
                </div>
                <div style="margin-bottom:10px;">
                    <label class="pwa-card-meta">Customer Type</label><br>
                    <select style="width:100%;padding:8px;border-radius:10px;border:1px solid #d0d7de;">
                        <option>Domestic</option>
                        <option>Commercial</option>
                        <option>Factory</option>
                        <option>School</option>
                        <option>Clinic</option>
                        <option>Office</option>
                        <option>Others</option>
                    </select>
                </div>
                <div style="margin-bottom:10px;">
                    <label class="pwa-card-meta">City</label><br>
                    <input type="text" style="width:100%;padding:8px;border-radius:10px;border:1px solid #d0d7de;">
                </div>
                <button type="button" style="width:100%;padding:10px;border-radius:999px;border:none;background:#2980B9;color:#fff;font-weight:600;">
                    Save (Dummy)
                </button>
            </form>
        </div>

    </main>
    <?php include __DIR__ . '/../components/pwa_nav.php'; ?>
</div>

<script src="/pwa/assets/pwa_dummy_data.js"></script>
<script src="/pwa/assets/pwa_filters.js"></script>
<script src="/pwa/assets/pwa_customer_view.js"></script>
<script src="/pwa/assets/pwa_app.js"></script>

<script src="/pwa/offline_queue.js"></script>
<script src="/pwa/pwa_event_controller.js"></script>
<script>
PWAEvents.bindForm("#addCustomerForm", "/api/customers/create_or_update.php", "POST");
</script>

<script src="/pwa/offline_queue.js"></script>
<script src="/pwa/pwa_event_controller.js"></script>
<script>
PWAEvents.bindForm("#addFollowupForm", "/api/followups/create_or_update.php", "POST");
</script>

<script src="/pwa/offline_queue.js"></script>
<script src="/pwa/pwa_event_controller.js"></script>
<script>
PWAEvents.bindForm("#addTaskForm", "/api/tasks/create_or_update.php", "POST");
</script>


</body>
</html>
