<?php include 'header.php'; ?>

<!-- Normal Sub Header -->
<?php include 'template-parts/breadcrumb-only.php'; ?>

<div class="uk-container uk-container-small">

    <!-- Progress Steps -->
    <div class="checkout-progress">
        <div class="progress-steps">
            <div class="step active">
                <span uk-icon="icon: credit-card; ratio: 1" class="uk-icon" aria-hidden="true"></span>
                <span class="step-label">Payment</span>
            </div>
            <div class="step step-completed">
                <span uk-icon="icon: check-circle; ratio: 1" class="uk-icon" aria-hidden="true"></span>
                <span class="step-label">Confirmation</span>
            </div>
        </div>
    </div>

    <div class="info-card">
        <div class="info-card-inner">
            <div class="uk-text-center">
                <h2>Payment Successful!</h2>
                <p>Your interview session has been booked successfully.</p>
            </div>

            <div class="uk-flex uk-flex-middle gap-16 uk-margin-medium">
                <div>
                    <span uk-icon="icon: order-confirm; ratio: 1.4" class="uk-icon uk-text-primary" aria-hidden="true"></span>
                </div>
                <div>
                    <div class="uk-h5 uk-margin-remove f600">
                        Order Confirmation
                    </div>
                    <p class="order-confirm-id uk-margin-remove" id="confirm-id">Order ID: #CS-2024-001247</p>
                </div>
            </div>

            <div class="session-detail">
                <span class="detail-label">Trainer</span>
                <span class="detail-value">Noor Abdullah</span>
            </div>
            <div class="session-detail">
                <span class="detail-label">Session Type</span>
                <span class="detail-value">Technical Interview (60 min)</span>
            </div>
            <div class="session-detail">
                <span class="detail-label">Date & Time</span>
                <span class="detail-value">January 16, 2025 • 14:00 PM</span>
            </div>
            <div class="session-detail">
                <span class="detail-label">Payment Method</span>
                <span class="detail-value">Visa •••• 4532</span>
            </div>
            <div class="session-detail">
                <span class="detail-label">Sessiope</span>
                <span class="detail-value">Technicion</span>
            </div>
            <div class="session-detail">
                <span class="detail-label">Total Paid</span>
                <span class="detail-value uk-text-large uk-text-primary f700">704.25 SAR</span>
            </div>

        </div>
    </div>

    <div class="info-card mb-24 mt-24">
        <h2>What happens next?</h2>

        <ul class="happen-next">
            <li>
                <span class="next-item">View Your Sessions</span>
                <span class="next-text">Go to your profile <a class="uk-link" href="user-dashboard-my-sessions.php">(My Sessions)</a> to see your upcoming sessions and Zoom link.</span>
            </li>
            <li>
                <span class="next-item">Prepare Your Materials</span>
                <span class="next-text">Upload your resume and prepare questions for the trainer</span>
            </li>
            <li>
                <span class="next-item">Join Your Session</span>
                <span class="next-text">You'll receive a reminder 1 hour before your session starts</span>
            </li>
            <li>
                <span class="next-item">Get Your Feedback</span>
                <span class="next-text">Receive detailed evaluation and improvement recommendations</span>
            </li>
        </ul>

    </div>

    <div class="payment-success-btn uk-grid uk-flex-center gap-12 uk-grid-small" uk-grid>
        <a href="user-dashboard-my-sessions.php" class="uk-button uk-button-primary">View My Sessions</a>
        <a href="trainers.php" class="uk-button uk-button-secondary">Book Another Session</a>
        <a href="contact.php" class="uk-button uk-button-default">Need help?</a>
    </div>


</div><!-- .uk-container -->



<?php include 'footer.php'; ?>