<?php
require __DIR__ . '/config.php';
?>
<!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="#d71920">
    <title>Avia – Your rental experience</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
<main class="survey-shell">
    <section class="survey-card">
        <header class="survey-header">
            <div class="brand">AVIA</div>
            <div class="header-badge">Customer experience</div>
            <h1>How was your rental?</h1>
            <p>Your feedback takes about one minute and helps us improve our service.</p>
        </header>

        <form action="submit.php" method="post" id="feedbackForm">
            <section class="rental-details">
                <div class="section-kicker">Your rental</div>
                <h2>First, tell us where you picked up the vehicle.</h2>
                <div class="field-grid">
                    <label class="field full">
                        <span>Pick-up location <b>*</b></span>
                        <select name="branch_code" required>
                            <option value="">Select location</option>
                            <?php foreach ($branches as $code => $name): ?>
                                <option value="<?= e($code) ?>"><?= e($name) ?></option>
                            <?php endforeach; ?>
                        </select>
                    </label>
                    <label class="field">
                        <span>Rental agreement number</span>
                        <input type="text" name="agreement_no" maxlength="60" autocomplete="off" placeholder="If you have it">
                        <small>Optional</small>
                    </label>
                    <label class="field">
                        <span>Rental / pick-up date</span>
                        <input type="date" name="rental_date">
                        <small>Optional</small>
                    </label>
                    <label class="field full">
                        <span>Team member name</span>
                        <input type="text" name="employee_name" maxlength="120" autocomplete="off" placeholder="If you remember the name">
                        <small>Optional — helpful if you would like to praise or comment on a specific team member.</small>
                    </label>
                </div>
                <div class="hp-field" aria-hidden="true">
                    <label>Website <input type="text" name="website" tabindex="-1" autocomplete="off"></label>
                </div>
                <input type="hidden" name="form_started_at" value="<?= time() ?>">
            </section>

            <section class="question-block compact">
                <div class="q-number">1</div>
                <div class="q-content">
                    <h2>How long did you wait before a member of our team started serving you?</h2>
                    <div class="choice-grid">
                        <?php foreach (['0–5 min','6–10 min','11–20 min','21–30 min','More than 30 min'] as $v): ?>
                            <label class="choice-chip"><input type="radio" name="wait_time" value="<?= e($v) ?>" required><span><?= e($v) ?></span></label>
                        <?php endforeach; ?>
                    </div>
                </div>
            </section>

            <section class="question-block compact">
                <div class="q-number">2</div>
                <div class="q-content">
                    <h2>Once we started serving you, how long did the rental process take?</h2>
                    <div class="choice-grid">
                        <?php foreach (['Less than 5 min','5–10 min','11–15 min','16–20 min','More than 20 min'] as $v): ?>
                            <label class="choice-chip"><input type="radio" name="process_time" value="<?= e($v) ?>" required><span><?= e($v) ?></span></label>
                        <?php endforeach; ?>
                    </div>
                </div>
            </section>

            <?php
            $starQuestions = [
                'office_find_rating' => 'How easy was it to find our office?',
                'pickup_speed_rating' => 'How satisfied were you with the speed of vehicle pick-up?',
                'staff_rating' => 'How friendly and helpful was our team member?',
                'professionalism_rating' => 'How professional was our team member?',
                'terms_rating' => 'How clearly were the rental conditions and charges explained?',
                'vehicle_condition_rating' => 'How would you rate the overall condition of the vehicle?',
                'cleanliness_rating' => 'How clean was the vehicle when you received it?'
            ];
            $n = 3;
            foreach ($starQuestions as $name => $title): ?>
                <section class="question-block">
                    <div class="q-number"><?= $n++ ?></div>
                    <div class="q-content">
                        <h2><?= e($title) ?></h2>
                        <div class="star-rating" aria-label="<?= e($title) ?>">
                            <?php for ($i = 1; $i <= 5; $i++): ?>
                                <label title="<?= $i ?>/5">
                                    <input type="radio" name="<?= e($name) ?>" value="<?= $i ?>" required>
                                    <span>★</span>
                                </label>
                            <?php endfor; ?>
                        </div>
                        <div class="rating-labels"><span>Poor</span><span>Excellent</span></div>
                    </div>
                </section>
            <?php endforeach; ?>

            <section class="question-block overall-block">
                <div class="q-number"><?= $n++ ?></div>
                <div class="q-content">
                    <h2>Overall, how satisfied were you with Avia?</h2>
                    <div class="emoji-rating">
                        <?php
                        $emojis = [1 => ['😞','Very dissatisfied'],2 => ['🙁','Dissatisfied'],3 => ['😐','Okay'],4 => ['🙂','Satisfied'],5 => ['😍','Excellent']];
                        foreach ($emojis as $value => [$emoji, $label]): ?>
                            <label>
                                <input type="radio" name="overall_rating" value="<?= $value ?>" required>
                                <span class="emoji"><?= $emoji ?></span>
                                <small><?= e($label) ?></small>
                            </label>
                        <?php endforeach; ?>
                    </div>
                </div>
            </section>

            <section class="question-block">
                <div class="q-number"><?= $n++ ?></div>
                <div class="q-content">
                    <h2>Would you rent from Avia again?</h2>
                    <div class="yes-no">
                        <label><input type="radio" name="rent_again" value="1" required><span>👍 Yes</span></label>
                        <label><input type="radio" name="rent_again" value="0" required><span>👎 No</span></label>
                    </div>
                </div>
            </section>

            <section class="question-block comment-block">
                <div class="q-number"><?= $n ?></div>
                <div class="q-content">
                    <h2>Anything else you would like us to know?</h2>
                    <textarea name="comment" rows="5" maxlength="1500" placeholder="Tell us what went well, how our team treated you, or what we could improve..."></textarea>
                    <p class="optional">Optional</p>
                </div>
            </section>

            <button class="primary-button" type="submit">Send feedback</button>
            <p class="privacy-note">Your feedback is used by Avia to improve service quality and staff training.</p>
        </form>
    </section>
</main>
<script src="survey.js"></script>
</body>
</html>
